/* ============ CHOOSE - homepage V2 (dark, bold-but-composed) ============ */
/* V1 tokens + creative section treatments:
   flow = pinned drawn-line sequence · experience = sticky stacking cards ·
   industries = bento grid · statement = zoom-through · stepper/cases polished.
   Pairs with js/main.js. */
:root{
  --ink:        #0a0a14;
  --ink-2:      #10101f;
  --blue:       #0b2b66;
  --purple:     #7b45ff;
  --magenta:    #ff0066;
  --orange:     #ff7a2f;
  --paper:      #f4f5fa;
  --muted:      rgba(255,255,255,.62);
  --line:       rgba(255,255,255,.12);
  --glass:      rgba(255,255,255,.06);
  --glass-brd:  rgba(255,255,255,.14);

  /* capability accents */
  --strat:  #4d47ff; /* was var(--blue) #0b2b66 - too dark to read as accent on dark bg */
  --insight:#7b45ff;
  --cx:     var(--magenta);
  --comm:   #ff7a2f;
  --tech:   #23c6c6;

  /* industry accents */
  --ind-1:  #fa5252;
  --ind-2:  #fab005;
  --ind-3:  #82c91e;
  --ind-4:  #12b886;
  --ind-5:  #cc5de8;

  --font-display: "clear-pro-pe","Helvetica Neue",Arial,sans-serif;
  --font-body:    "clear-pro-pe","Helvetica Neue",Arial,sans-serif;

  --radius: 4px;
  --maxw: 1440px;
  --pad: clamp(20px,5vw,88px);
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;overflow-x:clip}
body{
  font-family:var(--font-body);
  background:
    radial-gradient(90% 80% at 18% 12%,rgba(35,198,198,.13),transparent 62%),
    radial-gradient(95% 85% at 82% 34%,rgba(255,0,102,.16),transparent 64%),
    radial-gradient(80% 78% at 48% 82%,rgba(123,69,255,.12),transparent 66%),
    linear-gradient(135deg,#170a22 0%,#100719 42%,#17091f 100%);
  color:#fff;
  -webkit-font-smoothing:antialiased;
  overflow-x:clip;
  line-height:1.5;
  position:relative;
}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
ul,ol{list-style:none}

/* ---------- shared ---------- */
.section{position:relative;z-index:1;min-height:100vh;display:flex;align-items:center;padding:14vh var(--pad)}
.h2{font-family:var(--font-display);font-weight:700;line-height:1.02;letter-spacing:-.02em;
  font-size:clamp(38px,6vw,88px)}
.lead{font-size:clamp(18px,1.5vw,24px);color:var(--muted);max-width:60ch;margin-top:24px}
.grad{color:var(--magenta);font-style:italic}
.section__actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:30px}
.section__actions--center{justify-content:center}
.section__link{position:relative;display:inline-flex;align-items:center;gap:10px;
  font-family:var(--font-display);font-weight:700;font-size:17px;color:#fff}
.section__link::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:1px;
  background:currentColor;opacity:0;transform:scaleX(.72);transform-origin:left;
  transition:transform .25s cubic-bezier(.2,.7,.2,1),opacity .25s}
.section__link span{color:var(--magenta);transition:transform .25s cubic-bezier(.2,.7,.2,1)}
.section__link:hover::after,.section__link:focus-visible::after{opacity:1;transform:scaleX(1)}
.section__link:hover span,.section__link:focus-visible span{transform:translateX(5px)}

/* decorative brand rings */
.deco{position:absolute;z-index:-1;pointer-events:none;aspect-ratio:1;height:auto;
  mix-blend-mode:screen;opacity:.12}
.deco--xl{width:min(120vw,1500px);opacity:.09}
.deco--lg{width:min(80vw,1000px);opacity:.11}
.deco--md{width:min(55vw,720px);opacity:.13}
.deco-tl{top:-32vh;left:-22vw}
.deco-tr{top:-30vh;right:-20vw}
.deco-bl{bottom:-34vh;left:-18vw}
.deco-br{bottom:-36vh;right:-22vw}
.deco-cl{top:50%;left:-34vw;transform:translateY(-50%)}
.deco-cr{top:44%;right:-32vw;transform:translateY(-50%)}

/* reveal */
[data-reveal]{opacity:0;transform:translateY(34px)}
[data-reveal].is-revealed{opacity:1;transform:none}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;gap:.6em;font-weight:600;font-size:16px;
  padding:15px 26px;border-radius:var(--radius);transition:.35s cubic-bezier(.2,.7,.2,1);cursor:pointer;
  border:1px solid transparent;white-space:nowrap;position:relative;overflow:hidden;isolation:isolate}
.btn__fill{position:absolute;border-radius:50%;pointer-events:none;z-index:-1;transform:scale(0)}
.btn__arrow{transition:transform .35s}
.btn:hover .btn__arrow{transform:translateX(4px)}
/* shared line-arrow icon (same glyph as the card tile-arrow), swapped in for → */
.iarrow{display:inline-block;width:1em;height:1em;vertical-align:-.12em;background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h15M13 5l7 7-7 7'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h15M13 5l7 7-7 7'/%3E%3C/svg%3E") center/contain no-repeat}
.btn--solid{background:#fff;color:var(--ink);border:none}
.btn--solid .btn__fill{background:var(--magenta)}
.btn--solid:hover{color:#fff;background:var(--magenta)}
.btn--solid:has(.btn__fill):hover{background:#fff}
.btn--ghost{border-color:var(--glass-brd);backdrop-filter:blur(10px);background:var(--glass)}
.btn--ghost .btn__fill{background:rgba(255,255,255,.14)}
.btn--pill{background:var(--glass);border:1px solid var(--glass-brd);backdrop-filter:blur(14px);
  padding:12px 22px;font-size:15px}
.btn--pill .btn__fill{background:linear-gradient(100deg,var(--blue),var(--purple))}
.btn--pill:hover{border-color:transparent}
.btn--lg{padding:20px 36px;font-size:19px;margin-top:40px}

/* back-to-top */
.to-top{position:fixed;right:clamp(16px,4vw,40px);bottom:clamp(16px,4vw,40px);z-index:60;
  width:48px;height:48px;border-radius:50%;border:0;cursor:pointer;color:#fff;
  background:var(--magenta);box-shadow:0 10px 30px rgba(0,0,0,.35);
  display:grid;place-items:center;
  opacity:0;transform:translateY(16px);pointer-events:none;transition:.35s cubic-bezier(.2,.7,.2,1)}
.to-top.is-shown{opacity:1;transform:none;pointer-events:auto}
body.is-nav-open .to-top{opacity:0;pointer-events:none}
.to-top .iarrow{width:22px;height:22px;transform:rotate(-90deg)}

/* ============ NAV ============ */
.nav{position:fixed;top:0;left:0;right:0;z-index:50;
  padding:20px var(--pad);transition:.4s;background:transparent;border-bottom:1px solid transparent}
.nav__inner{max-width:var(--maxw);margin:0 auto;
  display:flex;align-items:center;gap:32px}
.nav.is-scrolled{background:rgba(10,10,20,.58);
  -webkit-backdrop-filter:blur(22px) saturate(155%);
  backdrop-filter:blur(22px) saturate(155%);
  border-bottom-color:rgba(255,255,255,.16);
  box-shadow:0 18px 42px rgba(0,0,0,.22);
  padding-top:14px;padding-bottom:14px}
.nav__logo img{height:26px;width:auto}
.nav__menu{display:flex;align-items:center;gap:6px;
  position:absolute;left:50%;transform:translateX(-50%)}
.nav__link{position:relative;background:none;border:0;color:#fff;font-family:var(--font-body);font-size:16px;
  font-weight:500;padding:10px 16px;border-radius:var(--radius);cursor:pointer;transition:.25s;opacity:.85}
.nav__link::after{content:"";position:absolute;left:16px;right:16px;bottom:4px;height:2px;border-radius:2px;
  background:linear-gradient(90deg,var(--magenta),#ff4d9d);
  transform:scaleX(0);transform-origin:center;transition:transform .3s cubic-bezier(.2,.7,.2,1)}
.nav__link:hover{opacity:1}
.nav__link:hover::after{transform:scaleX(1)}
.nav__link--disabled{opacity:.42;cursor:default;pointer-events:none}
.nav__link--disabled::after{display:none}
/* language switch (footer, bottom right) */
.footer__lang{position:relative;margin-left:auto;font:500 14px/1 var(--font-body);color:#fff}
.footer__lang summary{list-style:none;display:inline-flex;align-items:center;gap:8px;padding:10px 16px;
  border:1px solid var(--line);border-radius:var(--radius);cursor:pointer;opacity:.85;transition:.25s}
.footer__lang summary::-webkit-details-marker{display:none}
.footer__lang summary:hover{opacity:1;border-color:var(--glass-brd)}
.footer__lang-chevron{flex:0 0 auto;transition:transform .25s}
.footer__lang[open] .footer__lang-chevron{transform:rotate(180deg)}
.footer__lang-menu{position:absolute;right:0;bottom:calc(100% + 8px);min-width:100%;padding:6px;
  border:1px solid var(--line);border-radius:var(--radius);background:var(--ink-2);
  display:flex;flex-direction:column;gap:2px;z-index:5}
.footer__lang-menu button{padding:10px 14px;border-radius:var(--radius);background:none;border:0;
  color:var(--muted);font:inherit;text-align:left;cursor:pointer;transition:.2s;white-space:nowrap}
.footer__lang-menu button:hover{background:rgba(255,255,255,.06);color:#fff}
.footer__lang-menu button.is-active{background:rgba(255,255,255,.08);color:#fff}
.nav__item{position:relative}
.nav__lang{position:relative;margin-left:4px;color:#fff;font:700 12px/1 var(--font-body);letter-spacing:.08em}
.nav__lang summary{list-style:none;display:flex;align-items:center;gap:8px;padding:8px 10px;
  border:1px solid var(--line);border-radius:var(--radius);cursor:pointer;transition:.25s}
.nav__lang summary::-webkit-details-marker{display:none}
.nav__lang summary::after{content:"";width:6px;height:6px;border-right:1.5px solid currentColor;
  border-bottom:1.5px solid currentColor;transform:translateY(-2px) rotate(45deg);opacity:.65;transition:transform .25s}
.nav__lang[open] summary::after{transform:translateY(1px) rotate(225deg)}
.nav__lang summary:hover,.nav__lang summary:focus-visible{border-color:var(--glass-brd);outline:none}
.nav__lang button{position:absolute;right:0;top:calc(100% + 8px);min-width:100%;padding:10px;
  border:1px solid var(--line);border-radius:var(--radius);background:rgba(10,10,20,.96);
  color:#fff;font:inherit;letter-spacing:inherit;cursor:pointer}
.nav__lang button:hover,.nav__lang button:focus-visible{border-color:var(--glass-brd);outline:none}
.nav .btn--pill{margin-left:8px;background:var(--magenta);border:0}
.nav .btn--pill:hover{border:0}
.nav .btn--pill .btn__fill{background:radial-gradient(circle,#ff4d9d,#ff0066)}
.nav__socials{display:flex;align-items:center;gap:6px;margin-left:auto}
.nav__socials a{display:flex;padding:8px;color:#fff;opacity:.72;transition:opacity .25s}
.nav__socials a:hover{opacity:1}
.nav__toggle{display:none}
.nav__mobile-panel{display:none}
.nav__mobile-cta{display:none}

/* mega dropdown */
.mega{position:fixed;left:0;right:0;top:0;z-index:49;
  background:rgba(12,12,24,.97);backdrop-filter:blur(24px) saturate(140%);
  border-bottom:1px solid var(--line);
  padding:92px var(--pad) 40px;opacity:0;visibility:hidden;transform:translateY(-100%);
  transition:transform .4s cubic-bezier(.2,.7,.2,1),opacity .3s,visibility .3s;
  box-shadow:0 40px 90px rgba(0,0,0,.5)}
.mega.is-open{opacity:1;visibility:visible;transform:translateY(0)}
.mega__inner{max-width:var(--maxw);margin:0 auto}
.mega__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px 56px}
.mega__col h4{font-family:var(--font-display);font-size:19px;font-weight:700;margin-bottom:10px;
  display:flex;align-items:center;gap:10px}
.mega__col h4::before{content:"";flex:0 0 auto;width:16px;height:16px;border-radius:50%;
  background:currentColor}
.mega__col ul{list-style:none}
.mega__col li{font-size:15px;color:var(--muted);padding:4px 0;transition:.2s;cursor:pointer}
.mega__col li:hover{color:#fff}
.mega__all{display:inline-flex;align-items:center;gap:10px;margin-top:22px;
  font-family:var(--font-display);font-weight:700;font-size:17px;color:#fff;text-decoration:none;transition:.25s}
.mega__all span{transition:transform .25s}
.mega__all:hover span{transform:translateX(6px)}

/* ============ HERO ============ */
/* hero-pin holds the hero, then lets it slide away as the statement card beneath is revealed */
.hero-pin{position:relative;height:150vh}
.hero{position:sticky;top:0;overflow:hidden;contain:paint;align-items:flex-end;padding-bottom:8vh;z-index:2}
.hero__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.hero__scrim{position:absolute;inset:0;z-index:-1;
  background:
    radial-gradient(120% 80% at 20% 100%,rgba(10,10,20,.9),transparent 60%),
    linear-gradient(180deg,rgba(10,10,20,.55) 0%,transparent 30%,rgba(10,10,20,.65) 100%)}
.hero__inner{max-width:var(--maxw);width:100%;margin:0 auto}
.hero__title{font-family:var(--font-display);font-weight:700;letter-spacing:-.03em;line-height:.98;
  font-size:clamp(48px,9vw,150px)}
.hero__title-static{font-style:italic}
.hero__type{display:inline-flex;align-items:baseline;min-width:5.05ch;color:var(--magenta)}
.hero__cursor{width:.06em;height:.72em;margin-left:.04em;background:currentColor;
  animation:type-cursor .9s steps(1,end) infinite}
@keyframes type-cursor{50%{opacity:0}}
.hero__sub{font-size:clamp(20px,2vw,30px);margin-top:24px;font-weight:500}
.hero__support{color:var(--muted);max-width:56ch;margin-top:18px;font-size:clamp(15px,1.2vw,18px)}
.hero__cta{display:flex;flex-wrap:wrap;gap:16px;margin-top:36px}
.hero__scroll{position:absolute;bottom:26px;left:50%;transform:translateX(-50%);
  font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.hero__scroll::after{content:"";display:block;width:1px;height:34px;margin:10px auto 0;
  background:linear-gradient(var(--muted),transparent);animation:scroll 1.8s infinite}
@keyframes scroll{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}
  50.1%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}

/* ============ BRAND STATEMENT (zoom-through, scroll-driven in JS) ============ */
/* pulled up under hero-pin so it starts sticking the moment the hero begins to slide away */
.statement-pin{position:relative;height:200vh;margin-top:-70vh}
.statement{min-height:100vh;text-align:center;position:sticky;top:0;overflow:hidden;isolation:isolate;
  flex-direction:column;justify-content:center;
  background:
    radial-gradient(70% 90% at 34% 18%,rgba(35,198,198,.34),transparent 62%),
    radial-gradient(74% 88% at 58% 76%,rgba(255,0,102,.42),transparent 58%),
    radial-gradient(64% 86% at 100% 50%,rgba(123,69,255,.22),transparent 62%),
    linear-gradient(135deg,#151822 0%,#10101f 48%,#160b14 100%)}
.statement__bg{position:absolute;left:0;right:0;top:-25%;height:150%;width:100%;
  object-fit:cover;z-index:-2;will-change:transform;display:none}
.statement__scrim{position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,rgba(10,10,20,.6),rgba(10,10,20,.42))}
.statement__text{max-width:28ch;margin:0 auto;font-family:var(--font-display);font-weight:700;
  letter-spacing:-.02em;line-height:1.08;font-size:clamp(30px,4.4vw,64px);will-change:transform}
.statement__cta{margin-top:clamp(64px,7vh,96px)}
.statement em{font-style:normal;color:var(--magenta)}

/* ============ ECOSYSTEM / FLOW (pinned drawn-line sequence) ============ */
.flow__inner{max-width:var(--maxw);margin:0 auto;width:100%;text-align:center}
.flow .h2{font-size:clamp(40px,7vw,104px)}
.flow .lead{margin:24px auto 0}
.flow__track{position:relative;margin:72px 0 56px}
/* dim track the glowing line draws over */
.flow__track::before{content:"";position:absolute;top:8px;left:0;right:0;height:2px;
  background:var(--line);border-radius:2px}
.flow__line{position:absolute;top:8px;left:0;right:0;height:2px;border-radius:2px;
  /* stops pinned at each dot's position (dot i sits at i/6 of track) so line matches circle it passes */
  background:rgba(255,255,255,.92);
  transform:scaleX(0);transform-origin:left;
  box-shadow:0 0 18px -5px rgba(255,255,255,.9)}
/* steps sit above the line so dots cover it */
.flow__steps{position:relative;z-index:1;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:0 26px;text-align:left}
.flow__step{min-width:0;display:flex}
/* steps start dimmed; main-v2.js lights them as the line passes */
.flow__step{opacity:.28;filter:saturate(.4);will-change:opacity}
.flow__box{position:relative;width:100%;padding:34px 0 8px;
  display:flex;flex-direction:column;align-items:flex-start;
  font-family:var(--font-display);font-weight:700;font-size:clamp(19px,1.45vw,26px);line-height:1.08;
  color:#fff;text-align:left;transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.flow__dot{position:absolute;top:0;left:0;width:18px;height:18px;border-radius:50%;
  background:var(--flow-c,var(--magenta))}
.flow__box p{margin-top:12px;color:var(--muted);
  font-family:var(--font-body);font-weight:400;font-size:14px;line-height:1.45;max-width:30ch}
.flow__box:hover,.flow__box:focus-visible{transform:translateY(-5px)}
.flow__box:focus-visible{outline:2px solid var(--magenta);outline-offset:3px}
.flow__step:last-child .flow__dot{
  box-shadow:0 0 8px 2px var(--magenta),0 0 20px 6px var(--magenta);
  animation:flowPulse 1.8s ease-in-out infinite}
@keyframes flowPulse{0%,100%{box-shadow:0 0 8px 2px var(--magenta),0 0 20px 6px var(--magenta)}
  50%{box-shadow:0 0 12px 3px var(--magenta),0 0 32px 10px var(--magenta)}}
.flow__closing{font-size:clamp(18px,2vw,28px);color:var(--muted)}
.flow__closing strong{color:#fff}

/* ============ CAPABILITIES (stepper, polished) ============ */
.caps{flex-direction:column;justify-content:center;gap:44px}
.caps__head{max-width:var(--maxw);margin:0 auto;width:100%}
.caps__head .h2{max-width:18ch}
.caps__stepper{max-width:var(--maxw);margin:0 auto;width:100%;
  display:grid;grid-template-columns:minmax(340px,5fr) 7fr;gap:28px;align-items:stretch}

/* accordion list - each row expands inline (Cohere-style) */
.steps{display:flex;flex-direction:column}
/* direct children only, so nested .step__tags li stay unaffected */
.steps>li{position:relative;border-top:1px solid var(--line)}
.steps>li:last-child{border-bottom:1px solid var(--line)}
/* accent gradient rule on top of the active row */
.steps>li::before{content:"";position:absolute;top:-1px;left:0;right:0;height:2px;
  background:linear-gradient(90deg,var(--comm),var(--strat));
  transform:scaleX(0);transform-origin:left;transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.steps>li:has(.step.is-active)::before{transform:scaleX(1)}
/* equal vertical rhythm everywhere: 28px */
.step{width:100%;text-align:left;cursor:pointer;
  display:flex;align-items:center;gap:16px;
  padding:28px 0;color:rgba(255,255,255,.5);font-family:var(--font-body);
  background:transparent;border:0;transition:color .35s ease}
.step:hover,.step.is-active{color:#fff}
.step__orb{flex:0 0 auto;width:20px;aspect-ratio:1;border-radius:50%;background:var(--c);
  filter:saturate(.55) brightness(.85);opacity:.45;transition:.35s cubic-bezier(.2,.7,.2,1)}
.step:hover .step__orb,.step.is-active .step__orb{filter:none;opacity:1;transform:scale(1.08)}
.step__name{font-family:var(--font-display);font-weight:700;font-size:clamp(19px,1.5vw,24px);line-height:1.12}
/* expandable body - header's 28px bottom padding gives the title→desc gap */
.step__panel{overflow:hidden}
.step__panel:not([hidden]){animation:stepIn .45s cubic-bezier(.2,.7,.2,1)}
@keyframes stepIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.step__panel[hidden]{display:none}
.step__desc{color:var(--muted);font-size:clamp(15px,1.1vw,17px);line-height:1.55;max-width:44ch}
.step__tags{display:flex;flex-direction:column;gap:14px;margin-top:28px}
.step__tags li{position:relative;padding-left:30px;font-size:15px;line-height:1.3;color:rgba(255,255,255,.86)}
.step__tags li::before{content:"";position:absolute;left:0;top:0;width:18px;height:18px;border-radius:50%;
  border:1.5px solid var(--c);
  background:no-repeat center/9px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 6.2l2.3 2.3 4.7-5' fill='none' stroke='%23fff' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
.step__more{display:inline-flex;align-items:center;gap:8px;margin:28px 0;
  font-size:15px;color:#fff;transition:gap .3s ease}
.step__more span{color:var(--c)}
.step__more:hover{gap:14px}

/* right panel - just the image, crossfade + settle-scale on switch */
.panels{position:relative;border-radius:var(--radius);overflow:hidden;
  border:1px solid var(--glass-brd);background:var(--ink-2);min-height:560px}
.panel{position:absolute;inset:0;opacity:0;pointer-events:none;
  transition:opacity .55s cubic-bezier(.4,0,.2,1)}
.panel.is-active{opacity:1;pointer-events:auto}
.panel[hidden]{display:none}
.panel__img{position:absolute;inset:0;background-image:var(--img);background-size:cover;background-position:center;
  transform:scale(1.06);transition:transform 1.1s cubic-bezier(.2,.7,.2,1)}
.panel.is-active .panel__img{transform:scale(1)}
.panel__img::after{content:"";position:absolute;inset:0;
  background:linear-gradient(140deg,var(--c),transparent 55%);opacity:.42}

/* ============ INDUSTRIES (bento grid) ============ */
.industries{flex-direction:column;justify-content:center;gap:52px}
.industries__head{max-width:var(--maxw);margin:0 auto;width:100%}
.industries__head .h2{max-width:16ch}
.industries__head .lead{margin-top:20px}
.industries__grid{max-width:var(--maxw);margin:0 auto;width:100%;
  display:grid;grid-template-columns:repeat(6,minmax(0,1fr));
  grid-template-rows:clamp(340px,46vh,480px) clamp(260px,36vh,380px);gap:16px}
/* bento: wide feature + companion on row 1, three tiles on row 2 */
.industries__grid .ind:nth-child(1){grid-column:1/5}
.industries__grid .ind:nth-child(2){grid-column:5/7}
.industries__grid .ind:nth-child(3){grid-column:1/3}
.industries__grid .ind:nth-child(4){grid-column:3/5}
.industries__grid .ind:nth-child(5){grid-column:5/7}
.industries__grid .ind:nth-child(1) h3{font-size:clamp(26px,2.6vw,42px)}
.industries__grid .ind:nth-child(1) .ind__body{padding:30px}
.ind{position:relative;border-radius:var(--radius);overflow:hidden;
  display:flex;align-items:flex-end;isolation:isolate;transition:.45s cubic-bezier(.2,.7,.2,1);
  background-image:var(--img);background-size:cover;background-position:center}
.ind .tile-clip{position:absolute;inset:0}
.ind .tile-clip::before{content:"";position:absolute;inset:0;z-index:-2;background-image:var(--img);
  background-size:cover;background-position:center;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.ind .tile-clip::after{content:"";position:absolute;inset:0;z-index:-1;
  background:
    linear-gradient(color-mix(in srgb,var(--c) 62%,rgba(6,6,14,.38)),color-mix(in srgb,var(--c) 62%,rgba(6,6,14,.38))) 0 100%/100% 0 no-repeat,
    linear-gradient(to top,rgba(6,6,14,.92),rgba(6,6,14,.25) 55%,transparent),
    linear-gradient(140deg,color-mix(in srgb,var(--c) 68%,transparent),transparent 55%);
  transition:background-size .55s cubic-bezier(.2,.7,.2,1)}
.ind__body{padding:22px;position:relative;z-index:1;transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.ind__body h3{font-family:var(--font-display);font-weight:700;font-size:clamp(18px,1.5vw,23px);line-height:1.12}
.ind__body p{color:rgba(255,255,255,.9);font-size:14px;line-height:1.4;margin-top:0;max-width:26ch}
.ind__cta{display:inline-block;margin-top:0;font-family:var(--font-display);font-weight:700;font-size:14px}
.ind__body p,.ind__cta{opacity:0;max-height:0;overflow:hidden;transform:translateY(14px);
  transition:opacity .4s ease,transform .5s cubic-bezier(.2,.7,.2,1),max-height .45s cubic-bezier(.2,.7,.2,1),margin-top .45s cubic-bezier(.2,.7,.2,1)}
.ind:hover{transform:translateY(-8px)}
.ind:hover .tile-clip::before{transform:scale(1.08)}
.ind:hover .tile-clip::after{background-size:100% 100%,auto,auto}
.ind:hover .ind__body{transform:translateY(-4px)}
.ind:hover .ind__body p{opacity:1;max-height:4.5em;margin-top:10px;transform:none;transition-delay:.08s}
.ind:hover .ind__cta{opacity:1;max-height:2em;margin-top:14px;transform:none;transition-delay:.14s}

/* ============ THE CHOOSE EXPERIENCE (sticky stacking cards) ============ */
.exp{position:relative;z-index:1;padding:12vh var(--pad)}
.exp__head{max-width:var(--maxw);margin:0 auto 8vh}
.stack{max-width:var(--maxw);margin:0 auto;display:flex;flex-direction:column;gap:6vh}
.stack__card{position:sticky;display:grid;grid-template-columns:1fr 1fr;min-height:62vh;
  border-radius:var(--radius);overflow:hidden;isolation:isolate;
  border:1px solid var(--glass-brd);
  background:var(--ink-2);
  will-change:transform}
.stack__card:nth-child(1){--c:var(--blue);top:calc(12vh + 0px)}
.stack__card:nth-child(2){--c:var(--purple);top:calc(12vh + 16px)}
.stack__card:nth-child(3){--c:var(--magenta);top:calc(12vh + 32px)}
.stack__card:nth-child(4){--c:var(--tech);top:calc(12vh + 48px)}
.stack__media{position:absolute;inset:0;z-index:0;overflow:hidden}
.stack__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.stack__card:nth-child(1) .stack__media img{object-position:center 50%}
.stack__card:nth-child(2) .stack__media img{object-position:42% 50%}
.stack__card:nth-child(3) .stack__media img{object-position:40% 50%}
.stack__card:nth-child(4) .stack__media img{object-position:center 46%}
.stack__media::after{content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(6,6,14,.08),rgba(6,6,14,.2) 64%,rgba(6,6,14,.34)),
             linear-gradient(140deg,color-mix(in srgb,var(--c) 35%,transparent),transparent 60%);
  opacity:.58}
.stack__body{display:flex;flex-direction:column;justify-content:center;gap:18px;
  grid-column:2;min-height:100%;padding:clamp(28px,4vw,64px);position:relative;z-index:1;isolation:isolate}
.stack__body::before{content:"";position:absolute;inset:0 0 0 -22vw;z-index:-1;pointer-events:none;
  background:linear-gradient(90deg,transparent 0%,rgba(8,8,20,.64) 42%,rgba(8,8,20,.9) 100%)}
.stack__body h3{font-family:var(--font-display);font-weight:700;letter-spacing:-.02em;
  font-size:clamp(30px,3.6vw,58px);line-height:1.02}
.stack__body p{color:var(--muted);font-size:clamp(16px,1.3vw,20px);max-width:44ch}

/* ============ CASE STUDIES (photo cards) ============ */
.cases{flex-direction:column;justify-content:center;gap:56px}
.cases__head{max-width:var(--maxw);margin:0 auto;width:100%}
.cases__lead{max-width:68ch}
.cases__carousel{max-width:var(--maxw);margin:0 auto;width:100%}
.cases__viewport{overflow:hidden;outline:none}
.cases__track{display:flex;gap:22px;transition:transform .55s cubic-bezier(.2,.7,.2,1);will-change:transform}
.case{position:relative;border-radius:var(--radius);min-height:480px;overflow:hidden;
  flex:0 0 calc((100% - 44px) / 3);display:flex;align-items:flex-end;isolation:isolate;
  transition:.45s cubic-bezier(.2,.7,.2,1)}
.case .tile-clip::before{content:"";position:absolute;inset:0;z-index:-2;background-image:var(--img);
  background-size:cover;background-position:center;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.case .tile-clip::after{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(to top,rgba(6,6,14,.94),rgba(6,6,14,.35) 55%,transparent),
             linear-gradient(140deg,color-mix(in srgb,var(--c) 68%,transparent),transparent 55%)}
.case__body{padding:32px;position:relative;z-index:1;
  transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.case__body::before{content:"";position:absolute;inset:-40% 0 0;z-index:-1;
  background:color-mix(in srgb,var(--c) 62%,rgba(6,6,14,.38));
  transform:translateY(101%);transition:transform .55s cubic-bezier(.2,.7,.2,1)}
.case:hover{transform:none}
.case:hover .tile-clip::before{transform:scale(1.06)}
.case:hover .case__body{transform:translateY(-6px)}
.case:hover .case__body::before{transform:translateY(0)}
.case__tag{display:inline-block;font-size:12px;font-weight:600;letter-spacing:.14em;
  text-transform:uppercase;color:rgba(255,255,255,.85)}
.case h3{font-family:var(--font-display);font-size:26px;line-height:1.12;margin:20px 0 12px;min-height:2.24em}
.case p,.case__cta{opacity:0;max-height:0;overflow:hidden;transform:translateY(16px);
  transition:opacity .4s ease,transform .5s cubic-bezier(.2,.7,.2,1),max-height .45s cubic-bezier(.2,.7,.2,1)}
.case:hover p,.case:hover .case__cta{opacity:1;max-height:6em;transform:none}
.case:hover p{transition-delay:.08s}
.case:hover .case__cta{transition-delay:.14s;max-height:2em}
.case p{color:rgba(255,255,255,.85);font-size:15.5px}
.case__cta{display:block;margin-top:18px;font-weight:600}
.cases__controls{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-top:24px}
.cases__nav{width:46px;height:46px;border-radius:50%;border:1px solid var(--glass-brd);
  background:rgba(255,255,255,.06);color:#fff;
  display:grid;place-items:center;cursor:pointer;transition:background .25s,border-color .25s,transform .25s,opacity .25s}
.cases__nav .iarrow{width:18px;height:18px}
.cases__nav--prev .iarrow,.insights__nav--prev .iarrow{transform:rotate(180deg)}
.cases__nav:hover,.cases__nav:focus-visible{background:var(--magenta);border-color:var(--magenta);outline:none;transform:translateY(-2px)}
.cases__nav:disabled{opacity:.35;cursor:not-allowed;transform:none;background:rgba(255,255,255,.04);border-color:var(--glass-brd)}
.cases__dots{display:flex;align-items:center;justify-content:center;gap:10px;flex:1}
.cases__dot{width:34px;height:3px;border:0;border-radius:999px;background:rgba(255,255,255,.24);
  cursor:pointer;transition:background .25s,width .25s}
.cases__dot.is-active{width:52px;background:var(--magenta)}
.cases__dot:focus-visible{outline:2px solid #fff;outline-offset:4px}

/* ============ INSIGHTS ============ */
.insights__inner{max-width:var(--maxw);margin:0 auto;width:100%}
.insights__carousel{margin-top:56px;width:100%}
.insights__viewport{overflow:hidden;outline:none}
.insights__track{display:flex;gap:22px;transition:transform .55s cubic-bezier(.2,.7,.2,1);will-change:transform}
.insights__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:56px}
.ins{position:relative;border-radius:var(--radius);min-height:480px;overflow:hidden;
  display:flex;align-items:flex-end;isolation:isolate;
  transition:.45s cubic-bezier(.2,.7,.2,1)}
.insights__track .ins{flex:0 0 calc((100% - 44px) / 3)}
.ins__img{position:absolute;inset:0;z-index:-2;background-image:var(--img);background-size:cover;
  background-position:center;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.ins .tile-clip::after{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(to top,rgba(6,6,14,.94),rgba(6,6,14,.35) 55%,transparent),
             linear-gradient(140deg,color-mix(in srgb,var(--c,var(--strat)) 68%,transparent),transparent 55%)}
.ins__body{padding:32px;position:relative;z-index:1}
.ins__body::before{content:"";position:absolute;inset:0;z-index:-1;
  background:color-mix(in srgb,var(--c,var(--strat)) 62%,rgba(6,6,14,.38));
  transform:translateY(101%);transition:transform .55s cubic-bezier(.2,.7,.2,1)}
.ins:hover .ins__body::before{transform:translateY(0)}
.ins span{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.85);font-weight:600;transition:color .35s}
.ins:hover span{color:#fff}
.ins h3{font-family:var(--font-display);font-size:26px;line-height:1.12;margin:20px 0 0;min-height:3.36em}
.ins p{color:rgba(255,255,255,.86);font-size:15.5px;line-height:1.45;margin-top:0;opacity:0;
  max-height:0;overflow:hidden;transform:translateY(14px);
  transition:opacity .4s ease,transform .5s cubic-bezier(.2,.7,.2,1),max-height .45s cubic-bezier(.2,.7,.2,1),margin-top .45s cubic-bezier(.2,.7,.2,1)}
.ins:hover p{opacity:1;transform:none;max-height:6em;margin-top:12px;transition-delay:.08s}
.ins__body::after{content:"Read";font-weight:600;color:#fff;
  display:block;margin-top:18px;max-height:0;opacity:0;transform:translateY(10px);overflow:hidden;
  transition:opacity .35s ease,transform .45s cubic-bezier(.2,.7,.2,1),max-height .45s ease}
.ins:hover{transform:none}
.ins:hover .ins__img{transform:scale(1.05)}
.ins:hover .ins__body::after{opacity:1;transform:none;max-height:2em}

/* ---- Cohere-style corner-notch tiles (case + insight) ----
   JS wraps each card's content in .tile-clip; a static mask carves a
   rounded rectangular pocket out of its bottom-right corner (three fillets:
   two where the pocket meets the edges, one concave at its inner corner).
   The arrow sits on the page background inside the pocket, outside the
   masked wrapper, so it's never clipped. */
/* pocket dims are registered so they transition: on hover all three collapse
   to 0 and the mask smoothly closes, leaving the full rounded card */
@property --nw{syntax:"<length>";inherits:true;initial-value:96px}
@property --nh{syntax:"<length>";inherits:true;initial-value:72px}
@property --fr{syntax:"<length>";inherits:true;initial-value:20px}
.case,.ins,.ind{--nw:96px;--nh:72px;--fr:20px;border-radius:18px;
  transition:--nw .55s cubic-bezier(.2,.7,.2,1),--nh .55s cubic-bezier(.2,.7,.2,1),--fr .55s cubic-bezier(.2,.7,.2,1);
  background-image:var(--img);background-size:cover;background-position:center}
.case:hover,.ins:hover,.ind:hover,.case:focus-visible,.ins:focus-visible,.ind:focus-visible{--nw:0px;--nh:0px;--fr:0px}
/* card-level bg is only a no-JS fallback — once JS wraps content in the
   masked .tile-clip, it must not paint under the notch pocket */
.case:has(.tile-clip),.ins:has(.tile-clip),.ind:has(.tile-clip){background-image:none}
.tile-clip{position:relative;width:100%;min-height:inherit;display:flex;align-items:flex-end;
  border-radius:18px;overflow:hidden;isolation:isolate;
  -webkit-mask:
    linear-gradient(#000 0 0) left 0 top 0 / 100% calc(100% - var(--nh) - var(--fr) + 1px) no-repeat,
    linear-gradient(#000 0 0) left 0 bottom var(--nh) / calc(100% - var(--fr) + 1px) calc(var(--fr) + 1px) no-repeat,
    radial-gradient(var(--fr) at 0 0,#000 calc(var(--fr) - .5px),#0000 var(--fr)) right 0 bottom var(--nh) / var(--fr) var(--fr) no-repeat,
    linear-gradient(#000 0 0) left 0 bottom 0 / calc(100% - var(--nw) - var(--fr) + 1px) calc(var(--nh) + 1px) no-repeat,
    linear-gradient(#000 0 0) right var(--nw) bottom calc(var(--fr) - 1px) / var(--fr) calc(var(--nh) - var(--fr) + 2px) no-repeat,
    radial-gradient(var(--fr) at 0 0,#000 calc(var(--fr) - .5px),#0000 var(--fr)) right var(--nw) bottom 0 / var(--fr) var(--fr) no-repeat,
    radial-gradient(var(--fr) at 100% 100%,#0000 calc(var(--fr) - .5px),#000 var(--fr)) right calc(var(--nw) - var(--fr)) bottom calc(var(--nh) - var(--fr)) / var(--fr) var(--fr) no-repeat;
  mask:
    linear-gradient(#000 0 0) left 0 top 0 / 100% calc(100% - var(--nh) - var(--fr) + 1px) no-repeat,
    linear-gradient(#000 0 0) left 0 bottom var(--nh) / calc(100% - var(--fr) + 1px) calc(var(--fr) + 1px) no-repeat,
    radial-gradient(var(--fr) at 0 0,#000 calc(var(--fr) - .5px),#0000 var(--fr)) right 0 bottom var(--nh) / var(--fr) var(--fr) no-repeat,
    linear-gradient(#000 0 0) left 0 bottom 0 / calc(100% - var(--nw) - var(--fr) + 1px) calc(var(--nh) + 1px) no-repeat,
    linear-gradient(#000 0 0) right var(--nw) bottom calc(var(--fr) - 1px) / var(--fr) calc(var(--nh) - var(--fr) + 2px) no-repeat,
    radial-gradient(var(--fr) at 0 0,#000 calc(var(--fr) - .5px),#0000 var(--fr)) right var(--nw) bottom 0 / var(--fr) var(--fr) no-repeat,
    radial-gradient(var(--fr) at 100% 100%,#0000 calc(var(--fr) - .5px),#000 var(--fr)) right calc(var(--nw) - var(--fr)) bottom calc(var(--nh) - var(--fr)) / var(--fr) var(--fr) no-repeat}
/* arrow centered on the pocket's resting position (--nw0/--nh0 are static
   copies of the pocket dims, so the arrow stays put while the mask closes
   under it); on hover it nudges along its direction */
.case,.ins,.ind{--nw0:96px;--nh0:72px}
.tile-arrow{position:absolute;z-index:2;pointer-events:none;
  right:calc((var(--nw0) - 26px) / 2 - 4px);bottom:calc((var(--nh0) - 26px) / 2 - 2px);
  width:26px;height:26px;color:#fff;
  filter:drop-shadow(0 2px 8px rgba(0,0,0,.4));
  transition:transform .5s cubic-bezier(.2,.7,.2,1),color .3s ease}
.tile-arrow svg{display:block;width:100%;height:100%}
.case:hover .tile-arrow,.ins:hover .tile-arrow,.ind:hover .tile-arrow,
.case:focus-visible .tile-arrow,.ins:focus-visible .tile-arrow,.ind:focus-visible .tile-arrow{transform:translateX(7px)}
@media (prefers-reduced-motion:reduce){
  .case,.ins,.ind{transition:none}
  .case:hover,.ins:hover,.ind:hover,.case:focus-visible,.ins:focus-visible,.ind:focus-visible{--nw:96px;--nh:72px;--fr:20px}
  .tile-arrow{transition:none}
  .case:hover .tile-arrow,.ins:hover .tile-arrow,.ind:hover .tile-arrow{transform:none}
}

/* ============ FINAL CTA ============ */
.cta{text-align:center;background:var(--ink);overflow:hidden}
.cta__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.cta::before{content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg,rgba(6,6,14,.5),rgba(6,6,14,.3) 45%,rgba(6,6,14,.55))}
.cta__inner{position:relative;z-index:2;max-width:var(--maxw);margin:0 auto;width:100%;
  display:flex;flex-direction:column;align-items:center}
.cta__title{font-family:var(--font-display);font-weight:700;letter-spacing:-.03em;line-height:.98;
  font-size:clamp(48px,10vw,150px)}
.cta__lead{font-size:clamp(18px,1.5vw,24px);max-width:56ch;margin:28px auto 0;color:rgba(255,255,255,.9)}

/* ============ FILM GRAIN ============ */
.hero::after,.cta::after{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;
  mix-blend-mode:overlay;opacity:.5;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size:140px 140px}

/* ============ FOOTER ============ */
.footer{position:relative;z-index:1;padding:80px var(--pad) 32px;border-top:1px solid var(--line);
  background:var(--ink-2)}
.footer__main{max-width:var(--maxw);margin:0 auto;display:grid;
  grid-template-columns:minmax(300px,400px) 1fr;gap:56px 96px;align-items:start;padding-bottom:56px}
.footer__logo{height:64px;display:block;margin-bottom:32px}
.footer__contact{font-size:14px;line-height:2;color:var(--muted)}
.footer__contact .footer__name{color:#fff;font-family:var(--font-display);font-size:15px;
  letter-spacing:.02em;margin-bottom:6px}
.footer__news{margin-top:40px}
.footer__news h5{font-family:var(--font-display);font-size:18px;color:#fff;margin-bottom:24px}
.footer__form{display:flex;align-items:center;border-bottom:1px solid var(--line);gap:12px}
.footer__form input{flex:1;background:none;border:0;color:#fff;font:inherit;font-size:15px;
  padding:12px 0;outline:none}
.footer__form input::placeholder{color:var(--muted)}
.footer__form button{background:none;border:0;color:#fff;font-size:20px;cursor:pointer;
  line-height:1;padding:8px;transition:.2s}
.footer__form button:hover{color:var(--strat);transform:translateX(4px)}
.footer__note{margin-top:16px;font-size:12px;color:var(--muted)}
.footer__note a{color:#fff;text-decoration:underline}

.footer__cols{display:grid;grid-template-columns:1fr 1.5fr 1fr;gap:56px;align-items:start}
.footer__cols h5{font-size:13px;line-height:1.3;letter-spacing:.04em;color:#fff;
  margin-bottom:16px}
.footer__cols h5 a{display:inline;padding:0;font-size:inherit;color:#fff}
.footer__cols a{display:block;padding:5px 0;font-size:13px;line-height:1.3;color:var(--muted);transition:.2s}
.footer__cols a:hover{color:var(--strat)}
.footer__2col{display:grid;grid-template-columns:1fr 1fr;column-gap:24px}
.footer__legal{display:flex;gap:8px 20px;flex-wrap:wrap}
.footer__legal a{color:var(--muted);transition:.2s}
.footer__legal a:hover{color:#fff}

.footer__base{max-width:var(--maxw);margin:0 auto;display:flex;justify-content:space-between;
  align-items:center;gap:16px;flex-wrap:wrap;padding-top:32px;border-top:1px solid var(--line);
  font-size:13px;color:var(--muted)}
.footer__social{display:flex;align-items:center;gap:16px}
.footer__social a{display:inline-flex;align-items:center;justify-content:center;
  width:34px;height:34px;border:1px solid var(--line);border-radius:50%;color:var(--muted);transition:.2s}
.footer__social a:hover{color:#fff;border-color:var(--blue);background:var(--blue)}

/* ============ RESPONSIVE ============ */
@media(max-width:1024px){
  .case{flex-basis:calc((100% - 22px) / 2);min-height:420px}
  .insights__track .ins{flex-basis:calc((100% - 22px) / 2);min-height:420px}
  .insights__grid .ins{min-height:420px}
  .insights__grid{grid-template-columns:repeat(2,1fr)}
  .industries__grid{grid-template-columns:repeat(2,1fr);grid-template-rows:none;grid-auto-rows:clamp(260px,34vh,360px)}
  .industries__grid .ind{grid-column:auto!important}
  .industries__grid .ind:first-child{grid-column:1/-1!important}
  .flow__track{max-width:680px;margin:56px auto 44px;padding-left:34px}
  .flow__track::before{top:0;bottom:0;left:8px;right:auto;width:2px;height:auto;
    background:var(--line)}
  .flow__line{top:0;bottom:0;left:8px;right:auto;width:2px;height:auto;
    background:rgba(255,255,255,.92);
    transform:scaleY(0);transform-origin:top;box-shadow:0 0 20px -5px rgba(255,255,255,.9)}
  .flow__steps{display:grid;grid-template-columns:1fr;gap:24px;text-align:left}
  .flow__step{opacity:.42;filter:saturate(.45)}
  .flow__box{min-height:0;padding:0 0 0 20px;border-top:0}
  /* same flat magenta dots as desktop, repositioned onto the vertical line */
  .flow__dot{display:block;top:0;left:-34px;width:18px;height:18px}
  .stack__card{grid-template-columns:1fr}
  .stack__body{grid-column:1;min-height:62vh;margin-left:0}
  .exp__row{gap:40px}
  .footer__main{grid-template-columns:1fr;gap:48px}
  .footer__news{max-width:480px}
  .footer__cols{grid-template-columns:1fr 1.5fr 1fr;gap:32px;row-gap:32px}
}
@media(max-width:1100px){
  body.is-nav-open{overflow:hidden}
  .nav{padding:14px var(--pad);background:rgba(10,10,20,.68);
    -webkit-backdrop-filter:blur(22px) saturate(155%);
    backdrop-filter:blur(22px) saturate(155%);
    border-bottom-color:rgba(255,255,255,.16)}
  .nav.is-open{bottom:0;background:rgba(10,10,20,.98)}
  .nav__inner{gap:12px;position:relative}
  .nav__logo{position:relative;z-index:52}
  .nav__logo img{height:24px}
  .nav__toggle{position:relative;z-index:52;margin-left:auto;width:44px;height:44px;border-radius:50%;
    border:1px solid var(--glass-brd);background:rgba(255,255,255,.08);color:#fff;
    display:grid;place-items:center;cursor:pointer}
  .nav__toggle span{position:absolute;width:18px;height:2px;border-radius:2px;background:currentColor;
    transition:transform .28s cubic-bezier(.2,.7,.2,1),opacity .2s}
  .nav__toggle span:first-child{transform:translateY(-5px)}
  .nav__toggle span:last-child{transform:translateY(5px)}
  .nav.is-open .nav__toggle span:first-child{transform:rotate(45deg)}
  .nav.is-open .nav__toggle span:last-child{transform:rotate(-45deg)}
  .nav__inner>.btn--pill,.nav__socials{display:none}
  .nav__menu{position:absolute;left:calc(var(--pad) * -1);right:calc(var(--pad) * -1);top:100%;
    z-index:51;margin:14px 0 0;padding:14px var(--pad) 32px;
    max-height:calc(100svh - 78px);height:calc(100svh - 78px);
    display:flex;flex-direction:column;align-items:stretch;gap:0;overflow-y:auto;
    overflow-x:hidden;background:rgba(10,10,20,.98);
    -webkit-backdrop-filter:blur(24px) saturate(150%);
    backdrop-filter:blur(24px) saturate(150%);
    opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-10px);
    transition:opacity .25s ease,visibility .25s ease,transform .32s cubic-bezier(.2,.7,.2,1)}
  .nav.is-open .nav__menu{opacity:1;visibility:visible;pointer-events:auto;transform:none}
  .nav__item{position:static;border-bottom:1px solid var(--line)}
  .nav__menu>.nav__link,.nav__item>.nav__link{width:100%;display:flex;justify-content:space-between;
    border-bottom:1px solid var(--line);border-radius:0;padding:18px 0;font-size:clamp(22px,6vw,34px);
    font-family:var(--font-display);font-weight:700;line-height:1.05;text-align:left}
  .nav__item>.nav__link{border-bottom:0}
  .nav__lang{align-self:flex-start;margin:22px 0 0;font-size:14px}
  .nav__lang summary{padding:12px 14px}
  .nav__lang button{position:static;margin-top:8px;padding:12px 14px;background:transparent}
  .nav__link::after{display:none}
  .nav__item>.nav__link::before{content:"+";order:2;color:var(--magenta);font-weight:400}
  .nav__item.is-subopen>.nav__link::before{content:"-"}
  .nav__mobile-panel{display:block;padding:0 0 20px}
  .nav__mobile-panel[hidden]{display:none}
  .nav__mobile-panel .mega__inner{margin:0;max-width:none}
  .nav__mobile-panel .mega__grid{display:grid;grid-template-columns:1fr;gap:0;padding:0 0 6px}
  .nav__mobile-panel .mega__col{padding:0;border-top:1px solid var(--line)}
  .nav__mobile-panel .mega__col h4{font-size:17px;margin:0;padding:14px 0;cursor:pointer}
  .nav__mobile-panel .mega__col h4::before{width:10px;height:10px}
  /* second level collapses per group; tap the group name to expand */
  .nav__mobile-panel .mega__col h4::after{content:"+";margin-left:auto;color:var(--magenta);font-weight:400;font-size:20px}
  .nav__mobile-panel .mega__col.is-open h4::after{content:"\2013"}
  .nav__mobile-panel .mega__col ul{display:none;padding:0 0 14px 26px}
  .nav__mobile-panel .mega__col.is-open ul{display:block}
  .nav__mobile-panel .mega__col li{font-size:15px;padding:7px 0}
  .nav__mobile-panel .mega__all{margin:14px 0 4px;font-size:15px}
  .nav__mobile-cta{display:flex;justify-content:center;margin:26px 0 0;padding:16px 22px}
  .mega{display:none!important}
}
@media(max-width:760px){
  :root{--pad:20px}
  .section{min-height:auto;padding:92px var(--pad)}
  .h2{font-size:clamp(34px,11vw,56px)}
  .lead{font-size:17px}
  .btn{width:100%;justify-content:center;white-space:normal;text-align:center}
  .hero{min-height:100svh;align-items:flex-end;padding-bottom:72px}
  .hero__title{font-size:clamp(54px,16vw,78px)}
  .hero__title-static{display:block}
  .hero__type{min-width:0}
  .hero__sub{font-size:21px;margin-top:22px}
  .hero__support{font-size:16px;max-width:34ch}
  .hero__cta{display:grid;grid-template-columns:1fr;gap:12px}
  .hero__scroll{display:none}
  .statement{min-height:78svh;padding-block:88px}
  .statement__text{font-size:clamp(32px,10vw,46px);max-width:12ch}
  .statement__cta{margin-top:52px}
  .statement__bg{top:0;height:100%}
  .flow .h2{font-size:clamp(38px,12vw,60px)}
  .case{flex-basis:100%;min-height:430px}
  .insights__track .ins{flex-basis:100%;min-height:430px}
  .cases__controls{gap:12px}
  .cases__nav{width:42px;height:42px}
  .cases__dot{width:20px}
  .cases__dot.is-active{width:34px}
  .insights__grid,.industries__grid{grid-template-columns:1fr}
  .flow__steps{grid-template-columns:1fr;margin:0}
  .flow__track{margin:48px 0 40px;padding-left:32px}
  .flow__box{font-size:21px}
  .exp{padding:72px var(--pad)}
  .exp__head{margin-bottom:44px}
  .stack{gap:18px}
  .stack__card{min-height:520px}
  .stack__body{min-height:520px;padding:28px}
  .stack__body::before{inset:0;background:linear-gradient(0deg,rgba(8,8,20,.84),rgba(8,8,20,.48),transparent)}
  .caps__stepper{grid-template-columns:1fr;gap:18px}
  /* true accordion on mobile: image column dropped, one panel open at a time */
  .panels{display:none}
  .step__panel{padding-bottom:8px}
  .step{padding:22px 0}
  .step.is-active{color:#fff}
  .step::after{content:"+";margin-left:auto;font-size:24px;font-weight:400;opacity:.6}
  .step.is-active::after{content:"\2013"}
  .industries__grid{gap:12px;grid-auto-rows:minmax(320px,auto)}
  .ind{min-height:320px}
  .ind__body{padding:24px}
  .ind__body p,.ind__cta,.case p,.case__cta,.ins p,.ins__body::after{opacity:1;transform:none;max-height:none}
  .ind__body p{margin-top:10px}
  .ind__cta{margin-top:14px}
  .ins p{margin-top:12px}
  .ind .tile-clip::after,.case .tile-clip::after,.ins .tile-clip::after{
    background:linear-gradient(to top,rgba(6,6,14,.96) 22%,rgba(6,6,14,.5) 62%,rgba(6,6,14,.12)),
               linear-gradient(140deg,var(--c,var(--strat)),transparent 55%)}
  .case__body,.ins__body{padding:28px}
  .case h3,.ins h3{font-size:24px}
  .cta{min-height:74svh}
  .cta__title{font-size:clamp(48px,15vw,76px)}
  .cta__lead{font-size:17px}
  .footer__cols{grid-template-columns:1fr 1fr}
  .footer{padding-top:56px}
  .footer__base{justify-content:flex-start}
  .backtop{width:44px;right:18px;bottom:18px}
}
@media(max-width:560px){
  .flow__steps{grid-template-columns:1fr}
  .footer__cols{grid-template-columns:1fr}
  .footer__logo{height:52px}
  .footer__social{width:100%;flex-wrap:wrap}
}
@media(hover:none){
  .ind__body p,.ind__cta,.case p,.case__cta,.ins p,.ins__body::after{opacity:1;transform:none;max-height:none}
  .ind__body p{margin-top:10px}
  .ind__cta{margin-top:14px}
  .ins p{margin-top:12px}
}

/* respect reduced motion - everything visible, nothing pinned */
@media(prefers-reduced-motion:reduce){
  [data-reveal]{opacity:1;transform:none}
  .flow__step{opacity:1;filter:none}
  .flow__line{transform:none}
  .hero__scroll::after{animation:none}
  .hero__cursor{animation:none}
}

/* client preview lockdown: links to other internal pages, cursor only, no visual change */
.is-disabled-link{cursor:not-allowed}
