
/* ==========================================================
   ROAS SCALERS — GLOBAL DESIGN TOKENS
   (Map these to Elementor Site Settings > Global Colors / Fonts)
   ========================================================== */
:root{
  /* Colour */
  --c-dark:#07131D;        /* Primary dark */
  --c-black:#05090D;       /* Near black */
  --c-panel:#0A1824;       /* Raised dark surface (hero graph, mini visuals) */
  --c-green:#00FF3C;       /* Accent green: dark backgrounds only */
  --c-green-ink:#007A1F;   /* Green for text and lines on light backgrounds (4.5:1+) */
  --c-white:#FFFFFF;
  --c-muted:#94A3B8;       /* Muted text on dark */
  --c-soft:#CBD5E1;        /* Supporting text on dark */
  --c-light:#F6F8FA;       /* Light background */
  --c-ink:#07131D;         /* Text on light */
  --c-ink-2:#475569;       /* Secondary text on light */
  --c-shadow:#000000;
  --c-rule-d:color-mix(in srgb,var(--c-white) 9%,transparent);
  --c-rule-l:#E2E8F0;
  --c-line-faint:color-mix(in srgb,var(--c-white) 5%,transparent);
  --c-line-strong:color-mix(in srgb,var(--c-white) 16%,transparent);
  --c-green-tint:color-mix(in srgb,var(--c-green) 14%,transparent);

  /* Type */
  --f-sans:"Inter","Manrope",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --fs-display:clamp(2.4rem,1.4rem + 4vw,4.75rem);
  --fs-h1:clamp(2.6rem,1.4rem + 4.6vw,5rem);        /* 42 to 80 */
  --fs-page-h1:clamp(2.4rem,1.3rem + 3.6vw,4.5rem); /* inner page H1: 38 to 72 */
  --fs-h2:clamp(2rem,1.3rem + 2.8vw,3.5rem);        /* 32 to 56 */
  --fs-h3:clamp(1.375rem,1.1rem + .9vw,1.9rem);     /* 22 to 30 */
  --fs-h4:clamp(1.125rem,1rem + .6vw,1.5rem);       /* 18 to 24 */
  --fs-stat:clamp(3rem,2.2rem + 3vw,5rem);
  --fs-num:clamp(2.5rem,2rem + 1.6vw,3.75rem);
  --fs-tagline:clamp(1.75rem,1.2rem + 2vw,3rem);
  --fs-list:clamp(1.25rem,1rem + 1vw,1.875rem);
  --fs-statement:clamp(1.25rem,1rem + .8vw,1.625rem);
  --fs-menu:1.5rem;
  --fs-body:clamp(1.0625rem,1rem + .2vw,1.1875rem); /* 17 to 19 */
  --fs-ui:1rem;            /* buttons, links, list labels */
  --fs-small:.9375rem;     /* supporting details */
  --fs-micro:.8125rem;     /* smallest labels */
  --fs-tag:.6875rem;
  --fs-viz-head:14px;      /* hero graph (SVG units) */
  --fs-viz-label:15px;
  --fs-viz-sub:12px;

  /* Radius */
  --r-xs:2px; --r-sm:4px; --r-md:8px; --r-lg:12px; --r-round:50%;

  /* Spacing */
  --sp-half:2px; --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:20px; --sp-6:24px;
  --sp-7:28px; --sp-8:32px; --sp-10:40px; --sp-12:48px; --sp-14:56px; --sp-16:64px; --sp-20:80px;
  --sp-card:clamp(24px,3vw,40px);
  --sp-block-sm:clamp(28px,3.5vw,48px);
  --sp-block:clamp(32px,4vw,56px);
  --sp-block-lg:clamp(40px,5vw,64px);
  --sp-col-gap:clamp(32px,5vw,80px);
  --sp-col-gap-lg:clamp(40px,6vw,96px);
  --sp-hero-top:clamp(40px,6vw,88px);
  --sp-hero-bottom:clamp(56px,7vw,96px);
  --sp-final:clamp(72px,9vw,128px);
  --sec-y:clamp(56px,7vw,104px);
  --gutter:clamp(20px,4vw,48px);
  --stagger:22px;          /* Growth Path step height */
  --stagger-svc:32px;      /* Services panel step */

  --wrap:1280px;
  --header-h:84px;
  --ease:cubic-bezier(.2,.7,.2,1);
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--f-sans);font-size:var(--fs-body);line-height:1.6;color:var(--c-ink);background:var(--c-black);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,svg{display:block;max-width:100%}
a{color:inherit}
h1,h2,h3,p{margin:0}
h1,h2,h3{font-weight:700;letter-spacing:-.025em;line-height:1.05}
ul,ol{margin:0;padding:0;list-style:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;padding:0}
:focus-visible{outline:2px solid var(--c-green);outline-offset:3px;border-radius:var(--r-xs)}
.on-light :focus-visible{outline-color:var(--c-dark)}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:16px;top:-60px;z-index:100;background:var(--c-green);color:var(--c-black);padding:var(--sp-3) var(--sp-4);font-weight:700;border-radius:var(--r-sm);text-decoration:none}
.skip:focus{top:12px}

.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--gutter)}
.sec{padding:var(--sec-y) 0;position:relative}
.on-dark{background:var(--c-dark);color:var(--c-white)}
.on-black{background:var(--c-black);color:var(--c-white)}
.on-light{background:var(--c-light);color:var(--c-ink)}
.on-white{background:var(--c-white);color:var(--c-ink)}
.h2{font-size:var(--fs-h2);max-width:17ch}
.intro{font-size:var(--fs-body);max-width:58ch}
.on-dark .intro,.on-black .intro{color:var(--c-soft)}
.on-light .intro,.on-white .intro{color:var(--c-ink-2)}

/* ---------- Buttons ---------- */
.btn{display:inline-flex;align-items:center;gap:var(--sp-2);min-height:52px;padding:0 var(--sp-6);border-radius:var(--r-sm);font-weight:700;font-size:var(--fs-ui);text-decoration:none;letter-spacing:-.005em;transition:transform .25s var(--ease),background-color .25s,box-shadow .25s}
.btn .arr{width:16px;height:16px;transition:transform .25s var(--ease)}
.btn:hover .arr,.tlink:hover .arr{transform:translate(3px,-3px)}
.btn-primary{background:var(--c-green);color:var(--c-black)}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 10px 30px -10px color-mix(in srgb,var(--c-green) 55%,transparent)}
.btn-ghost{color:var(--c-white);border:1px solid color-mix(in srgb,var(--c-white) 28%,transparent)}
.btn-ghost:hover{border-color:var(--c-white);transform:translateY(-2px)}
.tlink{display:inline-flex;align-items:center;gap:var(--sp-2);font-weight:700;text-decoration:none;font-size:var(--fs-ui);padding:var(--sp-2) 0;border-bottom:1px solid currentColor}
.tlink .arr{width:14px;height:14px;transition:transform .25s var(--ease)}

/* ==========================================================
   HEADER
   ========================================================== */
.site-header{position:sticky;top:0;z-index:50;background:color-mix(in srgb,var(--c-black) 72%,transparent);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid transparent;transition:background-color .3s,border-color .3s}
.site-header.scrolled{background:var(--c-black);border-color:var(--c-rule-d)}
.hdr{height:var(--header-h);display:flex;align-items:center;gap:var(--sp-8);transition:height .3s var(--ease)}
.site-header.scrolled .hdr{height:68px}
.brand img{height:50px;width:auto;transition:height .3s var(--ease)}
.site-header.scrolled .brand img{height:42px}
.nav{margin-left:auto}
.nav-root{display:flex;gap:var(--sp-1);align-items:center}
.nav-root > li{position:relative}
.nav-root > li > a{display:block;padding:var(--sp-3) var(--sp-4);color:var(--c-soft);text-decoration:none;font-size:var(--fs-small);font-weight:500;border-radius:var(--r-sm);position:relative;transition:color .2s}
.nav-root > li > a::after{content:"";position:absolute;left:var(--sp-4);right:var(--sp-4);bottom:var(--sp-1);height:2px;background:var(--c-green);transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease)}
.nav-root > li > a:hover,.has-dd:hover > a,.has-dd.open > a{color:var(--c-white)}
.nav-root > li > a:hover::after,.has-dd:hover > a::after,.has-dd.open > a::after{transform:scaleX(1)}
/* Dropdowns */
.has-dd{display:flex;align-items:center}
.has-dd > a{padding-right:var(--sp-1)}
.has-dd > a::after{right:var(--sp-1)}
.dd-toggle{width:28px;height:36px;display:grid;place-items:center;color:var(--c-muted);border-radius:var(--r-sm);transition:color .2s}
.dd-toggle svg{width:12px;height:12px;transition:transform .25s var(--ease)}
.has-dd:hover .dd-toggle,.has-dd.open .dd-toggle{color:var(--c-green)}
.has-dd:hover .dd-toggle svg,.has-dd.open .dd-toggle svg{transform:rotate(180deg)}
.dd{position:absolute;top:100%;left:0;width:max-content;min-width:440px;margin-top:var(--sp-3);display:grid;grid-template-columns:1fr 1fr;grid-template-rows:repeat(4,auto);grid-auto-flow:column;gap:var(--sp-half) var(--sp-2);padding:var(--sp-3);background:var(--c-black);border:1px solid var(--c-rule-d);border-top:2px solid var(--c-green);border-radius:var(--r-md);box-shadow:0 24px 48px -20px color-mix(in srgb,var(--c-shadow) 80%,transparent);opacity:0;visibility:hidden;transform:translateY(-6px);transition:opacity .2s,transform .25s var(--ease),visibility 0s .25s;z-index:60}
.dd::before{content:"";position:absolute;left:0;right:0;bottom:100%;height:var(--sp-4)}
.has-dd:hover .dd,.has-dd.open .dd{opacity:1;visibility:visible;transform:none;transition:opacity .2s,transform .25s var(--ease)}
.dd a{display:flex;justify-content:space-between;align-items:center;gap:var(--sp-4);padding:var(--sp-3);border-radius:var(--r-sm);color:var(--c-soft);text-decoration:none;font-size:var(--fs-small);font-weight:500;white-space:nowrap;transition:background-color .2s,color .2s}
.dd a svg{width:12px;height:12px;flex:none;color:var(--c-green);opacity:0;transform:translate(-4px,4px);transition:opacity .2s,transform .25s var(--ease)}
.dd a:hover,.dd a:focus-visible{background:var(--c-line-faint);color:var(--c-white)}
.dd a:hover svg,.dd a:focus-visible svg{opacity:1;transform:none}
.hdr .btn{min-height:44px;padding:0 var(--sp-5);font-size:var(--fs-small)}
.hdr .short{display:none}
.burger{display:none;width:44px;height:44px;border:1px solid var(--c-rule-d);border-radius:var(--r-sm);align-items:center;justify-content:center}
.burger span{display:block;width:18px;height:2px;background:var(--c-white);position:relative;transition:background .2s}
.burger span::before,.burger span::after{content:"";position:absolute;left:0;width:18px;height:2px;background:var(--c-white);transition:transform .25s var(--ease)}
.burger span::before{top:-6px}.burger span::after{top:6px}
.burger[aria-expanded="true"] span{background:transparent}
.burger[aria-expanded="true"] span::before{transform:translateY(6px) rotate(45deg)}
.burger[aria-expanded="true"] span::after{transform:translateY(-6px) rotate(-45deg)}
.scroll-progress{position:absolute;left:0;bottom:-1px;height:2px;width:100%;background:var(--c-green);transform-origin:left;transform:scaleX(0)}
.mnav{display:none}

/* ==========================================================
   1. HERO
   ========================================================== */
.hero{padding:var(--sp-hero-top) 0 var(--sp-hero-bottom);overflow:hidden}
.hero::before{content:"";position:absolute;inset:0;background-image:linear-gradient(var(--c-rule-d) 1px,transparent 1px),linear-gradient(90deg,var(--c-rule-d) 1px,transparent 1px);background-size:64px 64px;-webkit-mask-image:radial-gradient(ellipse 70% 70% at 75% 45%,#000 20%,transparent 75%);mask-image:radial-gradient(ellipse 70% 70% at 75% 45%,#000 20%,transparent 75%);opacity:.6;pointer-events:none}
.hero-grid{display:grid;grid-template-columns:1.05fr 1fr;gap:var(--sp-col-gap);align-items:center;position:relative}
.eyebrow{display:flex;align-items:center;gap:var(--sp-3);font-size:var(--fs-small);color:var(--c-soft);font-weight:500;margin-bottom:var(--sp-7)}
.eyebrow::before{content:"";width:8px;height:8px;background:var(--c-green);border-radius:var(--r-round);box-shadow:0 0 0 4px color-mix(in srgb,var(--c-green) 15%,transparent);flex:none}
.hero h1{font-size:var(--fs-h1);font-weight:800;letter-spacing:-.04em;line-height:.98;max-width:12ch}
.hero .lede{margin-top:var(--sp-7);color:var(--c-soft);max-width:52ch}
.hero-ctas{display:flex;flex-wrap:wrap;gap:var(--sp-4);margin-top:var(--sp-10)}
.assure{display:flex;gap:var(--sp-3);margin-top:var(--sp-6);font-size:var(--fs-small);color:var(--c-muted);max-width:52ch;line-height:1.5}
.assure svg{flex:none;margin-top:var(--sp-1)}

.hero-visual{position:relative}
.viz{width:100%;height:auto;border-radius:var(--r-lg);overflow:visible}
.viz .ln{stroke-dasharray:1;stroke-dashoffset:1;animation:draw 1.9s .3s var(--ease) forwards}
.viz .area{opacity:0;animation:fade 1s 1.5s forwards}
.viz .node{opacity:0;transform-box:fill-box;transform-origin:center;animation:pop .5s var(--ease) forwards}
.viz .n1{animation-delay:.35s}.viz .n2{animation-delay:.9s}.viz .n3{animation-delay:1.45s}.viz .n4{animation-delay:2s}
.viz .tip{opacity:0;animation:fade .4s 2.1s forwards}
.viz .pulse{transform-box:fill-box;transform-origin:center;animation:pulse 2.4s 2.3s ease-out infinite;opacity:0}
.chip{position:absolute;background:color-mix(in srgb,var(--c-black) 92%,transparent);border:1px solid var(--c-rule-d);border-radius:var(--r-md);padding:var(--sp-3) var(--sp-4);display:flex;gap:var(--sp-3);align-items:center;opacity:0;animation:rise .6s var(--ease) forwards;box-shadow:0 18px 40px -20px color-mix(in srgb,var(--c-shadow) 80%,transparent)}
.chip b{display:block;font-size:var(--fs-small);color:var(--c-white);letter-spacing:-.01em}
.chip small{display:block;font-size:var(--fs-micro);color:var(--c-muted)}
.chip .ic{width:30px;height:30px;border-radius:var(--r-sm);display:grid;place-items:center;flex:none}
.chip-a{left:-4%;top:24%;animation-delay:2.2s}
.chip-a .ic{background:color-mix(in srgb,var(--c-green) 14%,transparent)}
.chip-b{right:-3%;bottom:9%;animation-delay:2.45s}
.chip-b .ic{background:color-mix(in srgb,var(--c-muted) 14%,transparent)}

@keyframes draw{to{stroke-dashoffset:0}}
@keyframes fade{to{opacity:1}}
@keyframes pop{from{opacity:0;transform:scale(.3)}to{opacity:1;transform:scale(1)}}
@keyframes rise{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes pulse{0%{opacity:.55;transform:scale(1)}100%{opacity:0;transform:scale(2.6)}}

/* ==========================================================
   2. MARKETING PROBLEM
   ========================================================== */
.problem{overflow:hidden}
.problem::before{content:"";position:absolute;inset:0;background-image:linear-gradient(var(--c-rule-l) 1px,transparent 1px);background-size:100% 88px;opacity:.3;pointer-events:none}
.prob-grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:var(--sp-col-gap-lg);position:relative}
.prob-head{position:sticky;top:110px;align-self:start}
.prob-head .h2{max-width:13ch;font-weight:800}
.tension{display:inline-flex;align-items:baseline;gap:var(--sp-half);position:relative;white-space:nowrap}
.tension svg{display:inline-block;width:.55em;height:.55em;align-self:center}
.t-flat{position:relative}
.t-flat::after{content:"";position:absolute;left:0;right:0;bottom:.02em;height:.07em;background:repeating-linear-gradient(90deg,var(--c-ink-2) 0 10px,transparent 10px 16px)}
.prob-head .intro{margin-top:var(--sp-7)}
.obs{border-top:1px solid var(--c-rule-l)}
.obs li{display:grid;grid-template-columns:88px 1fr;gap:var(--sp-5);padding:var(--sp-7) 0;border-bottom:1px solid var(--c-rule-l);position:relative;transition:background-color .3s}
.obs .num{font-size:var(--fs-num);font-weight:800;letter-spacing:-.05em;line-height:1;color:var(--c-ink-2);transition:color .3s}
.obs h3{font-size:var(--fs-h3);line-height:1.15;margin-bottom:var(--sp-3);display:flex;align-items:center;gap:var(--sp-3)}
.obs h3 .mk{width:0;height:18px;overflow:hidden;flex:none;transition:width .35s var(--ease)}
.obs p{color:var(--c-ink-2);max-width:46ch}
.obs li::before{content:"";position:absolute;left:0;bottom:-1px;height:2px;width:100%;background:var(--c-green-ink);transform:scaleX(0);transform-origin:left;transition:transform .5s var(--ease)}
.obs li:hover::before,.obs li:focus-within::before{transform:scaleX(1)}
.obs li:hover .num{color:var(--c-green-ink)}
.obs li:hover h3 .mk{width:22px}
.closing{margin-top:var(--sp-10);font-size:var(--fs-statement);font-weight:700;letter-spacing:-.02em;line-height:1.3;max-width:30ch}

/* ==========================================================
   3. SERVICES
   ========================================================== */
.svc-head{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-col-gap);align-items:end;margin-bottom:var(--sp-block)}
.svc-head .h2{max-width:16ch}
.svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-6);position:relative;align-items:start}
.gp-svg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible;z-index:0}
.gp-base{fill:none;stroke-width:1.5}
.gp-line{fill:none;stroke:var(--c-green);stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}
.svc-grid .gp-base{stroke:var(--c-rule-l)}
.svc-grid .gp-line{stroke:var(--c-green-ink)}
.panel{min-width:0;position:relative;z-index:1;border-radius:var(--r-lg);padding:var(--sp-7);display:flex;flex-direction:column;transition:transform .3s var(--ease)}
.panel:hover{transform:translateY(-3px)}
.panel:nth-of-type(1){margin-top:calc(var(--stagger-svc) * 2);background:var(--c-dark);color:var(--c-white)}
.panel:nth-of-type(2){margin-top:var(--stagger-svc);background:var(--c-light);border:1px solid var(--c-rule-l)}
.panel:nth-of-type(3){margin-top:0;background:var(--c-black);color:var(--c-white);border-top:3px solid var(--c-green)}
.pnum{display:flex;align-items:center;gap:var(--sp-3);font-weight:700;font-size:var(--fs-small);margin-bottom:var(--sp-6)}
.pnum .gp-dot{width:12px;height:12px;border-radius:var(--r-round);background:currentColor;flex:none;box-shadow:0 0 0 5px color-mix(in srgb,var(--c-muted) 18%,transparent)}
.panel:nth-of-type(1) .gp-dot,.panel:nth-of-type(3) .gp-dot{background:var(--c-green);box-shadow:0 0 0 5px color-mix(in srgb,var(--c-green) 16%,transparent)}
.panel:nth-of-type(2) .gp-dot{background:var(--c-green-ink)}
.pviz{min-width:0;height:184px;border-radius:var(--r-md);margin-bottom:var(--sp-7);position:relative;overflow:hidden}
.panel h3{font-size:var(--fs-h3);margin-bottom:var(--sp-3)}
.panel .sub{font-weight:600;font-size:var(--fs-body);margin-bottom:var(--sp-3);letter-spacing:-.01em}
.panel .body{font-size:var(--fs-body);line-height:1.6;margin-bottom:var(--sp-6)}
.panel:nth-of-type(1) .body,.panel:nth-of-type(3) .body{color:var(--c-soft)}
.panel:nth-of-type(2) .body{color:var(--c-ink-2)}
.svc-list{border-top:1px solid var(--c-rule-d);margin-bottom:var(--sp-6)}
.panel:nth-of-type(2) .svc-list{border-color:var(--c-rule-l)}
.svc-list li{border-bottom:1px solid var(--c-rule-d)}
.panel:nth-of-type(2) .svc-list li{border-color:var(--c-rule-l)}
.svc-list a{display:flex;justify-content:space-between;align-items:center;padding:var(--sp-3) 0;text-decoration:none;font-weight:600;font-size:var(--fs-ui)}
.svc-list a svg{width:14px;height:14px;opacity:.45;transition:transform .25s var(--ease),opacity .25s}
.svc-list a:hover svg{opacity:1;transform:translate(3px,-3px)}
.panel .tlink{margin-top:auto;align-self:flex-start}

/* search viz */
.v-search{background:var(--c-panel);padding:var(--sp-5)}
.sbar{white-space:nowrap;overflow:hidden;display:flex;align-items:center;gap:var(--sp-3);background:var(--c-white);color:var(--c-ink);border-radius:var(--r-sm);padding:var(--sp-3) var(--sp-3);font-size:var(--fs-micro);font-weight:500}
.sbar .caret{width:1.5px;height:16px;background:var(--c-ink);animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
.sres{margin-top:var(--sp-3);display:grid;gap:var(--sp-2)}
.sres div{height:26px;transition:opacity .35s,transform .35s var(--ease);border-radius:var(--r-sm);background:color-mix(in srgb,var(--c-white) 5%,transparent);display:flex;align-items:center;gap:var(--sp-2);padding:0 var(--sp-3)}
.sres div i{display:block;height:6px;border-radius:var(--r-sm);background:color-mix(in srgb,var(--c-white) 18%,transparent)}
.sres.searching div{opacity:.2;transform:translateY(4px)}
.sres div:nth-child(2){transition-delay:.08s}.sres div:nth-child(3){transition-delay:.16s}
.sres .hit{background:color-mix(in srgb,var(--c-green) 8%,transparent);box-shadow:inset 3px 0 0 var(--c-green)}
.sres .hit i{background:color-mix(in srgb,var(--c-white) 55%,transparent)}
.sres .tag{font-style:normal;font-size:var(--fs-tag);font-weight:700;color:var(--c-black);background:var(--c-green);padding:var(--sp-half) var(--sp-2);border-radius:var(--r-sm)}
/* social viz */
.v-social{background:var(--c-white);border:1px solid var(--c-rule-l);padding:var(--sp-4);display:grid;grid-template-rows:auto 1fr auto;gap:var(--sp-3)}
.v-social .who{display:flex;align-items:center;gap:var(--sp-2)}
.v-social .av{width:24px;height:24px;border-radius:var(--r-round);background:var(--c-dark)}
.v-social .who i{display:block;height:6px;width:90px;border-radius:var(--r-sm);background:var(--c-soft)}
.v-social .media{background:var(--c-dark);border-radius:var(--r-sm);position:relative;overflow:hidden}
.v-social .media svg{position:absolute;inset:0;width:100%;height:100%}
.v-social .acts{display:flex;gap:var(--sp-3);color:var(--c-ink-2)}
.v-social .acts svg{width:16px;height:16px}
/* growth viz */
.v-growth{background:var(--c-panel);padding:var(--sp-5) var(--sp-5) 0;display:flex;align-items:flex-end;gap:var(--sp-3)}
.v-growth span{flex:1;background:color-mix(in srgb,var(--c-white) 10%,transparent);border-radius:var(--r-sm) var(--r-sm) 0 0;transform-origin:bottom;transform:scaleY(.2);transition:transform 1s var(--ease)}
.v-growth span:last-of-type{background:var(--c-green)}
.panel.is-in .v-growth span{transform:scaleY(1)}
.v-growth span:nth-of-type(2){transition-delay:.08s}.v-growth span:nth-of-type(3){transition-delay:.16s}.v-growth span:nth-of-type(4){transition-delay:.24s}.v-growth span:nth-of-type(5){transition-delay:.32s}
.v-growth svg{position:absolute;inset:0;width:100%;height:100%}

/* ==========================================================
   4. PHILOSOPHY / GROWTH PATH
   ========================================================== */
.philo{overflow:hidden}
.philo-head{display:grid;grid-template-columns:1.1fr .9fr;gap:var(--sp-col-gap);align-items:end}
.philo-head .h2{max-width:18ch}
.journey{position:relative;display:grid;grid-template-columns:repeat(6,1fr);gap:var(--sp-5);margin-top:var(--sp-block);padding-top:var(--sp-12)}
.journey .gp-base{stroke:color-mix(in srgb,var(--c-white) 12%,transparent)}
.journey .gp-loop{fill:none;stroke:var(--c-green);stroke-width:1.5;stroke-dasharray:4 7;opacity:0;transition:opacity .8s}
.journey.looped .gp-loop{opacity:.6}
.stage{position:relative;padding-top:var(--sp-8);z-index:1}
.stage .gp-dot{position:absolute;left:0;top:0;width:14px;height:14px;border-radius:var(--r-round);background:var(--c-dark);border:2px solid color-mix(in srgb,var(--c-white) 30%,transparent);transition:background-color .4s,border-color .4s,box-shadow .4s}
.stage.lit .gp-dot{background:var(--c-green);border-color:var(--c-green);box-shadow:0 0 0 6px color-mix(in srgb,var(--c-green) 14%,transparent)}
.stage:last-of-type .gp-dot{width:20px;height:20px;left:-3px;top:-3px}
.stage .idx{display:block;font-size:var(--fs-micro);color:var(--c-muted);margin-bottom:var(--sp-2);font-variant-numeric:tabular-nums}
.stage h3{font-size:var(--fs-h4);color:var(--c-muted);transition:color .4s;letter-spacing:-.02em}
.stage p{margin-top:var(--sp-2);font-size:var(--fs-small);line-height:1.5;color:var(--c-muted);transition:color .5s;max-width:22ch}
.stage.lit h3{color:var(--c-white)}
.stage.lit p{color:var(--c-soft)}
.stage:nth-of-type(1){margin-top:calc(var(--stagger) * 8)}.stage:nth-of-type(2){margin-top:calc(var(--stagger) * 6)}.stage:nth-of-type(3){margin-top:calc(var(--stagger) * 7)}
.stage:nth-of-type(4){margin-top:calc(var(--stagger) * 4)}.stage:nth-of-type(5){margin-top:calc(var(--stagger) * 2)}.stage:nth-of-type(6){margin-top:0}
.philo-foot{display:grid;grid-template-columns:1.1fr .9fr;gap:var(--sp-col-gap);margin-top:var(--sp-block-lg);padding-top:var(--sp-10);border-top:1px solid var(--c-rule-d);align-items:end}
.philo-foot p{font-size:var(--fs-statement);font-weight:600;letter-spacing:-.02em;line-height:1.35;max-width:34ch}
.tagline{font-size:var(--fs-tagline);font-weight:800;letter-spacing:-.04em;line-height:1;text-align:right}
.tagline span{display:block;color:var(--c-green)}

/* ==========================================================
   5. WORK / CASE STUDIES
   ========================================================== */
.work-head{display:flex;justify-content:space-between;align-items:end;gap:var(--sp-8);flex-wrap:wrap;margin-bottom:var(--sp-block-sm)}
.work-head .intro{margin-top:var(--sp-5)}
.cases{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--sp-5)}
.case{position:relative;border-radius:var(--r-lg);padding:var(--sp-card);min-height:360px;display:flex;flex-direction:column;overflow:hidden;text-decoration:none;transition:transform .3s var(--ease)}
.case:hover{transform:translateY(-3px)}
.case.dk{background:var(--c-dark);color:var(--c-white)}
.case.lt{background:var(--c-white);border:1px solid var(--c-rule-l);color:var(--c-ink)}
.case .meta{display:flex;justify-content:space-between;gap:var(--sp-4);flex-wrap:wrap;font-size:var(--fs-small);font-weight:600}
.case .meta .ch{font-weight:500}
.case.dk .meta .ch{color:var(--c-muted)}
.case.lt .meta .ch{color:var(--c-ink-2)}
.case .chal{margin-top:var(--sp-6);font-size:var(--fs-statement);font-weight:700;letter-spacing:-.02em;line-height:1.2;max-width:22ch;position:relative;z-index:1}
.case .res{margin-top:auto;padding-top:var(--sp-8);position:relative;z-index:1}
.case .big{font-size:var(--fs-stat);font-weight:800;letter-spacing:-.05em;line-height:.95}
.case.dk .big{color:var(--c-green)}
.case .res small{display:block;font-size:var(--fs-small);margin-top:var(--sp-2)}
.case.dk .res small{color:var(--c-muted)}
.case.lt .res small{color:var(--c-ink-2)}
.case .read{margin-top:var(--sp-6);display:inline-flex;align-items:center;gap:var(--sp-2);font-weight:700;font-size:var(--fs-ui)}
.case .read svg{width:14px;height:14px;transition:transform .25s var(--ease)}
.case:hover .read svg{transform:translate(3px,-3px)}
.case .cg{position:absolute;right:0;bottom:0;width:62%;height:62%;pointer-events:none}

.case-idx{position:absolute;top:var(--sp-card);right:var(--sp-card)}

/* ==========================================================
   6. INDUSTRIES
   ========================================================== */
.ind-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-col-gap);margin-top:var(--sp-block);align-items:stretch}
.ind-list{border-top:1px solid var(--c-rule-d)}
.ind-btn{width:100%;display:flex;align-items:center;justify-content:space-between;gap:var(--sp-4);padding:var(--sp-5) 0;border-bottom:1px solid var(--c-rule-d);text-align:left;color:var(--c-muted);font-size:var(--fs-list);font-weight:700;letter-spacing:-.025em;transition:color .25s}
.ind-btn .arr{width:22px;height:22px;flex:none;opacity:0;transform:translateX(-10px);transition:transform .3s var(--ease),opacity .3s;color:var(--c-green)}
.ind-btn:hover,.ind-item.active .ind-btn{color:var(--c-white)}
.ind-item.active .ind-btn .arr,.ind-btn:hover .arr{opacity:1;transform:none}
.ind-inline{display:none}
.ind-stage{position:relative;border-radius:var(--r-lg);overflow:hidden;background:var(--c-black);min-height:460px;border:1px solid var(--c-rule-d)}
.pane{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;padding:var(--sp-card);opacity:0;visibility:hidden;transition:opacity .45s var(--ease),visibility 0s .45s}
.pane.active{opacity:1;visibility:visible;transition:opacity .45s var(--ease)}
.pane img,.pane .art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.pane img{filter:grayscale(.25) contrast(1.05)}
.pane::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,color-mix(in srgb,var(--c-black) 0%,transparent) 25%,color-mix(in srgb,var(--c-black) 92%,transparent) 80%)}
.pane > div{position:relative;z-index:1}
.pane h3{font-size:var(--fs-h3);margin-bottom:var(--sp-2)}
.pane p{color:var(--c-soft);max-width:36ch;margin-bottom:var(--sp-5)}
.ind-foot{margin-top:var(--sp-10)}
.on-dark .tlink,.on-black .tlink{color:var(--c-white)}
.on-dark .tlink:hover,.on-black .tlink:hover{color:var(--c-green)}

/* ==========================================================
   7. FINAL CTA
   ========================================================== */
.final{overflow:hidden;text-align:left;padding:var(--sp-final) 0}
.final-line{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.final-line path{fill:none;stroke:var(--c-green);stroke-width:2;stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 2.4s var(--ease)}
.final-line .fl-glow{stroke-width:10;opacity:.08}
.final.is-in .final-line path{stroke-dashoffset:0}
.final .wrap{position:relative}
.final h2{font-size:var(--fs-display);font-weight:800;letter-spacing:-.04em;line-height:1;max-width:15ch}
.final .intro{margin-top:var(--sp-7);max-width:56ch}
.final .ctas{display:flex;flex-wrap:wrap;gap:var(--sp-4);margin-top:var(--sp-10)}
.final .small{margin-top:var(--sp-6);font-size:var(--fs-small);color:var(--c-muted)}

/* ==========================================================
   FOOTER
   ========================================================== */
.site-footer{background:var(--c-black);color:var(--c-soft);border-top:1px solid var(--c-rule-d);padding:var(--sp-20) 0 var(--sp-8);font-size:var(--fs-small)}
.ft-grid{display:grid;grid-template-columns:1.3fr 1fr 1.3fr 1.3fr 1.1fr;gap:var(--sp-8)}
.ft-brand img{height:64px;width:auto}
.ft-brand p{margin-top:var(--sp-4);color:var(--c-white);font-weight:600}
.site-footer h2{font-size:var(--fs-micro);font-weight:700;color:var(--c-muted);letter-spacing:.02em;margin-bottom:var(--sp-4)}
.site-footer li{margin-bottom:var(--sp-3)}
.site-footer a{text-decoration:none;transition:color .2s}
.site-footer a:hover{color:var(--c-green)}
.ft-contact p{margin-bottom:var(--sp-3)}
.ft-base{margin-top:var(--sp-14);padding-top:var(--sp-6);border-top:1px solid var(--c-rule-d);display:flex;justify-content:space-between;gap:var(--sp-4);flex-wrap:wrap;color:var(--c-muted);font-size:var(--fs-micro)}


/* SVG colour utilities (token-driven) */
.fc-dark{fill:var(--c-dark)}
.fc-green{fill:var(--c-green)}
.fc-green-ink{fill:var(--c-green-ink)}
.fc-line-faint{fill:var(--c-line-faint)}
.fc-line-strong{fill:var(--c-line-strong)}
.fc-muted{fill:var(--c-muted)}
.fc-panel{fill:var(--c-panel)}
.fc-rule-d{fill:var(--c-rule-d)}
.fc-white{fill:var(--c-white)}
.sc-dark{stroke:var(--c-dark)}
.sc-green{stroke:var(--c-green)}
.sc-green-ink{stroke:var(--c-green-ink)}
.sc-ink-2{stroke:var(--c-ink-2)}
.sc-line-faint{stroke:var(--c-line-faint)}
.sc-line-strong{stroke:var(--c-line-strong)}
.sc-muted{stroke:var(--c-muted)}
.sc-rule-d{stroke:var(--c-rule-d)}
.sc-white{stroke:var(--c-white)}
.stc-green{stop-color:var(--c-green)}
.viz text{font-family:var(--f-sans)}
.vt-head{font-size:var(--fs-viz-head)}.vt-label{font-size:var(--fs-viz-label)}.vt-sub{font-size:var(--fs-viz-sub)}
.ind-intro{margin-top:var(--sp-6)}
.site-footer .ft-sub{margin-top:var(--sp-7)}
.push{margin-left:auto}
.sres div:nth-child(1) i{width:55%}.sres div:nth-child(2) i{width:70%}.sres div:nth-child(3) i{width:45%}
.v-growth span:nth-of-type(1){height:28%}.v-growth span:nth-of-type(2){height:40%}.v-growth span:nth-of-type(3){height:36%}.v-growth span:nth-of-type(4){height:62%}.v-growth span:nth-of-type(5){height:88%}
/* Case studies keep dark/light alternation when stacked on mobile */
@media (max-width:767px){.cases .case:nth-child(3){order:4}.cases .case:nth-child(4){order:3}}

/* ==========================================================
   RESPONSIVE
   ========================================================== */
@media (max-width:1180px){
  .chip-a{left:0}.chip-b{right:0}
  .ft-grid{grid-template-columns:repeat(3,1fr)}
  .ft-brand{grid-column:1/-1}
}
@media (max-width:1024px){
  .nav,.hdr > .btn{display:none}
  .burger{display:inline-flex}
  .hdr .mcta{display:inline-flex}
  .mnav{display:block;z-index:49;position:fixed;inset:68px 0 0 0;background:var(--c-black);padding:var(--sp-6) var(--gutter) var(--sp-10);transform:translateY(-8px);opacity:0;visibility:hidden;transition:opacity .25s,transform .25s var(--ease),visibility 0s .25s;overflow-y:auto}
  .mnav.open{opacity:1;visibility:visible;transform:none;transition:opacity .25s,transform .25s var(--ease)}
  .mnav > a,.m-row{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--c-rule-d)}
  .mnav > a,.m-row a{padding:var(--sp-5) 0;color:var(--c-white);text-decoration:none;font-size:var(--fs-menu);font-weight:700;letter-spacing:-.02em;flex:1}
  .m-toggle{width:48px;height:48px;display:grid;place-items:center;color:var(--c-muted);border:1px solid var(--c-rule-d);border-radius:var(--r-sm)}
  .m-toggle svg{width:14px;height:14px;transition:transform .25s var(--ease)}
  .m-toggle[aria-expanded="true"]{color:var(--c-green)}
  .m-toggle[aria-expanded="true"] svg{transform:rotate(180deg)}
  .m-sub{padding:var(--sp-2) 0 var(--sp-4);border-bottom:1px solid var(--c-rule-d)}
  .m-sub a{display:block;padding:var(--sp-2) 0 var(--sp-2) var(--sp-4);border-left:2px solid var(--c-rule-d);color:var(--c-soft);text-decoration:none;font-size:var(--fs-body);transition:color .2s,border-color .2s}
  .m-sub a:hover,.m-sub a:focus-visible{color:var(--c-white);border-left-color:var(--c-green)}
  .mnav .btn{margin-top:var(--sp-7);width:100%;justify-content:center;border:0;font-size:var(--fs-ui)}
  .hero-grid{grid-template-columns:1fr}
  .hero-visual{max-width:640px}
  .prob-grid{grid-template-columns:1fr}
  .prob-head{position:static}
  .svc-head,.philo-head,.philo-foot{grid-template-columns:1fr}
  .tagline{text-align:left}
  .svc-grid{grid-template-columns:minmax(0,1fr);gap:var(--sp-5)}
  .panel:nth-of-type(n){margin-top:0}
  .panel{display:grid;grid-template-columns:1fr 1.2fr;column-gap:var(--sp-8)}
  .panel > *{grid-column:2}
  .panel .pnum{grid-column:1/-1}
  .panel .pviz{grid-column:1;grid-row:2 / span 6;height:auto;min-height:184px;margin-bottom:0}
  .journey{grid-template-columns:1fr;gap:var(--sp-7);padding-top:0}
  .stage:nth-of-type(n){margin-top:0}
  .stage{padding:0 0 0 var(--sp-12)}
  .stage .gp-dot{top:4px}
  .stage:last-of-type .gp-dot{left:-3px;top:1px}
  .stage p{max-width:40ch}
  .ind-grid{grid-template-columns:1fr}
  .ind-stage{display:none}
  .ind-item.active .ind-inline{display:block}
  .ind-inline{padding:var(--sp-1) 0 var(--sp-6);border-bottom:1px solid var(--c-rule-d)}
  .ind-item.active .ind-btn{border-bottom-color:transparent}
  .ind-inline p{color:var(--c-soft);margin-bottom:var(--sp-4)}
  .ind-thumb{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:var(--r-md);margin-bottom:var(--sp-4);background:var(--c-black)}
  .ind-btn .arr{opacity:.6;transform:rotate(90deg)}
  .ind-item.active .ind-btn .arr{transform:rotate(-90deg)}
}
@media (max-width:767px){
  :root{--header-h:68px}
  .brand img{height:40px}
  .site-header.scrolled .brand img{height:38px}
  .hdr{gap:var(--sp-3)}
  .hdr .long{display:none}.hdr .short{display:inline}
  .hdr .mcta{margin-left:auto}
  .hero h1{max-width:12ch}
  .hero-ctas .btn{width:100%;justify-content:center}
  .chip{display:none}
  .viz .lbl-sub,.viz .pill{display:none}
  .viz{--fs-viz-label:24px}
  .final-line{opacity:.55}
  .obs li{grid-template-columns:56px 1fr;gap:var(--sp-3);padding:var(--sp-7) 0}
  .panel{display:flex}
  .panel .pviz{min-height:0;height:164px;margin-bottom:var(--sp-6)}
  .cases{grid-template-columns:1fr}
  .case{min-height:360px}
  .final .ctas .btn{width:100%;justify-content:center}
  .ft-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:420px){
  .ft-grid{grid-template-columns:1fr}
  .tension svg{display:none}
}
@media (min-width:1025px){ .hdr .mcta{display:none} }

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-delay:0s!important;animation-iteration-count:1!important;transition-duration:.01ms!important;transition-delay:0s!important}
  html{scroll-behavior:auto}
  .viz .pulse{display:none}
}

/* ==========================================================
   INNER PAGES — shared components
   ========================================================== */
[id]{scroll-margin-top:calc(var(--header-h) + var(--sp-4))}
.nav-root > li > a[aria-current="page"]{color:var(--c-white)}
.nav-root > li > a[aria-current="page"]::after{transform:scaleX(1)}
.mnav a[aria-current="page"]{color:var(--c-green)}

/* Page hero (Elementor: Container, 2 columns) */
.phero{padding:var(--sp-hero-top) 0 var(--sp-hero-bottom);overflow:hidden}
.phero::before{content:"";position:absolute;inset:0;background-image:linear-gradient(var(--c-rule-d) 1px,transparent 1px),linear-gradient(90deg,var(--c-rule-d) 1px,transparent 1px);background-size:64px 64px;-webkit-mask-image:radial-gradient(ellipse 70% 70% at 75% 45%,var(--c-shadow) 20%,transparent 75%);mask-image:radial-gradient(ellipse 70% 70% at 75% 45%,var(--c-shadow) 20%,transparent 75%);opacity:.6;pointer-events:none}
.phero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:var(--sp-col-gap);align-items:center;position:relative;z-index:1}
.phero-grid.solo{grid-template-columns:1fr}
.phero h1{font-size:var(--fs-page-h1);font-weight:800;letter-spacing:-.04em;line-height:1.02;max-width:16ch}
.phero .lede{margin-top:var(--sp-6);color:var(--c-soft);max-width:56ch}
.phero .hero-ctas{margin-top:var(--sp-10)}
/* Signature: growth line along the foot of every inner hero */
.phero-line{position:absolute;left:0;right:0;bottom:0;width:100%;height:120px;pointer-events:none;z-index:0}
.phero-line path{fill:none;stroke:var(--c-green);stroke-width:2;stroke-dasharray:1;stroke-dashoffset:1;animation:draw 2.2s .4s var(--ease) forwards;opacity:.55}

.sec-head{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-col-gap);align-items:end;margin-bottom:var(--sp-block)}
.sec-head .h2{max-width:18ch}

/* ==========================================================
   SERVICES PAGE
   ========================================================== */
/* Hero visual: the climb (HTML labels, SVG line only) */
.climb{position:relative;background:var(--c-panel);border:1px solid var(--c-rule-d);border-radius:var(--r-lg);padding:var(--sp-10) var(--sp-6) var(--sp-6)}
.climb .gp-svg{z-index:2}
.climb .gp-base{stroke:transparent}
.climb .gp-line{opacity:0;animation:fade .6s 1.1s forwards}
.climb ol{display:grid;grid-template-columns:repeat(5,1fr);gap:var(--sp-3);height:320px;position:relative;z-index:1}
.climb li{display:grid;grid-template-rows:1fr auto;min-width:0}
.climb .bw{display:flex;align-items:flex-end}
.climb .bar{position:relative;display:block;width:100%;background:var(--c-line-faint);border-radius:var(--r-sm) var(--r-sm) 0 0;transform-origin:bottom;animation:grow .9s var(--ease) both}
.climb li:nth-child(1) .bar{height:18%}.climb li:nth-child(2) .bar{height:34%;animation-delay:.1s}.climb li:nth-child(3) .bar{height:50%;animation-delay:.2s}
.climb li:nth-child(4) .bar{height:68%;animation-delay:.3s}.climb li:nth-child(5) .bar{height:92%;animation-delay:.4s;background:var(--c-green-tint);box-shadow:inset 0 2px 0 var(--c-green)}
.climb .gp-dot{position:absolute;top:0;left:50%;width:10px;height:10px;border-radius:var(--r-round);background:var(--c-green);transform:translate(-50%,-50%);box-shadow:0 0 0 5px var(--c-green-tint)}
.climb .lbl{margin-top:var(--sp-3);font-size:var(--fs-small);font-weight:600;color:var(--c-soft);text-align:center}
.climb li:last-child .lbl{color:var(--c-green)}
@keyframes grow{from{transform:scaleY(0)}to{transform:scaleY(1)}}

/* System map: three groups on a rising line */
.sysmap{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-6);align-items:start}
.sysmap .gp-base{stroke:var(--c-rule-l)}
.sysmap .gp-line{stroke:var(--c-green-ink)}
.sys-node{position:relative;z-index:1;display:block;text-decoration:none;padding:var(--sp-6) 0 0;border-top:2px solid var(--c-ink);transition:border-color .25s}
.sys-node:nth-of-type(1){margin-top:calc(var(--stagger-svc) * 2)}.sys-node:nth-of-type(2){margin-top:var(--stagger-svc)}
.sys-node .gp-dot{position:absolute;top:-7px;left:0;width:12px;height:12px;border-radius:var(--r-round);background:var(--c-green-ink)}
.sys-node .n{display:block;font-size:var(--fs-small);color:var(--c-ink-2);font-weight:600;margin-bottom:var(--sp-2)}
.sys-node strong{display:flex;align-items:center;gap:var(--sp-2);font-size:var(--fs-h3);letter-spacing:-.02em;line-height:1.15}
.sys-node strong .arr{width:18px;height:18px;transition:transform .25s var(--ease)}
.sys-node p{margin-top:var(--sp-2);color:var(--c-ink-2);max-width:30ch}
.sys-node:hover{border-color:var(--c-green-ink)}
.sys-node:hover .arr{transform:translate(3px,3px) rotate(90deg)}

/* Service groups (Elementor: Container 2 columns, left column sticky) */
.grp-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:var(--sp-col-gap)}
.grp-head{position:sticky;top:110px;align-self:start}
.grp-steps{display:flex;align-items:flex-end;gap:var(--sp-1);height:22px;margin-bottom:var(--sp-5)}
.grp-steps i{display:block;width:10px;background:var(--c-line-strong);border-radius:var(--r-xs)}
.grp-steps i:nth-child(1){height:8px}.grp-steps i:nth-child(2){height:14px}.grp-steps i:nth-child(3){height:22px}
.grp-steps i.on{background:var(--c-green)}
.on-light .grp-steps i{background:var(--c-rule-l)}
.on-light .grp-steps i.on{background:var(--c-green-ink)}
.grp-label{font-size:var(--fs-small);font-weight:700;margin-bottom:var(--sp-4)}
.on-dark .grp-label,.on-black .grp-label{color:var(--c-green)}
.on-light .grp-label{color:var(--c-green-ink)}
.grp-head .h2{max-width:14ch}
.grp-head .intro{margin-top:var(--sp-5)}
.grp-head .tlink{margin-top:var(--sp-8)}
.svc-rows{border-top:1px solid var(--c-rule-d)}
.on-light .svc-rows{border-color:var(--c-rule-l)}
.svc-row{display:grid;grid-template-columns:200px 1fr;gap:var(--sp-6);padding:var(--sp-8) 0;border-bottom:1px solid var(--c-rule-d);align-items:start;transition:transform .3s var(--ease)}
.on-light .svc-row{border-color:var(--c-rule-l)}
.svc-row:hover{transform:translateX(3px)}
.svc-viz{aspect-ratio:5/3;border-radius:var(--r-md);border:1px solid var(--c-rule-d);background:var(--c-panel);overflow:hidden;transition:border-color .3s}
.on-light .svc-viz{background:var(--c-white);border-color:var(--c-rule-l)}
.svc-viz svg{width:100%;height:100%}
.svc-row:hover .svc-viz{border-color:var(--c-green)}
.on-light .svc-row:hover .svc-viz{border-color:var(--c-green-ink)}
.svc-row h3{font-size:var(--fs-h3);margin-bottom:var(--sp-3)}
.row-link{text-decoration:none;display:inline-flex;align-items:center;gap:var(--sp-2)}
.row-link .arr{width:18px;height:18px;opacity:.5;transition:transform .25s var(--ease),opacity .25s}
.svc-row:hover .row-link .arr{opacity:1;transform:translate(3px,-3px)}
.on-dark .row-link:hover,.on-black .row-link:hover{color:var(--c-green)}
.on-light .row-link:hover{color:var(--c-green-ink)}
.svc-row p{max-width:44ch}
.on-dark .svc-row p,.on-black .svc-row p{color:var(--c-soft)}
.on-light .svc-row p{color:var(--c-ink-2)}

/* ==========================================================
   WORK PAGE
   ========================================================== */
.dir-head{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-col-gap);align-items:end;margin-bottom:var(--sp-block)}
.cs-cols{display:grid;grid-template-columns:32px 170px minmax(0,1fr) 160px 120px 210px 24px;gap:var(--sp-6);align-items:center}
.cs-headrow{padding:0 var(--sp-3) var(--sp-3);border-bottom:2px solid var(--c-ink);font-size:var(--fs-small);font-weight:600;color:var(--c-ink-2)}
.cs-list li{border-bottom:1px solid var(--c-rule-l)}
.cs-row{padding:var(--sp-6) 0;text-decoration:none;color:var(--c-ink);transition:background-color .25s}
.cs-row:hover{background:var(--c-white)}
.cs-row .i{font-size:var(--fs-small);color:var(--c-ink-2);font-variant-numeric:tabular-nums}
.cs-row .ind{font-weight:700}
.cs-row .ind small{display:block;font-weight:500;font-size:var(--fs-micro);color:var(--c-ink-2);margin-top:var(--sp-1)}
.cs-row .sp svg{width:120px;height:36px}
.cs-row{padding-left:var(--sp-3);padding-right:var(--sp-3);border-radius:var(--r-md)}
.cs-row .ch{font-size:var(--fs-statement);font-weight:700;letter-spacing:-.02em;line-height:1.25}
.cs-row .chn{color:var(--c-ink-2);font-size:var(--fs-small)}
.cs-row .res strong{display:block;font-size:var(--fs-h2);font-weight:800;letter-spacing:-.04em;line-height:1;color:var(--c-green-ink)}
.cs-row .res small{display:block;margin-top:var(--sp-1);font-size:var(--fs-micro);color:var(--c-ink-2)}
.cs-row .go{width:20px;height:20px;transition:transform .25s var(--ease)}
.cs-row:hover .go{transform:translate(3px,-3px);color:var(--c-green-ink)}

/* Case study report layout */
.rep-top{border-bottom:2px solid var(--c-ink);padding-bottom:var(--sp-8);margin-bottom:var(--sp-10)}
.rep-kicker{font-size:var(--fs-small);font-weight:700;color:var(--c-green-ink);margin-bottom:var(--sp-4)}
.rep-title{font-size:var(--fs-h2);letter-spacing:-.03em;line-height:1.05;max-width:20ch}
.case-tabs{display:flex;gap:var(--sp-2);flex-wrap:wrap;margin-bottom:var(--sp-10);border-bottom:1px solid var(--c-rule-l)}
.case-tab{display:flex;align-items:baseline;gap:var(--sp-2);padding:var(--sp-4) var(--sp-5);font-weight:700;font-size:var(--fs-ui);color:var(--c-ink-2);border-bottom:3px solid transparent;margin-bottom:calc(var(--sp-half) * -.5);transition:color .2s,border-color .2s}
.case-tab span{font-size:var(--fs-micro);font-variant-numeric:tabular-nums}
.case-tab:hover{color:var(--c-ink)}
.case-tab[aria-selected="true"]{color:var(--c-ink);border-bottom-color:var(--c-green-ink)}
.case-panel[hidden]{display:none}
.case-panel{animation:rise .5s var(--ease)}
.glance{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-4);margin-top:var(--sp-8)}
.gl{background:var(--c-dark);color:var(--c-white);border-radius:var(--r-lg);padding:var(--sp-6)}
.gl dt{font-size:var(--fs-small);color:var(--c-soft)}
.gl dd{margin:var(--sp-3) 0 0;display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-2)}
.gl .from{font-size:var(--fs-statement);color:var(--c-muted);text-decoration:line-through;text-decoration-thickness:1px}
.gl svg{width:16px;height:16px}
.gl .to{font-size:var(--fs-h2);font-weight:800;letter-spacing:-.04em;line-height:1;color:var(--c-green)}
.gl .delta{margin-left:auto;background:var(--c-green-tint);color:var(--c-green)}
.delta{display:inline-block;padding:var(--sp-half) var(--sp-2);border-radius:var(--r-sm);font-size:var(--fs-small);font-weight:700;background:color-mix(in srgb,var(--c-green-ink) 10%,transparent);color:var(--c-green-ink);white-space:nowrap}
.delta.flat{background:var(--c-light);color:var(--c-ink-2)}
.pull{font-size:var(--fs-statement);font-weight:700;color:var(--c-ink);letter-spacing:-.02em;margin-bottom:var(--sp-3)}
.res-tbl th[scope="row"]{font-size:var(--fs-ui);color:var(--c-ink);border-bottom:1px solid var(--c-rule-l);font-weight:600}
.chart-top{display:flex;justify-content:space-between;align-items:center;gap:var(--sp-4);flex-wrap:wrap;margin-bottom:var(--sp-3)}
.chart-top figcaption{margin:0;font-weight:600;color:var(--c-ink)}
.chart-key{display:flex;align-items:center;gap:var(--sp-2);font-size:var(--fs-micro);color:var(--c-ink-2)}
.chart-key i{width:16px;height:3px;background:var(--c-green-ink);border-radius:var(--r-xs)}
.chart svg{height:200px}
.chart-x{display:flex;justify-content:space-between;gap:var(--sp-2);margin-top:var(--sp-3)}
.chart-x li{text-align:center;font-size:var(--fs-micro);color:var(--c-ink-2);min-width:0}
.chart-x strong{display:block;color:var(--c-ink);font-size:var(--fs-small)}
.chart-x li:last-child strong{color:var(--c-green-ink)}
.rep-meta{display:flex;flex-wrap:wrap;gap:var(--sp-4) var(--sp-10);margin-top:var(--sp-6)}
.rep-meta div{min-width:0}
.rep-meta dt{font-size:var(--fs-micro);color:var(--c-ink-2)}
.rep-meta dd{margin:0;font-weight:700}
.rep-grid{display:grid;grid-template-columns:240px minmax(0,1fr);gap:var(--sp-col-gap)}
.rep-body{min-width:0}
.rep-toc{position:sticky;top:110px;align-self:start}
.rep-toc ol{border-left:2px solid var(--c-rule-l)}
.rep-toc a{display:flex;gap:var(--sp-3);padding:var(--sp-2) var(--sp-4);margin-left:calc(var(--sp-half) * -1);border-left:2px solid transparent;color:var(--c-ink-2);text-decoration:none;font-size:var(--fs-small);transition:color .2s,border-color .2s}
.rep-toc a span{font-variant-numeric:tabular-nums}
.rep-toc a:hover,.rep-toc a.is-active{color:var(--c-ink);border-left-color:var(--c-green-ink);font-weight:600}
.rep-block{padding:0 0 var(--sp-10);margin-bottom:var(--sp-10);border-bottom:1px solid var(--c-rule-l)}
.rep-block:last-child{border-bottom:0;margin-bottom:0;padding-bottom:0}
.rep-block h4{display:flex;align-items:baseline;gap:var(--sp-3);font-size:var(--fs-h3);margin-bottom:var(--sp-4)}
.rep-block h4 span{font-size:var(--fs-small);color:var(--c-green-ink);font-variant-numeric:tabular-nums}
.rep-block p,.rep-block li{color:var(--c-ink-2);max-width:62ch}
.rep-block ul,.rep-block ol.changes{display:grid;gap:var(--sp-3);margin-top:var(--sp-4)}
.rep-block ul li,.rep-block ol.changes li{position:relative;padding-left:var(--sp-6)}
.rep-block ul li::before{content:"";position:absolute;left:0;top:.7em;width:12px;height:2px;background:var(--c-green-ink)}
.rep-block ol.changes{counter-reset:c}
.rep-block ol.changes li::before{counter-increment:c;content:counter(c);position:absolute;left:0;top:0;font-weight:700;color:var(--c-green-ink)}
.kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-4);margin-top:var(--sp-4)}
.kpi{border:1px solid var(--c-rule-l);border-radius:var(--r-md);padding:var(--sp-5)}
.kpi dt{font-size:var(--fs-micro);color:var(--c-ink-2)}
.kpi dd{margin:var(--sp-2) 0 0;font-size:var(--fs-h3);font-weight:800;letter-spacing:-.03em}
.kpi dd small{display:block;font-size:var(--fs-micro);font-weight:500;color:var(--c-ink-2);letter-spacing:0}
.tags{display:flex;flex-wrap:wrap;gap:var(--sp-2);margin-top:var(--sp-2)}
.rep-block .tags{display:flex}
.rep-block .tags li{padding:var(--sp-1) var(--sp-3);border:1px solid var(--c-ink);border-radius:var(--r-sm);font-size:var(--fs-small);font-weight:600;color:var(--c-ink)}
.rep-block .tags li::before{display:none}
.tbl-wrap{overflow-x:auto;margin-top:var(--sp-4)}
.res-tbl{width:100%;border-collapse:collapse;font-size:var(--fs-ui);min-width:420px}
.res-tbl th,.res-tbl td{text-align:left;padding:var(--sp-3) var(--sp-4) var(--sp-3) 0;border-bottom:1px solid var(--c-rule-l)}
.res-tbl th{font-size:var(--fs-small);color:var(--c-ink-2);font-weight:600;border-bottom:2px solid var(--c-ink)}
.chart{margin:var(--sp-6) 0 0;border:1px solid var(--c-rule-l);border-radius:var(--r-md);padding:var(--sp-4)}
.chart svg{width:100%}
.learning{margin:0;font-size:var(--fs-statement);font-weight:700;letter-spacing:-.02em;line-height:1.35;color:var(--c-ink);padding-left:var(--sp-6);border-left:3px solid var(--c-green-ink);max-width:40ch}
.rep-cta{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--sp-6);background:var(--c-dark);color:var(--c-white);border-radius:var(--r-lg);padding:var(--sp-card)}
.rep-cta p{color:var(--c-white);font-size:var(--fs-statement);font-weight:700;max-width:none}

/* ==========================================================
   INDUSTRIES PAGE
   ========================================================== */
.paths{display:grid;gap:var(--sp-3);background:var(--c-panel);border:1px solid var(--c-rule-d);border-radius:var(--r-lg);padding:var(--sp-6)}
.paths li{display:grid;grid-template-columns:150px 1fr;gap:var(--sp-4);align-items:center;padding:var(--sp-3) 0;border-bottom:1px solid var(--c-rule-d)}
.paths li:last-child{border-bottom:0}
.paths span{font-size:var(--fs-small);font-weight:600;color:var(--c-soft)}
.paths svg{width:100%;height:56px}
.paths path{fill:none;stroke:var(--c-green);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1;animation:draw 1.6s var(--ease) forwards}
.paths li:nth-child(2) path{animation-delay:.25s}.paths li:nth-child(3) path{animation-delay:.5s}
.it-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-4)}
.it{position:relative;display:flex;flex-direction:column;background:var(--c-dark);color:var(--c-white);border-radius:var(--r-lg);overflow:hidden;text-decoration:none;transition:transform .3s var(--ease)}
.it:hover{transform:translateY(-3px)}
.it::after{content:"";position:absolute;left:0;bottom:0;height:3px;width:100%;background:var(--c-green);transform:scaleX(0);transform-origin:left;transition:transform .45s var(--ease)}
.it:hover::after,.it:focus-visible::after{transform:scaleX(1)}
.it-media{aspect-ratio:4/3;overflow:hidden;background:var(--c-black)}
.it-media img,.it-media svg{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.it-media img{filter:grayscale(.2)}
.it:hover .it-media img,.it:hover .it-media svg{transform:scale(1.04)}
.it-body{padding:var(--sp-5) var(--sp-5) var(--sp-6);display:flex;flex-direction:column;flex:1}
.it-num{font-size:var(--fs-micro);color:var(--c-muted);font-variant-numeric:tabular-nums}
.it h3{font-size:var(--fs-h4);margin:var(--sp-2) 0 var(--sp-2)}
.it p{color:var(--c-soft);font-size:var(--fs-ui);line-height:1.5}
.it-go{margin-top:auto;padding-top:var(--sp-5);display:inline-flex;align-items:center;gap:var(--sp-2);font-weight:700;font-size:var(--fs-small);color:var(--c-white)}
.it-go .arr{width:14px;height:14px;transition:transform .25s var(--ease)}
.it:hover .it-go .arr{transform:translate(3px,-3px);color:var(--c-green)}

/* ==========================================================
   PROCESS PAGE
   ========================================================== */
.steps{position:relative}
.steps .gp-base{stroke:var(--c-line-strong)}
.step{position:relative;display:grid;grid-template-columns:56px 140px 1fr 260px;gap:var(--sp-6);align-items:center;padding:var(--sp-10) 0;border-top:1px solid var(--c-rule-d)}
.step:last-child{border-bottom:1px solid var(--c-rule-d)}
.step .gp-dot{justify-self:center;width:14px;height:14px;border-radius:var(--r-round);background:var(--c-black);border:2px solid var(--c-line-strong);position:relative;z-index:1;transition:background-color .4s,border-color .4s,box-shadow .4s}
.step.lit .gp-dot{background:var(--c-green);border-color:var(--c-green);box-shadow:0 0 0 6px var(--c-green-tint)}
.step-num{font-size:var(--fs-num);font-weight:800;letter-spacing:-.05em;line-height:1;color:var(--c-muted);transition:color .4s;font-variant-numeric:tabular-nums}
.step.lit .step-num{color:var(--c-green)}
.step h3{font-size:var(--fs-h3);margin-bottom:var(--sp-2)}
.step p{color:var(--c-soft);max-width:46ch}
.meter{display:block;height:6px;border-radius:var(--r-sm);background:var(--c-line-faint);overflow:hidden}
.meter i{display:block;height:100%;background:var(--c-line-strong);transform-origin:left;transform:scaleX(0);transition:transform 1s var(--ease)}
.step.lit .meter i{transform:scaleX(1)}
.step:nth-child(1) .meter i{width:16%}.step:nth-child(2) .meter i{width:30%}.step:nth-child(3) .meter i{width:46%}
.step:nth-child(4) .meter i{width:62%}.step:nth-child(5) .meter i{width:80%}.step:nth-child(6) .meter i{width:100%;background:var(--c-green)}
.step:last-child .gp-dot{width:20px;height:20px}

/* ==========================================================
   ABOUT PAGE
   ========================================================== */
.ph-frame{position:relative;border-radius:var(--r-lg);overflow:hidden;aspect-ratio:4/5;background:var(--c-panel)}
.ph-frame img{width:100%;height:100%;object-fit:cover}
.ph-frame .corner{position:absolute;right:var(--sp-5);top:var(--sp-5);width:56px;height:56px}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-col-gap);align-items:start}
.prose p{color:var(--c-ink-2);max-width:56ch}
.on-dark .prose p,.on-black .prose p{color:var(--c-soft)}
.prose p + p{margin-top:var(--sp-5)}
.beliefs{display:grid;grid-template-columns:repeat(2,1fr);gap:0 var(--sp-col-gap);margin-top:var(--sp-block)}
.beliefs li{padding:var(--sp-8) 0;border-top:1px solid var(--c-rule-d)}
.beliefs svg{width:28px;height:20px;margin-bottom:var(--sp-4)}
.beliefs h3{font-size:var(--fs-h3);margin-bottom:var(--sp-3);max-width:20ch}
.beliefs p{color:var(--c-soft);max-width:44ch}
.how-img{border-radius:var(--r-lg);overflow:hidden;aspect-ratio:4/3;background:var(--c-light)}
.how-img img{width:100%;height:100%;object-fit:cover}
.how-list{margin-top:var(--sp-8);border-top:1px solid var(--c-rule-l)}
.how-list div{padding:var(--sp-5) 0;border-bottom:1px solid var(--c-rule-l)}
.how-list dt{font-weight:700;font-size:var(--fs-body)}
.how-list dd{margin:var(--sp-1) 0 0;color:var(--c-ink-2)}
.how .tlink{margin-top:var(--sp-8)}
.reach{display:grid;grid-template-columns:auto 1fr auto;gap:var(--sp-8);align-items:center;margin-top:var(--sp-block)}
.origin{display:flex;align-items:center;gap:var(--sp-3);font-weight:700;font-size:var(--fs-statement)}
.origin::before{content:"";width:14px;height:14px;border-radius:var(--r-round);background:var(--c-green);box-shadow:0 0 0 6px var(--c-green-tint)}
.routes{width:100%;height:220px}
.routes path{fill:none;stroke:var(--c-green);stroke-width:1.5;stroke-dasharray:4 6;opacity:.7}
.markets{display:grid;gap:var(--sp-6)}
.markets li{display:flex;align-items:center;gap:var(--sp-3);font-size:var(--fs-statement);font-weight:700}
.markets li::before{content:"";width:10px;height:10px;border-radius:var(--r-round);border:2px solid var(--c-green)}

/* ==========================================================
   CONTACT PAGE
   ========================================================== */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-col-gap);align-items:start;position:relative;z-index:1}
.c-details{margin-top:var(--sp-10);border-top:1px solid var(--c-rule-d)}
.c-details div{display:grid;grid-template-columns:120px 1fr;gap:var(--sp-4);padding:var(--sp-4) 0;border-bottom:1px solid var(--c-rule-d)}
.c-details dt{color:var(--c-muted);font-size:var(--fs-small)}
.c-details dd{margin:0;font-weight:600}
.c-details a{color:var(--c-white);text-decoration:none;border-bottom:1px solid var(--c-green)}
.c-details a:hover{color:var(--c-green)}
.form-card{background:var(--c-white);color:var(--c-ink);border-radius:var(--r-lg);padding:var(--sp-card);box-shadow:0 30px 60px -30px color-mix(in srgb,var(--c-shadow) 70%,transparent)}
.form-card h2{font-size:var(--fs-h3);margin-bottom:var(--sp-2)}
.form-card .note{color:var(--c-ink-2);font-size:var(--fs-small);margin-bottom:var(--sp-6)}
.f-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-4)}
.field{display:flex;flex-direction:column;gap:var(--sp-2);margin-bottom:var(--sp-4);min-width:0}
.field label{font-size:var(--fs-small);font-weight:600}
.field label .req{color:var(--c-green-ink)}
.field input,.field select,.field textarea{width:100%;font:inherit;font-size:var(--fs-ui);color:var(--c-ink);background:var(--c-light);border:1px solid var(--c-rule-l);border-radius:var(--r-sm);padding:var(--sp-3) var(--sp-4);min-height:48px;transition:border-color .2s,background-color .2s}
.field textarea{min-height:120px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:2px solid var(--c-green-ink);outline-offset:1px;background:var(--c-white)}
.field [aria-invalid="true"]{border-color:var(--c-ink);outline:2px solid var(--c-ink)}
.field .err{font-size:var(--fs-micro);color:var(--c-ink);font-weight:600;display:none}
.field .err.show{display:block}
.form-card .btn{width:100%;justify-content:center;border:0;cursor:pointer;margin-top:var(--sp-2)}
.f-status{margin-top:var(--sp-4);padding:var(--sp-4);border-radius:var(--r-sm);background:var(--c-light);border-left:3px solid var(--c-green-ink);font-size:var(--fs-small);color:var(--c-ink)}
.f-status[hidden]{display:none}
.next-h{margin-bottom:var(--sp-block)}
.where-intro{margin-top:var(--sp-5)}
.next-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-col-gap);counter-reset:n}
.next-steps li{position:relative;padding-top:var(--sp-10);border-top:2px solid var(--c-ink)}
.next-steps li::before{counter-increment:n;content:"0" counter(n);position:absolute;top:var(--sp-4);left:0;font-size:var(--fs-small);font-weight:700;color:var(--c-green-ink)}
.next-steps h3{font-size:var(--fs-h4);margin-bottom:var(--sp-2)}
.next-steps p{color:var(--c-ink-2)}

/* ==========================================================
   INNER PAGES — responsive
   ========================================================== */
@media (max-width:1180px){
  .it-grid{grid-template-columns:repeat(2,1fr)}
  .cs-headrow{display:none}
  .cs-cols{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"ind go" "ch ch" "res sp" "chn chn";row-gap:var(--sp-3)}
  .cs-row .i{display:none}.cs-row .ind{grid-area:ind}.cs-row .ch{grid-area:ch}.cs-row .chn{grid-area:chn}.cs-row .res{grid-area:res}.cs-row .sp{grid-area:sp;align-self:end}.cs-row .go{grid-area:go}
  .step{grid-template-columns:48px 110px 1fr 200px}
}
@media (max-width:1024px){
  .phero-grid,.sec-head,.grp-grid,.two-col,.contact-grid,.rep-grid{grid-template-columns:minmax(0,1fr)}
  .grp-head,.rep-toc{position:static}
  .rep-toc{display:none}
  .sysmap{grid-template-columns:1fr;gap:var(--sp-8)}
  .sys-node:nth-of-type(n){margin-top:0}
  .reach{grid-template-columns:1fr;gap:var(--sp-6)}
  .routes{display:none}
  .dir-head{grid-template-columns:1fr}
  .glance{grid-template-columns:1fr}
  .case-tabs{display:grid;grid-template-columns:1fr 1fr;border-bottom:0;gap:0}
  .case-tab{border-bottom:1px solid var(--c-rule-l);margin-bottom:0;padding:var(--sp-3);font-size:var(--fs-small);text-align:left;justify-content:flex-start}
  .case-tab[aria-selected="true"]{border-bottom:3px solid var(--c-green-ink)}
  .step{grid-template-columns:40px 1fr;grid-template-areas:"dot num" "dot body" "dot meter";row-gap:var(--sp-3);align-items:start}
  .step .gp-dot{grid-area:dot;margin-top:var(--sp-3)}
  .step-num{grid-area:num;font-size:var(--fs-h3)}
  .step-body{grid-area:body}
  .meter{grid-area:meter;max-width:360px}
  .ph-frame{aspect-ratio:16/10}
}
@media (max-width:767px){
  .beliefs,.next-steps{grid-template-columns:1fr}
  .next-steps{gap:var(--sp-8)}
  .kpis{grid-template-columns:1fr}
  .f-row{grid-template-columns:1fr;gap:0}
  .svc-row{grid-template-columns:1fr;gap:var(--sp-4)}
  .svc-viz{aspect-ratio:16/7}
  .paths li{grid-template-columns:1fr;gap:var(--sp-1)}
  .phero .hero-ctas .btn{width:100%;justify-content:center}
  .c-details div{grid-template-columns:1fr;gap:var(--sp-1)}
  .rep-cta .btn{width:100%;justify-content:center}
}
@media (max-width:600px){
  .it-grid{grid-template-columns:1fr}
  .climb{padding:var(--sp-6) var(--sp-5)}
  .climb ol{grid-template-columns:1fr;height:auto;gap:var(--sp-4)}
  .climb li{grid-template-rows:none;grid-template-columns:96px 1fr;align-items:center;gap:var(--sp-3)}
  .climb .lbl{order:-1;margin:0;text-align:left}
  .climb .bw{height:14px;align-items:stretch}
  .climb .bar{height:100%!important;border-radius:0 var(--r-sm) var(--r-sm) 0;transform-origin:left}
  .climb li:nth-child(1) .bar{width:18%}.climb li:nth-child(2) .bar{width:34%}.climb li:nth-child(3) .bar{width:50%}.climb li:nth-child(4) .bar{width:68%}.climb li:nth-child(5) .bar{width:92%;box-shadow:inset -2px 0 0 var(--c-green)}
  .climb .gp-dot{top:50%;left:100%}
  @keyframes grow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
}

/* ==========================================================
   SERVICE PAGES — components (shared tokens only)
   ========================================================== */
/* ---- Mockup shell (hero visuals). Values inside are illustrative. ---- */
.mk{position:relative;background:var(--c-panel);border:1px solid var(--c-rule-d);border-radius:var(--r-lg);padding:var(--sp-5);color:var(--c-white);font-size:var(--fs-small);box-shadow:0 30px 60px -30px color-mix(in srgb,var(--c-shadow) 80%,transparent)}
.mk-head{display:flex;justify-content:space-between;align-items:center;gap:var(--sp-3);margin-bottom:var(--sp-4)}
.mk-title{font-weight:600;color:var(--c-soft);display:flex;align-items:center;gap:var(--sp-2)}
.mk-title::before{content:"";width:8px;height:8px;border-radius:var(--r-round);background:var(--c-green)}
.mk-tag{font-size:var(--fs-micro);color:var(--c-muted);border:1px solid var(--c-rule-d);border-radius:var(--r-sm);padding:var(--sp-half) var(--sp-2)}
.mk-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-3);margin-bottom:var(--sp-4)}
.mk-kpi{background:var(--c-line-faint);border-radius:var(--r-md);padding:var(--sp-3)}
.mk-kpi small{display:block;font-size:var(--fs-micro);color:var(--c-muted)}
.mk-kpi b{display:block;font-size:var(--fs-h4);letter-spacing:-.02em;margin-top:var(--sp-1)}
.mk-kpi i{font-style:normal;font-size:var(--fs-micro);color:var(--c-green);font-weight:700}
.mk-bars li{display:grid;grid-template-columns:96px 1fr 52px;gap:var(--sp-3);align-items:center;padding:var(--sp-2) 0;border-top:1px solid var(--c-rule-d)}
.mk-bars span{color:var(--c-soft)}
.mk-bars .track{height:8px;border-radius:var(--r-sm);background:var(--c-line-faint);overflow:hidden}
.mk-bars .track i{display:block;height:100%;background:var(--c-green);border-radius:var(--r-sm);transform-origin:left;animation:grow-x 1.1s var(--ease) both}
.mk-bars li:nth-child(2) .track i{animation-delay:.1s;opacity:.8}.mk-bars li:nth-child(3) .track i{animation-delay:.2s;opacity:.6}.mk-bars li:nth-child(4) .track i{animation-delay:.3s;opacity:.45}
.mk-bars b{text-align:right;font-variant-numeric:tabular-nums}
@keyframes grow-x{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.w-2{width:2%}.w-5{width:5%}.w-100{width:100%}.w-58{width:58%}.w-64{width:64%}.w-72{width:72%}.w-74{width:74%}.w-82{width:82%}.w-88{width:88%}
.w-18{width:18%}.w-24{width:24%}.w-31{width:31%}.w-42{width:42%}.w-48{width:48%}.w-55{width:55%}.w-62{width:62%}.w-70{width:70%}.w-78{width:78%}.w-86{width:86%}.w-9{width:9%}
.mk-spark{width:100%;height:64px;margin-top:var(--sp-3)}
/* search result + table */
.mk-search{display:flex;align-items:center;gap:var(--sp-2);background:var(--c-white);color:var(--c-ink);border-radius:var(--r-sm);padding:var(--sp-3) var(--sp-4);font-weight:500}
.mk-search svg{width:14px;height:14px;flex:none}
.mk-ad{margin-top:var(--sp-3);background:var(--c-line-faint);border-left:3px solid var(--c-green);border-radius:var(--r-sm);padding:var(--sp-3) var(--sp-4)}
.mk-ad small{color:var(--c-muted);font-size:var(--fs-micro)}
.mk-ad small b{color:var(--c-black);background:var(--c-green);padding:0 var(--sp-1);border-radius:var(--r-xs);margin-right:var(--sp-1)}
.mk-ad strong{display:block;color:var(--c-white);font-size:var(--fs-ui);margin:var(--sp-1) 0}
.mk-ad p{color:var(--c-soft);font-size:var(--fs-micro);line-height:1.5}
.mk-tbl{width:100%;border-collapse:collapse;margin-top:var(--sp-4);font-variant-numeric:tabular-nums}
.mk-tbl th{font-weight:500;color:var(--c-muted);font-size:var(--fs-micro);text-align:right;padding:var(--sp-2) 0 var(--sp-2) var(--sp-2);border-bottom:1px solid var(--c-rule-d)}
.mk-tbl th:first-child,.mk-tbl td:first-child{text-align:left;padding-left:0}
.mk-tbl td{text-align:right;padding:var(--sp-2) 0 var(--sp-2) var(--sp-2);border-bottom:1px solid var(--c-rule-d);color:var(--c-soft)}
.mk-tbl td:first-child{color:var(--c-white)}
.mk-tbl .good{color:var(--c-green);font-weight:700}
.mk-tbl .bad{color:var(--c-muted);text-decoration:line-through}
/* rank tracker */
.mk-rank li{display:grid;grid-template-columns:1fr auto auto;gap:var(--sp-3);align-items:center;padding:var(--sp-3) 0;border-top:1px solid var(--c-rule-d)}
.mk-rank span{color:var(--c-soft);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mk-rank s{color:var(--c-muted);font-variant-numeric:tabular-nums}
.mk-rank b{display:inline-flex;align-items:center;gap:var(--sp-1);color:var(--c-green);font-variant-numeric:tabular-nums;min-width:48px;justify-content:flex-end}
.mk-rank b svg{width:10px;height:10px}
/* phone + creative test */
.mk-split{display:grid;grid-template-columns:200px 1fr;gap:var(--sp-5);align-items:center}
.phone{background:var(--c-black);border:1px solid var(--c-rule-d);border-radius:var(--r-lg);padding:var(--sp-3);aspect-ratio:9/16;display:flex;flex-direction:column;gap:var(--sp-2);overflow:hidden}
.phone .who{display:flex;align-items:center;gap:var(--sp-2);color:var(--c-soft);font-size:var(--fs-micro)}
.phone .who i{width:18px;height:18px;border-radius:var(--r-round);background:var(--c-line-strong)}
.phone .creative{flex:1;border-radius:var(--r-md);background:var(--c-panel);position:relative;overflow:hidden;border:1px solid var(--c-rule-d)}
.phone .creative svg{position:absolute;inset:0;width:100%;height:100%}
.phone .cta{display:flex;justify-content:space-between;align-items:center;font-size:var(--fs-micro);color:var(--c-soft)}
.phone .cta b{background:var(--c-green);color:var(--c-black);padding:var(--sp-1) var(--sp-2);border-radius:var(--r-sm)}
.mk-tests li{display:grid;grid-template-columns:24px 1fr auto;gap:var(--sp-3);align-items:center;padding:var(--sp-3) 0;border-top:1px solid var(--c-rule-d)}
.mk-tests .l{width:24px;height:24px;border-radius:var(--r-sm);display:grid;place-items:center;background:var(--c-line-faint);font-weight:700;font-size:var(--fs-micro)}
.mk-tests span{color:var(--c-soft)}
.mk-tests b{font-variant-numeric:tabular-nums}
.mk-tests .win .l{background:var(--c-green);color:var(--c-black)}
.mk-tests .win b{color:var(--c-green)}
.mk-tests small{display:block;color:var(--c-muted);font-size:var(--fs-micro)}
/* browser */
.browser{background:var(--c-white);border-radius:var(--r-md);overflow:hidden;color:var(--c-ink)}
.browser .bar{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-2) var(--sp-3);background:var(--c-light);border-bottom:1px solid var(--c-rule-l);font-size:var(--fs-micro);color:var(--c-ink-2)}
.browser .bar i{width:8px;height:8px;border-radius:var(--r-round);background:var(--c-rule-l)}
.browser .bar span{margin-left:var(--sp-2);background:var(--c-white);border:1px solid var(--c-rule-l);border-radius:var(--r-sm);padding:0 var(--sp-3);flex:1}
.browser .pg{padding:var(--sp-5);display:grid;gap:var(--sp-3)}
.sk{display:block;height:8px;border-radius:var(--r-sm);background:var(--c-rule-l)}
.sk.h{height:14px;background:var(--c-ink)}
.browser .cta-btn{justify-self:start;background:var(--c-green);color:var(--c-black);font-weight:700;font-size:var(--fs-micro);padding:var(--sp-2) var(--sp-4);border-radius:var(--r-sm);box-shadow:0 0 0 6px var(--c-green-tint);animation:pulse-cta 2.4s 1s ease-out infinite}
@keyframes pulse-cta{0%,100%{box-shadow:0 0 0 0 var(--c-green-tint)}50%{box-shadow:0 0 0 10px var(--c-green-tint)}}
.browser .trust{display:flex;gap:var(--sp-2)}
.browser .trust i{height:16px;flex:1;border-radius:var(--r-sm);background:var(--c-light);border:1px solid var(--c-rule-l)}
.mk-funnel{margin-top:var(--sp-4);display:grid;gap:var(--sp-2)}
.mk-funnel li{display:grid;grid-template-columns:110px 1fr 64px;gap:var(--sp-3);align-items:center}
.mk-funnel span{color:var(--c-soft)}
.mk-funnel b{text-align:right;font-variant-numeric:tabular-nums}
.mk-funnel li:last-child b{color:var(--c-green)}
.mk-funnel .track{height:8px;border-radius:var(--r-sm);background:var(--c-line-faint);overflow:hidden}
.mk-funnel .track i{display:block;height:100%;min-width:4px;background:var(--c-green);border-radius:var(--r-sm)}
.mk-foot{margin:var(--sp-3) 0 0}
/* video */
.frames{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-3);align-items:end;margin-bottom:var(--sp-4)}
.frame{position:relative;aspect-ratio:9/16;border-radius:var(--r-md);background:var(--c-black);border:1px solid var(--c-rule-d);overflow:hidden}
.frame:nth-child(2){transform:translateY(calc(var(--sp-4) * -1));border-color:var(--c-green)}
.frame svg.bg{position:absolute;inset:0;width:100%;height:100%}
.frame .play{position:absolute;left:50%;top:42%;width:36px;height:36px;transform:translate(-50%,-50%);border-radius:var(--r-round);background:var(--c-green);display:grid;place-items:center}
.frame .play svg{width:14px;height:14px}
.frame .cap{position:absolute;left:var(--sp-2);right:var(--sp-2);bottom:var(--sp-3);display:grid;gap:var(--sp-1)}
.frame .cap i{height:6px;border-radius:var(--r-sm);background:var(--c-white)}
.frame .cap i:last-child{width:60%;background:var(--c-green)}
.frame .ratio{position:absolute;top:var(--sp-2);left:var(--sp-2);font-size:var(--fs-micro);color:var(--c-soft);background:color-mix(in srgb,var(--c-black) 70%,transparent);padding:0 var(--sp-1);border-radius:var(--r-xs)}
.tl{position:relative;background:var(--c-black);border:1px solid var(--c-rule-d);border-radius:var(--r-md);padding:var(--sp-3);display:grid;gap:var(--sp-2);overflow:hidden}
.tl .tc{display:flex;justify-content:space-between;font-size:var(--fs-micro);color:var(--c-muted);font-variant-numeric:tabular-nums}
.tl .tc b{color:var(--c-green)}
.track-row{display:flex;gap:var(--sp-1);height:16px}
.track-row i{border-radius:var(--r-xs);background:var(--c-line-strong)}
.track-row.v i{background:color-mix(in srgb,var(--c-green) 55%,transparent)}
.track-row.c i{background:var(--c-soft);height:8px;align-self:center}
.track-row.a{height:18px;align-items:center}
.track-row.a i{width:3px;flex:none;background:var(--c-muted)}
.track-row.a i.h4{height:4px}.track-row.a i.h8{height:8px}.track-row.a i.h12{height:12px}.track-row.a i.h16{height:16px}
.track-row.a{overflow:hidden;gap:var(--sp-half)}
.playhead{position:absolute;top:0;bottom:0;width:2px;background:var(--c-green);left:12%;animation:scrub 6s linear infinite}
.playhead::before{content:"";position:absolute;top:0;left:-5px;border:6px solid transparent;border-top-color:var(--c-green)}
@keyframes scrub{from{left:8%}to{left:92%}}
.hook{position:absolute;top:var(--sp-7);left:8%;width:14%;height:calc(100% - var(--sp-8));border:1px dashed var(--c-green);border-radius:var(--r-xs)}
/* doc brief */
.doc{background:var(--c-white);color:var(--c-ink);border-radius:var(--r-md);padding:var(--sp-5);display:grid;gap:var(--sp-3)}
.doc dl{display:grid;gap:var(--sp-2)}
.doc dl div{display:grid;grid-template-columns:100px 1fr;gap:var(--sp-3);font-size:var(--fs-micro)}
.doc dt{color:var(--c-ink-2)}
.doc dd{margin:0;font-weight:600}
.pill{display:inline-block;padding:0 var(--sp-2);border-radius:var(--r-sm);background:color-mix(in srgb,var(--c-green-ink) 12%,transparent);color:var(--c-green-ink);font-weight:700}
.doc ol{display:grid;gap:var(--sp-2);border-top:1px solid var(--c-rule-l);padding-top:var(--sp-3);counter-reset:o}
.doc ol li{display:grid;grid-template-columns:28px 1fr;gap:var(--sp-2);align-items:center;font-size:var(--fs-micro);color:var(--c-ink-2)}
.doc ol li::before{counter-increment:o;content:"H2";font-weight:700;color:var(--c-ink)}
.doc .cta-line{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--c-rule-l);padding-top:var(--sp-3);font-size:var(--fs-micro);color:var(--c-ink-2)}
.doc .cta-line b{background:var(--c-green);color:var(--c-black);padding:var(--sp-1) var(--sp-3);border-radius:var(--r-sm)}
.intent{display:flex;flex-wrap:wrap;gap:var(--sp-2);margin-top:var(--sp-4)}
.intent li{display:flex;align-items:center;gap:var(--sp-2);font-size:var(--fs-micro);color:var(--c-soft)}
.intent li::after{content:"";width:14px;height:1px;background:var(--c-green)}
.intent li:last-child::after{display:none}
.intent li:last-child{color:var(--c-green);font-weight:700}
/* social: photo + calendar */
.soc{position:relative;padding:0;overflow:hidden;background:var(--c-black);aspect-ratio:4/5;width:100%;max-width:440px;justify-self:end}
.soc img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(.9)}
.soc .cal{position:absolute;left:var(--sp-5);right:var(--sp-5);bottom:var(--sp-5);background:color-mix(in srgb,var(--c-black) 92%,transparent);border:1px solid var(--c-rule-d);border-radius:var(--r-md);padding:var(--sp-4)}
.week{display:grid;grid-template-columns:repeat(7,1fr);gap:var(--sp-1)}
.week li{display:grid;gap:var(--sp-1);text-align:center;font-size:var(--fs-micro);color:var(--c-muted)}
.week li i{display:block;height:34px;border-radius:var(--r-sm);background:var(--c-line-faint)}
.week li.r i{background:var(--c-green)}
.week li.c i{background:color-mix(in srgb,var(--c-green) 45%,transparent)}
.week li.s i{background:var(--c-line-strong)}
.legend{display:flex;flex-wrap:wrap;gap:var(--sp-4);margin-top:var(--sp-3);font-size:var(--fs-micro);color:var(--c-soft)}
.legend span{display:flex;align-items:center;gap:var(--sp-1)}
.legend span::before{content:"";width:10px;height:10px;border-radius:var(--r-xs);background:var(--c-green)}
.legend span.c::before{background:color-mix(in srgb,var(--c-green) 45%,transparent)}
.legend span.s::before{background:var(--c-line-strong)}

/* ---- Problem variants ---- */
.pb-list{display:grid;grid-template-columns:1fr 1fr;gap:0 var(--sp-col-gap);border-top:2px solid var(--c-ink)}
.pb-list li{display:grid;grid-template-columns:48px 1fr;gap:var(--sp-4);padding:var(--sp-8) 0;border-bottom:1px solid var(--c-rule-l)}
.pb-n{font-size:var(--fs-small);font-weight:700;color:var(--c-green-ink);font-variant-numeric:tabular-nums;padding-top:var(--sp-1)}
.pb-list h3,.pb-table h3{font-size:var(--fs-h4);margin-bottom:var(--sp-2)}
.pb-list p,.pb-table p{color:var(--c-ink-2)}
.pb-table{border-top:2px solid var(--c-ink)}
.pb-th{display:grid;grid-template-columns:1fr 1.4fr;gap:var(--sp-col-gap);padding:var(--sp-3) 0;font-size:var(--fs-small);font-weight:600;color:var(--c-ink-2);border-bottom:1px solid var(--c-rule-l)}
.pb-table li{display:grid;grid-template-columns:1fr 1.4fr;gap:var(--sp-col-gap);padding:var(--sp-6) 0;border-bottom:1px solid var(--c-rule-l);position:relative}
.pb-table li::before{content:"";position:absolute;left:calc(40% - var(--sp-4));top:var(--sp-8);width:var(--sp-5);height:2px;background:var(--c-green-ink)}
.pb-table h3{margin:0}
.pb-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:var(--sp-4)}
.pb-tiles li{background:var(--c-panel);border:1px solid var(--c-rule-d);border-radius:var(--r-lg);padding:var(--sp-6);transition:border-color .3s,transform .3s var(--ease)}
.pb-tiles li:hover{border-color:var(--c-green);transform:translateY(-3px)}
.pb-tiles svg{width:24px;height:24px;margin-bottom:var(--sp-4)}
.pb-tiles h3{font-size:var(--fs-h4);margin-bottom:var(--sp-2)}
.pb-tiles p{color:var(--c-soft)}

/* ---- Approach: journey rail (signature) ---- */
.jr-label{margin-top:var(--sp-block);font-size:var(--fs-small);font-weight:600;color:var(--c-muted)}
.jr{display:grid;grid-template-columns:repeat(6,1fr);gap:var(--sp-4);margin-top:var(--sp-5)}
.jr li{position:relative;padding-top:var(--sp-8)}
.jr li::before{content:"";position:absolute;top:6px;left:0;right:calc(var(--sp-4) * -1);height:2px;background:var(--c-line-strong)}
.jr li:last-child::before{right:0}
.jr li.on::before{background:var(--c-green)}
.jr-dot{position:absolute;top:0;left:0;width:14px;height:14px;border-radius:var(--r-round);background:var(--c-black);border:2px solid var(--c-line-strong)}
.jr li.on .jr-dot{background:var(--c-green);border-color:var(--c-green);box-shadow:0 0 0 6px var(--c-green-tint)}
.jr strong{display:block;font-size:var(--fs-h4);letter-spacing:-.02em;color:var(--c-muted)}
.jr li.on strong{color:var(--c-white)}
.jr p{margin-top:var(--sp-2);font-size:var(--fs-small);line-height:1.5;color:var(--c-soft)}
.jr p.jr-muted{color:var(--c-muted)}

/* ---- What we do variants ---- */
.sec-head.with-photo{align-items:center}
.wd-intro{margin-top:var(--sp-5)}
.wd-photo{margin:0;border-radius:var(--r-lg);overflow:hidden;aspect-ratio:3/2;background:var(--c-light)}
.wd-photo img{width:100%;height:100%;object-fit:cover}
.wd-index{display:grid;grid-template-columns:1fr 1fr;gap:0 var(--sp-col-gap);border-top:1px solid var(--c-rule-l)}
.wd-index li{display:grid;grid-template-columns:40px 1fr;gap:var(--sp-4);padding:var(--sp-6) 0;border-bottom:1px solid var(--c-rule-l)}
.wd-n{font-size:var(--fs-small);font-weight:700;color:var(--c-green-ink);font-variant-numeric:tabular-nums;padding-top:var(--sp-1)}
.wd-index h3,.wd-cards h3{font-size:var(--fs-h4);margin-bottom:var(--sp-2)}
.wd-index p,.wd-cards p{color:var(--c-ink-2)}
.wd-groups{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:var(--sp-6)}
.wd-group{border-top:3px solid var(--c-ink);padding-top:var(--sp-5)}
.wd-group:first-child{border-top-color:var(--c-green-ink)}
.wd-group h3{font-size:var(--fs-h3);margin-bottom:var(--sp-5)}
.wd-group dl div{padding:var(--sp-4) 0;border-top:1px solid var(--c-rule-l)}
.wd-group dt{font-weight:700;font-size:var(--fs-body)}
.wd-group dd{margin:var(--sp-1) 0 0;color:var(--c-ink-2)}
.wd-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:var(--sp-4)}
.wd-cards li{position:relative;background:var(--c-light);border-radius:var(--r-md);padding:var(--sp-6);overflow:hidden;transition:transform .3s var(--ease)}
.wd-cards li::before{content:"";position:absolute;left:0;top:0;height:3px;width:32px;background:var(--c-green-ink);transition:width .45s var(--ease)}
.wd-cards li:hover{transform:translateY(-3px)}
.wd-cards li:hover::before{width:100%}
/* video formats strip */
.formats{display:flex;align-items:flex-end;gap:var(--sp-6);margin-top:var(--sp-block);padding-top:var(--sp-8);border-top:1px solid var(--c-rule-l);flex-wrap:wrap}
.fmt{display:grid;gap:var(--sp-2);justify-items:start}
.fmt i{display:block;background:var(--c-dark);border-radius:var(--r-sm);position:relative}
.fmt i::after{content:"";position:absolute;left:50%;top:50%;transform:translate(-40%,-50%);border:7px solid transparent;border-left:11px solid var(--c-green)}
.fmt.v i{width:72px;height:128px}.fmt.p i{width:96px;height:120px}.fmt.s i{width:112px;height:112px}.fmt.h i{width:200px;height:112px}
.fmt strong{font-size:var(--fs-small)}
.fmt small{font-size:var(--fs-micro);color:var(--c-ink-2)}
/* social weekly rhythm */
.rhythm{margin-top:var(--sp-block);display:grid;grid-template-columns:repeat(7,1fr);gap:var(--sp-2);padding-top:var(--sp-8);border-top:1px solid var(--c-rule-l)}
.rhythm li{background:var(--c-light);border-radius:var(--r-md);padding:var(--sp-4) var(--sp-3);min-height:120px;display:flex;flex-direction:column;gap:var(--sp-2)}
.rhythm b{font-size:var(--fs-micro);color:var(--c-ink-2)}
.rhythm span{font-weight:700;font-size:var(--fs-small)}
.rhythm li.post{background:var(--c-dark);color:var(--c-white)}
.rhythm li.post b{color:var(--c-muted)}
.rhythm li.post span{color:var(--c-green)}
.rhythm small{font-size:var(--fs-micro);color:inherit;opacity:1}

/* ---- Who it's for ---- */
.who-intro{margin-top:var(--sp-5)}
.who{border-top:1px solid var(--c-rule-l)}
.who a{display:grid;grid-template-columns:200px 1fr 20px;gap:var(--sp-4);align-items:center;padding:var(--sp-5) 0;border-bottom:1px solid var(--c-rule-l);text-decoration:none;transition:padding-left .3s var(--ease)}
.who a:hover{padding-left:var(--sp-3)}
.who strong{font-size:var(--fs-body)}
.who span{color:var(--c-ink-2)}
.who .arr{width:16px;height:16px;transition:transform .25s var(--ease)}
.who a:hover .arr{transform:translate(3px,-3px);color:var(--c-green-ink)}

/* ---- Process variants ---- */
.pr-row{display:grid;gap:var(--sp-5)}
.pr-row.n-4{grid-template-columns:repeat(4,1fr)}.pr-row.n-5{grid-template-columns:repeat(5,1fr)}.pr-row.n-6{grid-template-columns:repeat(6,1fr)}
.pr-row li{position:relative;padding-top:var(--sp-10)}
.pr-row li::before{content:"";position:absolute;top:6px;left:0;right:calc(var(--sp-5) * -1);height:2px;background:linear-gradient(90deg,var(--c-green),var(--c-line-strong))}
.pr-row li:last-child::before{right:0;background:var(--c-green)}
.pr-dot{position:absolute;top:0;left:0;width:14px;height:14px;border-radius:var(--r-round);background:var(--c-green);box-shadow:0 0 0 6px var(--c-green-tint)}
.pr-n{display:block;font-size:var(--fs-small);color:var(--c-muted);font-variant-numeric:tabular-nums;margin-bottom:var(--sp-2)}
.pr-row h3,.pr-list h3{font-size:var(--fs-h4);margin-bottom:var(--sp-2)}
.pr-row p,.pr-list p{color:var(--c-soft);font-size:var(--fs-ui);line-height:1.55}
.pr-list{border-top:1px solid var(--c-rule-d)}
.pr-list li{display:grid;grid-template-columns:120px 260px 1fr;gap:var(--sp-6);align-items:baseline;padding:var(--sp-6) 0;border-bottom:1px solid var(--c-rule-d);transition:background-color .3s}
.pr-list li:hover{background:var(--c-line-faint)}
.pr-list .pr-n{font-size:var(--fs-h2);font-weight:800;letter-spacing:-.04em;color:var(--c-muted);margin:0;line-height:1;transition:color .3s}
.pr-list li:hover .pr-n{color:var(--c-green)}
.pr-list h3{margin:0}
.pr-more{margin-top:var(--sp-10)}

/* ---- Measurement chain (signature) ---- */
.ms-photo{position:relative;margin:0 0 var(--sp-block);border-radius:var(--r-lg);overflow:hidden;aspect-ratio:21/8;background:var(--c-dark)}
.ms-photo img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) brightness(.45) contrast(1.1)}
.ms-overlay{position:absolute;inset:0;margin:0;background:linear-gradient(90deg,color-mix(in srgb,var(--c-black) 70%,transparent),transparent)}
.ms-overlay svg{position:absolute;inset:0;width:100%;height:100%}
.chain{display:grid;gap:var(--sp-2);counter-reset:none}
.chain.n-5{grid-template-columns:repeat(5,1fr)}.chain.n-6{grid-template-columns:repeat(6,1fr)}.chain.n-7{grid-template-columns:repeat(7,1fr)}
.chain li{position:relative;background:var(--c-light);border-radius:var(--r-md);padding:var(--sp-5) var(--sp-4) var(--sp-6);display:flex;flex-direction:column;gap:var(--sp-2);min-width:0}
.chain li:not(:last-child)::after{content:"";position:absolute;right:calc(var(--sp-2) * -1);top:50%;width:var(--sp-2);height:2px;background:var(--c-green-ink);z-index:1}
.ch-n{font-size:var(--fs-micro);font-weight:700;color:var(--c-ink-2);font-variant-numeric:tabular-nums}
.chain strong{font-size:var(--fs-body);letter-spacing:-.01em}
.chain small{font-size:var(--fs-small);color:var(--c-ink-2);line-height:1.45}
.chain li.end{background:var(--c-dark);color:var(--c-white)}
.chain li.end .ch-n,.chain li.end small{color:var(--c-soft)}
.chain li.end strong{color:var(--c-green)}
.chain li.stop{box-shadow:inset 0 0 0 1px var(--c-ink)}
.stop-tag{position:absolute;left:var(--sp-4);bottom:calc(var(--sp-3) * -1);font-style:normal;font-size:var(--fs-micro);font-weight:700;background:var(--c-ink);color:var(--c-white);padding:var(--sp-half) var(--sp-2);border-radius:var(--r-sm);white-space:nowrap}

/* ---- Why ---- */
.why-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:var(--sp-col-gap)}
.why{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-8) var(--sp-6)}
.why li{padding-top:var(--sp-5);border-top:2px solid var(--c-green)}
.why h3{font-size:var(--fs-h4);margin-bottom:var(--sp-2)}
.why p{color:var(--c-soft)}

/* ---- Related ---- */
.rel-h{margin-bottom:var(--sp-block)}
.rel{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:var(--sp-4)}
.rel a{position:relative;display:flex;flex-direction:column;gap:var(--sp-2);height:100%;background:var(--c-white);border:1px solid var(--c-rule-l);border-radius:var(--r-lg);padding:var(--sp-6) var(--sp-6) var(--sp-10);text-decoration:none;transition:border-color .3s,transform .3s var(--ease)}
.rel a:hover{border-color:var(--c-green-ink);transform:translateY(-3px)}
.rel strong{font-size:var(--fs-h4);letter-spacing:-.02em}
.rel span{color:var(--c-ink-2);font-size:var(--fs-ui)}
.rel .arr{position:absolute;right:var(--sp-6);bottom:var(--sp-6);width:16px;height:16px;transition:transform .25s var(--ease)}
.rel a:hover .arr{transform:translate(3px,-3px);color:var(--c-green-ink)}

/* ---- FAQ accordion (native details/summary: keyboard accessible, no JS) ---- */
.faq-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:var(--sp-col-gap);align-items:start}
.faq-cta{margin-top:var(--sp-6)}
.faqs{border-top:2px solid var(--c-ink)}
.faq{border-bottom:1px solid var(--c-rule-l)}
.faq summary{display:flex;justify-content:space-between;align-items:center;gap:var(--sp-4);padding:var(--sp-5) 0;cursor:pointer;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary h3{font-size:var(--fs-body);font-weight:700;letter-spacing:-.01em;line-height:1.35}
.faq summary:hover h3{color:var(--c-green-ink)}
.faq-i{position:relative;flex:none;width:28px;height:28px;border-radius:var(--r-round);border:1px solid var(--c-rule-l);transition:background-color .25s,border-color .25s}
.faq-i::before,.faq-i::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:2px;background:var(--c-ink);transform:translate(-50%,-50%);transition:transform .25s var(--ease)}
.faq-i::after{transform:translate(-50%,-50%) rotate(90deg)}
.faq[open] .faq-i{background:var(--c-green);border-color:var(--c-green)}
.faq[open] .faq-i::after{transform:translate(-50%,-50%) rotate(0)}
.faq-a{padding:0 var(--sp-12) var(--sp-6) 0}
.faq-a p{color:var(--c-ink-2)}

/* ---- Service responsive ---- */
@media (max-width:1180px){
  .jr{grid-template-columns:repeat(3,1fr);row-gap:var(--sp-8)}
  .jr li:nth-child(3)::before{right:0}
  .chain.n-6,.chain.n-7{grid-template-columns:repeat(3,1fr);row-gap:var(--sp-5)}
  .chain.n-5{grid-template-columns:repeat(3,1fr);row-gap:var(--sp-5)}
  .chain li:nth-child(3n)::after{display:none}
  .pr-row.n-5,.pr-row.n-6{grid-template-columns:repeat(3,1fr);row-gap:var(--sp-8)}
  .pr-row li:nth-child(3)::before{right:0}
  .pr-list li{grid-template-columns:90px 200px 1fr}
  .rhythm{grid-template-columns:repeat(4,1fr)}
}
@media (max-width:1024px){
  .why-grid,.faq-grid{grid-template-columns:minmax(0,1fr)}
  .pb-list,.wd-index{grid-template-columns:1fr}
  .pr-row.n-4{grid-template-columns:repeat(2,1fr);row-gap:var(--sp-8)}
  .pr-row li:nth-child(2)::before{right:0}
  .mk-split{grid-template-columns:160px 1fr}
}
@media (max-width:767px){
  .jr,.chain.n-5,.chain.n-6,.chain.n-7,.pr-row.n-4,.pr-row.n-5,.pr-row.n-6{grid-template-columns:1fr}
  .jr li{padding:0 0 0 var(--sp-8)}
  .jr li::before{top:0;bottom:calc(var(--sp-8) * -1);left:6px;right:auto;width:2px;height:auto}
  .jr li:last-child::before{display:none}
  .pr-row li{padding:0 0 0 var(--sp-8)}
  .pr-row li::before{top:0;bottom:calc(var(--sp-8) * -1);left:6px;right:auto;width:2px;height:auto;background:var(--c-green)}
  .pr-row li:last-child::before{display:none}
  .chain li::after{display:none}
  .chain li:not(:last-child)::before{content:"";position:absolute;left:var(--sp-6);bottom:calc(var(--sp-2) * -1);width:2px;height:var(--sp-2);background:var(--c-green-ink)}
  .pr-list li{grid-template-columns:1fr;gap:var(--sp-2)}
  .pb-table li,.pb-th{grid-template-columns:1fr;gap:var(--sp-2)}
  .pb-th{display:none}
  .pb-table li::before{display:none}
  .why{grid-template-columns:1fr}
  .who a{grid-template-columns:1fr 20px;row-gap:var(--sp-1)}
  .who span{grid-column:1}
  .who .arr{grid-row:1;grid-column:2}
  .mk-kpis{grid-template-columns:1fr 1fr}
  .mk-kpi:last-child{grid-column:span 2}
  .mk-split{grid-template-columns:1fr}
  .soc{justify-self:stretch;max-width:none;aspect-ratio:4/5}
  .mk-split .phone{max-width:200px;justify-self:center}
  .rhythm{grid-template-columns:repeat(2,1fr)}
  .ms-photo{aspect-ratio:16/10}
  .faq-a{padding-right:0}
  .mk-bars li{grid-template-columns:80px 1fr 44px}
  .mk-tbl{font-size:var(--fs-micro)}
  .formats{gap:var(--sp-4)}
  .fmt.h i{width:160px;height:90px}
}

/* ==========================================================
   INDUSTRIES — landing page components
   ========================================================== */
/* Hero: eight journeys converging into one growth path */
.converge{position:relative;height:440px;background:var(--c-panel);border:1px solid var(--c-rule-d);border-radius:var(--r-lg);overflow:hidden}
.converge svg{position:absolute;inset:0;width:100%;height:100%}
.cv-in path{fill:none;stroke:var(--c-line-strong);stroke-width:1.5;stroke-dasharray:1;stroke-dashoffset:1;animation:draw 1.4s var(--ease) forwards}
.cv-in path:nth-child(2){animation-delay:.08s}.cv-in path:nth-child(3){animation-delay:.16s}.cv-in path:nth-child(4){animation-delay:.24s}
.cv-in path:nth-child(5){animation-delay:.32s}.cv-in path:nth-child(6){animation-delay:.4s}.cv-in path:nth-child(7){animation-delay:.48s}.cv-in path:nth-child(8){animation-delay:.56s}
.cv-out{fill:none;stroke:var(--c-green);stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1;animation:draw 1.2s 1.3s var(--ease) forwards}
.cv-tip{opacity:0;animation:fade .4s 2.3s forwards}
.cv-lbl{position:absolute;transform:translateY(-50%);font-size:var(--fs-micro);font-weight:600;color:var(--c-soft);white-space:nowrap;padding-left:var(--sp-4)}
.cv-out-lbl{position:absolute;font-size:var(--fs-small);font-weight:700;color:var(--c-white);white-space:nowrap;opacity:0;animation:rise .5s var(--ease) forwards}
.cv-out-lbl::before{content:"";display:inline-block;width:8px;height:8px;border-radius:var(--r-round);background:var(--c-green);margin-right:var(--sp-2);vertical-align:middle}
.cv-out-lbl.l1{animation-delay:1.6s}.cv-out-lbl.l2{animation-delay:1.9s}.cv-out-lbl.l3{animation-delay:2.2s;color:var(--c-green)}
.cv-out-lbl.end{text-align:right}

/* Buying factors (spectrum rows) */
.statement{font-size:var(--fs-h2);font-weight:800;letter-spacing:-.035em;line-height:1.05;max-width:18ch}
.statement em{font-style:normal;color:var(--c-green-ink)}
.factors{display:grid;grid-template-columns:1fr 1fr;gap:0 var(--sp-col-gap);border-top:2px solid var(--c-ink)}
.factors li{padding:var(--sp-5) 0;border-bottom:1px solid var(--c-rule-l)}
.f-name{display:block;font-weight:700;margin-bottom:var(--sp-3)}
.f-scale{display:grid;grid-template-columns:auto 1fr auto;gap:var(--sp-3);align-items:center;font-size:var(--fs-micro);color:var(--c-ink-2)}
.f-bar{position:relative;height:6px;border-radius:var(--r-sm);background:linear-gradient(90deg,var(--c-rule-l),var(--c-green-ink))}
.f-mark{position:absolute;top:50%;width:18px;height:18px;border-radius:var(--r-round);background:var(--c-white);border:3px solid var(--c-ink);transform:translate(-50%,-50%);transition:left .6s var(--ease)}
.f-mark.p1{left:6%}.f-mark.p2{left:28%}.f-mark.p3{left:50%}.f-mark.p4{left:72%}.f-mark.p5{left:94%}
.f-chips{display:flex;flex-wrap:wrap;gap:var(--sp-2)}
.f-chips span{padding:var(--sp-half) var(--sp-3);border:1px solid var(--c-ink);border-radius:var(--r-sm);font-size:var(--fs-micro);font-weight:600;color:var(--c-ink)}
.f-value{display:inline-block;padding:var(--sp-1) var(--sp-3);border-radius:var(--r-sm);background:var(--c-dark);color:var(--c-green);font-weight:700;font-size:var(--fs-small)}

/* Directory: editorial 12-column composition */
.dir{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--sp-4)}
.d-tile{position:relative;display:flex;flex-direction:column;justify-content:flex-end;min-height:340px;border-radius:var(--r-lg);overflow:hidden;text-decoration:none;color:var(--c-white);background:var(--c-panel);isolation:isolate;transition:transform .3s var(--ease)}
.d-tile:hover{transform:translateY(-3px)}
.d-tile.s7{grid-column:span 7}.d-tile.s5{grid-column:span 5}.d-tile.s4{grid-column:span 4}.d-tile.s12{grid-column:span 12;min-height:300px}
.d-tile.lt{background:var(--c-white);color:var(--c-ink);border:1px solid var(--c-rule-l)}
.d-tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;filter:grayscale(.35) contrast(1.05);transition:transform .8s var(--ease)}
.d-tile:hover img{transform:scale(1.04)}
.d-tile.ph::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,color-mix(in srgb,var(--c-black) 15%,transparent) 0%,color-mix(in srgb,var(--c-black) 88%,transparent) 70%)}
.d-art{position:absolute;inset:0;z-index:-1;width:100%;height:60%}
.d-body{padding:var(--sp-card)}
.d-num{font-size:var(--fs-micro);font-variant-numeric:tabular-nums;color:var(--c-muted)}
.d-tile.lt .d-num{color:var(--c-ink-2)}
.d-tile h3{font-size:var(--fs-h3);margin:var(--sp-2) 0}
.d-tile p{color:var(--c-soft);max-width:36ch}
.d-tile.lt p{color:var(--c-ink-2)}
.d-steps{display:flex;flex-wrap:wrap;gap:var(--sp-1) var(--sp-2);margin-top:var(--sp-4);font-size:var(--fs-micro);color:var(--c-soft)}
.d-tile.lt .d-steps{color:var(--c-ink-2)}
.d-steps span:not(:last-child)::after{content:"→";margin-left:var(--sp-2);color:var(--c-green)}
.d-tile.lt .d-steps span:not(:last-child)::after{color:var(--c-green-ink)}
.d-go{display:inline-flex;align-items:center;gap:var(--sp-2);margin-top:var(--sp-5);font-weight:700;font-size:var(--fs-small)}
.d-go .arr{width:14px;height:14px;transition:transform .25s var(--ease)}
.d-tile:hover .d-go .arr{transform:translate(3px,-3px)}
.d-tile::after{content:"";position:absolute;left:0;bottom:0;height:3px;width:100%;background:var(--c-green);transform:scaleX(0);transform-origin:left;transition:transform .45s var(--ease)}
.d-tile:hover::after,.d-tile:focus-visible::after{transform:scaleX(1)}

/* Comparison lanes: different journeys, one growth path */
.lanes{border-top:1px solid var(--c-rule-d)}
.lane{display:grid;grid-template-columns:220px 1fr;gap:var(--sp-6);align-items:center;padding:var(--sp-5) 0;border-bottom:1px solid var(--c-rule-d)}
.ln-name{font-weight:700;display:flex;align-items:center;gap:var(--sp-2)}
.ln-name a{text-decoration:none}
.ln-name a:hover{color:var(--c-green)}
.ln-steps{position:relative;display:grid;grid-template-columns:repeat(5,1fr);gap:var(--sp-2)}
.ln-steps::before{content:"";position:absolute;left:0;top:50%;height:2px;width:100%;background:var(--c-line-strong);transform-origin:left;transform:scaleX(0);transition:transform 1.1s var(--ease)}
.ln-steps.n-4::before{width:78%}
.lanes.in .ln-steps::before{transform:scaleX(1)}
.ln-steps li{position:relative;z-index:1;text-align:center;padding:var(--sp-2) var(--sp-2);border-radius:var(--r-sm);background:var(--c-black);border:1px solid var(--c-rule-d);font-size:var(--fs-small);color:var(--c-soft);opacity:0;transform:translateY(6px);transition:opacity .5s var(--ease),transform .5s var(--ease)}
.lanes.in .ln-steps li{opacity:1;transform:none}
.ln-steps li:nth-child(2){transition-delay:.12s}.ln-steps li:nth-child(3){transition-delay:.24s}.ln-steps li:nth-child(4){transition-delay:.36s}.ln-steps li:nth-child(5){transition-delay:.48s}
.ln-steps li.cv{border-color:var(--c-green);color:var(--c-white)}
.ln-steps li.win{background:var(--c-green);border-color:var(--c-green);color:var(--c-black);font-weight:700}
.lane-key{display:flex;flex-wrap:wrap;gap:var(--sp-6);margin-top:var(--sp-6);font-size:var(--fs-small);color:var(--c-soft)}
.lane-key span{display:flex;align-items:center;gap:var(--sp-2)}
.lane-key i{width:14px;height:14px;border-radius:var(--r-xs);border:1px solid var(--c-green)}
.lane-key i.w{background:var(--c-green)}

/* Channel matrix */
.tbl-scroll{position:relative;overflow-x:auto;border:1px solid var(--c-rule-l);border-radius:var(--r-lg);background:var(--c-white)}
.matrix{width:100%;border-collapse:collapse;min-width:880px}
.matrix th,.matrix td{padding:var(--sp-4) var(--sp-3);border-bottom:1px solid var(--c-rule-l);text-align:center;font-size:var(--fs-small)}
.matrix thead th{font-weight:700;color:var(--c-ink);vertical-align:bottom}
.matrix thead th a{text-decoration:none;border-bottom:1px solid var(--c-rule-l)}
.matrix thead th a:hover{color:var(--c-green-ink);border-color:var(--c-green-ink)}
.matrix th[scope="row"]{text-align:left;font-weight:700;position:sticky;left:0;background:var(--c-white);z-index:1;white-space:nowrap}
.matrix th[scope="row"] a{text-decoration:none}
.matrix tbody tr:hover td,.matrix tbody tr:hover th{background:var(--c-light)}
.dot{display:inline-block;width:14px;height:14px;border-radius:var(--r-round);vertical-align:middle}
.dot.d2{background:var(--c-green-ink)}
.dot.d1{border:2px solid var(--c-green-ink)}
.dot.d0{width:6px;height:6px;background:var(--c-rule-l)}
.m-key{display:flex;flex-wrap:wrap;gap:var(--sp-6);margin-top:var(--sp-4);font-size:var(--fs-small);color:var(--c-ink-2)}
.m-key span{display:flex;align-items:center;gap:var(--sp-2)}

/* Journey switcher */
.jsw-tabs{display:flex;flex-wrap:wrap;gap:var(--sp-2);margin:var(--sp-block) 0 var(--sp-8)}
.jsw-tabs button{padding:var(--sp-2) var(--sp-4);border:1px solid var(--c-rule-d);border-radius:var(--r-sm);font-size:var(--fs-small);font-weight:600;color:var(--c-soft);transition:border-color .2s,color .2s,background-color .2s}
.jsw-tabs button:hover{border-color:var(--c-white);color:var(--c-white)}
.jsw-tabs button[aria-pressed="true"]{background:var(--c-green);border-color:var(--c-green);color:var(--c-black)}
.jsw{display:grid;grid-template-columns:repeat(7,1fr);gap:var(--sp-3)}
.jsw li{position:relative;padding:var(--sp-10) var(--sp-3) var(--sp-4) 0}
.jsw li::before{content:"";position:absolute;top:6px;left:0;right:calc(var(--sp-3) * -1);height:2px;background:var(--c-green)}
.jsw li:last-child::before{right:0}
.jsw li::after{content:"";position:absolute;top:0;left:0;width:14px;height:14px;border-radius:var(--r-round);background:var(--c-green);box-shadow:0 0 0 6px var(--c-green-tint)}
.jsw strong{display:block;font-size:var(--fs-h4);letter-spacing:-.02em}
.jsw span{display:block;margin-top:var(--sp-2);font-size:var(--fs-small);color:var(--c-soft);min-height:3em}
.jsw li.key{background:var(--c-panel);border-radius:var(--r-md);padding-left:var(--sp-3);outline:1px solid var(--c-green)}
.jsw li.key::after{left:var(--sp-3)}
.jsw li.key span{color:var(--c-green);font-weight:700}
.jsw-note{margin-top:var(--sp-6);color:var(--c-soft);max-width:60ch}

/* Economics: same metric, different meaning */
.econ{border-top:2px solid var(--c-ink)}
.econ li{display:grid;grid-template-columns:260px 1fr 1fr;gap:var(--sp-6);align-items:stretch;padding:var(--sp-6) 0;border-bottom:1px solid var(--c-rule-l)}
.econ .metric{font-size:var(--fs-h3);font-weight:800;letter-spacing:-.04em;line-height:1}
.econ .metric small{display:block;font-size:var(--fs-small);font-weight:500;letter-spacing:0;color:var(--c-ink-2);margin-top:var(--sp-2)}
.econ .case{border-radius:var(--r-md);padding:var(--sp-5);background:var(--c-light)}
.econ .case b{display:block;font-size:var(--fs-small);margin-bottom:var(--sp-1)}
.econ .case p{color:var(--c-ink-2);font-size:var(--fs-ui)}
.econ .case.good{background:var(--c-dark);color:var(--c-white)}
.econ .case.good b{color:var(--c-green)}
.econ .case.good p{color:var(--c-soft)}
.econ-note{margin-top:var(--sp-4);font-size:var(--fs-small);color:var(--c-ink-2)}

/* Previews: larger editorial cards */
.pv-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-6)}
.pv{display:grid;grid-template-rows:auto 1fr;background:var(--c-white);border:1px solid var(--c-rule-l);border-radius:var(--r-lg);overflow:hidden}
.pv-top{position:relative;height:140px;background:var(--c-dark);overflow:hidden}
.pv-top img{width:100%;height:100%;object-fit:cover;filter:grayscale(.4) brightness(.6)}
.pv-top svg{position:absolute;inset:0;width:100%;height:100%}
.pv-top .pv-name{position:absolute;left:var(--sp-6);bottom:var(--sp-4);color:var(--c-white);font-size:var(--fs-h3);font-weight:700;letter-spacing:-.02em;margin:0}
.pv-body{padding:var(--sp-6);display:flex;flex-direction:column;gap:var(--sp-4)}
.pv-body .pos{font-weight:700;font-size:var(--fs-body)}
.pv dl{display:grid;gap:var(--sp-3)}
.pv dl div{display:grid;grid-template-columns:130px 1fr;gap:var(--sp-3);padding-top:var(--sp-3);border-top:1px solid var(--c-rule-l)}
.pv dt{font-size:var(--fs-micro);color:var(--c-ink-2);font-weight:600}
.pv dd{margin:0;font-size:var(--fs-ui);color:var(--c-ink)}
.pv dd a{color:var(--c-ink);text-decoration:underline;text-decoration-color:var(--c-rule-l);text-underline-offset:3px}
.pv dd a:hover{text-decoration-color:var(--c-green-ink)}
.pv .tlink{align-self:flex-start;margin-top:auto}

/* Closing statement */
.closing-st{font-size:var(--fs-display);font-weight:800;letter-spacing:-.045em;line-height:1}
.closing-st span{display:block;color:var(--c-muted)}
.closing-st span.one{color:var(--c-white);margin-top:var(--sp-4)}
.closing-st span.tag{color:var(--c-green);font-size:var(--fs-h2);margin-top:var(--sp-8);letter-spacing:-.03em}

/* ==========================================================
   INDIVIDUAL INDUSTRY PAGES
   ========================================================== */
.ivis{position:relative;min-height:460px}
.ivis figure{margin:0;position:absolute;inset:0;overflow:hidden;background:var(--c-panel)}
.ivis.cut-a figure{clip-path:polygon(12% 0,100% 0,100% 88%,88% 100%,0 100%,0 14%)}
.ivis.cut-b figure{clip-path:polygon(0 0,86% 0,100% 16%,100% 100%,14% 100%,0 86%)}
.ivis figure img{width:100%;height:100%;object-fit:cover;filter:grayscale(.3) contrast(1.05)}
.ivis figure::after{content:"";position:absolute;inset:0;background:linear-gradient(200deg,transparent 30%,color-mix(in srgb,var(--c-black) 75%,transparent))}
.ivis .accent{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:1}
.ivis .accent path{fill:none;stroke:var(--c-green);stroke-width:2.5;stroke-dasharray:1;stroke-dashoffset:1;animation:draw 1.8s .5s var(--ease) forwards}
.icard{position:absolute;left:calc(var(--sp-6) * -1);bottom:var(--sp-8);z-index:2;background:color-mix(in srgb,var(--c-black) 94%,transparent);border:1px solid var(--c-rule-d);border-radius:var(--r-md);padding:var(--sp-4) var(--sp-5);min-width:260px;box-shadow:0 20px 40px -20px color-mix(in srgb,var(--c-shadow) 80%,transparent);opacity:0;animation:rise .6s 1s var(--ease) forwards}
.icard small{display:block;font-size:var(--fs-micro);color:var(--c-muted)}
.icard b{display:block;color:var(--c-green);font-size:var(--fs-h4);letter-spacing:-.02em;margin:var(--sp-1) 0 var(--sp-3)}
.icard ol{display:flex;gap:var(--sp-1);align-items:center}
.icard ol li{flex:1;height:6px;border-radius:var(--r-sm);background:var(--c-line-strong)}
.icard ol li.on{background:var(--c-green)}
.icard ol li.cv{background:var(--c-green);box-shadow:0 0 0 3px var(--c-green-tint)}

/* Conversion journey: rising step cards */
.path{display:grid;gap:var(--sp-3);align-items:end}
.path.n-4{grid-template-columns:repeat(4,1fr)}.path.n-5{grid-template-columns:repeat(5,1fr)}
.path li{position:relative;background:var(--c-panel);border:1px solid var(--c-rule-d);border-radius:var(--r-md);padding:var(--sp-5);display:flex;flex-direction:column;gap:var(--sp-2)}
.path li:nth-child(1){min-height:180px}.path li:nth-child(2){min-height:220px}.path li:nth-child(3){min-height:260px}.path li:nth-child(4){min-height:300px}.path li:nth-child(5){min-height:340px}
.path li::after{content:"";position:absolute;right:calc(var(--sp-3) * -1);bottom:var(--sp-6);width:var(--sp-3);height:2px;background:var(--c-green)}
.path li:last-child::after{display:none}
.path .pn{font-size:var(--fs-micro);color:var(--c-muted);font-variant-numeric:tabular-nums}
.path h3{font-size:var(--fs-h4)}
.path p{font-size:var(--fs-small);color:var(--c-soft);line-height:1.5}
.path li.cv{border-color:var(--c-green)}
.path li.cv .pn{color:var(--c-green)}
.path li.cv h3::after{content:"Conversion point";display:block;font-size:var(--fs-micro);font-weight:700;color:var(--c-green);letter-spacing:0;margin-top:var(--sp-1)}
.path li:last-child{background:var(--c-green);border-color:var(--c-green);color:var(--c-black)}
.path li:last-child .pn,.path li:last-child p{color:var(--c-dark)}

/* Channel mix */
.mix{border-top:1px solid var(--c-rule-d)}
.mix li{display:grid;grid-template-columns:240px 200px 1fr;gap:var(--sp-6);align-items:center;padding:var(--sp-5) 0;border-bottom:1px solid var(--c-rule-d)}
.mix a{font-weight:700;text-decoration:none;display:inline-flex;align-items:center;gap:var(--sp-2)}
.mix a .arr{width:14px;height:14px;opacity:.5;transition:transform .25s var(--ease),opacity .25s}
.mix a:hover{color:var(--c-green)}
.mix a:hover .arr{opacity:1;transform:translate(3px,-3px)}
.lvl{display:grid;gap:var(--sp-2)}
.lvl small{font-size:var(--fs-micro);color:var(--c-muted);font-weight:600}
.lvl .bars{display:flex;gap:var(--sp-1)}
.lvl .bars i{height:8px;flex:1;border-radius:var(--r-sm);background:var(--c-line-strong)}
.lvl.l3 .bars i,.lvl.l2 .bars i:nth-child(-n+2),.lvl.l1 .bars i:first-child{background:var(--c-green)}
.lvl.l3 small{color:var(--c-green)}
.mix p{color:var(--c-soft);font-size:var(--fs-ui)}

/* Case study link */
.ccase{display:grid;grid-template-columns:1.2fr 1fr;gap:var(--sp-col-gap);align-items:center;background:var(--c-panel);border:1px solid var(--c-rule-d);border-radius:var(--r-lg);padding:var(--sp-card);text-decoration:none;color:var(--c-white);transition:border-color .3s}
a.ccase:hover{border-color:var(--c-green)}
.ccase .k{font-size:var(--fs-small);color:var(--c-muted)}
.ccase h3{font-size:var(--fs-h3);margin:var(--sp-3) 0}
.ccase p{color:var(--c-soft)}
.ccase .big{font-size:var(--fs-stat);font-weight:800;letter-spacing:-.05em;line-height:1;color:var(--c-green)}
.ccase .big small{display:block;font-size:var(--fs-small);font-weight:500;letter-spacing:0;color:var(--c-soft);margin-top:var(--sp-2)}
.ccase .tlink{margin-top:var(--sp-5)}
.nocase{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-col-gap);align-items:start}
.nocase ul{display:grid;gap:var(--sp-3)}
.nocase ul a{display:flex;justify-content:space-between;align-items:center;gap:var(--sp-4);padding:var(--sp-4) var(--sp-5);border:1px solid var(--c-rule-d);border-radius:var(--r-md);text-decoration:none;transition:border-color .25s}
.nocase ul a:hover{border-color:var(--c-green)}
.nocase ul a span{color:var(--c-soft);font-size:var(--fs-small)}
.nocase ul a b{color:var(--c-green);white-space:nowrap}

/* Related industries */
.rind{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:var(--sp-4)}
.rind a{display:flex;flex-direction:column;gap:var(--sp-2);padding:var(--sp-6);border-radius:var(--r-lg);background:var(--c-dark);color:var(--c-white);text-decoration:none;position:relative;overflow:hidden;min-height:170px;transition:transform .3s var(--ease)}
.rind a:hover{transform:translateY(-3px)}
.rind a::after{content:"";position:absolute;left:0;bottom:0;height:3px;width:100%;background:var(--c-green);transform:scaleX(0);transform-origin:left;transition:transform .45s var(--ease)}
.rind a:hover::after{transform:scaleX(1)}
.rind strong{font-size:var(--fs-h4)}
.rind span{color:var(--c-soft);font-size:var(--fs-ui)}
.rind .arr{position:absolute;right:var(--sp-6);top:var(--sp-6);width:16px;height:16px;color:var(--c-green)}

/* ---- Industries responsive ---- */
@media (max-width:1180px){
  .jsw{grid-template-columns:repeat(4,1fr);row-gap:var(--sp-6)}
  .jsw li:nth-child(4)::before{right:0}
  .econ li{grid-template-columns:200px 1fr 1fr}
  .mix li{grid-template-columns:200px 160px 1fr}
}
@media (max-width:1024px){
  .factors,.pv-grid,.nocase,.ccase{grid-template-columns:minmax(0,1fr)}
  .d-tile.s7,.d-tile.s5,.d-tile.s4{grid-column:span 6}
  .d-tile.s12{grid-column:span 12}
  .lane{grid-template-columns:1fr;gap:var(--sp-3)}
  .econ li{grid-template-columns:1fr 1fr}
  .econ .metric{grid-column:1/-1}
  .path.n-4,.path.n-5{grid-template-columns:repeat(2,1fr);align-items:stretch}
  .path li:nth-child(n){min-height:0}
  .path li::after{display:none}
  .icard{left:var(--sp-4)}
  .ivis{min-height:380px}
}
@media (max-width:767px){
  .dir{grid-template-columns:1fr}
  .d-tile.s7,.d-tile.s5,.d-tile.s4,.d-tile.s12{grid-column:auto;min-height:300px}
  .ln-steps{display:flex;flex-wrap:wrap;gap:var(--sp-2)}
  .ln-steps::before{display:none}
  .ln-steps li{padding:var(--sp-1) var(--sp-3)}
  .jsw{grid-template-columns:1fr;row-gap:0}
  .jsw li{padding:0 0 var(--sp-5) var(--sp-8)}
  .jsw li::before{top:0;bottom:0;left:6px;right:auto;width:2px;height:auto}
  .jsw li.key{padding:var(--sp-3) var(--sp-3) var(--sp-3) var(--sp-8)}
  .jsw li.key::after{left:0}
  .jsw span{min-height:0}
  .econ li{grid-template-columns:1fr}
  .path.n-4,.path.n-5{grid-template-columns:1fr}
  .mix li{grid-template-columns:1fr;gap:var(--sp-2)}
  .pv dl div{grid-template-columns:1fr;gap:var(--sp-1)}
  .converge{height:400px}
  .cv-lbl{padding-left:var(--sp-3)}
  .ivis{min-height:320px}
  .ivis.cut-a figure,.ivis.cut-b figure{clip-path:polygon(0 0,100% 0,100% 90%,90% 100%,0 100%)}
  .icard{left:var(--sp-3);right:var(--sp-3);min-width:0;bottom:var(--sp-4)}
}

.on-light .wd-cards li{background:var(--c-white)}

/* ==========================================================
   PROCESS / ABOUT / CONTACT — components (tokens only)
   ========================================================== */
/* Process hero: business to reinvestment, rising */
.pchain{position:relative;background:var(--c-panel);border:1px solid var(--c-rule-d);border-radius:var(--r-lg);padding:var(--sp-8) var(--sp-6)}
.pchain .gp-svg{z-index:0}
.pchain .gp-base{stroke:transparent}
.pchain ol{position:relative;z-index:1;display:flex;flex-direction:column-reverse;gap:var(--sp-4)}
.pchain li{display:flex;align-items:center;gap:var(--sp-3);font-size:var(--fs-small);font-weight:600;color:var(--c-soft);opacity:0;animation:rise .5s var(--ease) forwards}
.pchain li:nth-child(2){margin-left:10%;animation-delay:.12s}.pchain li:nth-child(3){margin-left:20%;animation-delay:.24s}.pchain li:nth-child(4){margin-left:30%;animation-delay:.36s}
.pchain li:nth-child(5){margin-left:40%;animation-delay:.48s}.pchain li:nth-child(6){margin-left:50%;animation-delay:.6s}.pchain li:nth-child(7){margin-left:60%;animation-delay:.72s;color:var(--c-green);font-size:var(--fs-ui)}
.pchain .gp-dot{flex:none;width:12px;height:12px;border-radius:var(--r-round);background:var(--c-green);box-shadow:0 0 0 5px var(--c-green-tint)}
.pchain li:nth-child(-n+3) .gp-dot{background:var(--c-white);box-shadow:0 0 0 5px var(--c-line-faint)}
.pchain li:nth-child(7) .gp-dot{width:18px;height:18px}
.pchain .zone{position:absolute;right:var(--sp-6);font-size:var(--fs-micro);color:var(--c-muted);z-index:1}
.pchain .zone.a{bottom:var(--sp-8)}.pchain .zone.b{top:var(--sp-8);right:auto;left:var(--sp-6);color:var(--c-green)}

/* Intro: every piece has a job */
.jobs{border-top:2px solid var(--c-ink)}
.jobs li{display:grid;grid-template-columns:180px 40px 1fr;gap:var(--sp-4);align-items:center;padding:var(--sp-4) 0;border-bottom:1px solid var(--c-rule-l)}
.jobs b{font-size:var(--fs-body)}
.jobs svg{width:24px;height:12px}
.jobs span{color:var(--c-ink-2)}
.intro-links{display:flex;flex-wrap:wrap;gap:var(--sp-6);margin-top:var(--sp-8)}

/* Steps */
.sb-grid > *,.aud-rows span,.bmap{min-width:0}
.step-band .sb-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:var(--sp-col-gap);align-items:center}
.step-band.flip .sb-copy{order:2}
.sb-num{display:block;font-size:var(--fs-display);font-weight:800;letter-spacing:-.05em;line-height:.9;color:var(--c-green-ink)}
.on-dark .sb-num,.on-black .sb-num{color:var(--c-green)}
.sb-copy h2{font-size:var(--fs-h2);margin:var(--sp-3) 0 var(--sp-5)}
.sb-copy p{max-width:48ch}
.on-light .sb-copy p,.on-white .sb-copy p{color:var(--c-ink-2)}
.on-dark .sb-copy p,.on-black .sb-copy p{color:var(--c-soft)}
.sb-tags{display:flex;flex-wrap:wrap;gap:var(--sp-2);margin-top:var(--sp-6)}
.sb-tags li{padding:var(--sp-1) var(--sp-3);border:1px solid var(--c-ink);border-radius:var(--r-sm);font-size:var(--fs-small);font-weight:600}
.on-dark .sb-tags li,.on-black .sb-tags li{border-color:var(--c-rule-d);color:var(--c-soft)}
.step-rail{position:sticky;top:calc(var(--header-h) + var(--sp-2));z-index:5;background:var(--c-white);border-bottom:1px solid var(--c-rule-l)}
.site-header.scrolled ~ main .step-rail{top:68px}
.step-rail ol{display:flex;gap:var(--sp-1);overflow-x:auto;scrollbar-width:none;padding:var(--sp-2) 0}
.step-rail a{display:flex;gap:var(--sp-2);align-items:center;padding:var(--sp-2) var(--sp-3);border-radius:var(--r-sm);font-size:var(--fs-small);font-weight:600;color:var(--c-ink-2);text-decoration:none;white-space:nowrap}
.step-rail a span{font-variant-numeric:tabular-nums;color:var(--c-green-ink)}
.step-rail a:hover{background:var(--c-light);color:var(--c-ink)}

/* 01 Business map */
.bmap{position:relative;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);gap:var(--sp-4);height:380px}
.bmap ul{display:contents}
.bmap svg{position:absolute;inset:0;width:100%;height:100%;z-index:0}
.bmap svg path{stroke:var(--c-rule-l);stroke-width:1.5;fill:none;stroke-dasharray:4 5}
.bmap li{position:relative;z-index:1;align-self:center;justify-self:center;background:var(--c-white);border:1px solid var(--c-rule-l);border-radius:var(--r-md);padding:var(--sp-3) var(--sp-4);font-size:var(--fs-small);font-weight:600;text-align:center}
.bmap li.hub{background:var(--c-dark);color:var(--c-white);border-color:var(--c-dark);padding:var(--sp-5) var(--sp-5);font-size:var(--fs-ui)}
.bmap li.hub small{display:block;font-weight:500;color:var(--c-green);font-size:var(--fs-micro)}
.bmap .b1{grid-area:1/1}.bmap .b2{grid-area:1/2}.bmap .b3{grid-area:1/3}.bmap .b4{grid-area:2/1}.bmap .hub{grid-area:2/2}.bmap .b5{grid-area:2/3}.bmap .b6{grid-area:3/2}

/* 02 Audit */
.aud{position:relative;padding:var(--sp-10) 0 0 var(--sp-10)}
.aud-ph{margin:0;position:absolute;left:0;top:0;width:62%;height:72%;border-radius:var(--r-lg);overflow:hidden;background:var(--c-dark)}
.aud-ph img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) brightness(.55)}
.aud .mk{position:relative}
.aud-rows li{display:grid;grid-template-columns:1fr auto;gap:var(--sp-3);align-items:center;padding:var(--sp-3) 0;border-top:1px solid var(--c-rule-d)}
.aud-rows span{color:var(--c-soft)}
.aud-rows small{display:block;font-size:var(--fs-micro);color:var(--c-muted)}
.st{font-style:normal;font-size:var(--fs-micro);font-weight:700;padding:var(--sp-half) var(--sp-2);border-radius:var(--r-sm);white-space:nowrap}
.st.ok{background:var(--c-green);color:var(--c-black)}
.st.leak{background:var(--c-white);color:var(--c-black)}
.st.gap{border:1px solid var(--c-muted);color:var(--c-soft)}

/* 03 Build: stacked system */
.bricks{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-3);position:relative}
.bricks li{background:var(--c-white);border:1px solid var(--c-rule-l);border-radius:var(--r-md);padding:var(--sp-5);font-weight:700;opacity:0;transform:translateY(-14px);transition:opacity .5s var(--ease),transform .5s var(--ease)}
.bricks.in li{opacity:1;transform:none}
.bricks li small{display:block;font-weight:500;font-size:var(--fs-micro);color:var(--c-ink-2);margin-top:var(--sp-1)}
.bricks .w2{grid-column:span 2}.bricks .w3{grid-column:span 3}
.bricks .base{background:var(--c-dark);color:var(--c-white);border-color:var(--c-dark)}
.bricks .base small{color:var(--c-soft)}
.bricks .track{border-color:var(--c-green-ink);box-shadow:inset 0 -3px 0 var(--c-green-ink)}
.bricks li:nth-child(1){transition-delay:.6s}.bricks li:nth-child(2){transition-delay:.7s}.bricks li:nth-child(3){transition-delay:.8s}
.bricks li:nth-child(4){transition-delay:.3s}.bricks li:nth-child(5){transition-delay:.4s}.bricks li:nth-child(6){transition-delay:0s}

/* 04 Launch */
.launch .mk-head{margin-bottom:var(--sp-2)}
.live{display:inline-flex;align-items:center;gap:var(--sp-2);font-size:var(--fs-micro);font-weight:700;color:var(--c-green)}
.live::before{content:"";width:8px;height:8px;border-radius:var(--r-round);background:var(--c-green);animation:pulse-live 1.8s ease-out infinite}
@keyframes pulse-live{0%{box-shadow:0 0 0 0 var(--c-green-tint)}70%{box-shadow:0 0 0 10px transparent}100%{box-shadow:0 0 0 0 transparent}}
.checks li{display:grid;grid-template-columns:24px 1fr auto;gap:var(--sp-3);align-items:center;padding:var(--sp-3) 0;border-top:1px solid var(--c-rule-d);color:var(--c-soft)}
.checks li small{color:var(--c-muted);font-size:var(--fs-micro)}
.checks svg{width:20px;height:20px}
.checks svg path{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset .5s var(--ease)}
.launch.in .checks svg path{stroke-dashoffset:0}
.checks li:nth-child(2) path{transition-delay:.2s}.checks li:nth-child(3) path{transition-delay:.4s}.checks li:nth-child(4) path{transition-delay:.6s}.checks li:nth-child(5) path{transition-delay:.8s}
.launch .mk-spark path{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.4s 1s var(--ease)}
.launch.in .mk-spark path{stroke-dashoffset:0}

/* 05 Optimise */
.opt{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-3);align-items:end}
.opt li{display:flex;flex-direction:column;gap:var(--sp-3)}
.opt .bars{display:flex;align-items:flex-end;gap:var(--sp-2);height:180px;background:var(--c-light);border-radius:var(--r-md);padding:var(--sp-3)}
.opt .bars i{flex:1;border-radius:var(--r-sm) var(--r-sm) 0 0;background:var(--c-ink-2);transform-origin:bottom;transform:scaleY(.1);transition:transform .8s var(--ease)}
.opt.in .bars i{transform:scaleY(1)}
.opt .bars i.g{background:var(--c-green-ink)}
.opt .h40{height:40%}.opt .h38{height:38%}.opt .h52{height:52%}.opt .h66{height:66%}
.opt li:nth-child(2) i{transition-delay:.2s}.opt li:nth-child(3) i{transition-delay:.4s}.opt li:nth-child(4) i{transition-delay:.6s}
.opt b{font-size:var(--fs-ui)}
.opt small{display:block;font-size:var(--fs-micro);color:var(--c-ink-2)}
.opt .lbl{display:flex;justify-content:space-around;font-size:var(--fs-micro);color:var(--c-ink-2);font-weight:700}

/* 06 Scale: the big moment */
#step-06 .sb-grid{grid-template-columns:1.45fr .55fr}
#step-06 .scale-vis{height:540px}
.scale-vis{position:relative;height:420px;border-radius:var(--r-lg);background:var(--c-panel);border:1px solid var(--c-rule-d);overflow:hidden}
.scale-vis svg{position:absolute;inset:0;width:100%;height:100%}
.scale-vis .sv-area{fill:var(--c-green);fill-opacity:.07}
.scale-vis .sv-line{fill:none;stroke:var(--c-green);stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 2.2s var(--ease)}
.scale-vis.in .sv-line{stroke-dashoffset:0}
.scale-vis .sv-grid path{stroke:var(--c-line-faint);stroke-width:1}
.sv-lbl{position:absolute;display:grid;gap:var(--sp-1);opacity:0;transform:translateY(8px);transition:opacity .5s var(--ease),transform .5s var(--ease)}
.scale-vis.in .sv-lbl{opacity:1;transform:none}
.sv-lbl b{font-size:var(--fs-h4);letter-spacing:-.02em}
.sv-lbl small{font-size:var(--fs-micro);color:var(--c-muted)}
.sv-lbl.l1{left:18%;bottom:24%;transition-delay:.8s}.sv-lbl.l2{left:46%;bottom:44%;transition-delay:1.3s}.sv-lbl.l3{right:6%;top:10%;transition-delay:1.8s;text-align:right}
.sv-lbl.l3 b{color:var(--c-green);font-size:var(--fs-h3)}

/* Loop */
.loop-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-col-gap);align-items:center}
.loop{position:relative;width:100%;max-width:520px;aspect-ratio:1;justify-self:center}
.loop svg{position:absolute;inset:0;width:100%;height:100%}
.loop .track{fill:none;stroke:var(--c-line-strong);stroke-width:.6;stroke-dasharray:1.5 2}
.loop .spin{transform-origin:50px 50px;animation:spin 14s linear infinite}
.loop .arc{fill:none;stroke:var(--c-green);stroke-width:1.2;stroke-linecap:round}
@keyframes spin{to{transform:rotate(360deg)}}
.loop li{position:absolute;transform:translate(-50%,-50%);background:var(--c-black);border:1px solid var(--c-rule-d);border-radius:var(--r-sm);padding:var(--sp-2) var(--sp-3);font-size:var(--fs-small);font-weight:700;white-space:nowrap;display:flex;gap:var(--sp-2)}
.loop li span{color:var(--c-green);font-variant-numeric:tabular-nums}
.loop .center{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);text-align:center;max-width:14ch}
.loop .center b{display:block;font-size:var(--fs-h4);color:var(--c-green)}
.loop .center small{color:var(--c-muted);font-size:var(--fs-small)}
.loop li.p0{left:50.0%;top:6.0%}.loop li.p1{left:88.1%;top:28.0%}.loop li.p2{left:88.1%;top:72.0%}.loop li.p3{left:50.0%;top:94.0%}.loop li.p4{left:11.9%;top:72.0%}.loop li.p5{left:11.9%;top:28.0%}

/* About: point of view track */
.pov{display:grid;grid-template-columns:repeat(6,1fr);gap:0;margin-top:var(--sp-block)}
.pov-ol{display:contents}
.pov .br{grid-row:1;font-size:var(--fs-small);font-weight:700;padding-bottom:var(--sp-3);margin-bottom:var(--sp-6);border-bottom:2px solid var(--c-line-strong);color:var(--c-muted)}
.pov .br.a{grid-column:1/3}
.pov .br.b{grid-column:3/7;border-color:var(--c-green);color:var(--c-green);margin-left:var(--sp-4)}
.pov li{grid-row:2;position:relative;padding:var(--sp-8) var(--sp-4) 0 0}
.pov li::before{content:"";position:absolute;top:6px;left:0;right:0;height:3px;background:var(--c-line-strong)}
.pov li.g::before{background:var(--c-green)}
.pov li::after{content:"";position:absolute;top:0;left:0;width:16px;height:16px;border-radius:var(--r-round);background:var(--c-black);border:3px solid var(--c-line-strong)}
.pov li.g::after{background:var(--c-green);border-color:var(--c-green)}
.pov li.click::after{width:22px;height:22px;top:-3px;background:var(--c-white);border-color:var(--c-white)}
.pov strong{display:block;font-size:var(--fs-h3);letter-spacing:-.02em}
.pov li:not(.g) strong{color:var(--c-muted)}
.pov small{display:block;margin-top:var(--sp-2);font-size:var(--fs-small);color:var(--c-soft)}

/* About: beliefs */
.beliefs2 li{display:grid;grid-template-columns:160px 1fr 1fr;gap:var(--sp-6);align-items:baseline;padding:var(--sp-8) 0;border-top:1px solid var(--c-rule-l)}
.beliefs2 li:last-child{border-bottom:1px solid var(--c-rule-l)}
.beliefs2 .n{font-size:var(--fs-display);font-weight:800;letter-spacing:-.05em;line-height:.85;color:var(--c-ink);transition:color .3s}
.beliefs2 li:hover .n{color:var(--c-green-ink)}
.beliefs2 h3{font-size:var(--fs-h3);letter-spacing:-.025em}
.beliefs2 p{color:var(--c-ink-2);max-width:40ch}

/* About: growth system network */
.net{position:relative;height:560px}
.net svg{position:absolute;inset:0;width:100%;height:100%}
.net svg path{fill:none;stroke:var(--c-line-strong);stroke-width:1.5;vector-effect:non-scaling-stroke}
.net svg path.g{stroke:var(--c-green);stroke-dasharray:4 5}
.net a{position:absolute;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:var(--sp-1);padding:var(--sp-3) var(--sp-5);background:var(--c-panel);border:1px solid var(--c-rule-d);border-radius:var(--r-md);text-decoration:none;text-align:center;transition:border-color .25s,transform .25s var(--ease)}
.net a:hover{border-color:var(--c-green);transform:translate(-50%,-50%) translateY(-3px)}
.net a b{font-size:var(--fs-ui);white-space:nowrap}
.net a small{font-size:var(--fs-micro);color:var(--c-muted);white-space:nowrap}
.net a.hub{background:var(--c-green);border-color:var(--c-green);color:var(--c-black);padding:var(--sp-6) var(--sp-8)}
.net a.hub b{font-size:var(--fs-h4)}
.net a.hub small{color:var(--c-dark)}
.net .grp{position:absolute;font-size:var(--fs-micro);font-weight:700;color:var(--c-green);transform:translateX(-50%)}
.net a.n0{left:50%;top:46%}.net a.n1{left:14%;top:18%}.net a.n2{left:14%;top:46%}.net a.n3{left:14%;top:74%}.net a.n4{left:86%;top:18%}.net a.n5{left:86%;top:46%}.net a.n6{left:86%;top:74%}.net a.n7{left:50%;top:90%}.net .grp.g1{left:14%;top:4%}.net .grp.g2{left:86%;top:4%}

/* About: what happened after the click */
.q-old{font-size:var(--fs-h3);color:var(--c-muted);font-weight:700;letter-spacing:-.02em}
.q-old s{text-decoration-thickness:2px}
.q-new{font-size:var(--fs-display);font-weight:800;letter-spacing:-.045em;line-height:1;margin-top:var(--sp-4);max-width:16ch}
.q-new em{font-style:normal;color:var(--c-green)}
.path.n-6{grid-template-columns:repeat(6,1fr)}
.path.n-6 li:nth-child(6){min-height:380px}
.think-foot{margin-top:var(--sp-8);display:flex;flex-wrap:wrap;gap:var(--sp-6);align-items:center;justify-content:space-between}
.think-foot p{color:var(--c-soft);max-width:56ch}

/* Contact hero visual: inputs to growth audit */
.cin{position:relative;display:grid;grid-template-columns:150px 1fr;gap:var(--sp-10);align-items:center;background:var(--c-panel);border:1px solid var(--c-rule-d);border-radius:var(--r-lg);padding:var(--sp-8) var(--sp-6)}
.cin svg{position:absolute;inset:0;width:100%;height:100%;z-index:0}
.cin svg path{fill:none;stroke:var(--c-green);stroke-width:1.5;stroke-dasharray:1;stroke-dashoffset:1;animation:draw 1.2s .3s var(--ease) forwards;vector-effect:non-scaling-stroke;opacity:.7}
.cin ul{position:relative;z-index:1;display:grid;gap:var(--sp-4)}
.cin ul li{background:var(--c-black);border:1px solid var(--c-rule-d);border-radius:var(--r-sm);padding:var(--sp-3) var(--sp-4);font-size:var(--fs-small);font-weight:600;color:var(--c-soft)}
.cin .card{position:relative;z-index:1;background:var(--c-white);color:var(--c-ink);border-radius:var(--r-md);padding:var(--sp-6);opacity:0;animation:rise .6s 1.2s var(--ease) forwards}
.cin .card b{display:flex;align-items:center;gap:var(--sp-2);font-size:var(--fs-h4)}
.cin .card b svg{position:static;width:22px;height:22px}
.cin .card ol{margin-top:var(--sp-4);display:grid;gap:var(--sp-3);counter-reset:c}
.cin .card ol li{display:grid;grid-template-columns:24px 1fr;gap:var(--sp-2);font-size:var(--fs-small);color:var(--c-ink-2)}
.cin .card ol li::before{counter-increment:c;content:"0" counter(c);font-weight:700;color:var(--c-green-ink)}

/* Contact form area */
.cform-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:var(--sp-col-gap);align-items:start}
.cinfo{position:sticky;top:110px;display:grid;gap:var(--sp-6)}
.cinfo .box{background:var(--c-dark);color:var(--c-white);border-radius:var(--r-lg);padding:var(--sp-card)}
.cinfo .box h2{font-size:var(--fs-h3);margin-bottom:var(--sp-5)}
.cinfo dl div{padding:var(--sp-3) 0;border-top:1px solid var(--c-rule-d)}
.cinfo dt{font-size:var(--fs-micro);color:var(--c-muted)}
.cinfo dd{margin:var(--sp-1) 0 0;font-weight:600}
.cinfo dd a{color:var(--c-white);text-decoration:none;border-bottom:1px solid var(--c-green)}
.cinfo dd a:hover{color:var(--c-green)}
.cinfo .more h3{font-size:var(--fs-small);color:var(--c-ink-2);font-weight:700;margin-bottom:var(--sp-3)}
.cinfo .more ul{display:grid;gap:var(--sp-2)}
.cinfo .more a{display:flex;justify-content:space-between;align-items:center;padding:var(--sp-3) 0;border-bottom:1px solid var(--c-rule-l);text-decoration:none;font-weight:600}
.cinfo .more a .arr{width:14px;height:14px;transition:transform .25s var(--ease)}
.cinfo .more a:hover{color:var(--c-green-ink)}
.cinfo .more a:hover .arr{transform:translate(3px,-3px)}
.form-card.big{padding:var(--sp-card);border:1px solid var(--c-rule-l);box-shadow:none}
.pr-row.n-3{grid-template-columns:repeat(3,1fr)}
.pr-row.n-3 li:nth-child(2){margin-top:calc(var(--stagger) * -1)}.pr-row.n-3 li:nth-child(3){margin-top:calc(var(--stagger) * -2)}
.pr-row.n-3{align-items:end}

/* ---- Responsive ---- */
@media (max-width:1024px){
  .step-band .sb-grid,#step-06 .sb-grid,.loop-grid,.cform-grid{grid-template-columns:minmax(0,1fr)}
  #step-06 .scale-vis{height:400px}
  .step-band.flip .sb-copy{order:0}
  .pov{grid-template-columns:repeat(3,1fr);row-gap:var(--sp-8)}
  .pov .br{display:none}
  .pov li{grid-row:auto}
  .beliefs2 li{grid-template-columns:100px 1fr;row-gap:var(--sp-2)}
  .beliefs2 p{grid-column:2}
  .path.n-6{grid-template-columns:repeat(3,1fr);align-items:stretch}
  .cinfo{position:static}
  .net{height:auto;display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-3)}
  .net svg,.net .grp{display:none}
  .net a{position:static;transform:none;align-items:flex-start;text-align:left}
  .net a:hover{transform:translateY(-3px)}
  .net a.hub{grid-column:1/-1}
  .pr-row.n-3 li:nth-child(n){margin-top:0}
}
@media (max-width:767px){
  .jobs li{grid-template-columns:1fr;gap:var(--sp-1)}
  .jobs svg{display:none}
  .bmap{height:auto;grid-template-columns:1fr 1fr;grid-template-rows:none}
  .bmap svg{display:none}
  .bmap li:nth-child(n){grid-area:auto;justify-self:stretch}
  .bmap li.hub{grid-column:1/-1;order:-1}
  .aud{padding:0}
  .aud-ph{position:relative;width:100%;height:160px;margin-bottom:calc(var(--sp-10) * -1)}
  .aud .mk{margin:0 var(--sp-3)}
  .opt{grid-template-columns:1fr 1fr}
  .bricks{grid-template-columns:1fr 1fr}
  .bricks .w2,.bricks .w3{grid-column:span 2}
  .bricks li{padding:var(--sp-4)}
  .pr-row.n-3{grid-template-columns:1fr}
  .scale-vis{height:340px}
  .sv-lbl.l2{left:36%}
  .loop{display:none}
  .loop-list{display:block}
  .pov{grid-template-columns:1fr}
  .pov li{padding:0 0 var(--sp-6) var(--sp-8)}
  .pov li::before{top:0;bottom:0;left:6px;right:auto;width:3px;height:auto}
  .path.n-6{grid-template-columns:1fr}
  .beliefs2 li{grid-template-columns:1fr}
  .beliefs2 p{grid-column:auto}
  .net{grid-template-columns:1fr}
  .cin{grid-template-columns:1fr;gap:var(--sp-5)}
  .cin svg{display:none}
  .cin ul{grid-template-columns:1fr 1fr}
  .pchain li:nth-child(1){margin-left:calc(var(--sp-5) * 0)}
  .pchain li:nth-child(2){margin-left:calc(var(--sp-5) * 1)}
  .pchain li:nth-child(3){margin-left:calc(var(--sp-5) * 2)}
  .pchain li:nth-child(4){margin-left:calc(var(--sp-5) * 3)}
  .pchain li:nth-child(5){margin-left:calc(var(--sp-5) * 4)}
  .pchain li:nth-child(6){margin-left:calc(var(--sp-5) * 5)}
  .pchain li:nth-child(7){margin-left:calc(var(--sp-5) * 6)}
}
.loop-list{display:none}
.loop-list ol{display:grid;gap:var(--sp-2);counter-reset:l}
.loop-list li{display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-3) var(--sp-4);border:1px solid var(--c-rule-d);border-radius:var(--r-sm);font-weight:700}
.loop-list li span{color:var(--c-green)}
.loop-list li.again{border-color:var(--c-green);color:var(--c-green)}

.reach-light .routes path{stroke:var(--c-green-ink)}
.reach-light .origin::before{background:var(--c-green-ink)}
.reach-light .markets li::before{border-color:var(--c-green-ink)}
.think-path{margin-top:var(--sp-block)}
.sec-head .intro a,.beliefs2 + p a{color:inherit}

/* WordPress admin bar offset */
body.admin-bar .site-header{top:32px}@media (max-width:782px){body.admin-bar .site-header{top:46px}}
