:root{
  --ink:#10142f;--muted:#687188;--paper:#fff;--soft:#f4f6fc;--line:#dfe5f1;
  --blue:#4569ef;--violet:#7a55e8;--magenta:#ce58d1;--cyan:#68e0f6;
  --navy:#100d2e;--shadow:0 24px 70px rgba(31,42,91,.14);
  --grad-headline:linear-gradient(105deg,#a9e8ff 0%,#d1c4ff 52%,#ffb6e4 100%)
}
.grad{color:#cfe0ff;background-image:var(--grad-headline);-webkit-background-clip:text;background-clip:text}
@supports ((-webkit-background-clip:text) or (background-clip:text)){
  .grad{-webkit-text-fill-color:transparent}
}
@media(forced-colors:active){.grad{-webkit-text-fill-color:currentColor;background-image:none;color:CanvasText}}
@media print{.grad{-webkit-text-fill-color:#000;background-image:none;color:#000}}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family: Arial, Helvetica, sans-serif;
  color:var(--ink);
  background:#fff;
}

img{display:block;width:100%;height:auto}
a{text-decoration:none;color:inherit}
h1,h2,h3{
  letter-spacing:-.04em;
  margin:0; 
  font-weight: bold;
}
p{margin:0}
strong, span, b, .arrow-button, .button, .eyebrow {line-height: normal;}
.shell{width:min(1200px,calc(100% - 44px));margin:auto}
.button{display:inline-flex;align-items:center;justify-content:center;padding:15px 23px;border-radius:999px;background:linear-gradient(110deg,var(--blue),var(--violet),var(--magenta));color:#fff;font-weight:400;font-size:14px;box-shadow:0 14px 35px rgba(83,89,222,.28);transition:.25s}
.button:hover{transform:translateY(-2px)}
.button.light{background:#fff;color:#273fc1}
.button.outline{background:transparent;border:1px solid rgba(255,255,255,.45);box-shadow:none}
.button.small{padding:11px 17px}
.hero{position:relative;min-height:calc(100vh - 116px);display:flex;align-items:center;overflow:hidden;color:#fff;background:#0d0c2d}
.hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}

.hero:after{content:"";position:absolute;inset:0;background:
  radial-gradient(60% 70% at 6% 18%,rgba(206,88,209,.34),transparent 70%),radial-gradient(55% 65% at 2% 82%,rgba(69,105,239,.34),transparent 70%),radial-gradient(40% 50% at 28% 50%,rgba(122,85,232,.22),transparent 72%),
  linear-gradient(100deg,rgba(9,9,36,.86) 0%,rgba(12,11,44,.82) 46%,rgba(16,14,50,.46) 66%,rgba(15,12,43,0) 82%)}
.hero-content{position:relative;z-index:2;padding:110px 0 90px}
.eyebrow{font-size:12px;text-transform:uppercase;letter-spacing:.16em;font-weight:700;color:#536fea;margin-bottom:18px}
.eyebrow.light{color:#94e8ff}
.pulse{display:inline-block;min-width:8px;width:8px;height:8px;border-radius:50%;background:#66f1bd;box-shadow:0 0 0 8px rgba(102,241,189,.12);  animation: pulse-glow 1.8s ease-in-out infinite;}

@keyframes pulse-glow {
  0%,100% {
      box-shadow: 0 0 0 6px rgb(78 241 183 / .14)
  }
  50% {
      box-shadow: 0 0 0 8px rgb(78 241 183 / .28)
  }
}
h1{font-size:clamp(58px,7.1vw,80px);line-height:.94;max-width:800px; letter-spacing: -.065em;}
h1 span,.gradient-text{background:linear-gradient(100deg,#72e8ff,#8b76ff,#ef70d8);-webkit-background-clip:text;color:transparent}
.hero-copy{font-size:20px;line-height:1.72;color:#e2e7f8;max-width:720px;margin:28px 0}
.actions{display:flex;gap:18px;align-items:center;flex-wrap:wrap}
.proof{display:grid;grid-template-columns:repeat(4,1fr);max-width:990px;margin-top:70px;padding-top:25px;border-top:1px solid rgba(255,255,255,.21)}
.proof div{padding-right:22px}
.proof strong,.proof span{display:block}
.proof strong{font-size:16px}
.proof span{font-size:14px;color:#b9c1df;margin-top:5px}
.section{padding:130px 0}
.section-heading{max-width:860px;margin-bottom:52px}
.section-heading.center{text-align:center;margin-left:auto;margin-right:auto}
h2{font-size:clamp(28px,5.3vw,48px);line-height:1.03}
h3{font-size:25px;line-height:1.16}
.lead{font-size:18px;line-height:1.75;color:var(--muted);margin-top:22px}
.soft{background:linear-gradient(180deg,#f8f9fe,#f1f4fb)}
.dark{background:#100d2e;color:#fff}
.dark .lead{color:#c9d0e7}
.challenge-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.challenge-card{background:#fff;border:1px solid var(--line);border-radius:25px;overflow:hidden;box-shadow:0 15px 45px rgba(27,40,84,.07);transition:.25s}
.challenge-card:hover{transform:translateY(-5px);box-shadow:var(--shadow)}
.challenge-card img{height:170px;object-fit:cover}
.challenge-card div{padding:26px}
.challenge-card h3{font-size:20px;margin-bottom:13px}
.challenge-card p{font-size:14px;line-height:1.7;color:var(--muted)}
.challenge-card .mark{display:block;width:28px;height:3px;border-radius:5px;background:linear-gradient(90deg,var(--blue),var(--magenta));margin-bottom:18px; padding: 0;}
.bridge{margin-top:44px;padding:33px 36px;border-radius:26px;background:linear-gradient(115deg,#11123d,#33216f);color:#fff;display:flex;align-items:center;justify-content:space-between;gap:30px}
.bridge h3{font-size:30px}
.bridge p{color:#d6dcf1;line-height:1.7;margin-top:8px;max-width:760px}
.future-layout,.solution-layout,.trust-layout{display:grid;grid-template-columns:1fr 1fr;gap:75px;align-items:center}
/* download button centred beneath the image */
.future-media{display:flex;flex-direction:column;gap:44px}
.future-media .button{align-self:center}
.image-frame{position:relative;border-radius:36px;overflow:hidden;box-shadow:var(--shadow);min-height:570px}
.image-frame img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.image-frame:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(10,12,39,.56))}
.float-card{position:absolute;z-index:2;background:rgba(255,255,255,.95);backdrop-filter:blur(10px);border-radius:18px;padding:16px 18px;box-shadow:0 18px 44px rgba(15,22,63,.18)}
.float-card b,.float-card span{display:block}
.float-card span{font-size:11px;color:var(--muted);margin-top:5px}
.fc1{left:24px;top:26px}.fc2{right:24px;top:268px}.fc3{left:40px;bottom:30px}
.benefit-list{display:grid;grid-template-columns:1fr 1fr;gap:13px;margin-top:30px}
.benefit{padding:18px;border-radius:17px;background:#f7f8fc;border:1px solid var(--line)}
.benefit b{display:block;font-size:14px}.benefit span{display:block;color:var(--muted);font-size:14px;line-height:1.55;margin-top:7px}
.solution-copy .lead{color:#c9d0e7}
.solution-points{margin:28px 0; margin-top:0;}
.solution-points div{padding:17px 0;border-top:1px solid rgba(255,255,255,.14)}
.solution-points b,.solution-points span{display:block}
.solution-points span{font-size:14px;color:#aeb8d8;margin-top:6px}
.platform-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:17px;margin-top:60px;padding-top:46px;border-top:1px solid rgba(255,255,255,.12)}
.platform-cta{margin-top:80px;text-align:center}
/* Matches the heading font and weight; same size, gradient in the H1 family */
.eco-tagline{margin-top:112px;font-family:"Space Grotesk",Manrope,sans-serif;font-weight:700;font-size:clamp(22px,2.3vw,30px);line-height:1.2;letter-spacing:-.04em}
.eco-tagline.grad{background-image:linear-gradient(105deg,#d1c4ff 0%,#e6bdf2 50%,#ffb6e4 100%)}
.platform-card{min-height:220px;border-radius:23px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.11);overflow:hidden;display:flex;flex-direction:column}
.card-art{width:100%;height:118px;object-fit:cover;display:block}
.platform-card .card-body{padding:24px 26px 28px}
.platform-card span{font-size:11px;text-transform:uppercase;letter-spacing:.12em;color:#83e8ff;font-weight:700}
.platform-card h3{font-size:20px;margin:22px 0 10px}
.platform-card p{font-size:14px;line-height:1.65;color:#bfc7e1}
.trust-photo{position:relative;border-radius:36px;overflow:hidden;min-height:550px;box-shadow:var(--shadow)}
.trust-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.trust-badge{position:absolute;left:24px;right:24px;bottom:24px;background:rgba(16,13,46,.90);backdrop-filter:blur(12px);color:#fff;border-radius:20px;padding:22px;display:grid;grid-template-columns:repeat(3,1fr);gap:15px}
.trust-badge strong,.trust-badge span{display:block}
.trust-badge strong{font-size:21px}.trust-badge span{font-size:10px;color:#bcc5e2;margin-top:4px}
.reasons{display:grid;grid-template-columns:1fr 1fr;gap:13px;margin-top:28px}
.reason{padding:21px;border-radius:18px;background:#fff;border:1px solid var(--line)}
.reason b,.reason span{display:block}.reason span{font-size:14px;line-height:1.55;color:var(--muted);margin-top:7px}
.journey{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.step{border-radius:22px;background:#fff;border:1px solid var(--line);overflow:hidden}
.step .card-art{height:96px}
.step .card-body{padding:24px 24px 28px}
.step i{font-style:normal;font-size:11px;color:var(--violet);font-weight:700}
.step h3{font-size:20px;margin:20px 0 10px}
.step p{font-size:14px;line-height:1.6;color:var(--muted)}
.final{position:relative;overflow:hidden;background:#130b37;color:#fff}
.final:before,.final:after{content:"";position:absolute;border-radius:50%;filter:blur(10px)}
.final:before{width:650px;height:650px;left:-270px;top:-230px;background:radial-gradient(circle,rgba(64,110,255,.48),transparent 66%)}
.final:after{width:750px;height:750px;right:-320px;bottom:-350px;background:radial-gradient(circle,rgba(213,76,213,.40),transparent 66%)}
.final-inner{position:relative;z-index:2;min-height:690px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.final .eyebrow{font-size:clamp(18px,2.4vw,30px);text-transform:none;letter-spacing:-.02em;line-height:1.2;margin-bottom:22px}
.final h2{max-width:1040px}
.final p{font-size:18px;line-height:1.75;color:#cad2ea;max-width:750px;margin:25px 0 34px}
.vision{background:linear-gradient(180deg,#f8f9fe,#f1f4fb)}
.vision-layout{display:grid;grid-template-columns:.98fr 1.02fr;gap:60px;align-items:center}
.vision-stage{position:relative}
.vision-frame{position:relative}
.vision-photo{border-radius:24px;overflow:hidden;box-shadow:0 30px 70px rgba(24,36,86,.16)}
.vision-photo img{display:block;width:100%;height:auto}
.vision-copy .eyebrow{margin-bottom:16px}
.vision-copy h2 em{font-style:normal;background:linear-gradient(100deg,#2f8fe8,#4569ef);-webkit-background-clip:text;background-clip:text;color:transparent}
.wins{list-style:none;margin:32px 0 36px;padding:0}
.wins li{display:flex;align-items:center;gap:13px;padding:15px 0;border-top:1px solid var(--line);font-size:15.5px;line-height:1.45;color:#39415c;font-weight:600}
.wins svg{flex:0 0 auto;width:21px;height:21px;margin-top:1px}
.arrow-button{display:inline-flex;align-items:center;gap:13px;padding:13px 15px 13px 27px;border-radius:999px;background:linear-gradient(105deg,var(--blue),var(--violet));color:#fff;font-weight:400;font-size:15px;box-shadow:0 16px 36px rgba(83,89,222,.3);transition:.25s}
.arrow-button:hover{transform:translateY(-2px);box-shadow:0 20px 44px rgba(83,89,222,.38)}
.arrow-button span{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;background:rgba(255,255,255,.22)}
.arrow-button svg{width:13px;height:13px}

/* ===== Credentials bar ===== */
.credbar{background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:30px 0}
.cred-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:22px}
.cred-item{display:flex;align-items:flex-start;gap:14px}
.cred-item .ci{flex:0 0 auto;width:40px;height:40px}
.cred-item .ci svg{width:40px;height:40px}
.cred-item small{display:block;font-size:12px;font-weight:700;color:var(--muted)}
.cred-item b{display:block;font-family:"Space Grotesk",Manrope,sans-serif;font-size:27px;font-weight:800;letter-spacing:-.04em;color:var(--ink);line-height:1.1}
.cred-item p{font-size:12.5px;line-height:1.45;color:var(--muted);margin-top:5px;max-width:190px}
.cred-stars{display:flex;gap:3px;margin-top:3px}
.cred-stars svg{width:15px;height:15px}

/* ===== Customer success stories ===== */
.success{background:linear-gradient(180deg,#f6f8ff,#eff3fd);padding:96px 0 42px}
.resources{background:linear-gradient(180deg,#eff3fd,#e9effb);padding:6px 0 92px}
.success-head{display:flex;align-items:flex-end;justify-content:space-between;gap:30px;margin-bottom:34px}
.success-head h2{font-size:clamp(32px,3.6vw,44px);line-height:1.12}
.see-all{display:inline-flex;align-items:center;gap:9px;font-size:13.5px;font-weight:400;color:#3b52d8;white-space:nowrap;padding-bottom:6px}
.see-all svg{width:15px;height:15px}
.see-all:hover{color:#2436a8}

/* ===== Resource tiles ===== */
.res-head{margin:56px 0 22px}
.res-head h2{font-size:clamp(32px,3.6vw,44px);line-height:1.12}
.res-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}
.res-tile{display:flex;align-items:flex-start;gap:11px;padding:16px 15px;background:#fff;border:1px solid var(--line);border-radius:16px;transition:.22s}
.res-tile:hover{transform:translateY(-3px);box-shadow:0 16px 36px rgba(27,40,84,.1);border-color:#c9d4ee}
.res-tile .ri{flex:0 0 auto;width:30px;height:30px}
.res-tile .ri svg{width:30px;height:30px}
.res-tile b{display:block;font-size:15px;font-weight:700;color:var(--ink);line-height:1.3}
.res-tile span{display:block;font-size:14px;line-height:1.45;color:var(--muted);margin-top:5px}
/* ===== Industries served ===== */
.industries{background:linear-gradient(180deg,#fff,#f3f6fd);padding:94px 0 90px}
.industries .eyebrow{color:var(--violet)}
.industries .success-head{margin-bottom:34px;flex-wrap:wrap;row-gap:12px}
.industries .success-head h2{font-size:clamp(28px,5.3vw,48px);line-height:1.03}
.industries .see-all{margin-left:auto}
.ind-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.ind-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:25px;overflow:hidden;box-shadow:0 15px 45px rgba(27,40,84,.07);transition:transform .28s,box-shadow .28s,border-color .28s}
.ind-card:hover{transform:translateY(-6px);box-shadow:0 30px 62px rgba(27,40,84,.15);border-color:#c6d1ed}
.ind-media{position:relative;overflow:hidden}
.ind-media img{display:block;width:100%;height:170px;object-fit:cover;transition:transform .55s ease}
.ind-card:hover .ind-media img{transform:scale(1.055)}
.ind-media:after{content:"";position:absolute;left:0;right:0;bottom:0;height:56px;background:linear-gradient(180deg,transparent,rgba(16,22,56,.13))}
.ind-body{flex:1;display:flex;flex-direction:column;padding:22px 24px 26px}
.ind-body h3{display:flex;align-items:flex-start;gap:10px;font-size:20px;line-height:1.2;color:var(--ink)}
.ind-body h3 span{flex:1}
/* arrow stays visible so the cards read as links on touch devices too,
   then turns blue and nudges right on hover */
.ind-body h3 svg{flex:0 0 auto;width:16px;height:16px;margin-top:4px;color:#9aa5cc;opacity:1;transform:none;transition:.28s}
.ind-card:hover h3 svg{transform:translateX(4px);color:var(--blue)}
.ind-body p{margin-top:11px;font-size:14px;line-height:1.6;color:var(--muted)}
.tp-head{text-align:center;max-width:900px;margin:0 auto}
.tp-head h2{font-size:clamp(30px,3.6vw,44px);line-height:1.14}
.tp-head h2 em{font-style:normal;background:linear-gradient(100deg,var(--blue),var(--violet));-webkit-background-clip:text;background-clip:text;color:transparent}
.tp-rating{display:flex;align-items:center;justify-content:center;gap:11px;margin-top:18px;flex-wrap:wrap}
.tp-rating .word{font-size:15px;font-weight:800;color:var(--ink);text-decoration:underline;text-underline-offset:3px}
.tp-badge{display:flex;gap:2px}
.tp-badge i{width:23px;height:23px;background:#00b67a;display:flex;align-items:center;justify-content:center}
.tp-badge svg{width:15px;height:15px}
.tp-mark{display:inline-flex;align-items:center;gap:5px;font-size:15px;font-weight:800;color:var(--ink)}
.tp-mark svg{width:16px;height:16px}
/* same badge as the reviews section, recoloured for the dark hero */
.hero .tp-rating{margin-top:0;justify-content:flex-start;gap:10px}
.hero .tp-rating .word,.hero .tp-mark{color:#fff}
.tp-rule{height:1px;background:var(--line);margin:26px 0 32px}

.tp-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.tp-card{position:relative;overflow:hidden;display:block;background:#eef1fd;border:1px solid #e1e7f7;border-radius:14px;padding:18px;transition:transform .25s,box-shadow .25s}
.tp-card:hover{transform:translateY(-4px);box-shadow:0 20px 44px rgba(27,40,84,.13)}
.tp-ribbon{position:absolute;left:-46px;top:16px;width:150px;transform:rotate(-45deg);background:#00b67a;display:flex;justify-content:center;gap:3px;padding:5px 0}
.tp-ribbon svg{width:11px;height:11px}
.tp-top{display:flex;align-items:center;justify-content:flex-end;gap:11px;min-height:56px;padding-left:56px}
.tp-ini{flex:0 0 auto;width:44px;height:44px;border-radius:50%;background:#f7d9b0;color:#7a5220;display:flex;align-items:center;justify-content:center;font-family:"Space Grotesk",Manrope,sans-serif;font-size:14px;font-weight:800}
.tp-name{font-size:14.5px;font-weight:700;color:var(--ink)}
.tp-name span{font-weight:600;color:var(--muted)}
.tp-quote{display:block;margin:14px 0 0;background:#fff;border-radius:11px;padding:17px 19px}
.tp-text{display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden;font-size:14.5px;line-height:1.62;color:#4a5270}
.tp-foot{margin-top:28px;text-align:center;font-size:13.5px;font-weight:800}
.tp-foot a{color:#3b52d8;font-weight: 400}
.tp-foot a:hover{color:#2436a8}
.eco{position:relative;margin-top:54px;display:grid;grid-template-columns:1fr 296px 1fr;gap:16px 34px;align-items:center}
.eco-node{position:relative;z-index:2;display:flex;gap:14px;align-items:flex-start;background:#fff;border:2px solid var(--c);border-radius:17px;padding:14px 17px;box-shadow:0 14px 34px rgba(6,8,30,.4)}
.eco-node img{flex:0 0 auto;width:40px;height:40px;object-fit:contain;border-radius:8px}
/* Accounting card carries two marks: a square icon plus a wide wordmark */
.eco-marks{flex:0 0 auto;display:flex;align-items:center;gap:5px}
.eco-marks img{width:40px;height:40px}
.eco-marks .wordmark{width:auto;height:26px;border-radius:4px}
.eco-bottom{max-width:520px;column-gap:26px}
.eco-node b{display:block;font-family:"Space Grotesk",Manrope,sans-serif;font-size:15.5px;line-height:1.2;color:var(--c)}
.eco-node i{display:block;font-style:normal;font-size:14px;line-height:1.35;color:#5b6480;margin-top:3px}
.eco-node p{margin:9px 0 0;font-size:14px;line-height:1.52;color:#464f6b}
.eco-node:before,.eco-node:after{content:"";position:absolute;border-color:rgba(154,166,232,.5)}
.n-l1:after,.n-l2:after,.n-l3:after{left:100%;top:50%;width:34px;border-top:2px dotted}
.n-r1:before,.n-r2:before,.n-r3:before{right:100%;top:50%;width:34px;border-top:2px dotted}
.eco-top:after{top:100%;left:50%;height:16px;border-left:2px dotted}
.eco-bottom:before{bottom:100%;left:50%;height:16px;border-left:2px dotted}
.eco-top{grid-column:1/-1;grid-row:1;justify-self:center;max-width:430px}
.eco-bottom{grid-column:1/-1;grid-row:5;justify-self:center;max-width:430px}
.n-l1{grid-column:1;grid-row:2}.n-l2{grid-column:1;grid-row:3}.n-l3{grid-column:1;grid-row:4}
.n-r1{grid-column:3;grid-row:2}.n-r2{grid-column:3;grid-row:3}.n-r3{grid-column:3;grid-row:4}
.eco-hub{grid-column:2;grid-row:2/span 3;position:relative;z-index:3;display:flex;flex-direction:column;align-items:center;text-align:center;
  background:linear-gradient(165deg,#4a3ad6,#7a4fe0);border:1px solid rgba(255,255,255,.28);border-radius:28px;padding:26px 22px;
  box-shadow:0 0 70px rgba(122,79,224,.5),0 20px 50px rgba(6,8,30,.45)}
.eco-hub img{width:88px;height:88px;border-radius:50%}
.eco-hub b{display:block;font-family:"Space Grotesk",Manrope,sans-serif;font-size:27px;line-height:1.02;letter-spacing:-.03em;color:#fff;margin-top:14px}
.eco-hub p{margin:12px 0 0;font-size:12.5px;line-height:1.55;color:#e2ddff}
.reveal{opacity:0;transform:translateY(24px);transition:.75s}
.reveal.visible{opacity:1;transform:none}
.no-js .reveal{opacity:1;transform:none;transition:none}
.skip-link{position:absolute;left:-9999px;top:0;z-index:999;padding:12px 20px;background:#100d2e;color:#fff;font-weight:800;border-radius:0 0 12px 0}
.skip-link:focus{left:0}
a:focus-visible,button:focus-visible{outline:3px solid #68e0f6;outline-offset:3px}
@supports(height:100svh){.hero{min-height:calc(100svh - 116px)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}}
.future-media .button:hover {
  color: #fff;
}
.grad, .wins li span {
  line-height: unset;
}
.arrow-button:hover {
  color: #fff;
}
.eco-tagline.grad {
  line-height: 1.2;
}
.see-all,
.cred-item small {
  line-height: normal;
}
#main {
  overflow: hidden;
}
.hero-eyebrow {
  display: flex;
  align-items: center;
  gap: 13px;
}
.button.outline:hover {
  color: #fff;
}
#challenges .section-heading {
  max-width: 100%;
}
#challenges .eyebrow, 
#challenges #challenges-heading {
  max-width: 860px;
}
.future-media .eyebrow,
.vision-stage .eyebrow,
.trust-photo-wrap .eyebrow {
  display: none;
}