/* Convrsion — homepage styles. Tokens mirror the Convrsion design system. */
@font-face{font-family:"Syne";src:url("../fonts/syne-var.woff2") format("woff2");font-weight:400 800;font-style:normal;font-display:swap}
/* Geist, self-hosted (SIL Open Font License). Variable font: one file covers weights 400-700. */
@font-face{font-family:"Geist";src:url("../fonts/geist-latin.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Geist";src:url("../fonts/geist-latin-ext.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}

:root{
  --deep-green:#032828;
  --hero-green:#032c2c;
  --cyan:#00d7d7;
  --cyan-hover:#00bfbf;
  --cyan-ink:#017a73;
  --mark-mint:#5bd9b2;
  --mark-cyan:#00d7d7;
  --gradient-mark:linear-gradient(90deg,#5bd9b2 0%,#00d7d7 100%);
  --cyan-tint:rgba(0,215,215,.15);
  --white:#ffffff;
  --surface-100:#f8f8f8;
  --surface-200:#ebebeb;
  --line:#eeeeee;
  --grey-ink:#282929;
  --grey-313:#313131;
  --on-dark-muted:rgba(255,255,255,.72);
  --glass:rgba(255,255,255,.06);
  --glass-line:rgba(255,255,255,.12);

  --font-display:"Syne",sans-serif;
  --font-sans:"Geist",system-ui,sans-serif;

  --radius-10:10px;--radius-12:12px;--radius-20:20px;--radius-30:30px;
  --shadow-card:0 20px 74px 0 rgba(0,0,0,.05);
  --shadow-card-hover:0 25px 80px 0 rgba(0,0,0,.1);
  --shadow-cta-glow:0 0 28px 0 rgba(0,215,215,.22);

  --wrap:1245px;
  --gutter:clamp(16px,4vw,40px);
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--font-sans);font-size:16px;line-height:1.5;color:var(--grey-ink);background:var(--white);-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3,h4{font-family:var(--font-display);font-weight:700;color:var(--deep-green);margin:0}
p{margin:0}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--gutter)}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:8px;z-index:100;background:var(--white);color:var(--deep-green);padding:10px 16px;border-radius:var(--radius-10)}
.skip:focus{left:8px}
:focus-visible{outline:2px solid var(--deep-green);outline-offset:3px}
.dark :focus-visible{outline-color:var(--white)}

/* ---------- Buttons & labels ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font:600 16px/20px var(--font-sans);text-decoration:none;border-radius:var(--radius-12);padding:18px 30px;border:1px solid transparent;cursor:pointer;transition:transform .3s ease,background-color .3s ease,color .3s ease,box-shadow .3s ease;white-space:nowrap}
.btn-primary{background:var(--cyan);color:var(--deep-green);box-shadow:var(--shadow-cta-glow)}
.btn-primary:hover{background:var(--white);transform:translateY(-2px)}
.on-light .btn-primary:hover{background:var(--deep-green);color:var(--cyan)}
.btn-ghost{background:transparent;color:var(--white);border-color:var(--glass-line)}
.btn-ghost:hover{border-color:var(--cyan);color:var(--cyan)}
.btn-ghost img{width:15px;height:15px}
.btn-sm{padding:12px 16px;font-size:15px}
.pill{display:inline-flex;align-items:center;gap:8px;font:600 12px/14px var(--font-sans);letter-spacing:-.48px;text-transform:uppercase;color:var(--deep-green);background:var(--cyan-tint);padding:9px 15px;border-radius:var(--radius-30)}
.pill-dark{color:var(--white);background:var(--glass);border:1px solid var(--glass-line)}
.pill-dark .dot{width:7px;height:7px;border-radius:50%;background:var(--gradient-mark)}
.eyebrow{margin-bottom:16px}
.grad-text{background:var(--gradient-mark);-webkit-background-clip:text;background-clip:text;color:transparent}

/* ---------- Header ---------- */
.site-header{position:absolute;inset:0 0 auto 0;z-index:20;padding-top:clamp(16px,2.5vw,28px)}
.nav{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:14px clamp(16px,3vw,32px)}
.brand img{width:150px;height:auto}
.nav-links{display:flex;gap:28px;list-style:none;margin:0;padding:0}
.nav-links a{color:var(--white);text-decoration:none;font-weight:500;font-size:15px;opacity:.85}
.nav-links a:hover{color:var(--cyan);opacity:1}
.nav-right{display:flex;align-items:center;gap:18px}
.phone{display:inline-flex;align-items:center;gap:8px;color:var(--white);text-decoration:none;font-weight:600;font-size:15px}
.phone img{width:15px;height:15px}
.phone:hover{color:var(--cyan)}
.menu-toggle{display:none;background:none;border:0;padding:8px;cursor:pointer}

/* ---------- Hero ---------- */
.hero-shell{padding:clamp(10px,1.4vw,16px)}
.hero{position:relative;overflow:hidden;background:var(--hero-green);border-radius:var(--radius-30);color:var(--white);padding:clamp(130px,14vw,170px) 0 clamp(56px,7vw,90px);isolation:isolate}
.hero::before{content:"";position:absolute;z-index:-2;left:50%;top:-38%;width:min(1200px,140%);aspect-ratio:1;transform:translateX(-50%);border-radius:50%;background:radial-gradient(closest-side,rgba(0,215,215,.24),rgba(0,215,215,.09) 45%,rgba(0,215,215,0) 75%);animation:glow-breathe 9s ease-in-out infinite}
.hero::after{content:"";position:absolute;z-index:-1;inset:0;background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:88px 88px;background-position:center top;mask-image:radial-gradient(ellipse 65% 60% at 50% 38%,#000 0%,rgba(0,0,0,.55) 45%,transparent 80%);-webkit-mask-image:radial-gradient(ellipse 65% 60% at 50% 38%,#000 0%,rgba(0,0,0,.55) 45%,transparent 80%);animation:grid-drift 18s linear infinite}
.hero-grid{max-width:860px;margin:0 auto;text-align:center}
.hero .hero-grid h1,.hero .hero-grid .lead{margin-left:auto;margin-right:auto}
.hero-grid .hero-ctas{justify-content:center}
.trusted{text-align:center}
.hero h1{color:var(--white);font-size:clamp(40px,6.2vw,80px);line-height:.98;letter-spacing:-.02em;margin:22px 0 24px;max-width:15ch}
.hero .lead{font-size:clamp(17px,1.6vw,20px);line-height:1.5;color:var(--on-dark-muted);max-width:560px}
.hero .lead strong{color:var(--white);font-weight:600}
.hero-ctas{display:flex;flex-wrap:wrap;gap:14px;margin-top:34px}


/* Trusted-by logo strip */
.trusted{margin-top:clamp(48px,6vw,72px)}
.trusted-cap{margin:0 0 22px;font:600 12px/1.4 var(--font-sans);letter-spacing:.08em;text-transform:uppercase;color:var(--on-dark-muted)}
.trusted-cap b{color:var(--white);font-weight:700}
.logo-marquee{display:flex;overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.logo-track{display:flex;align-items:center;gap:clamp(32px,3.6vw,52px);padding:0 clamp(16px,1.8vw,26px);margin:0;list-style:none;flex-shrink:0;animation:logo-scroll 30s linear infinite}
.logo-marquee:hover .logo-track{animation-play-state:paused}
.logo-track li{flex-shrink:0}
.logo-track img{display:block;height:27px;width:auto;max-width:152px;object-fit:contain;filter:brightness(0) invert(1);opacity:.6;transition:opacity .3s}
.logo-track img:hover{opacity:1}
.logo-track img.is-square{height:36px}
.logo-track img.is-tall{height:39px}
.logo-track img.is-small{height:34px;max-width:170px}
@keyframes logo-scroll{to{transform:translateX(-100%)}}
@media (max-width:600px){.logo-track{gap:28px;padding:0 14px;animation-duration:22s}.logo-track img{height:21px;max-width:116px}.logo-track img.is-square{height:28px}.logo-track img.is-tall{height:30px}.logo-track img.is-small{height:26px;max-width:130px}}
@media (prefers-reduced-motion:reduce){.logo-track{animation:none;flex-wrap:wrap;justify-content:center;row-gap:24px}.logo-track[aria-hidden]{display:none}.logo-marquee{mask-image:none;-webkit-mask-image:none}}

/* ---------- Sections ---------- */
section{scroll-margin-top:24px}
.section{padding:clamp(72px,9vw,120px) 0}
.band{background:var(--surface-100)}
.section-head{max-width:760px;margin-bottom:clamp(36px,5vw,56px)}
.section-head.center{margin-left:auto;margin-right:auto;text-align:center}
.section-head h2{font-size:clamp(32px,4.4vw,56px);line-height:1;letter-spacing:-.02em}
.section-head p{margin-top:18px;font-size:18px;color:var(--grey-313);max-width:620px}
.section-head.center p{margin-left:auto;margin-right:auto}

/* Why */
.why-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.feature{background:var(--surface-100);border-radius:var(--radius-20);padding:34px 32px 38px;transition:transform .3s,background-color .3s}
.feature:hover{transform:translateY(-6px);background:var(--surface-200)}
.feature .ico{width:48px;height:48px;border-radius:14px;background:var(--deep-green);display:grid;place-items:center;margin-bottom:26px}
.feature .ico svg{width:24px;height:24px;stroke:var(--cyan);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.feature h3{font-size:24px;letter-spacing:-.476px;line-height:1.15;margin-bottom:12px}
.feature p{color:var(--grey-313)}
.feature.wide{grid-column:span 2;display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:center;background:var(--deep-green);color:var(--white)}
.feature.wide:hover{background:var(--deep-green)}
.feature.wide h3{color:var(--white)}
.feature.wide p{color:var(--on-dark-muted)}
.feature.wide .ico{background:var(--glass)}
.check-list{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.check-list li{display:flex;gap:12px;align-items:flex-start}
.check-list li::before{content:"\2713";flex:none;width:20px;height:20px;margin-top:2px;border-radius:50%;background:var(--gradient-mark);color:var(--deep-green);font:800 11px/20px var(--font-sans);text-align:center}
.feature.wide .check-list li{color:var(--white)}

/* Process */
.process{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;counter-reset:step;position:relative}
.step{position:relative;background:var(--white);border-radius:var(--radius-20);padding:30px 26px 34px;box-shadow:var(--shadow-card)}
.step::before{counter-increment:step;content:"0" counter(step);display:block;font:700 15px/1 var(--font-display);color:var(--deep-green);background:var(--cyan-tint);width:44px;height:44px;border-radius:50%;display:grid;place-items:center;margin-bottom:22px}
.step h3{font-size:21px;line-height:1.2;letter-spacing:-.4px;margin-bottom:10px}
.step p{font-size:15px;color:var(--grey-313)}
.step .tag{display:inline-block;margin-top:16px;font-size:12px;font-weight:600;letter-spacing:.02em;text-transform:uppercase;color:var(--cyan-ink)}

/* Case studies: see bottom of file */
/* Models */
.models{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;align-items:stretch}
.model{display:flex;flex-direction:column;gap:22px;background:var(--white);border-radius:var(--radius-20);padding:34px 28px 28px;box-shadow:var(--shadow-card);transition:transform .3s,box-shadow .3s}
.model:hover{transform:translateY(-6px);box-shadow:var(--shadow-card-hover)}
.model h3{font-size:26px;letter-spacing:-.5px}
.model .desc{color:var(--grey-313);margin-top:-8px}
.model .price{font:700 15px/1.3 var(--font-sans);color:var(--deep-green);padding:14px 16px;border-radius:var(--radius-12);background:var(--surface-100)}
.model .price small{display:block;font-weight:400;color:var(--grey-313);font-size:13px;margin-top:2px}
.model ul{flex:1}
.model .btn{width:100%}
.model.featured{background:var(--hero-green);color:var(--white);position:relative;overflow:hidden}
.model.featured h3{color:var(--white)}
.model.featured .desc{color:var(--on-dark-muted)}
.model.featured .price{background:var(--glass);color:var(--white);border:1px solid var(--glass-line)}
.model.featured .price small{color:var(--on-dark-muted)}
.model.featured .pill{background:var(--white)}
.model .btn-outline{background:transparent;color:var(--deep-green);border-color:var(--deep-green)}
.model .btn-outline:hover{background:var(--deep-green);color:var(--cyan)}

/* Sectors */
.sectors{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.sector-card{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:22px 22px;border-radius:var(--radius-20);background:var(--surface-100);text-decoration:none;font:700 19px/1.2 var(--font-display);color:var(--deep-green);border:1px solid transparent;transition:background-color .25s,border-color .25s,transform .25s;cursor:pointer;text-align:left}
.sector-card:hover{background:var(--white);border-color:var(--cyan);transform:translateY(-3px)}
.sector-card .arr{flex:none;width:34px;height:34px;border-radius:50%;background:var(--deep-green);display:grid;place-items:center;color:var(--cyan);font-family:var(--font-sans);font-size:16px}
.sectors-note{margin-top:22px;color:var(--grey-313);text-align:center}

/* Enquiry */
.enquire{background:var(--hero-green);border-radius:var(--radius-30);color:var(--white);overflow:hidden;position:relative;isolation:isolate}
.enquire::before{content:"";position:absolute;z-index:-1;width:700px;height:700px;left:-260px;top:-280px;border-radius:50%;background:radial-gradient(closest-side,rgba(0,215,215,.2),transparent)}
.enquire-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(32px,5vw,72px);padding:clamp(32px,5vw,72px)}
.enquire h2{color:var(--white);font-size:clamp(32px,4vw,52px);line-height:1;letter-spacing:-.02em;margin:18px 0 20px}
.enquire .intro{color:var(--on-dark-muted);font-size:18px}
.enquire .check-list{margin-top:28px}
.enquire .check-list li{color:var(--white)}
.contact-alt{margin-top:32px;padding-top:24px;border-top:1px solid var(--glass-line);display:grid;gap:10px}
.contact-alt a{color:var(--white);text-decoration:none;font-weight:600}
.contact-alt a:hover{color:var(--cyan)}
.contact-alt span{color:var(--on-dark-muted);font-size:14px;display:block}
form.card{background:var(--white);color:var(--grey-ink);border-radius:var(--radius-20);padding:clamp(24px,3vw,36px);display:grid;grid-template-columns:1fr 1fr;gap:16px 16px;align-content:start}
.field{display:flex;flex-direction:column;gap:7px}
.field.full{grid-column:1/-1}
.field label{font-size:14px;font-weight:600;color:var(--deep-green)}
.field input,.field select,.field textarea{font:400 16px/1.4 var(--font-sans);color:var(--grey-ink);background:var(--surface-100);border:1px solid var(--line);border-radius:var(--radius-10);padding:13px 14px;width:100%;transition:border-color .2s,background-color .2s}
.field textarea{min-height:96px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--deep-green);background:var(--white);box-shadow:0 0 0 3px var(--cyan-tint)}
.field .hint{font-size:12px;color:var(--grey-313)}
.consent{grid-column:1/-1;display:flex;gap:10px;align-items:flex-start;font-size:13px;color:var(--grey-313)}
.consent input{margin-top:3px;accent-color:var(--deep-green);width:16px;height:16px;flex:none}
.consent a{color:var(--deep-green)}
form .btn{grid-column:1/-1;width:100%;box-shadow:none}
.form-status{grid-column:1/-1;font-size:14px;min-height:20px}
.form-status.ok{color:#016b5f;font-weight:600}
.form-status.err{color:#b3261e;font-weight:600}
.hp{position:absolute;left:-5000px}

/* FAQ */
.faq{max-width:860px;margin:0 auto;display:grid;gap:12px}
.faq details{background:var(--white);border-radius:var(--radius-10);box-shadow:0 2px 6px rgba(0,0,0,.05);padding:0 24px}
.faq summary{list-style:none;cursor:pointer;padding:22px 36px 22px 0;position:relative;font:700 19px/1.3 var(--font-display);color:var(--deep-green)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:0;top:50%;transform:translateY(-50%);width:28px;height:28px;border-radius:50%;background:var(--cyan-tint);display:grid;place-items:center;font:600 18px/1 var(--font-sans);transition:transform .25s}
.faq details[open] summary::after{content:"–"}
.faq details p{padding:0 0 22px;color:var(--grey-313);max-width:70ch}

/* Footer */
.site-footer{background:var(--deep-green);color:var(--on-dark-muted);margin-top:0;padding:64px 0 32px;font-size:15px}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px}
.site-footer h4{font:700 15px/1 var(--font-sans);letter-spacing:.04em;text-transform:uppercase;color:var(--white);margin-bottom:18px}
.site-footer ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.site-footer a{color:var(--on-dark-muted);text-decoration:none}
.site-footer a:hover{color:var(--cyan)}
.footer-brand img{width:160px;height:auto;margin-bottom:18px}
.footer-brand p{max-width:34ch}
.meta-badge{display:inline-flex;align-items:center;gap:10px;margin-top:22px;padding:10px 14px;border:1px solid var(--glass-line);border-radius:12px;color:var(--white);font-weight:600;font-size:14px}
.meta-badge svg{width:22px;height:22px}
.footer-bottom{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;margin-top:48px;padding-top:24px;border-top:1px solid var(--glass-line);font-size:14px}
.socials{display:flex;gap:16px}

/* Reveal motion (from the live site: fade up, 0.8s ease-out) */
.reveal{opacity:0;transform:translateY(30px);transition:opacity .8s ease-out,transform .8s ease-out}
.reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}*{transition:none!important}}

/* ---------- Responsive ---------- */
@media (max-width:1080px){
  .nav-links{gap:20px}
  .phone span{display:none}
  .why-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .feature.wide{grid-column:1/-1}
  .process{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sectors{grid-template-columns:repeat(3,minmax(0,1fr))}
  .footer-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:900px){
  .menu-toggle{display:block}
  .nav-links{display:flex;opacity:0;visibility:hidden;transform:translateY(-10px) scale(.97);transform-origin:top right;transition:opacity .3s ease,transform .4s cubic-bezier(.2,.8,.2,1),visibility 0s .4s;position:absolute;top:calc(100% + 8px);left:clamp(10px,1.4vw,16px);right:clamp(10px,1.4vw,16px);flex-direction:column;gap:0;background:var(--white);border-radius:var(--radius-20);padding:10px;box-shadow:0 4px 12px rgba(0,0,0,.3)}
  .nav-links.open{opacity:1;visibility:visible;transform:none;transition-delay:0s}
  .nav-links li{opacity:0;transform:translateY(-6px);transition:opacity .3s,transform .3s}
  .nav-links.open li{opacity:1;transform:none}
  .nav-links.open li:nth-child(2){transition-delay:.04s}.nav-links.open li:nth-child(3){transition-delay:.08s}.nav-links.open li:nth-child(4){transition-delay:.12s}.nav-links.open li:nth-child(5){transition-delay:.16s}
  .nav-links a::after{display:none}
  .nav-links a{color:var(--deep-green);opacity:1;display:block;padding:14px 16px;border-radius:var(--radius-10);font-weight:600}
  .nav-links a:hover{background:var(--surface-100);color:var(--deep-green)}
  .nav{position:relative}
  .nav-right .btn{display:none}
  .models,.enquire-grid{grid-template-columns:1fr}
  .feature.wide{grid-template-columns:1fr}
}
@media (max-width:600px){
  .brand img{width:124px}
  .why-grid,.process{grid-template-columns:1fr}
  .sectors{grid-template-columns:1fr 1fr}
  .sector-card{font-size:16px;padding:18px 16px}
  .sector-card .arr{width:28px;height:28px}
  form.card{grid-template-columns:1fr}
  .enquire-grid{padding:24px 16px}
  .footer-grid{grid-template-columns:1fr}
  .hero-ctas .btn{width:100%}
  .phone{display:none}
}

/* ---------- Motion ---------- */
/* Hero background: drifting colour orbs, breathing glow, slow grid drift and a cursor spotlight */
.hero-fx{position:absolute;inset:0;z-index:-2;overflow:hidden;pointer-events:none}
.orb{position:absolute;border-radius:50%;filter:blur(60px);opacity:.55}
.orb-1{width:420px;height:420px;left:8%;top:18%;background:radial-gradient(closest-side,rgba(91,217,178,.45),transparent);animation:orb-a 22s ease-in-out infinite}
.orb-2{width:380px;height:380px;right:6%;top:34%;background:radial-gradient(closest-side,rgba(0,215,215,.4),transparent);animation:orb-b 26s ease-in-out infinite}
.spot{position:absolute;inset:0;opacity:0;transition:opacity .6s;background:radial-gradient(520px circle at var(--mx,50%) var(--my,50%),rgba(0,215,215,.12),transparent 60%)}
.hero:hover .spot{opacity:1}
@keyframes glow-breathe{50%{opacity:.7;transform:translateX(-50%) scale(1.06)}}
@keyframes grid-drift{to{background-position:center 88px}}
@keyframes orb-a{33%{transform:translate(120px,-60px) scale(1.1)}66%{transform:translate(40px,80px) scale(.92)}}
@keyframes orb-b{40%{transform:translate(-140px,50px) scale(1.12)}75%{transform:translate(-30px,-70px) scale(.95)}}

/* Hero words rise in one by one */
.words .w{display:inline-block;opacity:0;transform:translateY(.45em);filter:blur(6px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1),filter .7s ease;transition-delay:calc(var(--i)*55ms + .1s)}
.words.in .w{opacity:1;transform:none;filter:none}

/* Shimmering gradient text */
.grad-text{background-image:linear-gradient(90deg,#5bd9b2 0%,#00d7d7 30%,#aefbea 50%,#00d7d7 70%,#5bd9b2 100%);background-size:200% auto;animation:grad-shift 6s linear infinite}
@keyframes grad-shift{to{background-position:-200% center}}

/* "Live" pulsing dot */
.pill-dark .dot{position:relative}
.pill-dark .dot::after{content:"";position:absolute;inset:0;border-radius:50%;background:inherit;animation:dot-ping 2s cubic-bezier(0,0,.2,1) infinite}
@keyframes dot-ping{75%,100%{transform:scale(2.6);opacity:0}}

/* Primary buttons: light sweep (idle in the hero, on hover everywhere) */
.btn-primary{position:relative;overflow:hidden;isolation:isolate}
.btn-primary::after{content:"";position:absolute;z-index:-1;top:0;bottom:0;left:-60%;width:40%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-20deg);pointer-events:none}
.btn-primary:hover::after{animation:btn-shine .8s ease}
.hero-ctas .btn-primary::after{animation:btn-shine-idle 5s ease 1.2s infinite}
@keyframes btn-shine{to{left:130%}}
@keyframes btn-shine-idle{0%{left:-60%}22%,100%{left:130%}}

/* Softer, springier scroll reveals */
.reveal{transform:translateY(34px) scale(.985);transition:opacity .9s ease-out,transform .9s cubic-bezier(.2,.7,.2,1)}

/* Cursor spotlight on dark cards */
.feature.wide.spotlight,.model.featured.spotlight,.enquire.spotlight{background-image:radial-gradient(420px circle at var(--mx,-999px) var(--my,-999px),rgba(0,215,215,.13),transparent 60%)}

/* Slowly drifting glows inside dark cards */
.enquire::before{animation:glow-float 18s ease-in-out infinite reverse}
@keyframes glow-float{50%{transform:translate(-60px,-40px) scale(1.15)}}

/* Tick lists pop in one after another */
.check-list li::before{transform:scale(0);transition:transform .45s cubic-bezier(.3,1.6,.5,1)}
.in .check-list li::before,.check-list.in li::before{transform:none}
.check-list li:nth-child(2)::before{transition-delay:.1s}.check-list li:nth-child(3)::before{transition-delay:.2s}.check-list li:nth-child(4)::before{transition-delay:.3s}.check-list li:nth-child(5)::before{transition-delay:.4s}.check-list li:nth-child(6)::before{transition-delay:.5s}

.step::before{position:relative;z-index:2;transition:background-color .4s,color .4s,transform .4s}
.step:hover::before{background:var(--deep-green);color:var(--cyan);transform:scale(1.08)}
.step{transition:transform .5s cubic-bezier(.2,.7,.2,1),box-shadow .35s,opacity .9s ease-out}
.step:hover{box-shadow:var(--shadow-card-hover)}

/* Small hover touches */
.sector-card .arr{transition:transform .3s,background-color .3s,color .3s}
.sector-card:hover .arr{transform:translateX(4px);background:var(--cyan);color:var(--deep-green)}
.feature .ico{transition:transform .4s cubic-bezier(.3,1.6,.5,1)}
.feature:hover .ico{transform:rotate(-8deg) scale(1.08)}
.faq summary::after{transition:transform .3s}
.faq details[open] summary::after{transform:translateY(-50%) rotate(180deg)}
.faq details[open] p{animation:faq-in .4s ease}
@keyframes faq-in{from{opacity:0;transform:translateY(-6px)}}
.tilt{transition:transform .15s ease-out!important}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important}
  .words .w,.check-list li::before{opacity:1;transform:none;filter:none}
  .spot{display:none}
}

/* ---------- Menu button & nav links ---------- */
.menu-toggle{width:44px;height:44px;border-radius:12px;display:none;place-items:center;transition:background-color .3s}
.menu-toggle:hover{background:var(--glass)}
.burger{position:relative;display:block;width:24px;height:18px}
.burger i{position:absolute;right:0;height:1.8px;border-radius:2px;background:var(--white);transition:top .3s cubic-bezier(.7,0,.2,1) .15s,transform .3s cubic-bezier(.7,0,.2,1),width .35s cubic-bezier(.7,0,.2,1),opacity .2s,background-color .3s}
.burger i:nth-child(1){top:0;width:24px}
.burger i:nth-child(2){top:8px;width:14px}
.burger i:nth-child(3){top:16px;width:24px}
.menu-toggle:hover .burger i:nth-child(2){width:24px}
.menu-toggle:hover .burger i:nth-child(1){width:18px}
.menu-toggle[aria-expanded="true"] .burger i{transition:top .3s cubic-bezier(.7,0,.2,1),transform .3s cubic-bezier(.7,0,.2,1) .15s,width .3s,opacity .2s,background-color .3s;background:var(--cyan)}
.menu-toggle[aria-expanded="true"] .burger i:nth-child(1){top:8px;width:24px;transform:rotate(45deg)}
.menu-toggle[aria-expanded="true"] .burger i:nth-child(2){opacity:0;width:0}
.menu-toggle[aria-expanded="true"] .burger i:nth-child(3){top:8px;width:24px;transform:rotate(-45deg)}
@media (max-width:900px){.menu-toggle{display:grid}}
.nav-links a{position:relative;transition:color .25s,opacity .25s}
.nav-links a::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:1.5px;border-radius:2px;background:var(--gradient-mark);transform:scaleX(0);transform-origin:right;transition:transform .35s cubic-bezier(.7,0,.2,1)}
.nav-links a:hover::after{transform:scaleX(1);transform-origin:left}

/* ---------- Proof strip (under the hero) ---------- */
.proof{padding:clamp(20px,3vw,32px) 0 0}
.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(14px,1.6vw,20px)}
.stat{position:relative;overflow:hidden;background:var(--surface-100);border-radius:var(--radius-30);padding:clamp(22px,2.6vw,32px);display:flex;flex-direction:column;gap:0;min-height:190px;transition:background-color .35s,transform .9s cubic-bezier(.2,.7,.2,1),opacity .9s ease-out}
.stat::after{content:"";position:absolute;inset:auto -40% -60% auto;width:260px;height:260px;border-radius:50%;background:radial-gradient(closest-side,rgba(0,215,215,.18),transparent);opacity:0;transition:opacity .4s}
.stat:hover{background:var(--surface-200)}
.stat:hover::after{opacity:1}
.stat .ico{flex:none;width:44px;height:44px;border-radius:14px;background:var(--deep-green);display:grid;place-items:center;transition:transform .4s cubic-bezier(.3,1.6,.5,1)}
.stat:hover .ico{transform:rotate(-8deg) scale(1.08)}
.stat .ico svg{width:22px;height:22px;stroke:var(--cyan);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.stat .num{margin-top:clamp(28px,3vw,44px);font:700 clamp(36px,4vw,54px)/1 var(--font-display);letter-spacing:-.03em;color:var(--deep-green)}
.stat .lbl{margin-top:8px;font-size:15px;color:var(--grey-313)}
@media (max-width:900px){.stats{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.stat{min-height:0;padding:18px}.stat .ico{width:38px;height:38px;border-radius:12px}.stat .num{margin-top:16px}.stat .num{font-size:34px}.stat .lbl{font-size:14px}}
@media (prefers-reduced-motion:reduce){.burger i{transition:none}}
.grad-text.counting{background:none;color:var(--mark-cyan);-webkit-text-fill-color:var(--mark-cyan)}

/* ---------- Case studies ---------- */
.cs-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,1.8vw,24px)}
.cs-card{display:flex;flex-direction:column;background:var(--white);border:1px solid var(--line);border-radius:var(--radius-30);overflow:hidden;box-shadow:var(--shadow-card);transition:transform .9s cubic-bezier(.2,.7,.2,1),opacity .9s ease-out,box-shadow .35s,border-color .35s}
.cs-card:hover{box-shadow:var(--shadow-card-hover);border-color:rgba(0,215,215,.45)}
.cs-brand{position:relative;isolation:isolate;overflow:hidden;height:clamp(130px,12vw,160px);display:grid;place-items:center;padding:0 28px;background:var(--hero-green)}
.cs-brand::before{content:"";position:absolute;z-index:-1;inset:0;background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:32px 32px;mask-image:radial-gradient(ellipse at center,#000,transparent 75%);-webkit-mask-image:radial-gradient(ellipse at center,#000,transparent 75%);transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.cs-brand::after{content:"";position:absolute;z-index:-1;width:320px;height:320px;left:50%;top:50%;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(closest-side,rgba(0,215,215,.22),transparent);transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.cs-card:hover .cs-brand::before{transform:scale(1.12)}
.cs-card:hover .cs-brand::after{transform:translate(-50%,-50%) scale(1.35)}
.cs-brand img{height:38px;width:auto;max-width:78%;filter:brightness(0) invert(1);transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.cs-card:hover .cs-brand img,.cs-card:hover .cs-wordmark{transform:scale(1.06)}
.cs-wordmark{display:inline-flex;align-items:center;gap:10px;font:700 30px/1 var(--font-display);letter-spacing:-.03em;color:var(--white);transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.cs-anon{font:600 17px/1 var(--font-sans);letter-spacing:0;color:var(--on-dark-muted)}
.cs-anon svg{width:26px;height:26px;fill:none;stroke:var(--cyan);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.cs-body{flex:1;display:flex;flex-direction:column;padding:clamp(22px,2.4vw,30px)}
.cs-tags{display:flex;flex-wrap:wrap;gap:6px}
.cs-tags span{font-size:12px;font-weight:600;color:var(--deep-green);background:var(--surface-100);border:1px solid var(--line);padding:5px 10px;border-radius:30px}
.cs-num{margin-top:22px;font:700 clamp(40px,4.2vw,58px)/1 var(--font-display);letter-spacing:-.035em;color:var(--deep-green)}
.cs-metric{margin-top:8px;font-weight:600;color:var(--deep-green)}
.cs-body p{margin-top:12px;font-size:15px;color:var(--grey-313)}
.cs-stats{margin:auto 0 0;padding-top:22px;display:grid;grid-template-columns:1fr 1fr;gap:10px}
.cs-stats div{background:var(--surface-100);border-radius:14px;padding:12px 14px}
.cs-stats dt{font-size:12px;color:var(--grey-313)}
.cs-stats dd{margin:4px 0 0;font:700 22px/1 var(--font-display);letter-spacing:-.02em;color:var(--deep-green)}
@media (max-width:1080px){.cs-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.cs-grid{grid-template-columns:1fr}}

/* Keep last: Syne's default numerals are old-style (the 8 sits taller than the 4 and 9), and font shorthands reset this, so use even-height, equal-width figures */
h1,h2,h3,h4{font-variant-numeric:lining-nums}
.stat .num,.cs-num,.cs-stats dd,.step::before{font-variant-numeric:lining-nums tabular-nums}

/* ---------- Inner page hero ---------- */
.hero.page-hero{padding:clamp(120px,12vw,150px) 0 clamp(48px,6vw,72px)}
.page-hero-inner{max-width:820px;margin:0 auto;text-align:center}
.page-hero-inner h1{color:var(--white);font-size:clamp(38px,5.4vw,68px);line-height:1;letter-spacing:-.02em;margin:18px auto 20px;max-width:16ch}
.page-hero-inner .lead{font-size:clamp(17px,1.5vw,19px);line-height:1.55;color:var(--on-dark-muted);max-width:600px;margin:0 auto}
.page-hero-inner .hero-ctas{justify-content:center}
.crumbs{display:inline-flex;gap:8px;font-size:14px;color:var(--on-dark-muted)}
.crumbs a{color:var(--on-dark-muted);text-decoration:none}
.crumbs a:hover{color:var(--cyan)}
.crumbs [aria-current]{color:var(--white)}

/* ---------- Sectors dropdown ---------- */
.nav-links .has-sub{position:relative}
.sub-toggle{display:inline-flex;align-items:center;gap:6px;background:none;border:0;padding:0;cursor:pointer;font:500 15px/1.5 var(--font-sans);color:var(--white);opacity:.85;transition:color .25s,opacity .25s}
.sub-toggle svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:1.6;transition:transform .3s}
.has-sub:hover .sub-toggle,.has-sub.open .sub-toggle{color:var(--cyan);opacity:1}
.has-sub:hover .sub-toggle svg,.has-sub.open .sub-toggle svg{transform:rotate(180deg)}
.nav-sub{position:absolute;top:calc(100% + 18px);left:50%;width:min(720px,90vw);display:grid;grid-template-columns:1.5fr 1fr;gap:10px;padding:14px;background:var(--white);border-radius:var(--radius-20);box-shadow:0 30px 80px rgba(0,0,0,.28);opacity:0;visibility:hidden;transform:translate(-50%,8px);transition:opacity .25s,transform .3s cubic-bezier(.2,.8,.2,1),visibility 0s .3s;z-index:30}
.nav-sub::before{content:"";position:absolute;inset:-18px 0 auto 0;height:18px}
.has-sub:hover .nav-sub,.has-sub:focus-within .nav-sub,.has-sub.open .nav-sub{opacity:1;visibility:visible;transform:translate(-50%,0);transition-delay:0s}
.nav-sub-col{padding:8px}
.nav-sub-col+.nav-sub-col{background:var(--surface-100);border-radius:14px}
.nav-sub-title{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--grey-313);margin:4px 10px 8px}
.nav-sub ul{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.nav-sub-grid{grid-template-columns:1fr 1fr}
.nav-sub li a{display:block;padding:10px;border-radius:10px;color:var(--deep-green);opacity:1;text-decoration:none;transition:background-color .2s}
.nav-sub li a::after{display:none}
.nav-sub li a:hover{background:var(--cyan-tint);color:var(--deep-green)}
.nav-sub li b{display:block;font-size:14px;font-weight:600}
.nav-sub li span{display:block;margin-top:2px;font-size:12px;line-height:1.35;color:var(--grey-313);font-weight:400}
.nav-sub-cta{display:flex;justify-content:space-between;gap:8px;margin:10px 10px 4px;padding-top:12px;border-top:1px solid var(--surface-200);font-size:13px;font-weight:600;color:var(--deep-green);text-decoration:none}
.nav-sub-cta:hover{color:var(--cyan-ink)}
.nav-links-cta{display:none}
@media (max-width:900px){
  .nav-links{max-height:calc(100vh - 110px);overflow-y:auto}
  .sub-toggle{width:100%;justify-content:space-between;padding:14px 16px;border-radius:var(--radius-10);color:var(--deep-green);opacity:1;font-weight:600}
  .has-sub:hover .sub-toggle{color:var(--deep-green)}
  .has-sub:hover .sub-toggle svg{transform:none}
  .has-sub.open .sub-toggle svg{transform:rotate(180deg)}
  .nav-sub{position:static;width:auto;transform:none;opacity:1;visibility:visible;box-shadow:none;padding:0 0 8px;display:none;grid-template-columns:1fr}
  .has-sub:hover .nav-sub,.has-sub:focus-within .nav-sub{transform:none;display:none}
  .has-sub.open .nav-sub{display:grid}
  .nav-sub::before{display:none}
  .nav-sub li span{display:none}
  .nav-links-cta{display:block;padding:8px 6px 4px}
  .nav-links-cta .btn{width:100%;color:var(--deep-green)!important}
}

/* ---------- Footer sector lists ---------- */
.footer-links b{font-weight:400}
.footer-links span{display:none}

/* ---------- "View all" link under sections ---------- */
.section-more{margin-top:clamp(28px,3vw,40px);text-align:center}
.btn-outline-dark{background:transparent;color:var(--deep-green);border-color:var(--deep-green)}
.btn-outline-dark span{transition:transform .3s}
.btn-outline-dark:hover{background:var(--deep-green);color:var(--cyan)}
.btn-outline-dark:hover span{transform:translateX(4px)}

/* ---------- Get-pricing call to action ---------- */
.cta-band-wrap{padding:0 0 clamp(72px,9vw,120px)}
.cta-band{position:relative;overflow:hidden;isolation:isolate;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(28px,4vw,64px);align-items:center;padding:clamp(32px,5vw,64px);background:var(--hero-green);color:var(--white);border-radius:var(--radius-30)}
.cta-band::before{content:"";position:absolute;z-index:-1;width:700px;height:700px;left:-260px;top:-300px;border-radius:50%;background:radial-gradient(closest-side,rgba(0,215,215,.22),transparent);animation:glow-float 18s ease-in-out infinite}
.cta-band::after{content:"";position:absolute;z-index:-1;inset:0;background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:56px 56px;mask-image:radial-gradient(ellipse at 100% 50%,#000,transparent 70%);-webkit-mask-image:radial-gradient(ellipse at 100% 50%,#000,transparent 70%)}
.cta-band h2{color:var(--white);font-size:clamp(32px,4vw,52px);line-height:1;letter-spacing:-.02em;margin:18px 0 16px}
.cta-band p{color:var(--on-dark-muted);font-size:17px;max-width:48ch}
.cta-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.cta-quick-title{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--on-dark-muted);margin-bottom:12px}
.cta-tiles{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.cta-tiles a{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:15px 16px;border-radius:14px;background:var(--glass);border:1px solid var(--glass-line);color:var(--white);text-decoration:none;font-weight:600;font-size:15px;transition:background-color .25s,border-color .25s,transform .25s}
.cta-tiles a span{color:var(--cyan);transition:transform .25s}
.cta-tiles a:hover{background:rgba(0,215,215,.12);border-color:rgba(0,215,215,.5);transform:translateY(-2px)}
.cta-tiles a:hover span{transform:translateX(3px)}
@media (max-width:900px){.cta-band{grid-template-columns:1fr}}

/* ---------- Case study filters ---------- */
.chips{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-bottom:clamp(28px,3vw,40px)}
.chip{font:600 14px/1 var(--font-sans);color:var(--deep-green);background:var(--surface-100);border:1px solid var(--line);padding:11px 18px;border-radius:30px;cursor:pointer;transition:background-color .25s,color .25s,border-color .25s}
.chip:hover{border-color:var(--deep-green)}
.chip.on{background:var(--deep-green);border-color:var(--deep-green);color:var(--cyan)}
.cs-card[hidden]{display:none}
.cs-empty{text-align:center;color:var(--grey-313);margin-top:20px}
.cs-page{padding-top:clamp(40px,5vw,64px)}

/* ---------- Quiz ---------- */
.quiz{position:relative;max-width:760px;margin:clamp(32px,4vw,48px) auto 0;background:var(--white);color:var(--grey-ink);border-radius:var(--radius-30);padding:clamp(22px,3.4vw,40px);box-shadow:0 40px 100px rgba(0,0,0,.35);text-align:left}
.quiz-top{display:flex;align-items:center;justify-content:space-between;min-height:28px}
.quiz-back{display:inline-flex;align-items:center;gap:4px;background:none;border:0;padding:4px 6px 4px 0;cursor:pointer;font:600 14px/1 var(--font-sans);color:var(--deep-green)}
.quiz-back svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;transition:transform .25s}
.quiz-back:hover svg{transform:translateX(-3px)}
.quiz-count{margin-left:auto;font-size:13px;color:var(--grey-313)}
.quiz-count b{color:var(--deep-green)}
.quiz-progress{height:6px;margin:12px 0 26px;border-radius:6px;background:var(--surface-200);overflow:hidden}
.quiz-progress span{display:block;height:100%;background:var(--gradient-mark);border-radius:inherit;transform:scaleX(.16);transform-origin:left;transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.q-step{border:0;margin:0;padding:0;min-width:0}
.q-step+.q-step{margin-top:36px}
.quiz.js .q-step+.q-step{margin-top:0}
.quiz.js .q-step{display:none}
.quiz.js .q-step.active{display:block;animation:step-in .45s cubic-bezier(.2,.8,.2,1)}
@keyframes step-in{from{opacity:0;transform:translateX(24px)}}
.q-step legend{padding:0;font:700 clamp(24px,2.8vw,32px)/1.12 var(--font-display);letter-spacing:-.02em;color:var(--deep-green);outline:none}
.q-hint{margin-top:8px;color:var(--grey-313);font-size:15px}
.q-tiles{display:grid;gap:10px;margin-top:22px}
.q-tiles label{position:relative;cursor:pointer}
.q-tiles input{position:absolute;opacity:0;pointer-events:none}
.q-tiles label>span{display:flex;align-items:center;gap:12px;height:100%;padding:16px 18px;border-radius:14px;border:1.5px solid var(--line);background:var(--surface-100);font-weight:600;color:var(--deep-green);transition:border-color .2s,background-color .2s,transform .2s,box-shadow .2s}
.q-tiles label:hover>span{border-color:var(--deep-green);transform:translateY(-2px)}
.q-tiles input:checked+span{border-color:var(--deep-green);background:var(--white);box-shadow:0 0 0 3px var(--cyan-tint)}
.q-tiles input:focus-visible+span{outline:2px solid var(--deep-green);outline-offset:2px}
.q-tiles input:checked+span::after{content:"✓";margin-left:auto;flex:none;width:22px;height:22px;border-radius:50%;background:var(--gradient-mark);color:var(--deep-green);display:grid;place-items:center;font-size:12px;font-weight:800;animation:pop .3s cubic-bezier(.3,1.6,.5,1)}
@keyframes pop{from{transform:scale(0)}}
.q-tiles-icons{grid-template-columns:repeat(3,minmax(0,1fr))}
.q-tiles-icons label>span{flex-direction:column;align-items:flex-start;gap:14px;padding:18px}
.q-tiles-icons svg{width:36px;height:36px;padding:7px;border-radius:10px;background:var(--deep-green);fill:none;stroke:var(--cyan);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;transition:transform .3s cubic-bezier(.3,1.6,.5,1)}
.q-tiles-icons label:hover svg{transform:rotate(-8deg) scale(1.06)}
.q-tiles-icons input:checked+span::after{position:absolute;top:14px;right:14px}
.q-tiles-rows label>span{flex-wrap:wrap}
.q-tiles-rows b{display:block;font-size:16px}
.q-tiles-rows small{display:block;width:100%;margin-top:2px;font-size:14px;font-weight:400;color:var(--grey-313)}
.q-tiles-rows input:checked+span::after{position:absolute;top:50%;right:18px;transform:translateY(-50%)}
.q-tiles-rows label>span{padding-right:56px}
.q-tiles-pills{grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}
.q-area{margin-top:18px}
.q-fields{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:22px}
.q-step .consent{margin-top:16px}
.quiz-actions{display:flex;justify-content:flex-end;margin-top:26px}
.quiz-actions .btn{min-width:200px}
.quiz-actions .btn[hidden]{display:none}
.quiz-next:disabled{opacity:.45;cursor:not-allowed;transform:none;box-shadow:none}
.quiz.js .quiz-next.quiet{display:none}
.quiz:not(.js) .quiz-next,.quiz:not(.js) .quiz-back,.quiz:not(.js) .quiz-count,.quiz:not(.js) .quiz-progress{display:none}
.quiz .form-status{margin-top:10px;text-align:right}
.quiz.is-done>*:not(.quiz-done){display:none!important}
.quiz-done{text-align:center;padding:10px 0;outline:none;animation:step-in .5s cubic-bezier(.2,.8,.2,1)}
.done-tick{width:64px;height:64px;margin:0 auto 18px;border-radius:50%;background:var(--gradient-mark);display:grid;place-items:center;animation:pop .5s cubic-bezier(.3,1.6,.5,1)}
.done-tick svg{width:30px;height:30px;fill:none;stroke:var(--deep-green);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.quiz-done h2{font-size:clamp(28px,3.4vw,40px);letter-spacing:-.02em}
.quiz-done>p{margin:12px auto 0;max-width:46ch;color:var(--grey-313)}
.done-case{margin-top:30px;text-align:left}
.done-case-title{text-align:center;font-weight:600;color:var(--deep-green);margin-bottom:14px}
.done-case .cs-grid{grid-template-columns:minmax(0,420px);justify-content:center}
.quiz-trust{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 26px;margin:22px 0 0;padding:0;list-style:none;font-size:14px;color:var(--on-dark-muted)}
.quiz-trust li::before{content:"✓";margin-right:8px;color:var(--cyan);font-weight:800}
.quiz-hero .page-hero-inner h1{max-width:none}
@media (max-width:640px){
  .q-tiles-icons{grid-template-columns:1fr 1fr}
  .q-fields{grid-template-columns:1fr}
  .quiz-actions .btn{width:100%}
}
.quiz-back[hidden]{display:none}
.q-tiles-rows label>span{row-gap:2px}

/* ---------- Sector & channel pages ---------- */
.svc-hero .page-hero-inner h1{max-width:18ch}
.svc-usps{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 24px;margin:26px 0 0;padding:0;list-style:none;font-size:14px;font-weight:600;color:var(--white)}
.svc-usps li::before{content:"✓";margin-right:8px;color:var(--cyan);font-weight:800}
.svc-intro{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(28px,5vw,72px);align-items:start}
.svc-intro-copy h2{font-size:clamp(30px,3.8vw,48px);line-height:1.02;letter-spacing:-.02em;margin-bottom:20px}
.svc-intro-copy p{font-size:17px;color:var(--grey-313)}
.svc-intro-copy p+p{margin-top:14px}
.svc-note{margin-top:26px;padding:18px 20px;border-radius:var(--radius-12);background:var(--surface-100);border-left:3px solid var(--deep-green)}
.svc-note b{display:block;font-size:13px;letter-spacing:.04em;text-transform:uppercase;color:var(--deep-green);margin-bottom:6px}
.svc-note p{font-size:14px!important;line-height:1.55}
.svc-glance{position:sticky;top:24px;padding:clamp(22px,2.6vw,32px);border-radius:var(--radius-30);background:var(--hero-green);color:var(--white);overflow:hidden;isolation:isolate}
.svc-glance::before{content:"";position:absolute;z-index:-1;width:360px;height:360px;right:-140px;top:-160px;border-radius:50%;background:radial-gradient(closest-side,rgba(0,215,215,.25),transparent);animation:glow-float 14s ease-in-out infinite}
.svc-glance-title{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--on-dark-muted)}
.svc-glance-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:16px 0 22px}
.svc-glance-grid div{padding:16px;border-radius:14px;background:var(--glass);border:1px solid var(--glass-line)}
.svc-glance-grid b{display:block;font:700 28px/1 var(--font-display);letter-spacing:-.02em;font-variant-numeric:lining-nums}
.svc-glance-grid span{display:block;margin-top:6px;font-size:13px;color:var(--on-dark-muted)}
.svc-glance .btn{width:100%}
.svc-features{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px}
.svc-features .feature{background:var(--white)}
.section:not(.band) .svc-features .feature{background:var(--surface-100)}
.svc-features .feature .ico svg{stroke-width:2.2}
.svc-tags{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:0;padding:0;list-style:none}
.svc-tags li{display:inline-flex;align-items:center;gap:10px;padding:14px 20px;border-radius:40px;background:var(--white);border:1px solid var(--line);font-weight:600;color:var(--deep-green);box-shadow:var(--shadow-card);transition:transform .3s,border-color .3s}
.section:not(.band) .svc-tags li{background:var(--surface-100);box-shadow:none}
.svc-tags li:hover{transform:translateY(-3px);border-color:var(--cyan)}
.svc-tags svg{width:18px;height:18px;padding:3px;border-radius:50%;background:var(--gradient-mark);fill:none;stroke:var(--deep-green);stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.svc-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.svc-card{padding:24px;border-radius:var(--radius-20);background:var(--white);border:1px solid var(--line);transition:transform .9s cubic-bezier(.2,.7,.2,1),opacity .9s ease-out,border-color .3s,box-shadow .3s}
.section:not(.band) .svc-card{background:var(--surface-100)}
.svc-card:hover{border-color:var(--cyan);box-shadow:var(--shadow-card-hover)}
.svc-card h3{font-size:20px;letter-spacing:-.3px;margin-bottom:8px}
.svc-card p{font-size:15px;color:var(--grey-313)}
.svc-prose{max-width:760px;margin:0 auto;text-align:center}
.svc-prose h2{font-size:clamp(30px,3.8vw,48px);line-height:1.02;letter-spacing:-.02em;margin-bottom:18px}
.svc-prose p{font-size:17px;color:var(--grey-313)}
.svc-prose p+p{margin-top:14px}
.svc-highlight{position:relative;overflow:hidden;isolation:isolate;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:clamp(24px,4vw,56px);align-items:center;padding:clamp(28px,4.4vw,56px);border-radius:var(--radius-30);background:var(--hero-green);color:var(--white)}
.svc-highlight::before{content:"";position:absolute;z-index:-1;width:520px;height:520px;right:-180px;bottom:-240px;border-radius:50%;background:radial-gradient(closest-side,rgba(0,215,215,.22),transparent);animation:glow-float 16s ease-in-out infinite}
.svc-highlight p{margin-top:18px;font-size:clamp(18px,1.7vw,22px);line-height:1.45;color:var(--white)}
.svc-highlight-card{padding:26px;border-radius:var(--radius-20);background:var(--glass);border:1px solid var(--glass-line)}
.svc-highlight-card h3{color:var(--white);font-size:22px;line-height:1.2;margin-bottom:10px}
.svc-highlight-card p{margin:0;font-size:15px;color:var(--on-dark-muted)}
@media (max-width:900px){.svc-intro,.svc-highlight{grid-template-columns:1fr}.svc-glance{position:static}}

/* ---------- Legal pages ---------- */
.legal{max-width:760px;margin:0 auto;font-size:16px;line-height:1.7;color:var(--grey-313)}
.legal h2{font-size:clamp(20px,2vw,24px);letter-spacing:-.3px;margin:40px 0 12px}
.legal h2:first-child{margin-top:0}
.legal p+p,.legal ul+p,.legal p+ul{margin-top:12px}
.legal ul{padding-left:22px}
.legal li+li{margin-top:4px}
.cs-grid.cs-few{grid-template-columns:repeat(auto-fit,minmax(280px,380px));justify-content:center}
.nav-links .nav-sub-cta{color:var(--deep-green);opacity:1}
.nav-links .nav-sub-cta::after{display:none}
.nav-links .nav-sub-cta:hover{color:var(--cyan-ink)}
@media (max-width:900px){
  .has-sub.open .nav-sub{transform:none}
  .has-sub.open .sub-toggle{color:var(--deep-green);background:var(--surface-100)}
  .nav-sub-col{padding:4px 0}
  .nav-sub-col+.nav-sub-col{padding:4px 0;background:none}
  .nav-sub-title{margin:8px 16px 4px}
  .nav-sub li a{padding:10px 16px}
  .nav-sub-cta{margin:6px 16px 0}
}
@media (max-width:900px){.nav-links .nav-sub-cta{padding:12px 0 0;display:flex}}

/* ---------- WhatsApp ---------- */
.wa-nav{display:inline-flex;align-items:center;gap:8px;color:var(--white);text-decoration:none;font-weight:600;font-size:15px;transition:color .25s}
.wa-nav svg,.wa-btn svg{width:18px;height:18px;fill:#25d366}
.wa-nav:hover{color:#25d366}
.wa-float{position:fixed;right:clamp(14px,2vw,24px);bottom:clamp(14px,2vw,24px);z-index:50;width:58px;height:58px;border-radius:50%;background:#25d366;display:grid;place-items:center;box-shadow:0 10px 30px rgba(0,0,0,.25);transition:transform .3s cubic-bezier(.3,1.6,.5,1)}
.wa-float svg{width:30px;height:30px;fill:#fff}
.wa-float::before{content:"";position:absolute;inset:0;border-radius:50%;background:#25d366;z-index:-1;animation:wa-ping 2.6s cubic-bezier(0,0,.2,1) infinite}
@keyframes wa-ping{0%{transform:scale(1);opacity:.5}70%,100%{transform:scale(1.45);opacity:0}}
.wa-float:hover{transform:scale(1.08)}
.wa-tip{position:absolute;right:calc(100% + 12px);white-space:nowrap;background:var(--white);color:var(--deep-green);font-weight:600;font-size:14px;padding:9px 14px;border-radius:12px;box-shadow:0 8px 24px rgba(0,0,0,.15);opacity:0;transform:translateX(6px);transition:opacity .25s,transform .25s;pointer-events:none}
.wa-float:hover .wa-tip{opacity:1;transform:none}
@media (max-width:600px){.wa-nav span{display:none}}

/* ---------- Menu: services + sectors feature panel ---------- */
.nav-sub-sm{width:min(620px,90vw);grid-template-columns:1fr 1fr}
.nav-sub-feature{display:flex;flex-direction:column;align-items:flex-start;padding:16px!important}
.nav-sub-big{font:700 22px/1.1 var(--font-display);letter-spacing:-.02em;color:var(--deep-green);margin:2px 10px 8px;font-variant-numeric:lining-nums}
.nav-sub-text{font-size:13px;color:var(--grey-313);margin:0 10px 16px}
.nav-sub-feature .btn{margin:0 10px;color:var(--deep-green)!important;opacity:1!important}
.nav-sub-feature .btn::after{display:none}
.nav-sub-feature .btn::after{content:none}
@media (max-width:900px){.nav-sub-feature{padding:8px 0!important}.nav-sub-big,.nav-sub-text{margin-left:16px;margin-right:16px}.nav-sub-feature .btn{margin:0 16px}}

/* ---------- Technology section + pipeline ---------- */
.tech{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,5vw,80px);align-items:center}
.tech-points{list-style:none;margin:0 0 30px;padding:0;display:grid;gap:18px}
.tech-points li{padding-left:34px;position:relative}
.tech-points li::before{content:"";position:absolute;left:0;top:3px;width:20px;height:20px;border-radius:50%;background:var(--gradient-mark);box-shadow:0 0 0 5px var(--cyan-tint)}
.tech-points b{display:block;font:700 19px/1.25 var(--font-display);color:var(--deep-green);letter-spacing:-.2px}
.tech-points span{display:block;margin-top:4px;color:var(--grey-313)}
.pipeline{position:relative;display:grid;gap:14px;padding:clamp(22px,3vw,34px);border-radius:var(--radius-30);background:var(--hero-green);overflow:hidden;isolation:isolate}
.pipeline::before{content:"";position:absolute;z-index:-1;width:420px;height:420px;right:-160px;top:-180px;border-radius:50%;background:radial-gradient(closest-side,rgba(0,215,215,.24),transparent);animation:glow-float 16s ease-in-out infinite}
.pl-step{position:relative;display:flex;gap:16px;align-items:flex-start;padding:16px;border-radius:18px;background:var(--glass);border:1px solid var(--glass-line);transition:border-color .4s,background-color .4s}
.pl-step:hover{border-color:rgba(0,215,215,.5);background:rgba(0,215,215,.08)}
.pl-ico{flex:none;width:44px;height:44px;border-radius:14px;background:var(--deep-green);border:1px solid var(--glass-line);display:grid;place-items:center}
.pl-ico svg{width:22px;height:22px;fill:none;stroke:var(--cyan);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.pl-end .pl-ico{background:var(--gradient-mark);border:0}
.pl-end .pl-ico svg{stroke:var(--deep-green);stroke-width:2.4}
.pl-step b{display:block;color:var(--white);font-weight:600}
.pl-step span{display:block;margin-top:3px;font-size:14px;color:var(--on-dark-muted)}
@media (max-width:900px){.tech{grid-template-columns:1fr}}

/* ---------- Services (homepage) ---------- */
.model-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.model-actions .btn{flex:1}
.model .btn{width:auto}
.model-link{font-weight:600;font-size:15px;color:var(--deep-green);text-decoration:none;white-space:nowrap}
.model.featured .model-link{color:var(--cyan)}
.model-link:hover{text-decoration:underline}

/* ---------- Sectors: "also" list ---------- */
.more-verticals{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;margin-top:24px}
.more-verticals span{font-size:14px;font-weight:600;color:var(--grey-313);margin-right:4px}
.more-verticals a{font-size:14px;color:var(--deep-green);text-decoration:none;padding:7px 13px;border-radius:30px;border:1px solid var(--line);transition:border-color .2s,background-color .2s}
.more-verticals a:hover{border-color:var(--cyan);background:var(--cyan-tint)}
.cta-tiles .cta-tile-all{grid-column:1/-1;justify-content:center;gap:10px;background:rgba(0,215,215,.1);border-color:rgba(0,215,215,.35)}

/* ---------- Offers on sector pages ---------- */
.offers-inline{margin-top:clamp(40px,5vw,64px)}
.offers-title{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--grey-313);margin-bottom:14px}
.offers-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.offer{display:flex;flex-direction:column;padding:22px;border-radius:var(--radius-20);background:var(--surface-100);border:1px solid var(--line);text-decoration:none;color:inherit;transition:transform .9s cubic-bezier(.2,.7,.2,1),opacity .9s ease-out,border-color .3s,background-color .3s}
.offer:hover{border-color:var(--cyan);background:var(--white)}
.offer-k{font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--cyan-ink)}
.offer h3{margin-top:8px;font-size:20px;letter-spacing:-.3px}
.offer p{margin-top:6px;font-size:15px;color:var(--grey-313)}
.offer em{margin-top:auto;padding-top:14px;font-style:normal;font-weight:600;font-size:14px;color:var(--deep-green)}
@media (max-width:900px){.offers-grid{grid-template-columns:1fr}}

/* ---------- Sectors hub ---------- */
.vh-search{position:relative;max-width:520px;margin:28px auto 0}
.vh-search svg{position:absolute;left:18px;top:50%;transform:translateY(-50%);width:20px;height:20px;fill:none;stroke:var(--on-dark-muted);stroke-width:2;stroke-linecap:round}
.vh-search input{width:100%;padding:17px 18px 17px 50px;border-radius:14px;border:1px solid var(--glass-line);background:rgba(255,255,255,.08);color:var(--white);font:500 16px/1.2 var(--font-sans);transition:border-color .25s,background-color .25s}
.vh-search input::placeholder{color:var(--on-dark-muted)}
.vh-search input:focus{outline:none;border-color:var(--cyan);background:rgba(255,255,255,.12)}
.vh{display:grid;gap:clamp(28px,3vw,44px)}
.vh-group h2{font-size:clamp(22px,2.2vw,28px);letter-spacing:-.02em;margin-bottom:14px}
.vh-group ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px}
.vh-item{display:flex;flex-direction:column;gap:4px;padding:18px 20px;border-radius:16px;background:var(--surface-100);border:1px solid transparent;text-decoration:none;transition:border-color .25s,background-color .25s,transform .25s}
.vh-item span{font:700 18px/1.2 var(--font-display);color:var(--deep-green);letter-spacing:-.2px}
.vh-item em{font-style:normal;font-size:13px;font-weight:600;color:var(--grey-313)}
.vh-item.has-page{background:var(--hero-green)}
.vh-item.has-page span{color:var(--white)}
.vh-item.has-page em{color:var(--cyan)}
.vh-item:hover{border-color:var(--cyan);transform:translateY(-3px)}
.vh-group[hidden],.vh-group li[hidden]{display:none}
.vh-none{text-align:center;padding:30px 0}
.vh-none p{margin-bottom:16px;color:var(--grey-313)}
.vh-custom{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;margin-top:clamp(40px,5vw,64px);padding:clamp(24px,3vw,36px);border-radius:var(--radius-20);border:1.5px dashed var(--line)}
.vh-custom h2{font-size:clamp(22px,2.2vw,28px);letter-spacing:-.02em}
.vh-custom p{margin-top:6px;color:var(--grey-313);max-width:56ch}
.vh-section{padding-top:clamp(40px,5vw,64px)}

/* ---------- "Best for" blocks on product pages ---------- */
.fit{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(28px,5vw,72px);align-items:center}
.fit h2{font-size:clamp(28px,3.4vw,44px);line-height:1.04;letter-spacing:-.02em;margin:0 0 16px}
.fit p{font-size:17px;color:var(--grey-313)}
.fit p a{color:var(--deep-green);font-weight:600}
.fit .cs-grid.cs-few{grid-template-columns:minmax(0,420px);justify-content:start}
.fit-list{padding:clamp(22px,3vw,32px)!important;border-radius:var(--radius-20);background:var(--white);box-shadow:var(--shadow-card)}
.section:not(.band) .fit-list{background:var(--surface-100);box-shadow:none}
@media (max-width:900px){.fit{grid-template-columns:1fr}}
.pl-step{animation:pl-glow 6s ease-in-out infinite}
.pl-step:nth-child(2){animation-delay:1.5s}.pl-step:nth-child(3){animation-delay:3s}.pl-step:nth-child(4){animation-delay:4.5s}
@keyframes pl-glow{0%,30%,100%{border-color:var(--glass-line);background:var(--glass)}8%,20%{border-color:rgba(0,215,215,.55);background:rgba(0,215,215,.1)}}

/* ---------- Stats inside the hero ---------- */
.hero-stats{margin-top:clamp(36px,4.5vw,56px);text-align:left}
.hero-stats .stat{background:var(--glass);border:1px solid var(--glass-line);min-height:0;padding:clamp(18px,2vw,24px);transition:background-color .35s,border-color .35s,transform .9s cubic-bezier(.2,.7,.2,1),opacity .9s ease-out}
.hero-stats .stat:hover{background:rgba(255,255,255,.1);border-color:rgba(0,215,215,.45)}
.hero-stats .stat::after{background:radial-gradient(closest-side,rgba(0,215,215,.25),transparent)}
.hero-stats .stat .ico{width:38px;height:38px;border-radius:12px;background:rgba(0,215,215,.14)}
.hero-stats .stat .num{margin-top:18px;color:var(--white);font-size:clamp(30px,3.2vw,42px)}
.hero-stats .stat .lbl{color:var(--on-dark-muted);font-size:14px}

/* ---------- Closed-loop graphic ---------- */
.loop{position:relative;padding:clamp(20px,2.8vw,32px);border-radius:var(--radius-30);background:var(--hero-green);overflow:hidden;isolation:isolate}
.loop::before{content:"";position:absolute;z-index:-1;width:440px;height:440px;right:-170px;top:-190px;border-radius:50%;background:radial-gradient(closest-side,rgba(0,215,215,.24),transparent);animation:glow-float 16s ease-in-out infinite}
.loop-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:12px}
.loop-steps li{padding:18px;border-radius:18px;background:var(--glass);border:1px solid var(--glass-line);animation:loop-glow 9s ease-in-out infinite}
.loop-steps li:nth-child(2){animation-delay:1.5s}.loop-steps li:nth-child(3){animation-delay:3s}.loop-steps li:nth-child(4){animation-delay:4.5s}.loop-steps li:nth-child(5){animation-delay:6s}.loop-steps li:nth-child(6){animation-delay:7.5s}
@keyframes loop-glow{0%,22%,100%{border-color:var(--glass-line);background:var(--glass)}5%,15%{border-color:rgba(0,215,215,.6);background:rgba(0,215,215,.1)}}
.loop-n{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;background:rgba(0,215,215,.14);color:var(--cyan);font:700 12px/1 var(--font-display);font-variant-numeric:lining-nums}
.loop-steps b{display:block;margin-top:12px;color:var(--white);font:700 18px/1.2 var(--font-display);letter-spacing:-.2px}
.loop-steps li>span:last-child{display:block;margin-top:4px;font-size:14px;line-height:1.45;color:var(--on-dark-muted)}
.loop-foot{display:flex;align-items:center;gap:12px;margin-top:16px;padding:14px 16px;border-radius:14px;background:rgba(0,215,215,.1);border:1px solid rgba(0,215,215,.3);color:var(--white);font-weight:600;font-size:15px}
.loop-foot svg{flex:none;width:22px;height:22px;fill:none;stroke:var(--cyan);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;animation:loop-spin 6s linear infinite}
@keyframes loop-spin{to{transform:rotate(360deg)}}
@media (max-width:480px){.loop-steps{grid-template-columns:1fr}}

/* Hero numbers: plain centred row, no cards */
.hero-stats{max-width:900px;margin:clamp(36px,4.5vw,52px) auto 0;gap:clamp(16px,3vw,40px);text-align:center}
.hero-stats .stat,.hero-stats .stat:hover{background:none;border:0;padding:0;border-radius:0;min-height:0;align-items:center}
.hero-stats .stat::after,.hero-stats .stat .ico{display:none}
.hero-stats .stat .num{margin-top:0;font-size:clamp(30px,3.4vw,46px);color:var(--white)}
.hero-stats .stat .lbl{margin-top:6px;font-size:14px;color:var(--on-dark-muted)}
@media (max-width:900px){.hero-stats{row-gap:28px}}
.logo-marquee+.logo-marquee{margin-top:clamp(18px,2vw,26px)}
.logo-reverse .logo-track{animation-direction:reverse}
@media (prefers-reduced-motion:reduce){.logo-reverse{display:none}}

/* ---------- Hero rotating phrase ---------- */
.hero .hero-rot{max-width:none}
.rotator{display:grid;justify-items:center;font-size:min(1em,8vw);padding-bottom:.08em}
.rot-word{grid-area:1/1;white-space:nowrap;opacity:0;transform:translateY(.55em);filter:blur(8px);transition:opacity .6s ease,transform .7s cubic-bezier(.2,.8,.2,1),filter .6s ease}
.rot-word.is-in{opacity:1;transform:none;filter:none}
.rot-word.is-out{opacity:0;transform:translateY(-.55em);filter:blur(8px)}
@media (prefers-reduced-motion:reduce){.rot-word{transition:none}}
.hero-grid:has(.hero-rot){max-width:1040px}
.hero .hero-rot{font-size:clamp(38px,5.6vw,74px)}

/* Rotating phrase v2: clean vertical roll inside a clipped line (no blur, no overlap) */
.rotator{display:block;position:relative;height:1.14em;overflow:hidden;padding:0;font-size:min(1em,8vw)}
.rot-word,.rot-word.is-out{position:absolute;left:0;right:0;top:0;text-align:center;line-height:1.14;opacity:1;filter:none;transition:transform .75s cubic-bezier(.76,0,.24,1)}
.rot-word{transform:translateY(110%)}
.rot-word.is-in{transform:translateY(0)}
.rot-word.is-out{transform:translateY(-110%)}
@media (prefers-reduced-motion:reduce){.rot-word{transition:none}}
.rotator{height:1.3em;margin:-.1em 0 -.06em}
.rot-word,.rot-word.is-out{line-height:1.3}
/* On load the phrase arrives after "Sales-ready leads that" has risen in */
.words .rotator{opacity:0;transform:translateY(.35em);transition:opacity .8s ease .55s,transform .9s cubic-bezier(.2,.7,.2,1) .55s}
.words.in .rotator{opacity:1;transform:none}

/* Rotating phrase v3: simple fade — old fades out, then the new one fades in, no movement */
.rotator{overflow:visible}
.rot-word,.rot-word.is-in,.rot-word.is-out{transform:none;filter:none}
.rot-word{opacity:0;transition:opacity .45s ease}
.rot-word.is-in{opacity:1;transition:opacity .5s ease .4s}
.rot-word.is-out{opacity:0;transition:opacity .4s ease}

/* Rotating phrase v4 (like leadpronto.co.uk): words fade out left to right, then the next phrase fades in word by word */
.rot-word,.rot-word.is-in,.rot-word.is-out{opacity:1;transition:none}
.rot-word .rw{display:inline-block;opacity:0;transform:translateY(.16em);transition:opacity .45s ease,transform .6s cubic-bezier(.2,.8,.2,1);transition-delay:calc(var(--i) * 80ms + 500ms)}
.rot-word.is-in .rw{opacity:1;transform:none}
.rot-word.is-out .rw{opacity:0;transform:translateY(-.14em);transition-delay:calc(var(--i) * 80ms)}
.words:not(.in) .rot-word .rw{transition-delay:0s}
@media (prefers-reduced-motion:reduce){.rot-word .rw{transition:none}}

/* WhatsApp in the header: round green icon with an "unread" dot, like adfluential.com */
.wa-nav{position:relative;width:44px;height:44px;border-radius:50%;background:#25d366;display:grid;place-items:center;flex:none;box-shadow:0 6px 18px rgba(37,211,102,.35);transition:transform .3s cubic-bezier(.3,1.6,.5,1),box-shadow .3s}
.wa-nav svg{width:24px;height:24px;fill:#fff}
.wa-nav:hover{transform:scale(1.08);box-shadow:0 8px 24px rgba(37,211,102,.5)}
.wa-dot{position:absolute;top:1px;right:1px;width:12px;height:12px;border-radius:50%;background:#ff3b30;border:2px solid var(--hero-green)}
.wa-dot::after{content:"";position:absolute;inset:-2px;border-radius:50%;background:#ff3b30;animation:dot-ping 2s cubic-bezier(0,0,.2,1) infinite}
.wa-btn svg{width:18px;height:18px;fill:#25d366}
.wa-btn:hover{border-color:#25d366;color:#25d366}
.wa-float{opacity:0;visibility:hidden;transform:translateY(16px) scale(.9);transition:opacity .35s,transform .45s cubic-bezier(.3,1.6,.5,1),visibility 0s .45s}
.wa-float.show{opacity:1;visibility:visible;transform:none;transition-delay:0s}
.wa-float.show:hover{transform:scale(1.08)}

/* Solid white secondary button (like adfluential.com's "Get In Touch") */
.btn-light{background:var(--white);color:var(--deep-green);border-color:var(--white);box-shadow:0 10px 30px rgba(0,0,0,.18)}
.btn-light:hover{background:var(--surface-200);border-color:var(--surface-200);transform:translateY(-2px)}

/* Solid green WhatsApp button */
.btn.wa-btn{background:#25d366;border-color:#25d366;color:#fff;box-shadow:0 10px 28px rgba(37,211,102,.3)}
.btn.wa-btn svg{width:20px;height:20px;fill:#fff}
.btn.wa-btn:hover{background:#1ebe5a;border-color:#1ebe5a;color:#fff;transform:translateY(-2px);box-shadow:0 14px 34px rgba(37,211,102,.4)}

/* Main CTA: bigger, with an arrow chip */
.btn-lg{padding:10px 26px 10px 10px;font-size:17px;gap:14px;border-radius:14px}
.btn-chip{width:40px;height:40px;border-radius:10px;background:var(--deep-green);display:grid;place-items:center;flex:none;transition:transform .35s cubic-bezier(.3,1.6,.5,1)}
.btn-chip svg{width:16px;height:16px;fill:none;stroke:var(--cyan);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.btn-lg:hover .btn-chip{transform:translateX(3px)}
.cta-note{margin-top:14px;font-size:14px;color:var(--on-dark-muted)}
.hero-ctas+.cta-note{text-align:inherit}
@media (max-width:600px){.btn-lg{width:100%;justify-content:center}}
/* Main CTA: plain, a little larger than the standard button */
.btn-lg{padding:19px 34px;font-size:17px;gap:10px;border-radius:14px}

/* Main CTA: trailing arrow that slides on hover */
.btn-arrow{width:17px;height:17px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .3s cubic-bezier(.3,1.4,.5,1)}
.btn:hover .btn-arrow{transform:translateX(4px)}

/* ---------- Our brands ---------- */
.brands{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,1.6vw,22px)}
.brand-card{display:flex;flex-direction:column;border-radius:var(--radius-30);overflow:hidden;background:var(--white);border:1px solid var(--line);box-shadow:var(--shadow-card);text-decoration:none;color:inherit;transition:transform .9s cubic-bezier(.2,.7,.2,1),opacity .9s ease-out,box-shadow .35s,border-color .35s}
.brand-card:hover{box-shadow:var(--shadow-card-hover);border-color:rgba(0,215,215,.45)}
.brand-logo{height:clamp(120px,11vw,150px);display:grid;place-items:center;padding:0 clamp(24px,3vw,40px)}
.brand-logo img{max-height:56px;width:auto;max-width:82%;transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.brand-card:hover .brand-logo img{transform:scale(1.05)}
.brand-dark{background:#0f2a26}
.brand-light{background:var(--surface-100);border-bottom:1px solid var(--line)}
.brand-body{display:flex;flex-direction:column;flex:1;padding:clamp(20px,2.2vw,28px)}
.brand-tag{align-self:flex-start;font-size:12px;font-weight:600;color:var(--deep-green);background:var(--surface-100);border:1px solid var(--line);padding:5px 10px;border-radius:30px}
.brand-body b{margin-top:14px;font:700 22px/1.2 var(--font-display);color:var(--deep-green);letter-spacing:-.3px}
.brand-body>span:not(.brand-tag){margin-top:6px;font-size:15px;color:var(--grey-313)}
.brand-body em{margin-top:auto;padding-top:16px;font-style:normal;font-size:14px;font-weight:600;color:var(--cyan-ink)}
@media (max-width:900px){.brands{grid-template-columns:1fr}}
.brand-logo img[src*="windows-matched"]{max-height:74px}
/* Brands: four across, compact */
.brands{grid-template-columns:repeat(4,minmax(0,1fr))}
.brand-logo{height:clamp(100px,8vw,120px)}
.brand-logo img{max-height:44px}
.brand-logo img[src*="windows-matched"]{max-height:62px}
.brand-body{padding:clamp(18px,1.8vw,22px)}
.brand-body b{font-size:19px;margin-top:12px}
.brand-body>span:not(.brand-tag){font-size:14px}
.brand-navy{background:#0f1c2e}
.brand-plum{background:linear-gradient(135deg,#3c202e,#8e2f5c)}
@media (max-width:1080px){.brands{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.brands{grid-template-columns:1fr}}
.brands{display:flex;flex-wrap:wrap;justify-content:center}
.brand-card{flex:0 1 calc((100% - 3 * clamp(14px,1.6vw,22px)) / 4)}
.brand-logo{padding:0 16px}
.brand-logo img{max-width:92%}
.brand-logo img[src$=".svg"]{max-height:48px}
@media (max-width:1080px){.brand-card{flex-basis:calc((100% - clamp(14px,1.6vw,22px)) / 2)}}
@media (max-width:560px){.brand-card{flex-basis:100%}}
.brand-card{flex-basis:calc((100% - 2 * clamp(14px,1.6vw,22px)) / 3)}
@media (max-width:900px){.brand-card{flex-basis:100%}}

/* ---------- Our brands: bento grid (like leadpronto.co.uk) ---------- */
.bb{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.bb-intro{grid-column:span 2;grid-row:span 2;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;padding:clamp(4px,1vw,16px) clamp(8px,2vw,32px) clamp(4px,1vw,16px) 0}
.bb-intro h2{font-size:clamp(30px,3.6vw,48px);line-height:1.02;letter-spacing:-.02em;margin:0 0 16px}
.bb-intro p{font-size:17px;color:var(--grey-313);max-width:46ch;margin-bottom:26px}
.bb-tile{position:relative;display:grid;place-items:center;min-height:clamp(140px,12vw,178px);padding:22px;border-radius:18px;background:var(--white);border:1px solid var(--line);text-decoration:none;overflow:hidden;transition:transform .9s cubic-bezier(.2,.7,.2,1),opacity .9s ease-out,box-shadow .35s,border-color .35s}
.bb-tile img{max-width:78%;max-height:52px;width:auto;height:auto;filter:saturate(.7) opacity(.85);transition:filter .35s,transform .45s cubic-bezier(.2,.7,.2,1)}
.bb-tile img[src*="windows-matched"]{max-height:70px}
.bb-tile:hover{box-shadow:var(--shadow-card-hover);border-color:rgba(0,215,215,.45)}
.bb-tile:hover img{filter:none;transform:translateY(-8px) scale(1.04)}
.bb-meta{position:absolute;left:16px;right:16px;bottom:12px;display:flex;justify-content:space-between;gap:8px;font-size:12px;opacity:0;transform:translateY(6px);transition:opacity .3s,transform .35s}
.bb-meta span{font-weight:600;color:var(--grey-313)}
.bb-meta em{font-style:normal;font-weight:600;color:var(--cyan-ink);white-space:nowrap}
.bb-tile:hover .bb-meta,.bb-tile:focus-visible .bb-meta{opacity:1;transform:none}
.bb-more{place-items:start;align-content:center;gap:8px;background:var(--hero-green);border-color:var(--hero-green)}
.bb-more b{font:700 20px/1.15 var(--font-display);color:var(--white);letter-spacing:-.2px}
.bb-more span{font-size:14px;color:var(--cyan)}
@media (max-width:1080px){.bb{grid-template-columns:repeat(2,minmax(0,1fr))}.bb-intro{grid-column:1/-1;grid-row:auto;padding:0 0 12px}}
@media (hover:none){.bb-meta{opacity:1;transform:none}.bb-tile img{filter:none;transform:translateY(-8px)}}
.bb-tile img[src*="-matched.svg"],.bb-tile img[src*="compare-health-cover"]{max-width:92%;max-height:60px}
/* Brands: heading on top, simple 4 x 2 logo grid */
.bb{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:900px){.bb{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ---------- How it works: visual cards ---------- */
.how-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(16px,1.8vw,24px)}
.how-card{display:flex;flex-direction:column;background:var(--white);border-radius:var(--radius-30);overflow:hidden;box-shadow:var(--shadow-card);transition:transform .9s cubic-bezier(.2,.7,.2,1),opacity .9s ease-out,box-shadow .35s}
.how-card:hover{box-shadow:var(--shadow-card-hover)}
.how-visual{position:relative;height:clamp(230px,22vw,280px);overflow:hidden;isolation:isolate;background:var(--hero-green)}
.how-visual::before{content:"";position:absolute;z-index:-1;inset:0;background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:32px 32px;mask-image:radial-gradient(ellipse at center,#000,transparent 75%);-webkit-mask-image:radial-gradient(ellipse at center,#000,transparent 75%)}
.how-visual::after{content:"";position:absolute;z-index:-1;width:340px;height:340px;left:50%;top:50%;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(closest-side,rgba(0,215,215,.22),transparent)}
.how-copy{padding:clamp(22px,2.4vw,30px)}
.how-n{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--cyan-tint);color:var(--deep-green);font:700 13px/1 var(--font-display);font-variant-numeric:lining-nums}
.how-copy h3{margin:14px 0 8px;font-size:clamp(20px,1.9vw,24px);line-height:1.15;letter-spacing:-.4px}
.how-copy p{color:var(--grey-313);font-size:15px}
@media (max-width:800px){.how-grid{grid-template-columns:1fr}}

/* 01 phone with a slowly scrolling brand site */
.mock-phone{position:absolute;left:50%;top:26px;transform:translateX(-50%);width:170px;height:330px;border-radius:28px;background:#0b1413;padding:8px;box-shadow:0 30px 60px rgba(0,0,0,.45),0 0 0 1px rgba(255,255,255,.12) inset}
.phone-screen{position:relative;width:100%;height:100%;border-radius:21px;overflow:hidden;background:#fff}
.phone-shot{position:absolute;left:0;top:0;width:100%;height:auto;animation:phone-scroll 14s ease-in-out infinite}
@keyframes phone-scroll{0%,12%{transform:translateY(0)}48%,62%{transform:translateY(calc(-100% + 314px))}96%,100%{transform:translateY(0)}}
.hv-chip{position:absolute;padding:8px 12px;border-radius:30px;background:rgba(255,255,255,.1);border:1px solid var(--glass-line);color:var(--white);font-size:12px;font-weight:600;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);animation:float-y 6s ease-in-out infinite}
.hv-chip-a{left:8%;top:30%}
.hv-chip-b{right:6%;top:58%;animation-delay:-3s}
@keyframes float-y{50%{transform:translateY(-10px)}}

/* 02 channel logos floating around the buyer */
.hv-core{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);padding:12px 18px;border-radius:40px;background:var(--gradient-mark);color:var(--deep-green);font-weight:700;font-size:14px;box-shadow:0 0 0 10px rgba(0,215,215,.12),0 0 0 22px rgba(0,215,215,.06)}
.hv-logo{position:absolute;width:58px;height:58px;border-radius:18px;background:var(--white);display:grid;place-items:center;box-shadow:0 14px 30px rgba(0,0,0,.3);animation:float-y 5s ease-in-out infinite}
.hv-logo img{width:28px;height:28px}
.hv-l1{left:14%;top:16%}
.hv-l2{right:16%;top:12%;animation-delay:-1s}
.hv-l3{left:10%;bottom:14%;animation-delay:-2s}
.hv-l4{right:12%;bottom:16%;animation-delay:-3s}
.hv-l5{left:50%;top:6%;margin-left:-29px;animation-delay:-4s;width:50px;height:50px}
.hv-l5 img{width:24px;height:24px}

/* 03 SMS follow-up */
.sms{position:absolute;left:50%;top:22px;transform:translateX(-50%);width:min(300px,84%);padding:14px;border-radius:22px;background:var(--white);box-shadow:0 30px 60px rgba(0,0,0,.4)}
.sms-head{display:flex;align-items:center;gap:8px;padding-bottom:10px;margin-bottom:10px;border-bottom:1px solid var(--line);font-size:14px;color:var(--deep-green)}
.sms-av{width:28px;height:28px;border-radius:50%;background:var(--gradient-mark);display:grid;place-items:center;font-weight:700;font-size:13px;color:var(--deep-green)}
.hv-score{margin-left:auto;font-size:11px;font-weight:600;padding:5px 9px;border-radius:30px;background:var(--cyan-tint);color:var(--deep-green)}
.hv-score b{font-size:13px}
.sms-b{max-width:84%;padding:9px 12px;border-radius:16px;font-size:13px;line-height:1.35;margin:0 0 8px;opacity:0;transform:translateY(8px);animation:sms-in 9s ease infinite}
.sms-in{background:var(--surface-100);color:var(--grey-ink);border-bottom-left-radius:4px}
.sms-out{margin-left:auto;background:var(--deep-green);color:var(--white);border-bottom-right-radius:4px;animation-delay:1.4s}
.sms-typing{display:inline-flex;gap:4px;padding:11px 12px;animation-delay:2.8s}
.sms-b:first-of-type{animation-delay:.2s}
.sms-typing i{width:6px;height:6px;border-radius:50%;background:#9aa;animation:typing 1s ease-in-out infinite}
.sms-typing i:nth-child(2){animation-delay:.15s}.sms-typing i:nth-child(3){animation-delay:.3s}
@keyframes sms-in{0%,4%{opacity:0;transform:translateY(8px)}10%,88%{opacity:1;transform:none}96%,100%{opacity:0;transform:none}}
@keyframes typing{50%{transform:translateY(-3px);opacity:.5}}

/* 04 new lead landing in the CRM */
.crm{position:absolute;left:50%;top:28px;transform:translateX(-50%);width:min(290px,84%);padding:16px;border-radius:20px;background:var(--white);box-shadow:0 30px 60px rgba(0,0,0,.4);animation:crm-in 6s cubic-bezier(.2,.8,.2,1) infinite}
@keyframes crm-in{0%{opacity:0;transform:translate(-50%,-18px)}10%,85%{opacity:1;transform:translate(-50%,0)}100%{opacity:0;transform:translate(-50%,0)}}
.crm-top{display:flex;align-items:center;gap:8px;font-weight:700;color:var(--deep-green);font-size:15px;margin-bottom:12px}
.crm-top em{margin-left:auto;font-style:normal;font-weight:500;font-size:12px;color:var(--grey-313)}
.crm-dot{width:9px;height:9px;border-radius:50%;background:#1ec46e;box-shadow:0 0 0 4px rgba(30,196,110,.2)}
.crm dl{margin:0;display:grid;grid-template-columns:1fr 1fr;gap:8px}
.crm dl div{padding:8px 10px;border-radius:10px;background:var(--surface-100)}
.crm dt{font-size:11px;color:var(--grey-313)}
.crm dd{margin:2px 0 0;font-weight:600;font-size:14px;color:var(--deep-green)}
.crm-score{color:var(--cyan-ink)!important}
.crm-btn{display:block;margin-top:12px;padding:10px;border-radius:10px;background:var(--cyan);color:var(--deep-green);text-align:center;font-weight:700;font-size:13px}

/* Meta mark in the hero badge */
.pill-logo{width:18px;height:18px;filter:brightness(0) invert(1)}

/* Brands section on dark, so it doesn't blend into the grey section above */
.brands-dark{position:relative;overflow:hidden;isolation:isolate;background:var(--hero-green);margin:0 clamp(10px,1.4vw,16px);border-radius:var(--radius-30)}
.brands-dark::before{content:"";position:absolute;z-index:-1;width:800px;height:800px;left:50%;top:-420px;transform:translateX(-50%);border-radius:50%;background:radial-gradient(closest-side,rgba(0,215,215,.22),transparent);animation:glow-breathe 9s ease-in-out infinite}
.brands-dark .section-head h2{color:var(--white)}
.brands-dark .section-head p{color:var(--on-dark-muted)}
.brands-dark .bb-tile{border-color:transparent}
.brands-dark .bb-more{background:rgba(255,255,255,.06);border:1px solid var(--glass-line)}

@media (prefers-reduced-motion:reduce){.phone-shot,.sms-b,.crm,.hv-logo,.hv-chip{animation:none!important;opacity:1!important;transform:none}.crm{transform:translateX(-50%)!important}}
/* Phone cycles through the brand sites: each scrolls a little, then fades to the next */
.phone-shot{opacity:0;animation:phone-cycle 20s ease-in-out infinite}
.phone-shot:nth-child(2){animation-delay:5s}.phone-shot:nth-child(3){animation-delay:10s}.phone-shot:nth-child(4){animation-delay:15s}
@keyframes phone-cycle{0%{opacity:0;transform:translateY(0)}4%{opacity:1;transform:translateY(0)}8%{transform:translateY(0)}22%{opacity:1;transform:translateY(-38%)}26%,100%{opacity:0;transform:translateY(-38%)}}
@media (prefers-reduced-motion:reduce){.phone-shot{opacity:0}.phone-shot:first-child{opacity:1}}

/* ---------- Phone: Solaron funnel being tapped through ---------- */
.mock-phone{width:206px;height:420px;top:22px;border-radius:32px;padding:9px}
.fd-screen{background:#fff}
.fd{position:absolute;left:0;top:0;width:300px;height:640px;transform:scale(.627);transform-origin:top left;font-family:"Montserrat",var(--font-sans);color:#0f2a26;background:#fff}
.fd-head{height:58px;display:grid;place-items:center;border-bottom:1px solid #e8ecea}
.fd-head img{height:26px;width:auto}
.fd-prog{height:5px;background:#e8ecea}
.fd-prog span{display:block;height:100%;background:#0f2a26;transform-origin:left;transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.fd-pct{margin:8px 0 0;text-align:center;font-size:12px;color:#6b7b77}
.fd-stage{padding:18px 18px 0;opacity:0;transform:translateX(24px)}
.fd-stage.in{opacity:1;transform:none;transition:opacity .35s ease,transform .45s cubic-bezier(.2,.8,.2,1)}
.fd-q{margin:0 0 16px;text-align:center;font-weight:700;font-size:18px;line-height:1.3}
.fd-opts{display:grid;gap:9px}
.fd-tiles{grid-template-columns:1fr 1fr}
.fd-opt{display:flex;align-items:center;gap:10px;padding:13px 12px;border:1.5px solid #d6dcda;border-radius:12px;font-weight:600;font-size:14px;transition:border-color .2s,background-color .2s}
.fd-opt i{flex:none;width:16px;height:16px;border-radius:50%;border:1.5px solid #9aa6a3}
.fd-tiles .fd-opt{flex-direction:column;justify-content:center;padding:22px 8px;text-align:center}
.fd-tiles .fd-opt i{width:34px;height:34px;border:0;background:#e8ecea;border-radius:50%}
.fd-opt.sel{border-color:#0f2a26;background:#eef4f2}
.fd-opt.sel i{border-color:#0f2a26;background:radial-gradient(circle,#0f2a26 40%,transparent 45%)}
.fd-tiles .fd-opt.sel i{background:#39d8a4}
.fd-cta{display:block;margin-top:16px;padding:13px;border-radius:12px;background:#0f2a26;color:#fff;text-align:center;font-weight:700;font-size:15px;transition:transform .15s}
.fd-cta.press{transform:scale(.96)}
.fd-done{display:grid;justify-items:center;gap:14px;padding-top:40px}
.fd-spin{width:44px;height:44px;border-radius:50%;border:4px solid #e8ecea;border-top-color:#39d8a4;animation:fd-spin .9s linear infinite}
@keyframes fd-spin{to{transform:rotate(360deg)}}
.fd-finger{position:absolute;left:-22px;top:-22px;width:44px;height:44px;border-radius:50%;background:rgba(15,42,38,.18);border:2px solid rgba(255,255,255,.9);box-shadow:0 6px 16px rgba(0,0,0,.25);opacity:0;transition:transform .6s cubic-bezier(.4,0,.2,1),opacity .3s}
.fd-finger.on{opacity:1}
.fd-finger::after{content:"";position:absolute;inset:-2px;border-radius:50%;border:2px solid rgba(15,42,38,.35);opacity:0}
.fd-finger.tap{scale:.85}
.fd-finger.tap::after{animation:fd-ripple .5s ease-out}
@keyframes fd-ripple{from{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(2)}}

/* Hero badge with three partner marks */
.pill-logos{display:inline-flex;margin-right:2px}
.pill-logos img{width:22px;height:22px;padding:3px;border-radius:50%;background:#fff;box-shadow:0 0 0 2px var(--hero-green)}
.pill-logos img+img{margin-left:-6px}

/* ---------- Partners strip ---------- */
.partners-wrap{padding:clamp(56px,7vw,96px) 0 0}
.partners{position:relative;overflow:hidden;isolation:isolate;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(24px,4vw,56px);align-items:center;padding:clamp(28px,4vw,52px);border-radius:var(--radius-30);background:var(--hero-green);color:var(--white)}
.partners::before{content:"";position:absolute;z-index:-1;width:560px;height:560px;right:-200px;top:-260px;border-radius:50%;background:radial-gradient(closest-side,rgba(0,215,215,.22),transparent);animation:glow-float 16s ease-in-out infinite}
.partners h2{color:var(--white);font-size:clamp(26px,3vw,38px);line-height:1.05;letter-spacing:-.02em;margin:16px 0 12px}
.partners p{color:var(--on-dark-muted);font-size:16px;max-width:44ch}
.partner-badges{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.partner-badge{display:flex;flex-direction:column;align-items:center;gap:4px;padding:22px 12px;border-radius:18px;background:var(--white);text-align:center;transition:transform .35s cubic-bezier(.3,1.4,.5,1),box-shadow .35s}
.partner-badge:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(0,0,0,.3)}
.partner-badge img{width:40px;height:40px;margin-bottom:8px}
.partner-badge b{font:700 19px/1.1 var(--font-display);color:var(--deep-green)}
.partner-badge span{font-size:13px;color:var(--grey-313)}
@media (max-width:900px){.partners{grid-template-columns:1fr}}
@media (max-width:480px){.partner-badges{grid-template-columns:1fr}}
.fd-tiles .fd-opt i{display:grid;place-items:center}
.fd-tiles .fd-opt i svg{width:18px;height:18px;fill:none;stroke:#0f2a26;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.fd-finger{background:rgba(255,255,255,.35);border:2px solid #fff;box-shadow:0 0 0 1px rgba(15,42,38,.25),0 8px 18px rgba(0,0,0,.28)}
/* Finger moves via the script now (curved paths); only fade it with CSS */
.fd-finger{transition:opacity .4s ease}
.fd-finger.tap{scale:1}
/* Brand tiles are logos only (no links) */
div.bb-tile{cursor:default}
div.bb-tile:hover{box-shadow:none;border-color:var(--line)}
.brands-dark div.bb-tile:hover{border-color:transparent}
div.bb-tile:hover img{filter:none;transform:scale(1.04)}

/* ---------- Section CTAs ---------- */
.section-cta{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:12px 24px;margin-top:clamp(32px,4vw,48px);text-align:center}
.section-cta p{width:100%;margin:0;font:700 clamp(20px,2vw,26px)/1.2 var(--font-display);color:var(--deep-green);letter-spacing:-.3px}
.text-link{font-weight:600;color:var(--deep-green);text-decoration:none;border-bottom:1.5px solid rgba(3,40,40,.25);padding-bottom:2px;transition:border-color .25s,color .25s}
.text-link:hover{border-color:var(--cyan);color:var(--cyan-ink)}
.partners-cta{margin-top:24px}
.btn-lg{transition:transform .25s cubic-bezier(.3,1.4,.5,1),background-color .3s ease,box-shadow .3s ease}

/* ---------- Sticky Get In Touch bar ---------- */
.sticky-bar{position:fixed;top:12px;left:0;right:0;z-index:60;display:flex;justify-content:center;padding:0 clamp(10px,2vw,16px);pointer-events:none;opacity:0;transform:translateY(-20px);transition:opacity .35s ease,transform .45s cubic-bezier(.2,.8,.2,1)}
.sticky-bar.show{opacity:1;transform:none}
.sticky-inner{pointer-events:auto;width:min(1160px,100%);display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 10px 10px 22px;border-radius:18px;background:rgba(3,44,44,.86);backdrop-filter:blur(14px) saturate(1.3);-webkit-backdrop-filter:blur(14px) saturate(1.3);border:1px solid var(--glass-line);box-shadow:0 18px 40px rgba(0,0,0,.22)}
.sticky-bar:not(.show) .sticky-inner{pointer-events:none}
.sticky-inner .brand img{width:124px;height:auto}
.sticky-right{display:flex;align-items:center;gap:12px}
.sticky-right .wa-nav{width:40px;height:40px}
.sticky-right .wa-nav svg{width:22px;height:22px}
.sticky-right .btn{padding:12px 20px;font-size:15px;gap:8px}
@media (max-width:600px){.sticky-inner .brand img{width:104px}.sticky-right .btn{padding:11px 14px}}

/* ---------- Cursor glow beyond the hero ---------- */
.has-spot{position:relative;isolation:isolate}
.cursor-spot{position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:0;transition:opacity .6s ease;border-radius:inherit;background:radial-gradient(460px circle at var(--mx,50%) var(--my,50%),rgba(0,215,215,.16),transparent 60%)}
.has-spot:hover>.cursor-spot{opacity:1}
.section.band>.cursor-spot,#technology>.cursor-spot,#results>.cursor-spot,#sectors>.cursor-spot,#faq>.cursor-spot{background:radial-gradient(520px circle at var(--mx,50%) var(--my,50%),rgba(0,215,215,.09),transparent 60%)}

/* Get pricing block: what happens next */
.cta-steps{list-style:none;margin:0;padding:0;display:grid;gap:12px;counter-reset:none}
.cta-steps li{display:flex;gap:14px;align-items:flex-start;padding:16px 18px;border-radius:16px;background:var(--glass);border:1px solid var(--glass-line)}
.cta-steps li>span{flex:none;width:30px;height:30px;border-radius:50%;background:var(--gradient-mark);color:var(--deep-green);display:grid;place-items:center;font:700 13px/1 var(--font-display);font-variant-numeric:lining-nums}
.cta-steps b{display:block;color:var(--white);font-weight:600}
.cta-steps small{display:block;margin-top:3px;font-size:14px;color:var(--on-dark-muted)}

/* Brands: seven logos, rows centred */
.bb{display:flex;flex-wrap:wrap;justify-content:center}
.bb .bb-tile{flex:0 1 calc((100% - 3 * 14px) / 4)}
@media (max-width:900px){.bb .bb-tile{flex-basis:calc((100% - 14px) / 2)}}

/* Brands v3: light section, logos only in grey, colour on hover, 4 x 2 grid */
#brands .bb{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(8px,1.2vw,16px)}
#brands .bb-tile{background:transparent;border:0;box-shadow:none;min-height:clamp(110px,10vw,140px)}
#brands .bb-tile img{filter:grayscale(1) opacity(.55);transition:filter .4s ease,transform .45s cubic-bezier(.2,.7,.2,1)}
#brands .bb-tile:hover img{filter:none;transform:scale(1.06)}
#brands .bb-next{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;text-align:center;border:1.5px dashed #cfd6d4;border-radius:18px;text-decoration:none}
#brands .bb-next b{font:700 18px/1.2 var(--font-display);color:var(--deep-green)}
#brands .bb-next span{font-size:14px;color:var(--cyan-ink);font-weight:600}
#brands .bb-next:hover{border-color:var(--cyan);background:rgba(0,215,215,.05)}
@media (max-width:900px){#brands .bb{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Brands v4: dark green section, logos in white, full colour on a white tile when hovered */
#brands.brands-dark .bb-tile{border-radius:18px;background:transparent;transition:background-color .35s ease,box-shadow .35s ease,transform .9s cubic-bezier(.2,.7,.2,1),opacity .9s ease-out}
#brands.brands-dark .bb-tile img{filter:brightness(0) invert(1) opacity(.72)}
#brands.brands-dark .bb-tile:hover{background:var(--white);box-shadow:0 18px 40px rgba(0,0,0,.25)}
#brands.brands-dark .bb-tile:hover img{filter:none}
#brands.brands-dark .bb-next{border-color:var(--glass-line)}
#brands.brands-dark .bb-next b{color:var(--white)}
#brands.brands-dark .bb-next span{color:var(--cyan)}
#brands.brands-dark .bb-next:hover{background:rgba(0,215,215,.08);border-color:rgba(0,215,215,.5);box-shadow:none}
/* White logo by default, colour version fades in (on a white tile) on hover */
#brands.brands-dark .bb-tile{position:relative}
#brands.brands-dark .bb-tile img{filter:none;transition:opacity .35s ease,transform .45s cubic-bezier(.2,.7,.2,1)}
#brands.brands-dark .bb-tile .bb-w{opacity:.8}
#brands.brands-dark .bb-tile .bb-sil{filter:brightness(0) invert(1)}
#brands.brands-dark .bb-tile .bb-c{position:absolute;left:50%;top:50%;translate:-50% -50%;opacity:0}
#brands.brands-dark .bb-tile:hover .bb-w{opacity:0}
#brands.brands-dark .bb-tile:hover .bb-c{opacity:1}
#brands.brands-dark .bb-tile:hover img{transform:scale(1.05)}
/* Brand hover: a calm cross-fade only, no zoom or movement */
#brands.brands-dark .bb-tile{transition:background-color .5s ease,box-shadow .5s ease,opacity .9s ease-out,transform .9s cubic-bezier(.2,.7,.2,1)}
#brands.brands-dark .bb-tile img,#brands.brands-dark .bb-tile:hover img{transform:none}
#brands.brands-dark .bb-tile img{transition:opacity .5s ease}
#brands.brands-dark .bb-tile:hover{box-shadow:0 12px 30px rgba(0,0,0,.2)}
/* Brands v5: logos only, no tile on hover, smaller; white cross-fades to colour in exactly the same spot */
#brands.brands-dark .bb-tile,#brands.brands-dark .bb-tile:hover{display:grid;place-items:center;background:transparent;box-shadow:none;min-height:clamp(90px,8vw,112px)}
#brands.brands-dark .bb-tile img{grid-area:1/1;position:static;translate:none;transform:none;max-height:34px;max-width:64%;transition:opacity .6s cubic-bezier(.4,0,.2,1)}
#brands.brands-dark .bb-tile .bb-w{opacity:.78}
#brands.brands-dark .bb-tile .bb-c{opacity:0}
#brands.brands-dark .bb-tile:hover .bb-w{opacity:0}
#brands.brands-dark .bb-tile:hover .bb-c{opacity:1}
#brands.brands-dark .bb-tile .bb-w,#brands.brands-dark .bb-tile .bb-c{grid-area:1/1;position:static;left:auto;top:auto;translate:none;transform:none;width:auto;height:auto;max-height:34px;max-width:64%}

/* Brands: grid texture like the hero, and snappier hover */
.brands-dark::after{content:"";position:absolute;z-index:-1;inset:0;background-image:linear-gradient(rgba(255,255,255,.065) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.065) 1px,transparent 1px);background-size:88px 88px;background-position:center top;mask-image:radial-gradient(ellipse 70% 65% at 50% 40%,#000 0%,rgba(0,0,0,.5) 45%,transparent 80%);-webkit-mask-image:radial-gradient(ellipse 70% 65% at 50% 40%,#000 0%,rgba(0,0,0,.5) 45%,transparent 80%);animation:grid-drift 18s linear infinite;pointer-events:none}
#brands.brands-dark .bb-tile{cursor:default}
#brands.brands-dark .bb-tile .bb-w,#brands.brands-dark .bb-tile .bb-c{transition:opacity .18s ease-out;pointer-events:none}
#brands.brands-dark .bb-tile:hover .bb-w{transition-duration:.12s}

/* One consistent primary button: same cyan everywhere, same hover on light and dark */
.btn-primary,.on-light .btn-primary{background:var(--cyan);color:var(--deep-green);border-color:var(--cyan)}
.btn-primary:hover,.on-light .btn-primary:hover,.model.featured .btn-primary:hover{background:var(--cyan-hover);border-color:var(--cyan-hover);color:var(--deep-green);box-shadow:0 10px 28px rgba(0,215,215,.35)}
.btn-primary:not(.btn-lg):hover{transform:translateY(-2px)}
.btn-lg:hover{box-shadow:0 12px 32px rgba(0,215,215,.38)}

/* ---------- Global reach map ---------- */
.reach-map{position:relative;max-width:1000px;margin:0 auto}
.wmap{display:block;width:100%;height:auto;overflow:visible}
.wm-land{fill:url(#wm-dots)}
#wm-dots circle{fill:rgba(0,215,215,.4)}
.wm-arc{fill:none;stroke:rgba(0,215,215,.35);stroke-width:2;stroke-dasharray:4 6}
.wm-arc-glow{fill:none;stroke:var(--cyan);stroke-width:2.5;stroke-linecap:round;stroke-dasharray:40 700;animation:wm-dash 3.6s cubic-bezier(.45,0,.25,1) infinite}
@keyframes wm-dash{from{stroke-dashoffset:40}to{stroke-dashoffset:-700}}
.wm-traveller{fill:var(--cyan);filter:drop-shadow(0 0 6px rgba(0,215,215,.9))}
.wm-dot{fill:var(--deep-green);stroke:var(--cyan);stroke-width:3}
.wm-ping{fill:rgba(0,215,215,.35);transform-box:fill-box;transform-origin:center;animation:wm-ping 2.2s cubic-bezier(0,0,.2,1) infinite}
.wm-pin-b .wm-ping{animation-delay:1.1s}
@keyframes wm-ping{0%{transform:scale(.6);opacity:.9}100%{transform:scale(2.6);opacity:0}}
.wm-label{position:absolute;transform:translate(-50%,calc(-100% - 18px));display:inline-flex;align-items:center;gap:8px;padding:8px 14px 8px 8px;border-radius:40px;background:var(--white);box-shadow:0 12px 30px rgba(3,40,40,.14);font-weight:600;font-size:14px;color:var(--deep-green);white-space:nowrap;animation:float-y 5s ease-in-out infinite}
.wm-label-b{animation-delay:-2.5s}
.wm-label .flag{width:26px;height:26px;border-radius:50%;object-fit:cover;flex:none;box-shadow:0 0 0 1px rgba(0,0,0,.08)}
@media (max-width:600px){.wm-label{font-size:12px;padding:6px 10px 6px 6px}.wm-label .flag{width:20px;height:20px}}
@media (prefers-reduced-motion:reduce){.wm-arc-glow,.wm-ping,.wm-label{animation:none}.wm-traveller{display:none}}
.wm-label .flag{overflow:hidden}

/* Global reach map v2: dots from real coastlines, teardrop pins, labels beside the pins */
.wm-land{fill:none;stroke:rgba(0,215,215,.42);stroke-width:5;stroke-linecap:round}
.wm-arc{stroke:rgba(0,215,215,.45);stroke-width:2;stroke-dasharray:3 7}
.wm-arc-glow{stroke-width:3}
.wm-marker{fill:var(--cyan);filter:drop-shadow(0 4px 8px rgba(3,40,40,.25))}
.wm-hole{fill:var(--white)}
.wm-ping{fill:rgba(0,215,215,.3)}
.wm-label{transform:none;margin-top:-25px;translate:0 -50%}
.wm-label-l{translate:calc(-100% - 20px) -50%}
.wm-label-r{translate:20px -50%}
@keyframes wm-float{50%{margin-top:-30px}}
.wm-label{animation:wm-float 5s ease-in-out infinite}
@media (max-width:600px){.wm-label{font-size:0;gap:0;padding:4px}.wm-label .flag{width:22px;height:22px}.wm-label-l{translate:calc(-100% - 12px) -50%}.wm-label-r{translate:12px -50%}}
.wm-inner{position:relative}
.wm-arc{stroke:rgba(0,215,215,.7);stroke-width:2.2;stroke-dasharray:2 7;stroke-linecap:round}
/* Phones: zoom into the North Atlantic so the pins and line are readable */
@media (max-width:700px){
  .reach-map{overflow:hidden;border-radius:20px}
  .wm-inner{width:200%;margin-left:-18%}
  .wm-label{font-size:12px;gap:6px;padding:5px 10px 5px 5px}
  .wm-label .flag{width:20px;height:20px}
}
@media (max-width:700px){
  .wm-label,.wm-label-l,.wm-label-r{translate:-50% -100%;margin-top:-34px;animation:none}
}

/* Cooler greys (the old #f8f8f8 read slightly warm/brown next to the greens) */
:root{--surface-100:#f3f7f6;--surface-200:#e5eeec;--line:#e3ebe9}

/* ---------- Global reach on green ---------- */
.reach-dark{position:relative;overflow:hidden;isolation:isolate;background:var(--hero-green);margin:0 clamp(10px,1.4vw,16px);border-radius:var(--radius-30)}
.reach-dark::before{content:"";position:absolute;z-index:-1;width:900px;height:900px;left:50%;top:-460px;transform:translateX(-50%);border-radius:50%;background:radial-gradient(closest-side,rgba(0,215,215,.2),transparent);animation:glow-breathe 9s ease-in-out infinite}
.reach-dark .section-head h2{color:var(--white)}
.reach-dark .section-head p{color:var(--on-dark-muted)}
.reach-dark .wm-land{stroke:rgba(0,215,215,.35)}
.reach-dark .wm-arc{stroke:rgba(0,215,215,.55)}
.reach-dark .wm-hole{fill:var(--hero-green)}
.reach-dark .wm-label{box-shadow:0 12px 30px rgba(0,0,0,.35)}
@media (max-width:700px){
  .reach-dark .wm-inner{width:100%;margin-left:0}
  .reach-dark .wm-label{font-size:0;gap:0;padding:3px;margin-top:-30px}
  .reach-dark .wm-label .flag{width:22px;height:22px}
}

/* ---------- Closing: ready to do business? ---------- */
.closing-wrap{padding:0 0 clamp(64px,8vw,110px)}
.closing{position:relative;overflow:hidden;isolation:isolate;text-align:center;padding:clamp(40px,6vw,80px) clamp(24px,5vw,64px);border-radius:var(--radius-30);background:var(--gradient-mark)}
.closing::before{content:"";position:absolute;z-index:-1;inset:0;background-image:linear-gradient(rgba(3,40,40,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(3,40,40,.06) 1px,transparent 1px);background-size:64px 64px;mask-image:radial-gradient(ellipse at center,#000,transparent 75%);-webkit-mask-image:radial-gradient(ellipse at center,#000,transparent 75%)}
.closing::after{content:"";position:absolute;z-index:-1;width:520px;height:520px;right:-160px;bottom:-260px;border-radius:50%;background:radial-gradient(closest-side,rgba(255,255,255,.45),transparent);animation:glow-float 14s ease-in-out infinite}
.closing h2{font-size:clamp(36px,5.4vw,72px);line-height:1;letter-spacing:-.03em;color:var(--deep-green)}
.closing>p{max-width:560px;margin:18px auto 30px;font-size:clamp(16px,1.5vw,19px);color:rgba(3,40,40,.8)}
.btn-dark{background:var(--deep-green);color:var(--white);border-color:var(--deep-green);box-shadow:0 14px 34px rgba(3,40,40,.25)}
.btn-dark:hover{background:#021d1d;color:var(--cyan)}
.closing .closing-alt{margin:22px 0 0;font-size:15px;color:rgba(3,40,40,.75)}
.closing .closing-alt a{color:var(--deep-green);font-weight:600;text-decoration:none;border-bottom:1.5px solid rgba(3,40,40,.3)}
.closing .closing-alt a:hover{border-color:var(--deep-green)}
.closing .closing-alt{margin:22px auto 0}
/* Phones: close pins (US/Canada, UK/Europe) get their flags on different sides so they don't collide */
@media (max-width:700px){
  .reach-dark .wm-us,.reach-dark .wm-uk,.reach-dark .wm-au{translate:calc(-100% - 8px) -50%;margin-top:-14px}
  .reach-dark .wm-eu,.reach-dark .wm-ca{translate:8px -50%;margin-top:-14px}
}

/* ---------- Scan fixes (Sep 2026) ---------- */
/* Headlines break into even lines instead of leaving one word on its own */
.section-head h2,.closing h2{text-wrap:balance}

/* Sector cards: icons from the original convrsion.com theme */
.sector-card{justify-content:flex-start}
.sector-card .sc-icon{flex:none;width:44px;height:44px}
.sector-card .sc-name{flex:1}
@media (max-width:700px){.sector-card .sc-icon{width:34px;height:34px}}

/* Tech points: brand tick instead of a plain dot */
.tech-points li{padding-left:38px}
.tech-points li::before{width:24px;height:24px;top:1px;background:url(/assets/img/icons/tick.svg) center/contain no-repeat;box-shadow:none}


/* Global reach: compact two-column panel, copy + market list left, map right */
.reach-dark.section{padding:clamp(56px,6vw,88px) 0}
.reach-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(28px,4vw,56px);align-items:center}
.reach-copy h2{font-size:clamp(30px,3.4vw,46px);line-height:1.05;letter-spacing:-.02em;color:var(--white);margin:14px 0 14px;text-wrap:balance}
.reach-copy p{color:var(--on-dark-muted);margin:0 0 22px;max-width:420px}
.reach-markets{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.reach-markets li{display:inline-flex;align-items:center;gap:8px;padding:6px 12px 6px 6px;border-radius:999px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);color:var(--white);font-size:14px;font-weight:600}
.reach-markets .flag{width:22px;height:22px;border-radius:50%;overflow:hidden;flex:none}
.reach-dark .reach-map{max-width:none;margin:0}
/* On the map itself, flags only (names are in the list), placed beside each pin so neighbours never collide */
.reach-dark .wm-label{font-size:0;gap:0;padding:3px;animation:none}
.reach-dark .wm-label .flag{width:22px;height:22px}
.reach-dark .wm-us,.reach-dark .wm-uk,.reach-dark .wm-au{translate:calc(-100% - 8px) -50%;margin-top:-14px}
.reach-dark .wm-eu,.reach-dark .wm-ca{translate:8px -50%;margin-top:-14px}
@media (max-width:900px){.reach-grid{grid-template-columns:1fr}.reach-copy{text-align:center}.reach-copy p{margin-inline:auto}.reach-markets{justify-content:center}}

/* Closing: back on dark green, like the hero */
.closing{background:var(--hero-green);color:var(--white)}
.closing::before{background-image:linear-gradient(rgba(0,215,215,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(0,215,215,.07) 1px,transparent 1px)}
.closing::after{width:760px;height:760px;left:50%;right:auto;top:-420px;bottom:auto;transform:translateX(-50%);background:radial-gradient(closest-side,rgba(0,215,215,.22),transparent);animation:glow-breathe 9s ease-in-out infinite}
.closing h2{color:var(--white);max-width:900px;margin-inline:auto}
.closing>p{color:var(--on-dark-muted)}
.closing .closing-alt{color:var(--on-dark-muted)}
.closing .closing-alt a{color:var(--white);border-bottom-color:rgba(255,255,255,.3)}
.closing .closing-alt a:hover{border-color:var(--cyan);color:var(--cyan)}
.sector-card{gap:10px;padding:18px 18px}
.sector-card .sc-icon{width:38px;height:38px}
.sector-card .sc-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sector-card{min-width:0;gap:8px;padding:16px;font-size:17px}
@media (max-width:700px){.sector-card{font-size:15px;padding:14px 12px}.sector-card .sc-icon{width:30px;height:30px}}
.sector-card .arr{width:30px;height:30px}
@media (max-width:700px){.sector-card .arr{display:none}.sector-card .sc-name{white-space:normal;line-height:1.15}}

/* Case cards with a device mockup (Solaron, OneWay Finance) */
.cs-brand{height:clamp(190px,17vw,230px)}
.cs-brand.has-mock{display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:24px 20px 0}
.cs-brand.has-mock .cs-logo{flex:none;height:30px;max-width:60%}
.cs-brand.has-mock img[src*="oneway-full-logo"]{height:40px;margin-top:-6px}
.cs-brand .cs-mock{filter:none;display:block;height:auto;width:auto;max-width:86%;max-height:74%;margin-bottom:-14px;object-fit:contain;object-position:bottom;filter:drop-shadow(0 18px 28px rgba(0,0,0,.45));transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.cs-card:hover .cs-brand .cs-mock{transform:translateY(-8px)}
.cs-card:hover .cs-brand.has-mock .cs-logo{transform:none}
.reach-dark .wm-ae{translate:8px -50%;margin-top:-14px}
.cs-brand .cs-mock[src*="solaron"]{max-height:none;height:100%;max-width:none;margin-bottom:-26%}
/* Sector illustrations from the original convrsion.com pages */
.svc-illus{max-width:1040px;margin:0 auto clamp(40px,5vw,64px)}
.svc-illus img{display:block;width:100%;height:auto}
.cs-brand{height:clamp(130px,12vw,160px)}
.cs-brand img[src*="oneway-full-logo"]{height:52px}
.cs-brand img[src*="oneway-full-logo"]{height:66px}

/* ---------- Footer alignment + social icons ---------- */
.footer-brand img{width:auto;height:auto;margin:0}
.footer-brand>img{width:160px;margin-bottom:18px}
.meta-badge{gap:12px;line-height:1}
.meta-badge .pill-logos img{width:24px;height:24px;display:block;box-shadow:0 0 0 2px var(--deep-green)}
.footer-bottom{align-items:center}
.footer-legal{display:inline-flex;flex-wrap:wrap;align-items:center;gap:6px 20px}
.footer-legal a{color:var(--on-dark-muted)}
.socials{display:inline-flex;gap:10px}
.socials a{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--glass-line);color:var(--white);transition:background-color .2s,border-color .2s,color .2s,transform .2s}
.socials a:hover{background:var(--cyan);border-color:var(--cyan);color:var(--deep-green);transform:translateY(-2px)}
.socials svg{width:18px;height:18px;fill:currentColor}
.socials svg.ig{fill:none;stroke:currentColor;stroke-width:2}
.socials svg .ig-dot{fill:currentColor;stroke:none}

/* ---------- Cookie banner (only on the page when a tag is configured) ---------- */
.cc{position:fixed;z-index:200;left:16px;bottom:16px;max-width:420px;padding:20px;border-radius:20px;background:var(--hero-green);color:var(--on-dark-muted);box-shadow:0 20px 50px rgba(0,0,0,.35);border:1px solid rgba(255,255,255,.1);font-size:14px;line-height:1.5;opacity:0;transform:translateY(12px);pointer-events:none;transition:opacity .3s,transform .3s}
.cc.show{opacity:1;transform:none;pointer-events:auto}
.cc-title{font:700 17px/1.2 var(--font-display);color:var(--white);margin:0 0 6px}
.cc-text{margin:0}
.cc a{color:var(--cyan)}
.cc-prefs{display:grid;gap:10px;margin-top:14px}
.cc-prefs label{display:flex;gap:10px;align-items:flex-start;cursor:pointer}
.cc-prefs input{margin-top:3px;accent-color:var(--cyan)}
.cc-prefs b{display:block;color:var(--white)}
.cc-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px;align-items:center}
.cc-btn{flex:1;min-width:120px;padding:11px 14px;border-radius:999px;border:1px solid var(--cyan);background:var(--cyan);color:var(--deep-green);font:600 14px var(--font-sans);cursor:pointer}
.cc-btn:hover{background:var(--cyan-hover)}
.cc-link{width:100%;background:none;border:0;color:var(--on-dark-muted);text-decoration:underline;font:500 13px var(--font-sans);cursor:pointer;padding:4px}
.cookie-settings{background:none;border:0;padding:0;color:var(--on-dark-muted);font:inherit;cursor:pointer}
.cookie-settings:hover{color:var(--cyan)}
@media (max-width:520px){.cc{left:10px;right:10px;bottom:10px;max-width:none}}

/* Legal page tables */
.legal h3{font-size:18px;margin:28px 0 8px;color:var(--deep-green)}
.legal-table{overflow-x:auto;margin:16px 0;border:1px solid var(--line);border-radius:14px}
.legal table{width:100%;border-collapse:collapse;font-size:14px;line-height:1.5}
.legal th,.legal td{text-align:left;vertical-align:top;padding:12px 14px;border-bottom:1px solid var(--line)}
.legal th{background:var(--surface-100);color:var(--deep-green);font-weight:600}
.legal tr:last-child td{border-bottom:0}
.legal code{font-size:13px;background:var(--surface-100);padding:1px 6px;border-radius:6px}
.legal .legal-box{background:var(--surface-100);border-radius:16px;padding:18px 20px;margin:16px 0}
.cc-prefs[hidden]{display:none}

/* ---------- Privacy Centre (privacy.convrsion.com) ---------- */
.pc{background:var(--white)}
.pc-top{background:var(--hero-green);color:var(--white);padding-bottom:clamp(40px,6vw,72px)}
.pc-top-inner{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-top:22px;padding-bottom:22px;flex-wrap:wrap}
.pc-brand{display:inline-flex;align-items:center;gap:14px;text-decoration:none;color:var(--white)}
.pc-brand img{width:140px;height:auto}
.pc-brand span{padding-left:14px;border-left:1px solid rgba(255,255,255,.25);font:600 14px var(--font-sans);color:var(--on-dark-muted)}
.pc-nav{display:flex;gap:22px}
.pc-nav a{color:var(--on-dark-muted);text-decoration:none;font-weight:500;font-size:15px}
.pc-nav a:hover{color:var(--cyan)}
.pc-hero{padding-top:clamp(24px,4vw,48px)}
.pc-hero h1{font-size:clamp(36px,5vw,60px);line-height:1;letter-spacing:-.03em;color:var(--white);margin:0 0 14px}
.pc-hero .lead{max-width:640px;color:var(--on-dark-muted);font-size:clamp(16px,1.5vw,19px);margin:0}
.pc-section{padding-top:clamp(40px,5vw,64px)}
.pc-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-bottom:clamp(40px,5vw,64px)}
.pc-card{display:flex;flex-direction:column;gap:8px;padding:24px;border-radius:var(--radius-20);background:var(--surface-100);border:1px solid transparent;text-decoration:none;color:var(--grey-313);transition:border-color .2s,background-color .2s,transform .2s}
.pc-card:hover{background:var(--white);border-color:var(--cyan);transform:translateY(-3px)}
.pc-card b{font:700 20px/1.2 var(--font-display);color:var(--deep-green)}
.pc-card em{margin-top:auto;padding-top:8px;font-style:normal;font-weight:600;color:var(--cyan-ink)}
.pc-block{max-width:860px}
.pc-brands{list-style:none;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:16px 0}
.pc-brands li{padding:14px 16px;border:1px solid var(--line);border-radius:14px;margin:0}
.pc-brands a{display:block;font:700 16px var(--font-display);color:var(--deep-green);text-decoration:none}
.pc-brands a:hover{color:var(--cyan-ink)}
.pc-brands span{display:block;font-size:13px;color:var(--grey-313);margin-top:2px}
.pc-req{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-bottom:clamp(40px,5vw,56px)}
.pc-req-card{padding:28px;border-radius:var(--radius-20);background:var(--surface-100);scroll-margin-top:24px}
.pc-req-card h2{font-size:clamp(22px,2.2vw,28px);margin:0 0 10px;color:var(--deep-green)}
.pc-req-card>p{color:var(--grey-313);margin:0 0 20px}
.pc-req-btns{display:flex;flex-wrap:wrap;gap:10px}
.pc-small{font-size:13px;color:var(--grey-313);margin:16px 0 0!important}
.pc-foot{margin-top:clamp(48px,6vw,80px);padding:28px 0;background:var(--deep-green);color:var(--on-dark-muted);font-size:14px}
.pc-foot p{margin:4px 0}
.pc-foot a{color:var(--on-dark-muted)}
.pc-foot a:hover{color:var(--cyan)}
@media (max-width:800px){.pc-cards,.pc-req{grid-template-columns:1fr}.pc-brands{grid-template-columns:1fr}}
@media (max-width:520px){.pc-brand span{display:none}.pc-nav{gap:14px}}
.legal th.legal-sub{background:var(--white);color:var(--cyan-ink);font-size:12px;letter-spacing:.06em;text-transform:uppercase;padding-top:18px}

/* Privacy Centre home: plain, single column (Adfluential-style) */
.pc-simple{padding:clamp(36px,5vw,56px) 0 0}
.pc-simple .wrap{max-width:760px}
.pc-simple h2{font-size:clamp(20px,2vw,24px);color:var(--deep-green);margin:36px 0 12px}
.pc-simple p,.pc-simple li{font-size:16px;line-height:1.7;color:var(--grey-313)}
.pc-simple a{color:var(--cyan-ink);font-weight:600}
.pc-controller{padding:16px 20px;border-radius:14px;background:var(--surface-100);margin:0}
.pc-links,.pc-rights,.pc-sites{margin:0;padding-left:20px}
.pc-links li+li,.pc-rights li+li{margin-top:6px}
.pc-sites{columns:2;column-gap:32px}
.pc-sites li{margin-bottom:6px;break-inside:avoid}
@media (max-width:520px){.pc-sites{columns:1}}
.pc-hero{max-width:760px;padding-left:16px;padding-right:16px}
.pc-hero h1{font-size:clamp(32px,4vw,48px);line-height:1.05}
@media (min-width:792px){.pc-hero{padding-left:0;padding-right:0}}
.pc-simple .wrap{max-width:calc(760px + 2 * var(--gutter))}
.pc-simple .btn{color:var(--deep-green);font-weight:600}
.pc-simple .btn-primary{color:var(--deep-green)}
.pc-btns{display:flex;flex-wrap:wrap;gap:10px}
.pc-simple h2{scroll-margin-top:20px}

/* Phones: keep the hero headline to exactly two lines ("Qualified leads that" + rotating phrase).
   The widest line ("your team can close") is ~10.7em in Syne, so size to the space available. */
@media (max-width:600px){
  .hero h1.hero-rot{font-size:min(40px,calc((100vw - 56px) / 11.1));max-width:none;white-space:nowrap}
  .hero h1.hero-rot .rotator{font-size:1em}
}
/* Brand logos a touch bigger */
#brands.brands-dark .bb-tile .bb-w,#brands.brands-dark .bb-tile .bb-c{max-height:40px;max-width:76%}
#brands.brands-dark .bb-tile .bb-w[src*="compare-health"],#brands.brands-dark .bb-tile .bb-c[src*="compare-health"]{max-width:92%}
/* HouseQuotes is a label (taller than the wordmarks), so give it more height */
#brands.brands-dark .bb-tile .bb-c[src*="house-quotes"]{max-height:56px}
/* HouseQuotes uses its stacked (square) label, so it gets more height */

/* Our brands: white logos that switch to their own colours on hover.
   HouseQuotes is a filled label (a white silhouette would be a blank square), so its resting state is the label in grey. */
#brands.brands-dark .bb-tile .bb-grey{filter:grayscale(1)}
#brands.brands-dark .bb-tile .bb-c[src*="house-quotes"],#brands.brands-dark .bb-tile .bb-w[src*="house-quotes"]{max-height:56px}

/* Page speed: Google times the page by when the main text first appears (LCP). Hero text is visible
   from the first paint and only slides into place, instead of fading in from invisible. */
.hero .words .w{opacity:1;filter:none}
.hero .words .rotator{opacity:1}
.hero .reveal{opacity:1}
