:root{
  --void:#0a0a0f; --panel:#14141b; --panel-2:#101017; --line:#26232e;
  --silver-hi:#f4f4f6; --silver-lo:#9a96a3;
  /* One horizontal gutter sitewide, taken from the homepage sections. */
  --gutter:clamp(24px,5vw,64px);
  /* One vertical section padding sitewide: 48px from the section edge to its first and last content (was 70px; Ryan, October 2026). */
  --section-pad:48px;
  --ame:#7b56a3; --ame-glow:#a67fd6; --ame-light:#ceb5f3; --ame-deep:#2c1840;
  --ok:#8fd6a8; --err:#f0a3a3;
  /* Type: Archivo for headings and interface labels, Inter for supporting text. */
  --font-head:'Archivo',system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-ui:'Archivo',system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-body:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}}
[id]{scroll-margin-top:96px}
body{background:var(--void);color:var(--silver-hi);font-family:var(--font-body);font-weight:400;overflow-x:hidden}
/* Sitewide decorative background: one fixed layer behind the whole page, painted by the body's pseudo-element in
   the root stacking context (negative z-index: above the canvas colour, below all content), so nothing wraps the
   content, nothing is added to the accessibility tree and layout is untouched. The dark overlay keeps white text
   at AA contrast while the obsidian texture and purple seams stay subtly visible. Sections that only painted the
   flat page colour are transparent so the layer shows through; panels, cards, photographs, the header, the
   footer and form fields keep their own surfaces. AVIF, then WebP, then the PNG fallback: one file per page. */
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(rgba(10,10,15,.72),rgba(10,10,15,.82)),url("/obsidian-sitewide-background.webp") center/cover no-repeat var(--void)}
@supports (background-image:image-set(url("a.avif") type("image/avif"))){body::before{background-image:linear-gradient(rgba(10,10,15,.72),rgba(10,10,15,.82)),image-set(url("/obsidian-sitewide-background.avif") type("image/avif"),url("/obsidian-sitewide-background.webp") type("image/webp"),url("/obsidian-sitewide-background.png") type("image/png"))}}
/* phones: cover crops the wide picture to its flat centre, so the layer shows the left third where the fracture
   and a purple seam run through the frame */
@media(max-width:767px){body::before{background-position:18% center}}
h1,h2,h3,h4{font-family:var(--font-head)}
.eyebrow,.k,.nav-links a,.btn,.btn-rect,.btn-outline,.brand-name,.brand-sub,.post-meta,.form label,.crumbs,.stat .l,.hero-note,.cell .more,.faq summary,.step .num,.legal{font-family:var(--font-ui);font-weight:600}
a{color:inherit}
img,svg{max-width:100%}
.wrap{width:100%;margin:0 auto;padding:0 var(--gutter)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--ame);color:#fff;padding:10px 16px;border-radius:8px;text-decoration:none;font-size:13px;font-weight:600}
.skip:focus{top:12px}
.eyebrow{display:flex;align-items:center;gap:14px;font-size:11px;letter-spacing:.4em;text-transform:uppercase;color:var(--ame-light)}
.eyebrow::before{content:"";width:44px;height:1px;background:linear-gradient(90deg,var(--ame),transparent);flex:none}
.silver{background:linear-gradient(180deg,var(--silver-hi) 30%,var(--silver-lo) 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.purple{background:linear-gradient(180deg,var(--ame-light) 10%,var(--ame) 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
h1{font-size:clamp(36px,5.6vw,76px);line-height:1.04;font-weight:800;letter-spacing:-.015em}
h2{font-size:clamp(26px,3.4vw,44px);line-height:1.12;font-weight:800;letter-spacing:-.01em}
h3{font-size:19px;font-weight:700;line-height:1.35}
p.lead{color:var(--silver-lo);font-size:clamp(14px,1.25vw,17px);line-height:1.75;max-width:620px}
:focus-visible{outline:2px solid var(--ame-light);outline-offset:3px;border-radius:4px}

/* nav */
header{position:fixed;top:0;left:0;right:0;z-index:50;transition:background .35s,border-color .35s;border-bottom:1px solid transparent}
header.solid,header.nav-open{background:rgba(10,10,15,.88);backdrop-filter:blur(14px);border-color:var(--line)}
.navbar{position:relative;display:flex;align-items:center;justify-content:space-between;padding:20px var(--gutter);gap:16px}
/* On wide screens the menu starts where the hero dashboard begins; the CTA stays at the right edge. */
.site-nav{position:absolute;left:42.5%;right:var(--gutter);top:50%;transform:translateY(-50%)}
@media(max-width:1180px){.site-nav{position:static;transform:none;margin-left:auto}}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--silver-hi)}
.brand-logo{display:block;height:46px;width:auto;flex:none}
.brand-lockup{display:flex;flex-direction:column;line-height:1.1}
.brand-name{font-weight:600;font-size:19px;letter-spacing:-.01em;white-space:nowrap;color:var(--silver-hi)}
.brand-sub{font-size:9px;letter-spacing:.24em;text-transform:uppercase;color:var(--silver-lo);margin-top:4px;white-space:nowrap}
.nav-links{display:flex;gap:30px;align-items:center;list-style:none}
.nav-links a{color:#d9d6e0;text-decoration:none;font-size:14px;font-weight:500;transition:color .25s}
.nav-links a:hover,.nav-links a[aria-current="page"]{color:var(--ame-light)}
.nav-links li:last-child{margin-left:auto}
@media(max-width:1180px){.nav-links li:last-child{margin-left:10px}}
.nav-links a.btn-rect{color:#fff}
.nav-links a.btn-rect:hover,.nav-links a.btn-rect[aria-current="page"]{color:#fff}
/* Services dropdown (servicesNavItem in templates.js): label link + disclosure button; the panel opens on the
   button, on hover with a fine pointer, and while focus is inside. The sub-list resets the .nav-links li rules. */
.nav-sub{position:relative;display:flex;align-items:center;gap:2px}
.nav-links a.is-section{color:var(--ame-light)}
.nav-sub__toggle{display:inline-flex;align-items:center;justify-content:center;width:24px;height:32px;margin-right:-6px;padding:0;background:none;border:0;color:#d9d6e0;cursor:pointer;transition:color .25s}
.nav-sub__toggle svg{width:10px;height:7px;transition:transform .25s}
.nav-sub__toggle:hover,.nav-sub.is-open .nav-sub__toggle{color:var(--ame-light)}
.nav-sub.is-open .nav-sub__toggle svg{transform:rotate(180deg)}
.nav-sub__toggle:focus-visible{outline:2px solid var(--ame-light);outline-offset:2px}
.nav-sub__panel{position:absolute;left:-22px;top:calc(100% + 18px);z-index:60;width:300px;padding:10px;background:rgba(14,13,20,.97);border:1px solid var(--line);box-shadow:0 18px 40px rgba(0,0,0,.45);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);opacity:0;visibility:hidden;transform:translateY(-6px);transition:opacity .2s ease,transform .2s ease,visibility 0s linear .2s}
.nav-sub__panel::before{content:"";position:absolute;left:0;right:0;top:-19px;height:19px}
.nav-sub.is-open .nav-sub__panel,.nav-sub:focus-within .nav-sub__panel{opacity:1;visibility:visible;transform:none;transition:opacity .2s ease,transform .2s ease,visibility 0s}
@media(hover:hover) and (pointer:fine) and (min-width:821px){.nav-sub:hover .nav-sub__panel{opacity:1;visibility:visible;transform:none;transition:opacity .2s ease,transform .2s ease,visibility 0s}.nav-sub:hover .nav-sub__toggle svg{transform:rotate(180deg)}}
.nav-sub.is-closed .nav-sub__panel{opacity:0 !important;visibility:hidden !important}
.nav-sub__list{list-style:none;margin:0;padding:0}
.nav-links .nav-sub__list li,.nav-links .nav-sub__list li:last-child{margin:0;width:auto;border:0;padding:0}
.nav-links .nav-sub__list a{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding:11px 12px;font-size:14px;color:#ecebf1;transition:background-color .2s,color .2s}
.nav-links .nav-sub__list a:hover,.nav-links .nav-sub__list a:focus-visible,.nav-links .nav-sub__list a[aria-current="page"]{background:rgba(123,86,163,.18);color:#fff}
.nav-links .nav-sub__list a[aria-current="page"] .nav-sub__name{color:var(--ame-light)}
.nav-sub__k{font-family:var(--font-body);font-weight:400;font-size:12px;color:var(--silver-lo);white-space:nowrap}


@media(prefers-reduced-motion:reduce){.nav-sub__panel,.nav-sub__toggle svg{transition:none}}
.nav-toggle{display:none;background:none;border:1px solid var(--line);border-radius:999px;width:44px;height:44px;cursor:pointer;color:var(--silver-hi);align-items:center;justify-content:center}
.nav-toggle .bars{position:relative;width:18px;height:2px;background:currentColor;display:block;transition:background .2s}
.nav-toggle .bars::before,.nav-toggle .bars::after{content:"";position:absolute;left:0;width:18px;height:2px;background:currentColor;transition:transform .25s,top .25s}
.nav-toggle .bars::before{top:-6px}.nav-toggle .bars::after{top:6px}
.nav-open .nav-toggle .bars{background:transparent}
.nav-open .nav-toggle .bars::before{top:0;transform:rotate(45deg)}
.nav-open .nav-toggle .bars::after{top:0;transform:rotate(-45deg)}
@media(max-width:820px){
  .nav-toggle{display:flex}
  .site-nav{display:none;position:absolute;left:0;right:0;top:100%;transform:none;margin:0;background:rgba(10,10,15,.97);border-bottom:1px solid var(--line);padding:12px var(--gutter) 28px}
  .nav-open .site-nav{display:block}
  .nav-links{flex-direction:column;align-items:flex-start;gap:0}
  .nav-links li{width:100%;border-bottom:1px solid var(--line)}
  .nav-links li:last-child{border:0;padding-top:18px;margin-left:0}
  .nav-links a:not(.btn-rect){display:block;padding:16px 0;font-size:15px}
  /* Services dropdown inline in the phone menu: the toggle sits at the right of the row, the list opens below */
  .nav-sub{flex-wrap:wrap;gap:0}
  .nav-sub > a{flex:1}
  .nav-sub__toggle{width:44px;height:44px;margin:0}
  .nav-sub__panel,.nav-sub:focus-within .nav-sub__panel{position:static;display:none;width:100%;padding:0 0 10px 14px;background:none;border:0;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;opacity:1;visibility:visible;transform:none;transition:none}
  .nav-sub.is-open .nav-sub__panel{display:block}
  .nav-sub__panel::before{display:none}
  .nav-links .nav-sub__list a{display:flex;padding:12px 0;font-size:15px;background:none}
  .nav-links .nav-sub__list a:hover,.nav-links .nav-sub__list a[aria-current="page"]{background:none}
  .brand-logo{height:38px}
}
/* Buttons: bevelled "cut crystal" corners where the browser supports corner-shape, a soft 4px corner
   otherwise. Thin luminous edge, glow beneath, light sweep and arrow nudge on hover. */
.btn,.btn-rect{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:12px;padding:15px 24px;border-radius:4px;background:linear-gradient(180deg,#8f62c9 0%,#6a45a3 100%);color:#fff;font-family:var(--font-ui);font-weight:600;font-size:14px;line-height:1;letter-spacing:.01em;text-decoration:none;border:1px solid rgba(206,181,243,.55);box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 14px 32px -12px rgba(166,127,214,.75);cursor:pointer;overflow:hidden;isolation:isolate;transition:transform .2s,box-shadow .3s,border-color .3s;white-space:nowrap}
.btn::before,.btn-rect::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.32) 50%,transparent 65%);transform:translateX(-130%);transition:transform .75s cubic-bezier(.2,.7,.2,1)}
.btn:hover::before,.btn-rect:hover::before{transform:translateX(130%)}
.btn:hover,.btn-rect:hover{transform:translateY(-1px);border-color:rgba(206,181,243,.9);box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 18px 40px -12px rgba(166,127,214,.95)}
.btn > span,.btn-rect > span{display:inline-block;transition:transform .25s}
.btn:hover > span,.btn-rect:hover > span{transform:translateX(4px)}
.btn.sm,.btn-rect.sm{padding:11px 18px;font-size:13px}
.btn[disabled]{opacity:.6;cursor:progress;transform:none}
.btn-outline{position:relative;display:inline-flex;align-items:center;gap:12px;padding:15px 24px;border-radius:4px;border:1px solid rgba(154,150,163,.4);color:var(--silver-hi);font-family:var(--font-ui);font-weight:600;font-size:14px;line-height:1;text-decoration:none;background:rgba(20,20,27,.5);backdrop-filter:blur(6px);transition:border-color .25s,background .25s,transform .2s;white-space:nowrap}
.btn-outline:hover{border-color:var(--ame-glow);background:rgba(44,24,64,.45);transform:translateY(-1px)}
@supports (corner-shape: bevel){.btn,.btn-rect,.btn-outline{border-radius:12px;corner-shape:bevel}}
/* Secondary CTA used sitewide: editorial arrow link. Primary CTAs use .btn / .btn-rect above. */
.cta-link{display:inline-flex;align-items:center;gap:14px;width:fit-content;padding-bottom:6px;color:var(--silver-hi);font-family:var(--font-ui);font-weight:600;font-size:15px;letter-spacing:.01em;line-height:1.3;text-decoration:none;border-bottom:1px solid rgba(244,244,246,.35);transition:color .25s,border-color .25s}
.cta-link > span{display:inline-block;transition:transform .25s}
.cta-link:hover{color:var(--ame-light);border-color:var(--ame-light)}
.cta-link:hover > span{transform:translateX(4px)}
.cta-link:focus-visible{outline:2px solid var(--ame-light);outline-offset:4px;border-radius:0}
.cta-link--ink{color:#0a0a0f;border-color:rgba(10,10,15,.35)}
.cta-link--ink:hover{color:#6a2ac0;border-color:#6a2ac0}

/* hero (home) */
/* Hero height is one variable. The artwork is a single SVG composition (picture + chart + captions)
   that fills the hero and crops as one piece, so changing the height never moves parts apart. */
.hero-b2b{--hero-height:max(560px,78svh);position:relative;min-height:var(--hero-height);display:flex;align-items:center;overflow:hidden;background:transparent;padding:calc(88px + 4vh) 0 clamp(48px,8vh,80px)}
.hero-artwork-wrapper{position:absolute;inset:0;z-index:0;pointer-events:none}
.hero-artwork{display:block;width:100%;height:100%;font-family:var(--font-ui)}
.hero-artwork.mobile{display:none}
.hero-veil{z-index:1}
.hero-content{position:relative;z-index:2}
/* Captions live in artwork units (1672 x 941), so these sizes scale with the picture. */
.cap{fill:rgba(214,208,226,.62);font-weight:600;font-size:10.4px;letter-spacing:.28em}
.cap.illus{fill:rgba(200,196,212,.55);font-size:9.2px;font-weight:400;font-style:italic;letter-spacing:.06em;font-family:var(--font-body)}
.cap.side{fill:rgba(214,208,226,.55);font-size:10px}
@media(max-width:900px){
  .hero-artwork.desktop{display:none}
  .hero-artwork.mobile{display:block;opacity:.7}
  .hero-artwork .captions{display:none}
}

/* Neon pipes: packets of light travel along the traced centrelines while the hero is on screen. */
.fl,.fl-breathe{fill:none;stroke-linecap:round;stroke-linejoin:round;mix-blend-mode:screen;animation-play-state:paused}
.fl{animation:flow var(--t,2s) linear infinite}
.fl-tail{stroke:#8a4dff;stroke-width:16;opacity:.22}
.fl-body{stroke:#b57bff;stroke-width:8;opacity:.6;filter:blur(1.5px)}
.fl-head{stroke:#dcc6ff;stroke-width:3.5;opacity:.95}
/* The whole tube breathes slowly so the current reads as live even between packets. */
.fl-breathe{stroke:#9b5cff;stroke-width:10;opacity:.14;filter:blur(3px);animation:breathe 2.6s ease-in-out infinite}
.hero-b2b.inview .fl,.hero-b2b.inview .fl-breathe{animation-play-state:running}
/* crystal beam: one run per chart cycle, restarted with the chart's play class */
.fl.beam{animation:none}
.hero-b2b.play .fl.beam{animation:beamrun var(--t,2s) linear var(--start,2.8s) 1 forwards}
@keyframes beamrun{to{stroke-dashoffset:-1000}}
@keyframes flow{to{stroke-dashoffset:0}}
@keyframes breathe{0%,100%{opacity:.12}50%{opacity:.34}}
@media (prefers-reduced-motion: reduce){.fl,.fl-breathe{display:none}}
html:not(.js) .fl,html:not(.js) .fl-breathe{display:none}

/* Chart: draws the purple line over the (line-free) artwork once the hero is in view. */
.gline,.gline-glow,.gline-glow2{fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1000;stroke-dashoffset:1000}
.gline{stroke:#cfa6ff;stroke-width:3}
.ggrid{stroke:rgba(255,255,255,.09);stroke-width:1}
/* purple glow on the crystal's four glass boxes */
.box-glow rect{fill:none;stroke:#cfa6ff;stroke-width:2;opacity:1;mix-blend-mode:screen;filter:drop-shadow(0 0 4px rgba(207,166,255,1)) drop-shadow(0 0 12px rgba(160,100,240,.9)) drop-shadow(0 0 26px rgba(130,70,220,.65)) drop-shadow(0 0 44px rgba(110,60,200,.35))}
/* the crystal boxes flare as the beam pulse passes, then settle; timing comes from the pipe data */
.box-glow rect.pulse{opacity:.16}
.hero-b2b.play .box-glow rect.pulse{animation:boxpulse var(--t,2s) linear var(--d,0s) 1 forwards;animation-play-state:paused}
.hero-b2b.play.inview .box-glow rect.pulse{animation-play-state:running}
@keyframes boxpulse{0%{opacity:.16}8%{opacity:1}30%{opacity:.16}100%{opacity:.16}}
@media (prefers-reduced-motion: reduce){.box-glow rect.pulse{animation:none;opacity:.85}}
html:not(.js) .box-glow rect.pulse{animation:none;opacity:.85}
.gaxis{stroke:rgba(255,255,255,.32);stroke-width:1}
.gline2{fill:none;stroke:#b6b2bf;stroke-width:2.2;stroke-linejoin:round;stroke-linecap:round}
.gp2{fill:#d6d3dc;stroke:#1a1524;stroke-width:1}
/* Neon: two soft purple glow layers draw underneath the core line. */
.gline-glow{stroke:#a066ff;stroke-width:9;opacity:.5;filter:blur(2.5px);mix-blend-mode:screen}
.gline-glow2{stroke:#8a4dff;stroke-width:18;opacity:.22;filter:blur(6px);mix-blend-mode:screen}
.graph{transition:opacity .6s ease}
.hero-b2b.gfade .graph{opacity:0}
.gpulse{fill:none;stroke:#f1e9ff;stroke-width:4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:60 940;stroke-dashoffset:1060;opacity:0;filter:blur(2px)}
.gp{fill:#d9bfff;stroke:#1a1524;stroke-width:1.2;opacity:0;transform-box:fill-box;transform-origin:center;transform:scale(.3);filter:drop-shadow(0 0 3px rgba(176,124,240,.95)) drop-shadow(0 0 7px rgba(138,77,255,.55))}
.ghalo{fill:none;stroke:#c79bff;stroke-width:1.6;opacity:0;transform-box:fill-box;transform-origin:center}
.gt{opacity:0;transform:translateY(10px)}
.gt rect{fill:rgba(14,12,20,.94);stroke:rgba(170,150,210,.45);stroke-width:1}
.gt text{fill:#e7e3f0;font-size:9.5px;font-weight:400;font-family:var(--font-body)}
.gt .gt-title{font-size:11px;font-weight:600;font-family:var(--font-ui)}
.gt .gt-val{font-weight:600;font-family:var(--font-ui)}
.play .gline,.play .gline-glow,.play .gline-glow2{animation:gdraw 2.5s cubic-bezier(.45,.05,.3,1) .3s forwards}
.play .gp{animation:gpop .35s cubic-bezier(.2,.9,.3,1.35) var(--d) forwards}
.play .ghalo{animation:ghalo 2s ease-out var(--d) 2}
.play .gt{animation:grise .5s ease-out var(--d) forwards}
.play .gpulse{animation:gtravel 1.9s ease-in-out 3s 2}
@keyframes gdraw{to{stroke-dashoffset:0}}
@keyframes gpop{to{opacity:1;transform:scale(1)}}
@keyframes grise{to{opacity:1;transform:translateY(0)}}
@keyframes gtravel{0%{opacity:0;stroke-dashoffset:1060}12%{opacity:.8}88%{opacity:.8}100%{opacity:0;stroke-dashoffset:0}}
@keyframes ghalo{0%{opacity:.75;transform:scale(.5)}100%{opacity:0;transform:scale(2)}}
/* Finished state, shown straight away for reduced motion and when scripts are unavailable. */
@media (prefers-reduced-motion: reduce){
  .gline,.gline-glow,.gline-glow2{stroke-dashoffset:0;animation:none !important}
  .gp,.gt{opacity:1;transform:none;animation:none !important}
  .gpulse,.ghalo{display:none}
}
html:not(.js) .gline,html:not(.js) .gline-glow,html:not(.js) .gline-glow2{stroke-dashoffset:0}
html:not(.js) .gp,html:not(.js) .gt{opacity:1;transform:none}
html:not(.js) .gpulse,html:not(.js) .ghalo{display:none}
.hero-veil{position:absolute;inset:0;background:linear-gradient(90deg,rgba(7,7,11,.94) 0%,rgba(7,7,11,.8) 28%,rgba(7,7,11,.35) 45%,rgba(7,7,11,0) 58%),linear-gradient(180deg,rgba(7,7,11,.55) 0%,rgba(7,7,11,0) 22%)}
.hero-inner{position:relative;z-index:2;width:100%;padding:0 var(--gutter)}
.hero-text{max-width:640px;display:flex;flex-direction:column;gap:22px}
.hero-b2b h1{font-size:clamp(34px,3.85vw,60px);letter-spacing:-.03em;line-height:1.06;color:#fff;font-weight:800;white-space:nowrap}
.hero-b2b .lead{font-size:clamp(16px,1.35vw,19px);color:#b7b2c2;line-height:1.6;max-width:480px}
@media(max-width:1100px){.hero-b2b h1{font-size:clamp(34px,4.6vw,56px)}}
@media(max-width:560px){.hero-b2b h1{white-space:normal;font-size:clamp(32px,9.5vw,40px)}}
.hero-note{border-top:1px solid rgba(255,255,255,.1);padding-top:18px;font-size:12.5px;color:var(--silver-lo);letter-spacing:.01em;margin-top:8px}
.eyebrow.plain{letter-spacing:.3em;font-size:11px;color:var(--ame-glow);font-weight:600}
.eyebrow.plain::before{display:none}
h1 .drumwrap{display:inline-block;position:relative;vertical-align:bottom;perspective:700px;height:1.05em;min-width:5ch}
.drumwrap span{position:absolute;left:0;top:0;white-space:nowrap;background:linear-gradient(180deg,var(--ame-light) 10%,var(--ame-glow) 55%,var(--ame) 100%);-webkit-background-clip:text;background-clip:text;color:transparent;transform-origin:50% 50% -0.52em;transform:rotateX(-90deg);opacity:0;transition:transform .8s cubic-bezier(.3,.9,.3,1),opacity .5s}
.drumwrap span.on{transform:rotateX(0);opacity:1}
.drumwrap span.off{transform:rotateX(90deg);opacity:0}
.hero-actions{display:flex;gap:14px;align-items:center;flex-wrap:wrap}
@media(max-width:900px){
  .hero-b2b{align-items:flex-end;min-height:92svh}
  .hero-veil{background:linear-gradient(180deg,rgba(7,7,11,.2) 0%,rgba(7,7,11,.55) 35%,rgba(7,7,11,.95) 62%)}
  .hero-text{max-width:100%}
}

/* inner-page heroes */
.page-hero{position:relative;padding:calc(96px + 5vh) 0 72px;overflow:hidden;border-bottom:1px solid var(--line)}
.page-hero .wrap{position:relative;z-index:2;display:flex;flex-direction:column;gap:20px}
.crystal-bg{position:absolute;right:-4%;top:8%;width:clamp(300px,36vw,560px);opacity:.5;pointer-events:none}
.crumbs{list-style:none;display:flex;flex-wrap:wrap;gap:8px;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--silver-lo)}
.crumbs li+li::before{content:"/";margin-right:8px;opacity:.5}
.crumbs a{text-decoration:none;color:var(--silver-lo)}
.crumbs a:hover{color:var(--ame-light)}

/* sections */
section.block{padding:clamp(72px,10vw,128px) 0;position:relative}
section.block.tint{background:var(--panel-2);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
section.block.tight{padding-top:0}
.sec-head{display:flex;flex-direction:column;gap:16px;margin-bottom:clamp(36px,5vw,64px)}
.grid{display:grid;gap:1px;background:var(--line)}
.grid.c3{grid-template-columns:repeat(3,1fr)}
.grid.c2{grid-template-columns:repeat(2,1fr)}
.grid+.grid{margin-top:1px}
@media(max-width:900px){.grid.c3,.grid.c2{grid-template-columns:1fr}}
.cell{background:var(--void);padding:38px 32px;position:relative;overflow:hidden;transition:background .35s;text-decoration:none;display:block}
.cell::before{content:"";position:absolute;top:0;left:0;width:100%;height:1px;background:linear-gradient(90deg,var(--ame),transparent);transform:scaleX(0);transform-origin:left;transition:transform .5s}
.cell:hover{background:var(--panel)}
.cell:hover::before{transform:scaleX(1)}
.k{font-size:11px;letter-spacing:.32em;text-transform:uppercase;color:var(--ame-light);margin-bottom:14px}
.cell h3{margin-bottom:10px}
.cell p{font-size:14px;line-height:1.7;color:var(--silver-lo)}
.cell .more{display:inline-block;margin-top:18px;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--ame-light)}
.tilt{transform-style:preserve-3d;will-change:transform;transition:transform .18s ease-out}
.after{margin-top:28px}

/* process */
.proc{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line)}
@media(max-width:900px){.proc{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.proc{grid-template-columns:1fr}}
.step{background:var(--void);padding:38px 30px}
.step .num{font-size:44px;font-weight:800;background:linear-gradient(180deg,var(--ame-light),var(--ame-deep));-webkit-background-clip:text;background-clip:text;color:transparent;line-height:1;margin-bottom:18px}
.step p{color:var(--silver-lo);font-size:14px;line-height:1.7;margin-top:10px}

/* stats */
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line)}
@media(max-width:760px){.stats{grid-template-columns:1fr}}
.stat{background:var(--void);padding:44px 32px;text-align:left}
.stat .n,.cell .n{font-size:clamp(38px,4.4vw,58px);font-weight:800;line-height:1}
.cell .n{margin-bottom:14px}
.stat .l{margin-top:12px;font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--silver-lo)}

/* faq */
.faq{border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line);padding:26px 4px}
.faq summary{cursor:pointer;list-style:none;font-weight:700;font-size:17px;display:flex;justify-content:space-between;align-items:center;gap:20px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--ame-light);font-size:24px;font-weight:400;transition:transform .3s;flex:none}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{margin-top:14px;color:var(--silver-lo);font-size:14px;line-height:1.75;max-width:720px}

/* cta band */
.cta-band{position:relative;overflow:hidden;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:linear-gradient(180deg,var(--panel-2),var(--void))}
.cta-band .wrap{padding-top:clamp(64px,9vw,110px);padding-bottom:clamp(64px,9vw,110px);display:flex;flex-direction:column;gap:24px;align-items:flex-start;position:relative;z-index:2}
.actions{display:flex;gap:18px;flex-wrap:wrap;align-items:center}

/* insights */
.post-list .cell{padding:34px 32px}
.post-meta{font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--silver-lo);margin-bottom:12px}
article.post{max-width:760px;margin:0 auto}
article.post h2{margin:44px 0 16px;font-size:clamp(22px,2.6vw,30px)}
article.post p,article.post li{color:var(--silver-lo);line-height:1.85;margin-bottom:18px;font-size:15.5px}
article.post ul,article.post ol{padding-left:22px}
article.post a{color:var(--ame-light)}
.notice{border:1px solid var(--line);border-left:3px solid var(--ame);padding:18px 22px;border-radius:8px;color:var(--silver-lo);font-size:14px;line-height:1.7;background:var(--panel-2)}

/* legal */
.legal-copy{max-width:760px}
.legal-copy h2{font-size:clamp(20px,2.2vw,26px);margin:40px 0 12px}
.legal-copy p,.legal-copy li{color:var(--silver-lo);line-height:1.8;font-size:15px;margin-bottom:14px}
.legal-copy ul{padding-left:22px}
.legal-copy a{color:var(--ame-light)}

/* contact */
.contact-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:64px}
@media(max-width:860px){.contact-grid{grid-template-columns:1fr}}
.form{display:grid;gap:16px;max-width:560px;position:relative}
.form .row{display:grid;gap:6px}
.form .two{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:560px){.form .two{grid-template-columns:1fr}}
.form input,.form select,.form textarea{width:100%;background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:16px 18px;color:var(--silver-hi);font-family:inherit;font-size:14px;transition:border-color .25s}
.form select{appearance:none;-webkit-appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--silver-lo) 50%),linear-gradient(135deg,var(--silver-lo) 50%,transparent 50%);background-position:calc(100% - 22px) 50%,calc(100% - 16px) 50%;background-size:6px 6px;background-repeat:no-repeat;padding-right:44px}
.form select option{background:var(--panel);color:var(--silver-hi)}
.form input:focus,.form select:focus,.form textarea:focus{outline:none;border-color:var(--ame)}
.form input[aria-invalid="true"],.form select[aria-invalid="true"]{border-color:var(--err)}
.form label{font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--silver-lo)}
.form .hint{font-size:12px;color:var(--silver-lo);letter-spacing:0;text-transform:none}
.form .consent{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:start}
.form .consent input{width:18px;height:18px;margin-top:2px;padding:0;accent-color:var(--ame)}
.form .consent label{font-size:13px;letter-spacing:0;text-transform:none;line-height:1.6}
.form .consent a{color:var(--ame-light)}
.form .hp{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
.form-status{font-size:14px;line-height:1.6;min-height:1.4em}
.form-status.ok{color:var(--ok)}
.form-status.err{color:var(--err)}
.direct{margin-top:36px}
.direct p{color:var(--silver-lo);font-size:14px;line-height:2}
.direct a{text-decoration:none}
.direct a:hover{color:var(--ame-light)}

/* footer: compact, one link row and one bottom bar */
footer{border-top:1px solid var(--line);padding:36px 0 22px;background:var(--panel-2)}
.foot{display:grid;grid-template-columns:minmax(0,1.6fr) repeat(3,minmax(0,1fr));gap:32px;align-items:start}
@media(max-width:820px){.foot{grid-template-columns:1fr 1fr;gap:28px 24px}.foot__brand{grid-column:1 / -1}}
@media(max-width:480px){.foot{grid-template-columns:1fr}}
.foot .brand-logo{height:32px}
.foot .brand{margin-bottom:12px}
.foot .blurb{margin:0;max-width:380px;font-size:13px;line-height:1.6;color:var(--silver-lo)}
.foot__label{margin:0 0 10px;font-family:var(--font-ui);font-weight:700;font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--silver-lo)}
.foot ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--silver-lo)}
.foot a{color:var(--silver-lo);text-decoration:none;font-size:13px;transition:color .25s}
.foot a:hover{color:var(--ame-light)}
.legal{margin-top:26px;padding-top:16px;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px 20px;font-size:12px;color:var(--silver-lo)}
.legal a{color:var(--silver-lo);text-decoration:none}
.legal a:hover{color:var(--ame-light)}
.legal-links{display:flex;gap:16px}
.socials{display:flex;gap:8px;margin-left:auto}
.socials a{width:30px;height:30px;border:1px solid var(--line);border-radius:999px;display:flex;align-items:center;justify-content:center;color:var(--silver-lo);transition:color .25s,border-color .25s}
.socials a:hover{color:var(--ame-light);border-color:var(--ame)}
.socials svg{width:15px;height:15px}
@media(max-width:480px){.legal{flex-direction:column;align-items:flex-start}.socials{margin-left:0}}

/* reveals: content is visible without JS; with JS it fades in on scroll */
html.js .rv{opacity:0;transform:translateY(34px);transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1)}
html.js .rv.in{opacity:1;transform:none}

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.001s !important;transition-duration:.001s !important}
  html.js .rv{opacity:1;transform:none}
  .tilt{transition:none}
}

/* Cookie notice: fixed panel, bottom left, shown by site.js until a choice is stored */
/* cookie notice: a full-width bar docked to the bottom edge, not a floating card */
.cookie-notice{position:fixed;left:0;right:0;bottom:0;z-index:60;display:flex;align-items:center;justify-content:space-between;gap:16px 32px;flex-wrap:wrap;padding:14px var(--gutter);background:var(--panel-2);border-top:1px solid var(--line);opacity:0;transform:translateY(100%);transition:opacity .25s ease,transform .3s ease}
.cookie-notice.is-in{opacity:1;transform:none}
.cookie-notice__text{flex:1 1 520px;margin:0;color:var(--silver-lo);font-family:var(--font-body);font-size:14px;line-height:1.5}
.cookie-notice__text strong{color:var(--silver-hi);font-weight:600}
.cookie-notice__text a{color:var(--ame-light)}
.cookie-notice__actions{display:flex;align-items:center;gap:20px;flex-wrap:wrap;flex:none}
.cookie-notice__decline{background:none;border-top:0;border-left:0;border-right:0;cursor:pointer;font-size:14px}
@media(max-width:600px){.cookie-notice{padding:14px var(--gutter) 16px}.cookie-notice__text{flex-basis:100%;font-size:13px}}
@media (prefers-reduced-motion: reduce){.cookie-notice{transition:none}}

/* phones: hero artwork hidden sitewide (the homepage chart artwork and its veil, the Services slabs with their
   stage labels, the Industries monolith and the page-hero crystal). The homepage hero then sits at its
   content height instead of the artwork's 92svh. */
@media(max-width:767px){
  .hero-artwork-wrapper,.hero-veil,.services-hero__art,.industries-hero__art,.crystal-bg{display:none !important}
  .hero-b2b{min-height:0;align-items:center;padding:calc(88px + 4vh) 0 var(--section-pad)}
}

/* ===== Commercial levers: methodology and evidence tabs (drawn to the approved mock) ===== */
.commercial-levers{padding:clamp(40px,5vw,64px) 0;background:transparent;border-top:1px solid var(--line)}
.lv-wrap{padding:0 var(--gutter)}
.lv-top{display:flex;justify-content:space-between;gap:16px;font-family:var(--font-ui);font-weight:600;font-size:9px;letter-spacing:.3em;text-transform:uppercase;color:var(--silver-lo);padding-bottom:12px;border-bottom:1px solid var(--line);margin-bottom:22px}
/* The three columns share one height: the navigation stretches to the panel height and its rows
   spread evenly to fill it. */
.lv-layout{display:grid;grid-template-columns:34% 1fr;gap:22px;align-items:stretch}
.lv-nav{display:flex;flex-direction:column}
.lv-nav h2{font-size:clamp(24px,2.2vw,31px);line-height:1.08;letter-spacing:-.02em;color:#fff}
.lv-sub{margin-top:10px;color:var(--ame-light);font-family:var(--font-ui);font-weight:600;font-size:13px}
.lv-desc{margin-top:8px;color:var(--silver-lo);font-size:12.5px;line-height:1.6;max-width:420px}
/* Rows divided by hairlines; only the selected row is boxed in purple, with a filled icon square. */
.lever-tabs{display:flex;flex-direction:column;gap:0;margin-top:18px;border-top:1px solid var(--line);flex:1}
.lever-tab{display:grid;grid-template-columns:30px 26px 1fr 12px;align-items:center;gap:10px;width:100%;min-height:54px;flex:1;padding:8px 10px;background:transparent;border:1px solid transparent;border-bottom-color:var(--line);border-radius:0;color:var(--silver-hi);text-align:left;cursor:pointer;font-family:var(--font-body);transition:background .2s,border-color .2s}
.lever-tab:hover{background:rgba(255,255,255,.03)}
.lever-tab.is-active{border-color:var(--ame-glow);border-radius:8px;background:linear-gradient(90deg,rgba(123,86,163,.32),rgba(123,86,163,.08));box-shadow:0 0 0 1px rgba(166,127,214,.2) inset}
.lever-tab:focus-visible{outline:2px solid var(--ame-light);outline-offset:2px;border-radius:8px}
.lever-icon{width:30px;height:30px;display:grid;place-items:center;border:1px solid var(--line);border-radius:5px;color:var(--silver-lo);transition:color .2s,border-color .2s,background .2s}
.lever-icon svg{width:15px;height:15px}
.lever-tab.is-active .lever-icon{color:#fff;border-color:var(--ame-glow);background:var(--ame)}
.lever-num{font-family:var(--font-ui);font-weight:600;font-size:11px;color:var(--silver-lo)}
.lever-tab.is-active .lever-num{color:var(--ame-light)}
.lever-name{display:block;font-family:var(--font-ui);font-weight:600;font-size:13.5px}
.lever-hint{display:block;font-size:11px;color:var(--silver-lo);margin-top:1px}
.lever-arrow{color:var(--silver-lo);font-size:16px;line-height:1}
/* Three sections as in the mock: navigation | bordered evidence panel | free-standing insight column.
   The tab wrapper spans the last two, keeps the tallest panel's height, and swaps panels in place. */
.commercial-levers__panel{position:relative;min-height:200px}
.commercial-levers__panel-content{width:100%;height:100%;display:grid;grid-template-columns:1.3fr 1fr;gap:12px;align-items:stretch}
html.js .commercial-levers__panel-content{position:absolute;inset:0;opacity:0;transform:translateX(14px);transition:opacity .3s ease,transform .3s ease;pointer-events:none}
html.js .commercial-levers__panel-content.is-active{opacity:1;transform:none;pointer-events:auto}
html.js .commercial-levers__panel-content[hidden]{display:none}
.lv-evidence{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:14px 16px 12px;display:flex;flex-direction:column;min-width:0}
.lv-aside{display:flex;flex-direction:column;gap:8px;min-width:0}
.lv-head{margin-bottom:8px}
.lv-head h3{font-size:clamp(17px,1.35vw,19px);margin-top:4px;letter-spacing:-.01em;line-height:1.2;color:#fff}
.lv-head p{color:var(--silver-lo);font-size:11.5px;line-height:1.5;margin-top:5px;max-width:520px}
.lv-eyebrow{font-family:var(--font-ui);font-weight:600;font-size:9.5px;letter-spacing:.3em;text-transform:uppercase;color:var(--ame-light)}
.lv-scenario{font-family:var(--font-ui);font-weight:600;font-size:9px;letter-spacing:.24em;text-transform:uppercase;color:var(--ame-light);white-space:nowrap;text-align:right;padding-top:2px}
.lv-visual{padding:2px 0 0;flex:1;display:flex;flex-direction:column;justify-content:flex-start;min-width:0}
.lv-disclosure{font-size:9.5px;color:var(--silver-lo);margin:6px 0 0;line-height:1.45}
.lv-cards{display:flex;flex-direction:column;gap:10px;min-width:0;flex:1}
.lv-card{background:var(--panel-2);border:1px solid var(--line);border-radius:8px;padding:12px 14px;flex:1 1 0;display:flex;flex-direction:column;justify-content:center}
.lv-card-head{display:flex;align-items:center;gap:9px;margin-bottom:7px}
.lv-card-icon{width:22px;height:22px;display:grid;place-items:center;border:1px solid var(--line);border-radius:5px;color:var(--ame-light);flex:none}
.lv-card-icon svg{width:12px;height:12px}
.lv-card h4{font-size:13.5px;font-family:var(--font-ui);font-weight:600}
.lv-card ul{list-style:none;display:flex;flex-direction:column;gap:4px}
.lv-card li{position:relative;padding-left:12px;font-size:12px;line-height:1.45;color:var(--silver-lo)}
.lv-card li::before{content:"";position:absolute;left:0;top:8px;width:4px;height:4px;border-radius:50%;background:var(--ame-glow)}
/* progression strip */
/* Progression strip as in the mock: plain lavender line icons, long thin arrows, items spread across. */
.lv-progress{display:flex;align-items:center;gap:24px;margin-top:18px;padding-top:16px;border-top:1px solid var(--line)}
.lv-steps{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:12px;flex:1;flex-wrap:wrap}
.lv-step{display:flex;align-items:center;gap:12px;color:var(--silver-lo)}
.lv-step b{display:block;font-family:var(--font-ui);font-weight:600;font-size:13px;color:#fff;transition:color .25s}
.lv-step small{display:block;font-size:10.5px;margin-top:2px}
.lv-step-icon{display:grid;place-items:center;color:var(--ame-light);flex:none}
.lv-step-icon svg{width:26px;height:26px}
.lv-step.is-active b{color:var(--ame-light)}
.lv-step-arrow{color:#6b6577;display:flex;align-items:center}
.lv-step-arrow svg{width:48px;height:12px}
.lv-tag{font-family:var(--font-ui);font-weight:600;font-size:8.5px;letter-spacing:.3em;text-transform:uppercase;color:var(--silver-lo);text-align:right;line-height:1.8;border-left:1px solid var(--line);padding-left:18px;white-space:nowrap}
/* 01 opportunity matrix */
.lv-matrix{display:grid;gap:2px;font-size:11px}
.lv-mx-head,.lv-mx-row{display:grid;grid-template-columns:1.5fr 1.2fr 1fr 1fr 1.2fr;gap:12px;align-items:center}
.lv-mx-head{font-family:var(--font-ui);font-weight:600;font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:var(--silver-lo);padding:0 8px 6px;border-bottom:1px solid var(--line)}
.lv-mx-row{padding:5px 8px;border-radius:6px;border:1px solid transparent}
.lv-mx-row.is-key{border-color:rgba(166,127,214,.6);background:rgba(123,86,163,.12)}
.lv-mx-theme{font-family:var(--font-ui);font-weight:600;color:var(--silver-hi)}
.lv-mx-note{display:block;font-style:normal;font-family:var(--font-body);font-weight:400;font-size:10px;color:var(--ame-light);margin-top:2px}
.lv-bar{display:block;height:5px;background:rgba(255,255,255,.07);border-radius:3px;overflow:hidden}
.lv-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--ame),var(--ame-glow));border-radius:3px}
.lv-bar.pr i{background:linear-gradient(90deg,var(--ame-glow),var(--ame-light))}
.lv-mx-priority{display:flex;align-items:center;gap:8px}
.lv-mx-priority .lv-bar{flex:1}
.lv-mx-priority b{font-family:var(--font-ui);font-weight:600;font-size:10px;color:var(--silver-hi);min-width:44px}
.lv-dots{display:inline-flex;gap:3px}
.lv-dots i{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.08)}
.lv-dots.intent i.on{background:var(--ame-glow)}
.lv-dots.difficulty i.on{background:var(--silver-lo)}
/* 02 visibility chart */
.lv-chart{display:block;width:100%;height:auto;font-family:var(--font-body)}
.lv-axis-title{fill:var(--silver-lo);font-size:9px;font-family:var(--font-ui);font-weight:600}
.lv-tick{fill:var(--silver-lo);font-size:8.5px}
.lv-gridline{stroke:#26232e;stroke-width:1}
.lv-colbar{transform-box:fill-box;transform-origin:bottom;transform:scaleY(0)}
.lv-colbar.hi{fill:url(#lv-bar-fill)}
.lv-colbar.gen{fill:#8f8b97}
.draw .lv-colbar{animation:lvgrow .55s cubic-bezier(.2,.8,.2,1) var(--d) forwards}
@keyframes lvgrow{to{transform:scaleY(1)}}
.lv-general{fill:none;stroke:#9a96a3;stroke-width:1.8}
.lv-gpt{fill:#b5b1bd}
.lv-line{fill:none;stroke:var(--ame-glow);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1000;stroke-dashoffset:1000}
.lv-area{fill:url(#lv-fill);opacity:0}
.lv-pt{fill:var(--ame-light);stroke:var(--panel);stroke-width:1.2;opacity:0;transform-box:fill-box;transform-origin:center;transform:scale(.4)}
.lv-ann{opacity:0}
.lv-ann-line{stroke:var(--ame-glow);stroke-width:1;stroke-dasharray:3 3;opacity:.8}
.lv-ann-text{fill:var(--silver-hi);font-size:9px}
.lv-call{opacity:0}
.lv-call-bg{fill:rgba(20,20,27,.86)}
.lv-call-big{fill:#fff;font-size:14px;font-family:var(--font-ui);font-weight:600}
.lv-call-small{fill:var(--silver-lo);font-size:8.5px}
.draw .lv-line{animation:gdraw 2.2s cubic-bezier(.45,.05,.3,1) .2s forwards}
.draw .lv-pt{animation:gpop .3s cubic-bezier(.2,.9,.3,1.3) var(--d) forwards}
.draw .lv-ann,.draw .lv-call{animation:lvfade .4s ease var(--d) forwards}
.draw .lv-area{animation:lvfade .9s ease var(--d) forwards}
@keyframes lvfade{to{opacity:1}}
.lv-legend{display:flex;gap:16px;margin-top:4px;font-size:10.5px;color:var(--silver-lo)}
.lv-legend i{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px;vertical-align:middle}
.lv-legend .hi{background:var(--ame-glow)}.lv-legend .gen{background:#9a96a3}
/* 03 buyer journey */
.lv-stages{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-bottom:10px}
.lv-stages li{display:flex;align-items:center;gap:7px;font-family:var(--font-ui);font-weight:600;font-size:10.5px;padding:5px 8px;border:1px solid var(--line);border-radius:6px;position:relative}
.lv-stages li+li::before{content:"";position:absolute;left:-6px;top:50%;width:6px;height:1px;background:var(--ame)}
.lv-stage-n{width:18px;height:18px;border-radius:50%;background:rgba(123,86,163,.25);color:var(--ame-light);display:grid;place-items:center;font-size:10px;flex:none}
.lv-page-wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:12px;align-items:center}
.lv-page{background:#0d0d14;border:1px solid var(--line);border-radius:8px;padding:8px;display:flex;flex-direction:column;gap:6px}
.lv-page-bar{display:flex;gap:4px}.lv-page-bar i{width:5px;height:5px;border-radius:50%;background:#26232e}
.lv-page-hero,.lv-page-proof,.lv-page-form{position:relative;border:1px dashed #2f2b3a;border-radius:6px;padding:7px}
.lv-page-h1{display:block;height:7px;width:70%;background:#3a3446;border-radius:3px;margin-bottom:4px}.lv-page-h1.short{width:45%}
.lv-page-cta{display:block;width:30%;height:10px;margin-top:5px;border-radius:3px;background:linear-gradient(90deg,var(--ame),var(--ame-glow))}
.lv-page-proof{display:flex;gap:5px}.lv-page-proof i{flex:1;height:16px;background:#1a1822;border-radius:4px}
.lv-page-form{display:flex;flex-direction:column;gap:4px}.lv-page-form i{height:6px;width:60%;background:#1a1822;border-radius:3px}.lv-page-form i.btn{width:28%;height:9px;background:var(--ame);padding:0;border:0;box-shadow:none;border-radius:3px}
.lv-callout{position:absolute;right:-8px;top:-8px;width:17px;height:17px;border-radius:50%;background:var(--ame-glow);color:#0a0a0f;font-family:var(--font-ui);font-weight:600;font-size:10px;display:grid;place-items:center}
.lv-callout.c3{top:auto;bottom:-8px}
.lv-callouts{list-style:none;display:flex;flex-direction:column;gap:7px;font-size:11px;color:var(--silver-hi)}
.lv-callouts li{display:flex;align-items:center;gap:8px}
.lv-callouts .lv-callout{position:static;flex:none}
.lv-compare{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:8px}
.lv-compare>div{border:1px solid var(--line);border-radius:8px;padding:7px 8px}
.lv-compare .rec{border-color:rgba(166,127,214,.6)}
.lv-compare h4{font-family:var(--font-ui);font-weight:600;font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--silver-lo);margin-bottom:6px}
.lv-compare .rec h4{color:var(--ame-light)}
.lv-compare ol{list-style:none;display:flex;flex-wrap:wrap;gap:4px;font-size:10px}
.lv-compare li{padding:3px 6px;border-radius:4px;background:rgba(255,255,255,.05);color:var(--silver-lo)}
.lv-compare .rec li{background:rgba(123,86,163,.16);color:var(--silver-hi)}
/* 04 attribution pathway */
.lv-attr{display:grid;grid-template-columns:1fr;gap:8px}
.lv-path{width:100%;height:auto;display:block;font-family:var(--font-body)}
.lv-col{fill:var(--silver-lo);font-size:11px;font-family:var(--font-ui);font-weight:600;letter-spacing:.14em;text-transform:uppercase}
.lv-flow{fill:none;stroke:var(--ame-glow);stroke-linecap:round}
.lv-node rect{fill:#14141b;stroke:#3a3644;stroke-width:1}
.lv-node text{fill:var(--silver-hi);font-size:13px;font-family:var(--font-ui);font-weight:600}
.lv-node.src rect{fill:#101017}
.lv-node.hi rect{stroke:var(--ame-glow);fill:rgba(123,86,163,.2)}
.lv-summary{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.lv-summary div{border:1px solid var(--line);border-radius:6px;padding:5px 8px}
.lv-summary dt{font-family:var(--font-ui);font-weight:600;font-size:10.5px}
.lv-summary dd{font-size:9.5px;color:var(--silver-lo);margin-top:1px}
/* responsive */
@media(max-width:1024px){
  .lv-layout{grid-template-columns:minmax(0,1fr);gap:18px}
  .lv-nav{min-width:0}
  .lever-tabs{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;border-top:0}
  .lever-tab{grid-template-columns:auto 1fr;min-height:56px;border:1px solid var(--line);border-radius:8px}
  .lever-num,.lever-arrow,.lever-hint{display:none}
  .lv-tag{display:none}
}
@media(max-width:700px){
  .lever-tabs{display:flex;flex-direction:row;overflow-x:auto;gap:8px;padding-bottom:6px;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;min-width:0;max-width:100%}
  .lever-tab{flex:0 0 auto;width:auto;min-width:170px;min-height:48px;scroll-snap-align:start}
  .commercial-levers__panel-content{grid-template-columns:1fr}
  .lv-scenario{text-align:left}
  .lv-mx-head{display:none}
  .lv-mx-row{grid-template-columns:1fr 1fr;gap:8px}
  .lv-mx-theme{grid-column:1/-1}
  .lv-ann-text{display:none}
  .lv-stages{grid-template-columns:1fr 1fr}
  .lv-page-wrap,.lv-compare,.lv-summary{grid-template-columns:1fr}
  .lv-top span:last-child{display:none}
  .lv-steps{gap:10px}
  .lv-step small,.lv-step-arrow{display:none}
}

/* ---- visual 01: bars fill in, lit dots breathe ---- */
.lv-mx-row .lv-bar i{transform-origin:left center;transform:scaleX(0)}
.draw .lv-mx-row .lv-bar i{animation:lvfill .9s cubic-bezier(.2,.8,.2,1) forwards}
.draw .lv-mx-row:nth-child(2) .lv-bar i{animation-delay:.1s}.draw .lv-mx-row:nth-child(3) .lv-bar i{animation-delay:.22s}.draw .lv-mx-row:nth-child(4) .lv-bar i{animation-delay:.34s}.draw .lv-mx-row:nth-child(5) .lv-bar i{animation-delay:.46s}.draw .lv-mx-row:nth-child(6) .lv-bar i{animation-delay:.58s}
@keyframes lvfill{to{transform:scaleX(1)}}
.lv-dots.intent{--dc:rgba(166,127,214,.95)}.lv-dots.difficulty{--dc:rgba(154,150,163,.7)}
.draw .lv-dots i.on{animation:lvdot 2.2s ease-in-out infinite}
.draw .lv-dots i:nth-child(2).on{animation-delay:.15s}.draw .lv-dots i:nth-child(3).on{animation-delay:.3s}.draw .lv-dots i:nth-child(4).on{animation-delay:.45s}.draw .lv-dots i:nth-child(5).on{animation-delay:.6s}
@keyframes lvdot{0%,100%{transform:scale(1);box-shadow:0 0 0 rgba(0,0,0,0)}50%{transform:scale(1.35);box-shadow:0 0 7px var(--dc)}}
/* ---- visual 03: the journey builds in order: steps, page blocks, callouts, then the recommended path lights up ---- */
.lv-steps > *,.lv-page-hero,.lv-page-proof,.lv-page-form,.lv-callouts li,.lv-compare > div{opacity:0}
.lv-page .lv-callout{transform:scale(0)}
.lv-page-cta,.lv-page-form i.btn{transform-origin:left center;transform:scaleX(0)}
.draw .lv-steps > *{animation:lvin .4s ease forwards}
.draw .lv-steps > :nth-child(1){animation-delay:.05s}.draw .lv-steps > :nth-child(2){animation-delay:.2s}.draw .lv-steps > :nth-child(3){animation-delay:.35s}.draw .lv-steps > :nth-child(4){animation-delay:.5s}.draw .lv-steps > :nth-child(5){animation-delay:.65s}.draw .lv-steps > :nth-child(6){animation-delay:.8s}.draw .lv-steps > :nth-child(7){animation-delay:.95s}
.draw .lv-page-hero{animation:lvup .5s ease .9s forwards}.draw .lv-page-proof{animation:lvup .5s ease 1.15s forwards}.draw .lv-page-form{animation:lvup .5s ease 1.4s forwards}
.draw .lv-page-cta{animation:lvfill .6s cubic-bezier(.2,.8,.2,1) 1.25s forwards}.draw .lv-page-form i.btn{animation:lvfill .6s cubic-bezier(.2,.8,.2,1) 1.7s forwards}
.draw .lv-page .lv-callout{animation:lvpop .35s cubic-bezier(.2,.9,.3,1.3) forwards}
.draw .lv-page .lv-callout.c1{animation-delay:1.35s}.draw .lv-page .lv-callout.c2{animation-delay:1.6s}.draw .lv-page .lv-callout.c3{animation-delay:1.5s}.draw .lv-page .lv-callout.c4{animation-delay:1.85s}
.draw .lv-callouts li{animation:lvin .4s ease forwards}
.draw .lv-callouts li:nth-child(1){animation-delay:1.35s}.draw .lv-callouts li:nth-child(2){animation-delay:1.6s}.draw .lv-callouts li:nth-child(3){animation-delay:1.5s}.draw .lv-callouts li:nth-child(4){animation-delay:1.85s}
.draw .lv-compare > div{animation:lvup .5s ease 2.05s forwards}.draw .lv-compare > div.rec{animation-delay:2.25s}
.draw .lv-compare .rec li{animation:lvchip .5s ease forwards}
.draw .lv-compare .rec li:nth-child(1){animation-delay:2.5s}.draw .lv-compare .rec li:nth-child(2){animation-delay:2.7s}.draw .lv-compare .rec li:nth-child(3){animation-delay:2.9s}.draw .lv-compare .rec li:nth-child(4){animation-delay:3.1s}
@keyframes lvin{to{opacity:1}}
@keyframes lvup{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@keyframes lvpop{to{transform:scale(1)}}
@keyframes lvchip{to{border-color:var(--ame-glow);box-shadow:0 0 10px rgba(166,127,214,.35);color:#fff}}
/* ---- visual 04: glow on the pathway, a light travelling along every connection, the key node breathing ---- */
.lv-flow{filter:drop-shadow(0 0 3px rgba(166,127,214,.6))}
.lv-flow-light{fill:none;stroke:#dcc6ff;stroke-width:2.4;stroke-linecap:round;stroke-dasharray:14 86;stroke-dashoffset:100;opacity:0;mix-blend-mode:screen;filter:drop-shadow(0 0 4px rgba(207,166,255,.95)) drop-shadow(0 0 9px rgba(160,100,240,.6))}
.draw .lv-flow-light{opacity:1;animation:lvflow 1.5s linear infinite}
@keyframes lvflow{to{stroke-dashoffset:0}}
.lv-node rect{filter:drop-shadow(0 0 4px rgba(166,127,214,.22))}
.lv-node.hi rect{filter:drop-shadow(0 0 6px rgba(166,127,214,.75)) drop-shadow(0 0 14px rgba(140,80,220,.45))}
.draw .lv-node.hi rect{animation:lvnode 2.4s ease-in-out infinite}
@keyframes lvnode{50%{stroke:#dcc6ff;fill:rgba(123,86,163,.36)}}
@media (prefers-reduced-motion: reduce){
  .lv-mx-row .lv-bar i,.lv-page-cta,.lv-page-form i.btn,.lv-page .lv-callout{transform:none;animation:none !important}
  .lv-steps > *,.lv-page-hero,.lv-page-proof,.lv-page-form,.lv-callouts li,.lv-compare > div{opacity:1;animation:none !important}
  .draw .lv-dots i.on,.draw .lv-node.hi rect{animation:none !important}
  .lv-flow-light{opacity:.6;animation:none !important}
}
html:not(.js) .lv-mx-row .lv-bar i,html:not(.js) .lv-page-cta,html:not(.js) .lv-page-form i.btn,html:not(.js) .lv-page .lv-callout{transform:none}
html:not(.js) .lv-steps > *,html:not(.js) .lv-page-hero,html:not(.js) .lv-page-proof,html:not(.js) .lv-page-form,html:not(.js) .lv-callouts li,html:not(.js) .lv-compare > div{opacity:1}
@media (prefers-reduced-motion: reduce){
  html.js .commercial-levers__panel-content{transition:none;transform:none !important}
  .lv-line{stroke-dashoffset:0;animation:none !important}
  .lv-pt,.lv-ann,.lv-call,.lv-area,.lv-colbar{opacity:1;transform:none;animation:none !important}
}
html:not(.js) .lv-line{stroke-dashoffset:0}
html:not(.js) .lv-pt,html:not(.js) .lv-ann,html:not(.js) .lv-call,html:not(.js) .lv-area,html:not(.js) .lv-colbar{opacity:1;transform:none}

/* ===== Industries: "Different markets. Different buying journeys." (implemented from design-reference.png) ===== */
.industries{background:transparent;border-top:1px solid var(--line);padding-top:clamp(21px,2.55vw,33px)}
/* editorial heading row: brand | eyebrow + H2 | supporting copy | handwritten note */
.ind-head{display:grid;grid-template-columns:auto minmax(0,1fr) minmax(360px,440px) auto;gap:clamp(24px,3.5vw,56px);align-items:center;padding:0 var(--gutter) 18px}
.ind-brand{display:flex;flex-direction:column;align-self:start;font-family:var(--font-ui);font-weight:600;font-size:9.5px;letter-spacing:.3em;text-transform:uppercase;color:var(--silver-hi);padding-top:4px;min-width:96px}
.ind-brand small{font-size:7.5px;color:var(--silver-lo);margin-top:3px;letter-spacing:.3em}
.ind-eyebrow{font-family:var(--font-body);font-weight:500;font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:var(--ame-glow);margin-bottom:12px}
.ind-heading h2{font-family:var(--font-head);font-weight:700;font-size:clamp(28px,3vw,42px);line-height:1.06;letter-spacing:-.02em;color:#fff}
@media(min-width:1180px){.ind-heading h2{white-space:nowrap}}
.ind-support{font-family:var(--font-body);font-size:12.5px;line-height:1.6;color:var(--silver-lo);align-self:center;padding-bottom:0}
.ind-note{position:relative;align-self:start;color:var(--ame-glow);font-family:"Segoe Script","Bradley Hand","Brush Script MT","Comic Sans MS",cursive;font-style:italic;font-size:15px;line-height:1.25;transform:rotate(-8deg);padding-top:8px;text-align:right;min-width:170px}
.ind-note-arrow{width:28px;height:28px;display:block;margin:6px 0 0 auto;transform:rotate(10deg)}
/* accordion */
.ind-accordion{display:flex;height:450px;min-height:450px;background:#000;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.industry-panel{position:relative;flex:1 1 0;min-width:0;overflow:hidden;background:var(--panel-2);filter:saturate(.92);transition:flex-grow 600ms cubic-bezier(.22,1,.36,1),filter 400ms ease}
.industry-panel+.industry-panel{border-left:1px solid var(--line)}
.industry-panel.is-active{flex-grow:2.35;filter:none}
.industry-panel__image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
[data-industry="professional"] img{object-position:52% center}
[data-industry="technology"] img{object-position:55% center}
[data-industry="construction"] img{object-position:56% center}
[data-industry="property"] img{object-position:54% center}
.industry-panel::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,10,15,.25),rgba(10,10,15,.78)),linear-gradient(90deg,rgba(10,10,15,.62),transparent 65%);pointer-events:none;transition:background 400ms ease}
.industry-panel:not(.is-active)::after{background:rgba(10,10,15,.52)}
/* overlays are positioned against the panel box, never the image */
.industry-panel__trigger{position:absolute;z-index:2;top:20px;left:20px;right:20px;min-height:44px;padding:4px 0;background:none;border:0;color:#fff;text-align:left;cursor:pointer;font-family:var(--font-ui)}
.industry-panel__trigger:focus-visible{outline:2px solid var(--ame-light);outline-offset:4px}
.industry-panel__title{display:block;font-family:var(--font-ui);font-weight:600;font-size:clamp(16px,1.35vw,19px);line-height:1.2;letter-spacing:-.01em;max-width:11em;text-shadow:0 1px 2px rgba(0,0,0,.4)}
.industry-panel.is-active .industry-panel__title{font-size:clamp(22px,1.9vw,27px);max-width:none}
.industry-panel__body{position:absolute;z-index:2;left:20px;right:20px;top:64px;bottom:22px;display:flex;flex-direction:column;opacity:0;transition:opacity 350ms ease}
.industry-panel.is-active .industry-panel__body{opacity:1;transition-delay:200ms}
.industry-panel__body[hidden]{display:none}
.industry-panel__descriptor{font-family:var(--font-body);font-size:clamp(14px,1.15vw,16px);line-height:1.5;color:var(--silver-hi);max-width:26em;margin-top:10px}
.industry-panel__journey{flex:1;display:flex;align-items:center;min-height:0}
.journey{width:100%;max-width:640px;aspect-ratio:1000/220;height:auto;display:block;overflow:visible}
.journey-path{fill:none;stroke:var(--ame-glow);stroke-width:2.5;stroke-linecap:round;stroke-dasharray:1000;stroke-dashoffset:1000}
.journey-glow{fill:none;stroke:var(--ame);stroke-width:10;stroke-linecap:round;opacity:.28;filter:blur(3px);stroke-dasharray:1000;stroke-dashoffset:1000}
.journey-node{opacity:0}
.journey-halo{fill:var(--ame-glow);opacity:.22}
.journey-dot{fill:#fff;stroke:var(--ame-light);stroke-width:2.5}
.journey-label{fill:#fff;font-family:var(--font-body);font-size:24px;font-weight:500}
.industry-panel.is-active .journey-path,.industry-panel.is-active .journey-glow{animation:drawJourney 900ms ease forwards;animation-delay:250ms}
.industry-panel.is-active .journey-node{animation:journeyNode 400ms ease forwards;animation-delay:var(--d)}
@keyframes drawJourney{to{stroke-dashoffset:0}}
/* after the draw, a light travels the route on a loop and each stage flares as it arrives */
.journey-light{fill:none;stroke:#e6d6ff;stroke-width:4;stroke-linecap:round;stroke-dasharray:60 940;stroke-dashoffset:0;opacity:0;mix-blend-mode:screen;filter:drop-shadow(0 0 4px rgba(207,166,255,.95)) drop-shadow(0 0 12px rgba(160,100,240,.7))}
.industry-panel.is-active .journey-light{opacity:1;animation:journeyFlow 3.2s linear 1.3s infinite}
@keyframes journeyFlow{to{stroke-dashoffset:-1000}}
.journey-halo,.journey-dot{transform-box:fill-box;transform-origin:center}
.industry-panel.is-active .journey-halo{animation:journeyNode 400ms ease var(--d) forwards,journeyHalo 3.2s ease-out calc(1.3s + (var(--f) - 0.1) * 3.2s) infinite}
.industry-panel.is-active .journey-dot{animation:journeyDot 3.2s ease-out calc(1.3s + (var(--f) - 0.1) * 3.2s) infinite}
@keyframes journeyHalo{0%{transform:scale(1);opacity:.22}6%{transform:scale(2.2);opacity:.65}32%{transform:scale(1);opacity:.22}100%{transform:scale(1);opacity:.22}}
@keyframes journeyDot{0%{fill:#fff;transform:scale(1)}6%{fill:#efe4ff;transform:scale(1.4);filter:drop-shadow(0 0 8px rgba(207,166,255,1))}32%{fill:#fff;transform:scale(1);filter:none}100%{fill:#fff;transform:scale(1)}}
@keyframes journeyNode{to{opacity:1}}
.journey-list{display:none}
.industry-panel__cta{align-self:flex-start;margin-top:8px}
/* small closing strip from the reference */
.ind-foot{display:flex;justify-content:space-between;gap:16px;padding:12px var(--gutter);font-family:var(--font-ui);font-weight:600;font-size:8.5px;letter-spacing:.3em;text-transform:uppercase;color:var(--silver-lo)}
/* tablet */
@media(max-width:1024px){
  .ind-head{grid-template-columns:auto 1fr;row-gap:14px}
  .ind-support{grid-column:2;align-self:start;padding-bottom:0;max-width:520px}
  .ind-note{grid-column:2;justify-self:start;transform:rotate(-4deg);text-align:left;min-width:0}
  .ind-note-arrow{margin:4px 0 0 0}
  .ind-accordion{height:450px}
}
/* phones: vertical accordion */
@media(max-width:767px){
  .ind-head{grid-template-columns:1fr;gap:10px;padding-bottom:18px}
  .ind-brand{display:none}
  .ind-support{grid-column:1;margin-top:4px}
  .ind-note{display:none}
  .ind-accordion{flex-direction:column;height:auto;min-height:0}
  .industry-panel{flex:none;height:112px;transition:height 500ms cubic-bezier(.22,1,.36,1),filter 400ms ease;filter:none}
  .industry-panel+.industry-panel{border-left:0;border-top:1px solid var(--line)}
  .industry-panel.is-active{height:430px;flex-grow:0}
  .industry-panel__trigger{top:0;left:0;right:0;min-height:112px;padding:0 20px}
  .industry-panel__title{font-size:19px;max-width:none}
  .industry-panel.is-active .industry-panel__title{font-size:22px}
  .industry-panel__body{top:96px;bottom:18px;left:20px;right:20px}
  .industry-panel__descriptor{margin-top:0;font-size:14px}
  .journey{display:none}
  .journey-list{display:flex;flex-direction:column;gap:8px;list-style:none;counter-reset:j;margin:14px 0}
  .journey-list li{position:relative;padding-left:22px;font-family:var(--font-body);font-size:14px;color:#fff}
  .journey-list li::before{content:"";position:absolute;left:0;top:6px;width:9px;height:9px;border-radius:50%;background:#fff;box-shadow:0 0 0 3px rgba(166,127,214,.35)}
  .journey-list li+li::after{content:"";position:absolute;left:4px;top:-10px;width:1px;height:12px;background:var(--ame-glow)}
  .industry-panel__cta{min-height:44px;display:inline-flex;align-items:center}
}
/* reduced motion: final state, no draw */
@media (prefers-reduced-motion: reduce){
  .industry-panel,.industry-panel::after,.industry-panel__body{transition:none}
  .industry-panel.is-active .journey-path,.industry-panel.is-active .journey-glow,.industry-panel.is-active .journey-node,.industry-panel.is-active .journey-halo,.industry-panel.is-active .journey-dot,.industry-panel.is-active .journey-light{animation:none}
  .journey-light{opacity:0}
  .industry-panel.is-active .journey-path,.industry-panel.is-active .journey-glow{stroke-dashoffset:0}
  .industry-panel.is-active .journey-node{opacity:1}
}
html:not(.js) .industry-panel .journey-path,html:not(.js) .industry-panel .journey-glow{stroke-dashoffset:0}
html:not(.js) .industry-panel .journey-node{opacity:1}

/* ===== Proof: "Measure what changed. Know what caused it." (implemented from design-reference.png) ===== */
.proof-section{position:relative;display:grid;grid-template-columns:minmax(420px,38%) minmax(0,62%);min-height:760px;overflow:hidden;background:radial-gradient(circle at 61% 18%,rgba(123,86,163,.08),transparent 34%),#0a0a0f}
.proof-section__content{position:relative;z-index:2;display:flex;flex-direction:column;justify-content:center;min-width:0;padding:76px 36px 58px var(--gutter);text-align:left}
.proof-section__eyebrow{display:flex;align-items:center;gap:24px;margin-bottom:26px;color:#a67fd6;font-family:var(--font-body);font-size:13px;font-weight:500;letter-spacing:.22em;text-transform:uppercase}
.proof-section__eyebrow::after{content:"";width:54px;height:1px;background:#9a96a3}
/* Sized so each of the three forced lines fits the 38% column at every desktop width. */
.proof-section h2{max-width:600px;margin:0;color:#f4f4f6;font-family:var(--font-head);font-size:clamp(48px,4.4vw,76px);font-weight:700;line-height:.95;letter-spacing:-.045em;white-space:nowrap}
.proof-section__content>p{max-width:480px;margin:30px 0 0;color:#d2ced8;font-family:var(--font-body);font-size:20px;font-weight:400;line-height:1.55}
.proof-section__cta{align-self:flex-start;margin-top:28px}
.proof-section__annotation{position:relative;align-self:flex-start;margin-top:34px;color:#a67fd6;font-family:"Segoe Script","Bradley Hand","Brush Script MT","Comic Sans MS",cursive;font-style:italic;font-size:32px;line-height:1.1;transform:rotate(-6deg);transform-origin:left center}
.proof-section__stroke{display:block;width:100%;height:10px;margin-top:2px;overflow:visible}
.proof-section__stroke path{fill:none;stroke:#a67fd6;stroke-width:2;stroke-linecap:round}
.proof-section__footer{display:flex;align-items:center;gap:22px;margin-top:auto;padding-top:56px;color:#9a96a3;font-family:var(--font-ui);font-weight:600;font-size:8.5px;letter-spacing:.3em;line-height:1.7;text-transform:uppercase}
.proof-section__rule{display:block;width:24px;height:1px;background:#9a96a3;flex:none}
/* right column: the supplied transparent artwork, whole and uncropped, anchored to its column */
.proof-section__artwork{position:relative;z-index:1;display:flex;align-items:center;justify-content:flex-end;min-width:0;padding:28px 0 12px}
.proof-section__artwork img{display:block;width:min(100%,1120px);height:auto;max-height:730px;object-fit:contain;object-position:right center;transform:translateX(1.5%)}
/* entrance: the composition fades and rises once, as one object */
html.js .proof-section__artwork img{opacity:0;transform:translateX(1.5%) translateY(18px);transition:opacity 700ms ease,transform 700ms ease}
html.js .proof-section.is-in .proof-section__artwork img{opacity:1;transform:translateX(1.5%)}
/* tablet */
@media(min-width:768px) and (max-width:1100px){
  .proof-section{grid-template-columns:minmax(0,43%) minmax(0,57%);min-height:640px}
  .proof-section__content{padding:56px 24px 40px clamp(24px,4vw,48px)}
  .proof-section h2{font-size:clamp(36px,4.6vw,54px)}
  .proof-section__content>p{font-size:17px}
  .proof-section__annotation{font-size:28px}
  .proof-section__artwork img{max-height:600px}
}
@media(min-width:768px) and (max-width:900px){.proof-section__statement,.proof-section__rule{display:none}.proof-section__eyebrow{font-size:11px;gap:16px}}
/* phones */
@media(max-width:767px){
  .proof-section{grid-template-columns:1fr;min-height:auto}
  .proof-section__content{padding:72px 20px 28px}
  .proof-section h2{font-size:clamp(44px,13vw,62px);line-height:.98;max-width:none;white-space:normal}
  .proof-section__br{display:none}
  .proof-section__content>p{font-size:18px}
  .proof-section__annotation{font-size:28px}
  .proof-section__footer{display:none}
  .proof-section__artwork{justify-content:center;padding:10px 0 42px}
  .proof-section__artwork img{width:115%;max-width:none;transform:none}
  html.js .proof-section__artwork img{transform:translateY(18px)}
  html.js .proof-section.is-in .proof-section__artwork img{transform:none}
}
@media (prefers-reduced-motion: reduce){
  html.js .proof-section__artwork img{opacity:1;transform:translateX(1.5%);transition:none}
  .proof-section__cta{transition:none}
  @media(max-width:767px){html.js .proof-section__artwork img{transform:none}}
}

/* ===== Ways to work together (implemented from design-reference.png) ===== */
.ways-to-work{position:relative;width:100%;min-height:0;height:auto;overflow:hidden;background:transparent;border-top:1px solid var(--line)}
/* header: copy left, brand statement right */
.ways-to-work__header{display:grid;grid-template-columns:minmax(0,1fr) 230px;gap:48px;align-items:start;padding:22px var(--gutter) 18px;border-bottom:1px solid #393640}
.ways-to-work__eyebrow{color:#a67fd6;font-family:var(--font-body);font-size:12px;line-height:1.3;font-weight:500;letter-spacing:.24em;text-transform:uppercase}
.ways-to-work h2{margin:6px 0 6px;color:#f4f4f6;font-family:var(--font-head);font-size:clamp(40px,3.5vw,52px);font-weight:700;line-height:1;letter-spacing:-.04em}
.ways-to-work__intro{color:#9a96a3;font-family:var(--font-body);font-size:17px;line-height:1.4;margin:0}
.ways-to-work__brand{padding-top:2px;font-family:var(--font-ui);font-weight:600;font-size:9.5px;letter-spacing:.24em;line-height:1.9;text-transform:uppercase;color:#9a96a3}
.ways-to-work__brand p{margin:0}
.ways-to-work__brand p:first-child{color:#d2ced8}
.ways-to-work__pillars{margin-top:12px !important;padding-top:10px;border-top:1px solid #393640;letter-spacing:.3em}
/* engagement rows: fixed-height list, full-bleed bands, four aligned zones with solid rules */
.engagement-list{display:flex;flex-direction:column;height:315px}
.engagement-row{display:grid;grid-template-columns:minmax(130px,11%) minmax(360px,33%) minmax(360px,29%) minmax(250px,27%);align-items:center;flex:1 1 0;min-height:0;position:relative;border-top:1px solid transparent;border-bottom:1px solid #26232e;transition:flex-grow 450ms cubic-bezier(.22,1,.36,1),background-color 300ms ease,border-color 300ms ease}
.engagement-row:not(.is-active){flex-grow:1;background:#0a0a0f}
.engagement-row.is-active{flex-grow:1.28;background:linear-gradient(90deg,rgba(70,42,101,.94),rgba(51,34,73,.96));border-color:#a67fd6}
.engagement-row__number{padding-left:var(--gutter);color:rgba(244,244,246,.42);font-family:var(--font-head);font-size:clamp(56px,5.6vw,88px);font-weight:700;line-height:.8;letter-spacing:-.08em;transition:color 300ms ease}
.engagement-row.is-active .engagement-row__number{color:#ceb5f3}
.engagement-row__offer,.engagement-row__panel,.engagement-row__action{height:100%;display:flex;align-items:center;border-left:1px solid #393640;min-width:0}
.engagement-row__offer{padding:0 24px 0 clamp(24px,2.6vw,48px)}
.engagement-row__trigger{display:flex;flex-direction:column;align-items:flex-start;gap:4px;width:100%;min-height:44px;padding:4px 0;background:none;border:0;color:inherit;text-align:left;cursor:pointer;font-family:var(--font-ui)}
.engagement-row__trigger:focus-visible{outline:2px solid #ceb5f3;outline-offset:6px}
.engagement-row__label{font-family:var(--font-ui);font-weight:600;font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:#9a96a3}
.engagement-row.is-active .engagement-row__label{color:#ceb5f3}
.engagement-row__title{color:#f4f4f6;font-family:var(--font-head);font-size:26px;font-weight:700;line-height:.95;letter-spacing:-.02em;text-transform:uppercase}
.engagement-row__headline{font-family:var(--font-body);font-weight:400;font-size:clamp(16px,1.25vw,18px);line-height:1.3;color:#f4f4f6}
.engagement-row__indicator{display:none}
.engagement-row__panel{padding:0 clamp(20px,2.4vw,40px)}
.engagement-row__desc{margin:0;color:#9a96a3;font-family:var(--font-body);font-size:clamp(14px,1.1vw,16px);line-height:1.4;max-width:24em}
.engagement-row.is-active .engagement-row__desc{color:#ceb5f3}
.engagement-row__action{padding:0 20px 0 clamp(24px,2vw,40px);position:relative;gap:20px;justify-content:flex-start}
.engagement-row__cta{justify-content:space-between;gap:20px;padding-bottom:8px;white-space:nowrap;flex:none}
/* handwritten annotation, only in the active Modernise row, at the far right beyond the CTA */
.engagement-row__note{display:none;position:relative;flex:none;transform:rotate(-8deg);color:#ceb5f3;font-family:"Segoe Script","Bradley Hand","Brush Script MT","Comic Sans MS",cursive;font-style:italic;font-size:14px;line-height:1.15;text-align:left;white-space:nowrap}
.engagement-row__stroke{display:block;width:100%;height:8px;margin-top:2px;overflow:visible}
.engagement-row__stroke path{fill:none;stroke:#ceb5f3;stroke-width:1.6;stroke-linecap:round}
@media(min-width:1600px){.engagement-row.is-active .engagement-row__note{display:block}}
/* bottom decorative row */
.ways-to-work__foot{display:flex;align-items:center;gap:28px;height:28px;padding:0 var(--gutter);font-family:var(--font-ui);font-weight:600;font-size:9px;letter-spacing:.3em;text-transform:uppercase;color:#9a96a3;white-space:nowrap}
.ways-to-work__foot i{flex:1;height:1px;background:#393640}
/* tablet */
@media(min-width:768px) and (max-width:1100px){
  .ways-to-work__header{grid-template-columns:1fr;padding:32px clamp(24px,4vw,48px) 24px}
  .ways-to-work__brand{display:none}
  .ways-to-work h2{font-size:clamp(34px,4.4vw,48px)}
  .ways-to-work__intro{font-size:16px}
  .engagement-list{height:auto}
  .engagement-row{flex:none;min-height:0;grid-template-columns:minmax(96px,12%) minmax(0,1fr) minmax(200px,30%);padding:18px 0}
  .engagement-row__number{font-size:clamp(56px,7vw,80px);padding-left:clamp(24px,4vw,48px)}
  .engagement-row__number{grid-column:1;grid-row:1 / span 2}
  .engagement-row__offer{grid-column:2;grid-row:1;border-left:1px solid #393640;padding-right:20px}
  .engagement-row__panel{grid-column:2;grid-row:2;border-left:0;padding:8px 20px 0 clamp(20px,2.6vw,40px);height:auto}
  .engagement-row__action{grid-column:3;grid-row:1 / span 2}
  .engagement-row__title{font-size:26px}
  .engagement-row__action{padding-right:clamp(20px,4vw,48px)}
  .engagement-row__cta{white-space:normal;font-size:16px}
  .engagement-row__desc{font-size:15px}
  .engagement-row__note{display:none !important}
}
/* phones: compact vertical accordion */
@media(max-width:767px){
  .ways-to-work__header{grid-template-columns:1fr;padding:56px 20px 28px}
  .ways-to-work__brand{display:none}
  .ways-to-work h2{font-size:clamp(36px,10vw,48px)}
  .ways-to-work__br{display:none}
  .ways-to-work__intro{font-size:16px}
  .engagement-list{height:auto}
  .engagement-row{display:block;flex:none;overflow:hidden;padding:22px 20px;transition:background-color 300ms ease,border-color 300ms ease}
  .engagement-row:not(.is-active){min-height:88px}
  .engagement-row.is-active{min-height:260px}
  .engagement-row__number{padding-left:0;font-size:48px;line-height:1;color:rgba(244,244,246,.42);margin-bottom:10px}
  .engagement-row__offer,.engagement-row__panel,.engagement-row__action{height:auto;display:block;border-left:0;padding:0}
  .engagement-row__trigger{position:relative;padding-right:40px}
  .engagement-row__title{font-size:26px}
  .engagement-row__indicator{display:block;position:absolute;right:4px;top:50%;width:12px;height:12px;border-right:1.5px solid #ceb5f3;border-bottom:1.5px solid #ceb5f3;transform:translateY(-70%) rotate(45deg);transition:transform 250ms ease}
  .engagement-row.is-active .engagement-row__indicator{transform:translateY(-30%) rotate(225deg)}
  .engagement-row:not(.is-active) .engagement-row__label,.engagement-row:not(.is-active) .engagement-row__headline,.engagement-row:not(.is-active) .engagement-row__panel,.engagement-row:not(.is-active) .engagement-row__action{display:none}
  .engagement-row__headline{font-size:18px;margin-top:4px}
  .engagement-row__desc{margin-top:12px;font-size:15px;max-width:none}
  .engagement-row__action{margin-top:18px}
  .engagement-row__cta{min-height:44px;font-size:16px;white-space:normal}
  .engagement-row__note{display:none !important}
  .ways-to-work__foot{height:auto;padding:14px 20px;font-size:8px;gap:14px}
}
@media (prefers-reduced-motion: reduce){
  .engagement-row,.engagement-row__number,.engagement-row__indicator,.engagement-row__cta{transition:none}
}

/* ===== Indicative fees (implemented from design-reference.png) ===== */
.pricing-section{width:100%;min-height:0;background:transparent;color:#f4f4f6;overflow:hidden}
.pricing-section__header{position:static;z-index:auto;border:0;transition:none;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:140px;padding:20px 24px 16px;text-align:center}
.pricing-section__eyebrow{margin:0 0 10px;color:#a67fd6;font-family:var(--font-body);font-size:13px;font-weight:500;letter-spacing:.24em;text-transform:uppercase}
.pricing-section h2{margin:0;color:#f4f4f6;font-family:var(--font-head);font-size:clamp(46px,4vw,68px);font-weight:700;line-height:1;letter-spacing:-.045em}
.pricing-section__intro{margin:10px 0 0;color:#9a96a3;font-family:var(--font-body);font-size:18px;line-height:1.5}
/* one continuous schedule: three columns, 1px solid rules, no radius, no shadow */
.pricing-schedule{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid #8b8791;border-bottom:1px solid #8b8791}
.pricing-tier{position:relative;display:flex;flex-direction:column;min-height:390px;padding:26px clamp(28px,3vw,52px) 22px;background:#0f0f15;transition:background-color .3s ease}
.pricing-tier + .pricing-tier{border-left:1px solid #8b8791}
.pricing-tier:hover{background:#13131a}
.pricing-tier--modernise{background:linear-gradient(145deg,#74529a 0%,#8d68af 46%,#735395 100%)}
.pricing-tier--modernise:hover{background:linear-gradient(145deg,#7a58a0 0%,#936eb5 46%,#79599b 100%)}
.pricing-tier > p,.pricing-tier > h3,.pricing-tier > ul{margin:0}
.pricing-tier__category{color:#bcb4c9;font-family:var(--font-head);font-size:15px;font-weight:600;letter-spacing:.2em;text-transform:uppercase}
.pricing-tier--modernise .pricing-tier__category{color:#ebe3f5}
.pricing-tier__name{margin:10px 0 0 !important;color:#f4f4f6;font-family:var(--font-head);font-size:clamp(28px,2.3vw,40px);font-weight:700;line-height:1.05;letter-spacing:-.02em}
/* handwritten annotation above the Modernise price: soft lavender, slight rotation, one solid underline */
.pricing-tier__annotation{position:relative;display:inline-block;align-self:flex-start;margin:10px 0 -14px 18px !important;color:#e6d9fb;font-family:"Segoe Script","Bradley Hand","Brush Script MT","Comic Sans MS",cursive;font-style:italic;font-size:19px;line-height:1.2;transform:rotate(-3deg);transform-origin:left center}
.pricing-tier__stroke{display:block;width:100%;height:6px;overflow:visible;margin-top:1px}
.pricing-tier__stroke path{fill:none;stroke:#e6d9fb;stroke-width:1.5;stroke-linecap:round}
/* prices: one line on desktop, FROM and /MONTH slightly smaller, baseline aligned as one unit */
.pricing-tier__price{margin-top:20px !important;color:#fff;font-family:var(--font-head);font-size:clamp(52px,5vw,82px);font-weight:700;line-height:.92;letter-spacing:-.055em;white-space:nowrap}
.pricing-tier__from,.pricing-tier__unit{font-size:.5em;letter-spacing:-.02em;text-transform:uppercase;vertical-align:baseline}
.pricing-tier__from{margin-right:.06em}
.pricing-tier__unit{margin-left:.02em}
.pricing-tier--grow .pricing-tier__price{font-size:clamp(44px,3.6vw,64px)}
.pricing-tier--grow .pricing-tier__from{font-size:.62em}
.pricing-tier--grow .pricing-tier__unit{font-size:.5em}
.pricing-tier__secondary-price{margin-top:12px !important;color:#d8d3dd;font-family:var(--font-body);font-size:21px}
.pricing-tier__frequency{margin-top:10px !important;color:#c9bfd3;font-family:var(--font-head);font-size:13px;font-weight:600;letter-spacing:.22em;text-transform:uppercase}
.pricing-tier--modernise .pricing-tier__frequency{color:#ebe3f5}
.pricing-tier__scope{margin:16px 0 0 !important;padding:12px 0;border-top:1px solid rgba(244,244,246,.65);border-bottom:1px solid rgba(244,244,246,.65);list-style:none}
.pricing-tier__scope li{margin:0 0 8px;color:#f4f4f6;font-family:var(--font-body);font-size:17px;line-height:1.35}
.pricing-tier__scope li:last-child{margin-bottom:0}
.pricing-tier__boundary{margin-top:10px !important;color:#9a96a3;font-family:var(--font-body);font-size:15px;line-height:1.4}
.pricing-tier--modernise .pricing-tier__boundary{color:#e2d9ee}
/* CTA: plain editorial link at the foot of each column */
.pricing-tier__cta{margin-top:auto;position:relative;top:14px}
.pricing-tier--modernise .pricing-tier__cta{color:#f7f2ff;border-color:rgba(247,242,255,.45)}
/* bottom terms strip */
.pricing-section__terms{position:static;margin:0;border-top:0;display:flex;align-items:center;justify-content:center;min-height:44px;padding:10px 20px;color:#9a96a3;background:#111118;font-family:var(--font-body);font-size:14px;text-align:center;border-bottom:1px solid #8b8791}
/* tablet: three columns kept, tighter padding and smaller prices */
@media(min-width:768px) and (max-width:1100px){
  .pricing-section__header{min-height:0;padding:28px 20px 22px}
  .pricing-section h2{font-size:clamp(34px,4.4vw,46px)}
  .pricing-section__intro{font-size:16px}
  .pricing-tier{padding:28px clamp(16px,2.2vw,24px) 24px;min-height:0}
  .pricing-tier__category{font-size:12px}
  .pricing-tier__name{font-size:clamp(22px,2.6vw,28px)}
  .pricing-tier__annotation{font-size:16px;margin-left:8px !important}
  .pricing-tier__price{font-size:clamp(38px,5vw,52px);margin-top:26px !important}
  .pricing-tier--grow .pricing-tier__price{font-size:clamp(28px,3.4vw,36px);white-space:normal}
  .pricing-tier--grow .pricing-tier__from{display:block;font-size:.6em;margin-bottom:.15em}
  .pricing-tier__secondary-price{font-size:17px}
  .pricing-tier__scope li{font-size:15px}
  .pricing-tier__boundary{font-size:14px}
  .pricing-tier__cta{font-size:14px}
}
/* phones: tiers stack in order, horizontal rules between them */
@media(max-width:767px){
  .pricing-section__header{min-height:0;padding:44px 20px 24px}
  .pricing-section h2{font-size:clamp(36px,10vw,46px)}
  .pricing-section__intro{font-size:16px}
  .pricing-schedule{grid-template-columns:1fr}
  .pricing-tier{min-height:auto;padding:34px 20px 30px}
  .pricing-tier + .pricing-tier{border-left:0;border-top:1px solid #8b8791}
  .pricing-tier__name{font-size:30px}
  .pricing-tier__annotation{font-size:17px;margin:8px 0 -8px 8px !important}
  .pricing-tier__price{white-space:normal;font-size:clamp(48px,15vw,68px);margin-top:26px !important}
  .pricing-tier--grow .pricing-tier__price{font-size:clamp(40px,11vw,52px)}
  .pricing-tier__secondary-price{font-size:18px}
  .pricing-tier__scope li{font-size:16px}
  .pricing-section__terms{font-size:13px;padding:12px 20px}
}
@media (prefers-reduced-motion: reduce){
  .pricing-tier,.pricing-tier__arrow{transition:none}
}

/* ===== Perth Solar Direct case study, reproduced from design/case-study-source.png (1881 x 836) =====
   --u is one mock pixel, so every size below is the mock measurement. The composition scales with the section
   width from 1101px up; tablet and phone rules follow. Approved change from the mock: black section ground,
   off-white only on the evidence sheet. */
.case-study-section{--u:min(calc(100cqw / 1881),0.7655px);--ink:#0a0a0f;--paper:#eeeae2;--rule:#393640;--purple:#7c33bf;--purple-ink:#7b56a3;container-type:inline-size;position:relative;display:grid;grid-template-columns:max(calc(708 * var(--u)),38%) minmax(0,1fr);grid-template-rows:calc(68 * var(--u)) minmax(0,auto) calc(61 * var(--u));width:100%;min-height:calc(836 * var(--u));overflow:hidden;background:#0a0a0f;color:#f4f4f6}
/* corner marks, as in the mock */
.cs-mark{position:absolute;width:calc(24 * var(--u));height:calc(24 * var(--u));pointer-events:none}
.cs-mark::before,.cs-mark::after{content:"";position:absolute;background:#6f6b78}
.cs-mark::before{left:50%;top:0;width:1px;height:100%}
.cs-mark::after{top:50%;left:0;height:1px;width:100%}
.cs-mark--tl{left:calc(32 * var(--u));top:calc(22 * var(--u))}
.cs-mark--tr{right:calc(32 * var(--u));top:calc(22 * var(--u))}
.cs-mark--bl{left:calc(32 * var(--u));bottom:calc(22 * var(--u))}
.cs-mark--br{right:calc(32 * var(--u));bottom:calc(22 * var(--u))}
/* top meta bar: brand line left, strategy / measurement / growth and Perth WA right, rule beneath */
.cs-topbar{grid-column:1 / -1;display:flex;align-items:center;justify-content:space-between;margin:0 calc(118 * var(--u));border-bottom:1px solid #6f6b78;font-family:var(--font-head);font-weight:500;font-size:max(9px,calc(12 * var(--u)));letter-spacing:.2em;text-transform:uppercase;color:#b7b2be}
.cs-topbar p{margin:0;line-height:1.45}
.cs-topbar__meta{display:flex;align-items:center;gap:calc(44 * var(--u));white-space:nowrap}
.cs-topbar__meta i{display:block;width:1px;height:calc(26 * var(--u));background:#6f6b78}
/* left editorial column, vertical divider on its right edge */
.case-study-section__intro{position:relative;display:flex;flex-direction:column;justify-content:flex-start;padding:calc(38 * var(--u)) calc(30 * var(--u)) calc(30 * var(--u)) calc(50 * var(--u));border-right:1px solid #6f6b78;background:radial-gradient(circle at 22% 38%,rgba(123,86,163,.08),transparent 42%),#0a0a0f}
.case-study-section__intro > p,.case-study-section__intro > h2{margin:0}
.case-study-section__eyebrow{color:#a67fd6;font-family:var(--font-head);font-weight:700;font-size:max(11px,calc(17 * var(--u)));letter-spacing:.06em;text-transform:uppercase}
.case-study-section h2{margin:calc(24 * var(--u)) 0 0 !important;color:#f4f4f6;font-family:var(--font-head);font-size:calc(82 * var(--u));font-weight:700;line-height:.96;letter-spacing:-.05em;white-space:nowrap}
.case-study-section__summary{max-width:calc(560 * var(--u));margin-top:calc(26 * var(--u)) !important;color:#b7b2be;font-family:var(--font-body);font-size:max(13px,calc(27 * var(--u)));line-height:1.3}
/* index and CTA share one row: 01, diagonal rule, outlined 01 on the left; CTA on the right */
.case-study-section__row{display:flex;align-items:flex-end;justify-content:space-between;gap:calc(24 * var(--u));margin-top:calc(20 * var(--u))}
/* fraction geometry from the mock, in em of the large numeral: big 01 top left, slash between, outlined 01 lower right */
.case-study-section__index{position:relative;display:block;margin:0;width:1.6em;height:1.37em;font-size:calc(128 * var(--u));line-height:.8;font-family:var(--font-body);font-weight:800;letter-spacing:-.06em;color:#f4f4f6}
/* the diagonal slices the foot of the big 1, as in the mock: the numeral is clipped along the same 45 degree line */
.case-study-section__index-current{position:absolute;left:0;top:0;clip-path:polygon(0 0,1.6em 0,.8em .8em,0 .8em)}
/* Archivo numerals are wider than the mock's, so the small 01 sits further right and the slash is steered through the gap */
.case-study-section__index-rule{position:absolute;left:.36em;bottom:.04em;width:1px;height:1.3em;background:#8b8791;transform:rotate(45deg);transform-origin:bottom center}
.case-study-section__index-total{position:absolute;left:1.08em;bottom:0;font-size:.58em;line-height:.8;font-weight:300;letter-spacing:-.02em;color:#b7b2be}
.case-study-section__cta{justify-content:space-between;gap:calc(28 * var(--u));width:calc(366 * var(--u));min-height:calc(66 * var(--u));margin-bottom:calc(8 * var(--u));padding:0 calc(32 * var(--u));font-size:max(13px,calc(18 * var(--u)))}
/* evidence sheet: off-white document holding the header, table, metrics, work row, source stamps and strip */
.case-study-section__evidence{position:relative;display:grid;grid-template-columns:minmax(0,1fr) calc(181 * var(--u));column-gap:calc(40 * var(--u));margin:calc(22 * var(--u)) calc(26 * var(--u)) calc(22 * var(--u)) calc(22 * var(--u));padding:0 calc(14 * var(--u)) 0 0;color:var(--ink);background:linear-gradient(rgba(238,234,226,.96),rgba(238,234,226,.96)),#eeeae2;border:1px solid #d3cec5;border-radius:0}
html.js .case-study-section__evidence{opacity:0;transform:translateY(14px);transition:opacity .6s ease,transform .6s ease}
html.js .case-study-section.is-in .case-study-section__evidence{opacity:1;transform:none}
.case-study-section__sheet{display:flex;flex-direction:column;padding:calc(6 * var(--u)) 0 calc(28 * var(--u)) calc(22 * var(--u));min-width:0}
.case-study-section__sheet > *{margin:0}
.case-study-section__sheet-head{display:flex;justify-content:space-between;align-items:center;gap:calc(20 * var(--u));min-height:calc(30 * var(--u));padding-bottom:calc(6 * var(--u));border-bottom:calc(2 * var(--u)) solid var(--ink)}
.case-study-section__client{display:flex;align-items:center;gap:calc(16 * var(--u));min-width:0}
.case-study-section__client-logo{display:block;height:calc(34 * var(--u));width:auto;flex:none}
.case-study-section__label{font-family:var(--font-head);font-weight:700;font-size:max(10px,calc(17 * var(--u)));letter-spacing:.08em;text-transform:uppercase;color:var(--ink)}
.case-study-section__case-number{font-family:var(--font-head);font-weight:500;font-size:max(9px,calc(15 * var(--u)));letter-spacing:.14em;text-transform:uppercase;color:#4a4652;white-space:nowrap}
.case-study-section__sheet-heading{margin-top:calc(22 * var(--u)) !important;padding-bottom:calc(14 * var(--u));border-bottom:calc(2 * var(--u)) solid var(--ink);color:var(--ink);font-family:var(--font-head);font-size:calc(92 * var(--u));font-weight:700;line-height:.92;letter-spacing:-.05em;white-space:nowrap}
/* before/after table: 221 | 305 | 342 mock columns, thin solid rules */
.case-study-section__table{width:100%;border-collapse:collapse;table-layout:fixed;font-family:var(--font-body);font-size:max(11px,calc(24 * var(--u)))}
.case-study-section__table col:first-child{width:25.5%}
.case-study-section__table th,.case-study-section__table td{padding:0 calc(14 * var(--u));height:calc(45 * var(--u));text-align:center;border-bottom:1px solid var(--ink);vertical-align:middle}
.case-study-section__table thead th{height:calc(40 * var(--u));font-family:var(--font-head);font-weight:700;font-size:max(9px,calc(17 * var(--u)));letter-spacing:.1em;text-transform:uppercase;color:var(--ink)}
.case-study-section__table thead th:first-child{width:25.5%}
.case-study-section__table thead th:nth-child(2),.case-study-section__table td:nth-child(2){width:35%}
.case-study-section__table tbody th{padding-left:0;text-align:left;font-family:var(--font-head);font-weight:700;font-size:max(9px,calc(18 * var(--u)));letter-spacing:.06em;text-transform:uppercase;color:var(--ink);white-space:nowrap}
.case-study-section__table td,.case-study-section__table thead th:not(:first-child){border-left:1px solid var(--ink)}
.case-study-section__table tbody tr:last-child th,.case-study-section__table tbody tr:last-child td{border-bottom:calc(2 * var(--u)) solid var(--ink)}
.case-study-section__before{color:var(--ink)}
.case-study-section__count{font-variant-numeric:tabular-nums;font-weight:600}
.case-study-section__count--up{color:#c0392b !important}
.case-study-section__after.case-study-section__count--down,.case-study-section__count--down{color:var(--purple-ink) !important}
.case-study-section__after{color:var(--purple-ink) !important;font-weight:600}
/* three summary metrics: 288 | 312 | 268 mock columns, solid vertical rules */
.case-study-section__metrics{display:grid;grid-template-columns:288fr 312fr 268fr;list-style:none;margin:0 !important;padding:calc(18 * var(--u)) 0;border-bottom:calc(2 * var(--u)) solid var(--ink)}
.case-study-section__metrics li{display:flex;align-items:flex-start;gap:calc(20 * var(--u));padding:0 calc(20 * var(--u));min-width:0}
.case-study-section__metrics li:first-child{padding-left:0}
.case-study-section__metrics li:last-child{padding-left:calc(52 * var(--u))}
.case-study-section__metrics li + li{border-left:1px solid var(--ink)}
.case-study-section__metric-value{font-family:var(--font-head);font-weight:700;font-size:calc(50 * var(--u));letter-spacing:-.05em;line-height:1;color:var(--ink);white-space:nowrap}
.case-study-section__metrics li:nth-child(2) .case-study-section__metric-value{font-size:calc(44 * var(--u))}
.case-study-section__metric-label{font-family:var(--font-body);font-size:max(10px,calc(21 * var(--u)));line-height:1.2;color:var(--ink);max-width:8em;padding-top:calc(2 * var(--u))}
.case-study-section__metrics li:nth-child(2){flex-direction:column;gap:calc(4 * var(--u))}
/* work completed row: label | rule | copy */
.case-study-section__work{display:grid;grid-template-columns:calc(178 * var(--u)) minmax(0,1fr);padding:calc(16 * var(--u)) 0;border-bottom:1px solid var(--ink)}
.case-study-section__work-label{margin:0;font-family:var(--font-head);font-weight:700;font-size:max(10px,calc(20 * var(--u)));letter-spacing:.06em;text-transform:uppercase;line-height:1.2;color:var(--ink);max-width:6em}
.case-study-section__work-copy{margin:0;padding-left:calc(35 * var(--u));border-left:1px solid var(--ink);font-family:var(--font-body);font-size:max(11px,calc(21 * var(--u)));line-height:1.2;color:var(--ink)}
/* source stamps: outlined labels */
.case-study-section__sources{display:grid;grid-template-columns:calc(176 * var(--u)) minmax(0,1fr);align-items:center;padding-top:calc(8 * var(--u))}
.case-study-section__sources-label{margin:0;font-family:var(--font-head);font-weight:500;font-size:max(9px,calc(15 * var(--u)));letter-spacing:.14em;text-transform:uppercase;color:#4a4652}
.case-study-section__sources ul{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:calc(18 * var(--u));list-style:none;margin:0;padding:0;min-width:0}
.case-study-section__sources li{position:relative;display:flex;align-items:center;justify-content:center;height:calc(42 * var(--u));border:calc(2 * var(--u)) solid var(--ink);font-family:var(--font-head);font-weight:700;font-size:max(8px,calc(16 * var(--u)));letter-spacing:.08em;text-transform:uppercase;color:var(--ink);white-space:nowrap;overflow:hidden;isolation:isolate;transition:color .3s ease,border-color .3s ease}
/* colour effects: a purple fill sweeps in on hover; on entry each stamp flashes its border purple in turn */
.case-study-section__sources li::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--purple-ink);transform:translateX(-101%);transition:transform .35s cubic-bezier(.22,1,.36,1)}
.case-study-section__sources li:hover{color:#fff;border-color:var(--purple-ink)}
.case-study-section__sources li:hover::before{transform:translateX(0)}
html.js .case-study-section.is-in .case-study-section__sources li{animation:cs-stamp .9s ease both}
html.js .case-study-section.is-in .case-study-section__sources li:nth-child(2){animation-delay:.18s}
html.js .case-study-section.is-in .case-study-section__sources li:nth-child(3){animation-delay:.36s}
@keyframes cs-stamp{0%{border-color:var(--ink);color:var(--ink)}35%{border-color:var(--purple-ink);color:var(--purple-ink)}100%{border-color:var(--ink);color:var(--ink)}}
/* black result strip inside the sheet */
.case-study-section__result-strip{display:flex;flex-direction:column;justify-content:space-between;align-self:start;height:calc(627 * var(--u));padding:calc(58 * var(--u)) calc(20 * var(--u)) calc(40 * var(--u)) calc(28 * var(--u));background:#0a0a0f;color:#f4f4f6;border-left:2px solid #7b56a3}
.case-study-section__result{display:flex;flex-direction:column;gap:calc(10 * var(--u))}
.case-study-section__result + .case-study-section__result{padding-top:calc(30 * var(--u));border-top:calc(2 * var(--u)) solid #f4f4f6;border-image:linear-gradient(90deg,#f4f4f6 0 calc(62 * var(--u)),transparent calc(62 * var(--u))) 1}
.case-study-section__result-value{font-variant-numeric:tabular-nums;font-family:var(--font-head);font-weight:700;font-size:calc(62 * var(--u));letter-spacing:-.04em;line-height:1;color:#f4f4f6}
.case-study-section__result-label{font-family:var(--font-head);font-weight:600;font-size:max(9px,calc(17 * var(--u)));letter-spacing:.08em;text-transform:uppercase;line-height:1.5;color:#f4f4f6;max-width:8em}
/* bottom bar: brand, four process labels, disclosure right */
.cs-bottombar{grid-column:1 / -1;display:flex;align-items:center;gap:calc(30 * var(--u));margin:0 calc(118 * var(--u));border-top:1px solid #6f6b78;font-family:var(--font-head);font-weight:500;font-size:max(9px,calc(12 * var(--u)));letter-spacing:.18em;text-transform:uppercase;color:#b7b2be;white-space:nowrap}
.cs-bottombar p{margin:0}
.cs-bottombar__brand{margin-right:calc(60 * var(--u)) !important}
.case-study-section__process{display:flex;align-items:center;list-style:none;margin:0;padding:0}
.case-study-section__process li{padding:0 calc(30 * var(--u))}
.case-study-section__process li:first-child{padding-left:0}
.case-study-section__process li + li{border-left:1px solid #6f6b78}
.case-study-section__disclosure{margin-left:auto !important;font-family:var(--font-body);font-weight:400;font-size:max(11px,calc(14 * var(--u)));letter-spacing:0;text-transform:none;color:#b7b2be;white-space:normal;text-align:right}
/* tablet: same composition, 36 / 64 columns, headline lines allowed to wrap */
@media(min-width:768px) and (max-width:1100px){
  .case-study-section{--u:calc(100cqw / 1500);grid-template-columns:36% minmax(0,64%);grid-template-rows:auto minmax(0,auto) auto}
  .case-study-section h2{white-space:normal;font-size:clamp(34px,4.6vw,52px)}
  .cs-br{display:none}
  .case-study-section__summary{font-size:15px}
  .case-study-section__row{flex-direction:column;align-items:flex-start;gap:18px}
  .case-study-section__index{font-size:64px}
  .case-study-section__cta{width:auto;min-height:48px;font-size:14px;padding:0 20px;gap:18px}
  .case-study-section__sheet-heading{white-space:normal;font-size:clamp(30px,4.6vw,48px)}
  .case-study-section__table{font-size:15px}
  .case-study-section__table tbody th{font-size:11px;white-space:normal}
  .case-study-section__metrics li{flex-direction:column;gap:4px;padding:0 12px}
  .case-study-section__metrics li:last-child{padding-left:12px}
  .case-study-section__metric-value,.case-study-section__metrics li:nth-child(2) .case-study-section__metric-value{font-size:clamp(20px,2.6vw,30px)}
  .case-study-section__metric-label{font-size:13px}
  .case-study-section__work{grid-template-columns:110px minmax(0,1fr)}
  .case-study-section__work-copy{font-size:14px;padding-left:14px}
  .case-study-section__sources{grid-template-columns:1fr}
  .case-study-section__sources ul{margin-top:8px;gap:8px}
  .case-study-section__sources li{font-size:9px;height:auto;min-height:34px;padding:4px 6px;white-space:normal;text-align:center;line-height:1.15}
  .case-study-section__result-strip{height:auto;padding:22px 12px 22px 14px;gap:18px}
  .case-study-section__result-value{font-size:32px}
  .case-study-section__result-label{font-size:10px}
  .cs-topbar,.cs-bottombar{font-size:9px;margin:0 52px}
  .cs-topbar{padding:10px 0}
  .cs-bottombar{flex-wrap:wrap;row-gap:6px;padding:10px 0}
  .case-study-section__process li{padding:0 14px}
  .case-study-section__disclosure{font-size:11px;text-align:left;margin-left:0 !important;flex-basis:100%}
}
/* phones: headline block, then the evidence sheet with the black strip below the table */
@media(max-width:767px){
  .case-study-section{--u:0.35px;grid-template-columns:1fr;grid-template-rows:auto auto auto auto;min-height:0}
  .cs-mark{display:none}
  .cs-topbar{margin:0 20px;padding:14px 0;font-size:9px;flex-direction:column;align-items:flex-start;gap:8px}
  .cs-topbar__meta i{height:12px}
  .case-study-section__intro{padding:40px 20px 34px;border-right:0}
  .case-study-section h2{white-space:normal;font-size:clamp(40px,11vw,52px);margin-top:14px !important}
  .cs-br{display:none}
  .case-study-section__summary{font-size:16px;margin-top:18px !important;max-width:none}
  .case-study-section__row{flex-direction:column;align-items:flex-start;gap:16px;margin-top:22px}
  .case-study-section__index{font-size:72px}
  .case-study-section__cta{width:auto;min-height:52px;font-size:14px;padding:0 22px;gap:20px}
  .case-study-section__evidence{grid-template-columns:1fr;column-gap:0;margin:0 20px 24px;padding:0}
  .case-study-section__sheet{display:contents}
  .case-study-section__sheet > *{margin-left:18px !important;margin-right:18px !important}
  .case-study-section__sheet-head{margin-top:22px !important;flex-direction:column;align-items:flex-start;gap:6px;padding-bottom:10px;border-bottom-width:2px}
  .case-study-section__label{font-size:12px}
  .case-study-section__case-number{font-size:10px}
  .case-study-section__sheet-heading{white-space:normal;font-size:clamp(32px,9vw,42px);margin-top:16px !important;padding-bottom:12px;border-bottom-width:2px}
  .case-study-section__table{font-size:15px}
  .case-study-section__table th,.case-study-section__table td{height:auto;padding:9px 8px}
  .case-study-section__table thead th{font-size:11px}
  .case-study-section__table tbody th{font-size:11px;white-space:normal}
  .case-study-section__table tbody tr:last-child th,.case-study-section__table tbody tr:last-child td{border-bottom-width:2px}
  .case-study-section__result-strip{order:1;flex-direction:row;justify-content:space-between;align-self:auto;height:auto;margin:16px 18px 0;padding:14px 14px;border-left:0;border-top:2px solid #7b56a3}
  .case-study-section__result{flex:1;gap:4px;padding:0 10px}
  .case-study-section__result + .case-study-section__result{padding-top:0;border-top:0;border-image:none;border-left:1px solid #8b8791}
  .case-study-section__result-value{font-size:28px}
  .case-study-section__result-label{font-size:9px}
  .case-study-section__metrics,.case-study-section__work,.case-study-section__sources{order:2}
  .case-study-section__metrics{grid-template-columns:1fr;padding:6px 0;border-bottom-width:2px}
  .case-study-section__metrics li,.case-study-section__metrics li:last-child,.case-study-section__metrics li:nth-child(2){flex-direction:row;align-items:baseline;gap:10px;padding:10px 0}
  .case-study-section__metrics li + li{border-left:0;border-top:1px solid #8b8791}
  .case-study-section__metric-value,.case-study-section__metrics li:nth-child(2) .case-study-section__metric-value{font-size:28px}
  .case-study-section__metric-label{font-size:14px;max-width:none}
  .case-study-section__work{grid-template-columns:1fr;gap:6px;padding:12px 0}
  .case-study-section__work-label{font-size:12px;max-width:none}
  .case-study-section__work-copy{padding-left:0;border-left:0;font-size:15px;line-height:1.4}
  .case-study-section__sources{grid-template-columns:1fr;gap:10px;padding:14px 0 22px}
  .case-study-section__sources-label{font-size:11px}
  .case-study-section__sources ul{grid-template-columns:1fr;gap:8px}
  .case-study-section__sources li{height:40px;font-size:11px;border-width:1px}
  .cs-bottombar{margin:0 20px;padding:14px 0;flex-wrap:wrap;gap:8px 0;font-size:9px;white-space:normal}
  .cs-bottombar__brand{flex-basis:100%;margin-right:0 !important}
  .case-study-section__process{flex-wrap:wrap;gap:6px 0}
  .case-study-section__process li{padding:0 12px}
  .case-study-section__disclosure{flex-basis:100%;margin:8px 0 0 !important;font-size:12px;text-align:left}
}
@media(max-width:480px){
  .case-study-section__cta{align-self:stretch;width:100%}
  .case-study-section__result-strip{flex-direction:column}
  .case-study-section__result{padding:12px 0}
  .case-study-section__result + .case-study-section__result{border-left:0;border-top:1px solid #8b8791}
}
@media (prefers-reduced-motion: reduce){
  html.js .case-study-section__evidence{opacity:1;transform:none;transition:none}
  .case-study-section__sources li,.case-study-section__sources li::before{transition:none;animation:none !important}
  .case-study-section__cta{transition:none}
}

/* ===== Buyer FAQ (implemented from design-reference.png) ===== */
.buyer-faq{display:grid;grid-template-columns:minmax(380px,36%) minmax(0,64%);width:100%;min-height:590px;overflow:hidden;background:radial-gradient(circle at 16% 42%,rgba(123,86,163,.06),transparent 34%),#0a0a0f;color:#f4f4f6;border-top:1px solid #26232e}
/* left introduction, vertically centred */
.buyer-faq__intro{display:flex;flex-direction:column;justify-content:center;padding:54px clamp(32px,4vw,54px)}
.buyer-faq__intro > p,.buyer-faq__intro > h2{margin:0}
.buyer-faq__eyebrow{display:flex;align-items:center;gap:22px;margin:0 0 24px !important;color:#ceb5f3;font-family:var(--font-body);font-size:13px;font-weight:500;letter-spacing:.22em;text-transform:uppercase}
.buyer-faq__eyebrow i{display:block;width:90px;height:1px;background:#7b56a3}
.buyer-faq h2{max-width:560px;margin:0;color:#f4f4f6;font-family:var(--font-head);font-size:clamp(44px,3.3vw,72px);font-weight:700;line-height:.98;letter-spacing:-.045em}
.buyer-faq__intro-copy{max-width:520px;margin-top:28px !important;color:#9a96a3;font-family:var(--font-body);font-size:19px;line-height:1.5}
/* handwritten annotation: lavender, slight rotation, two lines, one solid underline */
.buyer-faq__note{position:relative;display:inline-block;align-self:flex-start;margin-top:44px !important;color:#c58cff;font-family:"Segoe Script","Bradley Hand","Brush Script MT","Comic Sans MS",cursive;font-style:italic;font-size:clamp(32px,2.8vw,44px);line-height:1.05;transform:rotate(-8deg);transform-origin:left center}
.buyer-faq__note span{display:block;padding-left:.2em}
.buyer-faq__note span::first-line{padding-left:0}
.buyer-faq__stroke{display:block;width:100%;height:14px;margin-top:2px;overflow:visible}
.buyer-faq__stroke path{fill:none;stroke:#c58cff;stroke-width:2.2;stroke-linecap:round}
/* right: one continuous editorial list */
.buyer-faq__content{display:flex;flex-direction:column;justify-content:center;min-width:0;padding:28px 42px 22px 0}
.buyer-faq__accordion{min-height:440px}
.faq-item{overflow:hidden;border-bottom:1px solid #4b4851;background:transparent;transition:background-color .3s ease,border-color .3s ease}
.faq-item__heading{margin:0;font-size:inherit}
.faq-item__trigger{display:grid;grid-template-columns:76px minmax(0,1fr) 34px;gap:18px;align-items:center;width:100%;min-height:58px;padding:9px 20px;color:#f4f4f6;background:transparent;border:0;text-align:left;cursor:pointer;font:inherit}
.faq-item__trigger:focus-visible{outline:2px solid #ceb5f3;outline-offset:-4px}
.faq-item__number{color:#817d88;font-family:var(--font-head);font-size:clamp(32px,2.6vw,42px);font-weight:700;line-height:1;letter-spacing:-.05em;transition:color .3s ease}
.faq-item__text{display:flex;flex-direction:column;gap:3px;min-width:0}
.faq-item__question{font-family:var(--font-head);font-size:clamp(17px,1.35vw,20px);font-weight:600;line-height:1.25}
.faq-item__preview{color:#9a96a3;font-weight:400;font-family:var(--font-body);font-size:clamp(14px,1.1vw,17px);line-height:1.35}
.faq-item.is-open .faq-item__preview{display:none}
.faq-item__control{justify-self:end;color:#f4f4f6;font-family:var(--font-body);font-size:34px;font-weight:300;line-height:1;width:34px;text-align:center}
/* active row */
.faq-item.is-open{background:linear-gradient(100deg,rgba(93,65,121,.88),rgba(53,40,70,.88));border-top:1px solid #7b56a3;border-bottom:1px solid #8f6cae}
.faq-item.is-open .faq-item__number{color:#c58cff}
/* answer: animated with a 0fr to 1fr grid so no fixed height ever clips text */
.faq-item__answer{display:grid;grid-template-rows:1fr;opacity:1;transition:grid-template-rows 300ms cubic-bezier(.22,1,.36,1),opacity 220ms ease}
.faq-item__answer[hidden]{display:grid;grid-template-rows:0fr;opacity:0}
.faq-item__answer-inner{overflow:hidden;min-height:0}
.faq-item__answer p{margin:0;padding:0 54px 16px 114px;color:#ddd8e3;font-family:var(--font-body);font-size:clamp(15px,1.15vw,17px);line-height:1.5}
/* bottom prompt and CTA */
.buyer-faq__footer{display:flex;align-items:center;justify-content:space-between;gap:28px;min-height:52px;margin-top:6px;padding-left:20px;color:#9a96a3;font-family:var(--font-body)}
.buyer-faq__prompt{margin:0;font-size:17px}
.buyer-faq__cta{flex:none}
/* tablet */
@media(min-width:768px) and (max-width:1100px){
  .buyer-faq{grid-template-columns:minmax(0,34%) minmax(0,66%);min-height:0}
  .buyer-faq__intro{padding:40px clamp(20px,3vw,32px)}
  .buyer-faq h2{font-size:clamp(34px,4.6vw,48px)}
  .buyer-faq__intro-copy{font-size:16px;margin-top:18px !important}
  .buyer-faq__note{font-size:30px;margin-top:34px !important}
  .buyer-faq__content{padding:28px 24px 24px 0}
  .buyer-faq__accordion{min-height:0}
  .faq-item__trigger{grid-template-columns:58px minmax(0,1fr) 28px;gap:12px;padding:12px 12px;min-height:60px}
  .faq-item__number{font-size:32px}
  .faq-item__question{font-size:17px}
  .faq-item__preview{display:none}
  .faq-item__control{font-size:28px;width:28px}
  .faq-item__answer p{padding:0 20px 18px 82px;font-size:15px}
  .buyer-faq__footer{padding-left:12px;flex-wrap:wrap;gap:12px}
  .buyer-faq__prompt{font-size:15px}
}
/* phones: introduction, then the accordion; natural heights; one open */
@media(max-width:767px){
  .buyer-faq{grid-template-columns:1fr;min-height:0}
  .buyer-faq__intro{padding:58px 20px 34px}
  .buyer-faq h2{font-size:clamp(40px,11vw,52px)}
  .buyer-faq__intro-copy{font-size:16px;margin-top:20px !important}
  .buyer-faq__note{font-size:32px;margin-top:30px !important}
  .buyer-faq__content{padding:0 20px 48px}
  .buyer-faq__accordion{min-height:0}
  .faq-item__trigger{grid-template-columns:48px minmax(0,1fr) 28px;gap:12px;padding:18px 0;min-height:44px}
  .faq-item__number{font-size:30px}
  .faq-item__question{font-size:17px}
  .faq-item__preview{display:none}
  .faq-item__control{font-size:28px;width:28px}
  .faq-item__answer p{padding:0 28px 22px 60px;font-size:16px}
  .buyer-faq__footer{flex-direction:column;align-items:flex-start;gap:16px;padding:20px 0 0}
  .buyer-faq__prompt{font-size:15px}
  .buyer-faq__cta{min-height:44px}
}
@media (prefers-reduced-motion: reduce){
  .faq-item,.faq-item__number,.faq-item__answer{transition:none}
}

/* ===== Final CTA: fit check (homepage and Services page), reproduced from the supplied reference ===== */
.fit-check{position:relative;width:100%;min-height:580px;overflow:hidden;background:transparent;color:var(--silver-hi);border-top:1px solid var(--line)}
/* a soft light rising from the bottom centre, well under the readability threshold */
.fit-check::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 58% 62% at 50% 100%,rgba(166,127,214,.22) 0%,rgba(123,86,163,.09) 38%,rgba(10,10,15,0) 72%);pointer-events:none}
.fit-check__inner{position:relative;width:100%;padding:0 var(--gutter);display:flex;flex-direction:column;align-items:center;text-align:center}
.fit-check__inner > *{margin:0}
.fit-check__eyebrow{margin-bottom:26px !important;color:var(--ame-glow);font-family:var(--font-body);font-weight:500;font-size:.75rem;letter-spacing:.24em;text-transform:uppercase}
.fit-check h2{max-width:1180px;margin-bottom:20px !important;color:var(--silver-hi);font-family:var(--font-head);font-weight:700;white-space:nowrap}
.fit-check__intro{max-width:760px;margin-bottom:34px !important;color:var(--silver-lo);font-family:var(--font-body)}
.fit-check__form{width:100%;max-width:1200px;display:flex;flex-direction:column;align-items:center}
/* one attached unit: clipped-corner outer shape with a thin purple-grey border, the field on the left and the
   gradient submit on the right (about 77/23). The border is the outer background showing through a 1px inset;
   the field and button carry matching clips on their outer corners so the hairline follows the diagonal. */
.fit-check__url-row{display:flex;width:100%;height:clamp(88px,6.4vw,96px);padding:1px;background:rgba(166,127,214,.5);clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,16px 100%,0 calc(100% - 16px));transition:background-color 180ms ease}
.fit-check__input{flex:1 1 77%;min-width:0;padding:0 30px;background:#101017;border:0;outline:0;color:var(--silver-hi);font-family:var(--font-body);font-size:18px;clip-path:polygon(0 0,100% 0,100% 100%,15px 100%,0 calc(100% - 15px))}
.fit-check__input::placeholder{color:#777280}
.fit-check__input:focus-visible{outline:2px solid var(--ame-light);outline-offset:-4px}
.fit-check__submit{flex:0 0 23%;height:100%;display:inline-flex;align-items:center;justify-content:center;gap:12px;padding:0 20px;background:linear-gradient(135deg,#8f62c9 0%,#6a45a3 100%);box-shadow:inset 1px 0 0 rgba(166,127,214,.5);border:0;border-radius:0;color:#fff;font-family:var(--font-head);font-weight:600;font-size:18px;white-space:nowrap;cursor:pointer;clip-path:polygon(0 0,calc(100% - 15px) 0,100% 15px,100% 100%,0 100%);transition:filter 180ms ease}
.fit-check__submit span{transition:transform 180ms ease}
.fit-check__submit:hover,.fit-check__submit:focus-visible{filter:brightness(1.14)}
.fit-check__submit:hover span{transform:translateX(3px)}
.fit-check__submit:focus-visible{outline:2px solid var(--ame-light);outline-offset:-5px}
/* space for the validation message is reserved so nothing shifts */
.fit-check__error{display:block;width:100%;min-height:22px;margin-top:8px !important;color:var(--ame-light);font-family:var(--font-body);font-size:14px;line-height:22px;text-align:left}
.fit-check__url-row.is-invalid{background:var(--ame-light)}
/* constraint radio group: five equal columns with hairline dividers; the selected option gets a filled purple
   centre, a white label and a thin purple underline */
.fit-check__constraints{margin:10px 0 0 !important;padding:0;border:0;min-width:0;width:100%}
.fit-check__legend{display:block;width:100%;margin-bottom:14px;padding:0;text-align:center;color:#d9d6e0;font-family:var(--font-body);font-size:16px}
.fit-check__options{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));width:100%}
.fit-check__option{position:relative;display:flex;align-items:center;justify-content:center;gap:12px;min-height:56px;padding:0 14px;cursor:pointer;color:var(--silver-lo);font-family:var(--font-head);font-weight:600;font-size:17px;white-space:nowrap;transition:color 220ms ease}
.fit-check__option + .fit-check__option{border-left:1px solid #4b4851}
.fit-check__option input{position:absolute;opacity:0;width:1px;height:1px;margin:0;pointer-events:none}
.fit-check__radio{position:relative;flex:0 0 auto;width:16px;height:16px;border-radius:50%;border:1px solid #5c5866;transition:border-color 220ms ease}
.fit-check__radio::after{content:"";position:absolute;inset:3px;border-radius:50%;background:var(--ame-glow);transform:scale(0);transition:transform 220ms ease}
.fit-check__option::after{content:"";position:absolute;left:14px;right:14px;bottom:0;height:2px;background:var(--ame-glow);transform:scaleX(0);transition:transform 220ms ease}
.fit-check__option:hover{color:#d9d6e0}
.fit-check__option input:checked ~ span{color:var(--silver-hi)}
.fit-check__option input:checked + .fit-check__radio{border-color:var(--ame-glow)}
.fit-check__option input:checked + .fit-check__radio::after{transform:scale(1)}
.fit-check__option:has(input:checked)::after{transform:scaleX(1)}
.fit-check__option:has(input:focus-visible){outline:2px solid var(--ame-light);outline-offset:-2px}
.fit-check__secondary{margin-top:30px !important}
.fit-check__reassurance{margin-top:24px !important;color:var(--silver-lo);font-family:var(--font-body);font-size:14px;line-height:1.5}
/* Industries instance: same composition, at the reference's section height */
.fit-check--market{min-height:700px;display:flex;flex-direction:column;justify-content:center}
/* entrance: tiny, once, off under reduced motion */
html.js .fit-check__inner{opacity:0;transform:translateY(10px);transition:opacity .5s ease,transform .5s ease}
html.js .fit-check.is-in .fit-check__inner{opacity:1;transform:none}
@media(max-width:1199px){
  .fit-check h2{white-space:normal}
  .fit-check__option{gap:8px;padding:0 8px;font-size:14px}
  .fit-check__radio{width:14px;height:14px}
  .fit-check__option::after{left:8px;right:8px}
}
/* tablets and below: two columns of options, the last spanning both */
@media(max-width:1023px){
  .fit-check{min-height:0}
  .fit-check__options{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fit-check__option{font-size:15px;white-space:normal;text-align:left;justify-content:flex-start;padding:0 16px;border-bottom:1px solid var(--line)}
  .fit-check__option + .fit-check__option{border-left:0}
  .fit-check__option:nth-child(even){border-left:1px solid #4b4851}
  .fit-check__option:last-child{grid-column:1 / -1;border-left:0}
  .fit-check__option::after{left:16px;right:16px}
}
/* phones: the field and button stack, each at least 56px tall */
@media(max-width:767px){
  .fit-check__url-row{flex-direction:column;height:auto;padding:0;background:none;clip-path:none;gap:12px}
  .fit-check__url-row.is-invalid{background:none}
  .fit-check__url-row.is-invalid .fit-check__input{border-color:var(--ame-light)}
  .fit-check__input{flex:none;min-height:56px;padding:0 18px;border:1px solid rgba(166,127,214,.5);font-size:16px;clip-path:none}
  .fit-check__submit{flex:none;width:100%;min-height:56px;box-shadow:none;font-size:17px;clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,14px 100%,0 calc(100% - 14px))}
  .fit-check__legend{font-size:15px}
  .fit-check__option{min-height:52px}
  .fit-check__reassurance{font-size:13px}
}
@media(max-width:479px){
  .fit-check__inner{padding-left:24px;padding-right:24px}
}
@media (prefers-reduced-motion: reduce){
  html.js .fit-check__inner{opacity:1;transform:none;transition:none}
  .fit-check__url-row,.fit-check__submit,.fit-check__submit span,.fit-check__option,.fit-check__option::after,.fit-check__radio,.fit-check__radio::after{transition:none}
}

/* ---------- Services page hero ----------
   Reproduction of design/services-hero-reference.webp (1942 x 809). The supplied artwork
   (design/services-art-source.webp, same frame: slabs, purple light, floor, smoke) is the hero's own
   background, scaled to the hero height and pinned to the right, exactly as the reference composes it; the
   copy sits over its empty left half. Its baked stage labels are painted out by scripts/prepare-services-art.js
   (static/services-art.webp) and set here as live HTML at the same positions (rule rows at 22.1%, 45.2% and
   68% of the picture height, numbers at 74.1% of its width in the September 2026 frame). Sizes are the reference measurements at 1440.
   Below 960px the hero stacks: copy, then the picture cropped to the slabs with the labels listed under it. */
.services-hero{position:relative;overflow:hidden;background:transparent;min-height:clamp(540px,39.5vw,600px);display:flex;align-items:center;padding:96px 0 40px;border-bottom:1px solid var(--line)}
.services-hero__inner{position:relative;z-index:2;width:100%;padding:0 var(--gutter);display:flex;align-items:center}
.services-hero__copy{position:relative;width:54%;flex:none}
.services-hero__eyebrow{margin:0 0 26px;font-family:var(--font-body);font-weight:500;font-size:clamp(11px,.85vw,12.5px);letter-spacing:.32em;text-transform:uppercase;color:var(--silver-lo)}
.services-hero__title{margin:0 0 22px;max-width:14em;font-family:var(--font-head);font-weight:700;font-size:clamp(36px,3.5vw,54px);line-height:1.06;letter-spacing:-.03em;color:var(--silver-hi)}
/* The commercial phrase: three phrases stacked in one inline grid cell, so the box is always the widest
   phrase and nothing reflows when they change. The first is the default and the only one without JS
   or under reduced motion; the layer is aria-hidden and a visually hidden copy carries the default text. */
.services-hero__phrase{color:var(--ame-glow)}
.services-hero__words{display:inline-grid;vertical-align:top;text-align:left}
.services-hero__words > span{grid-area:1/1;opacity:0;transform:translateY(.3em);transition:opacity .45s ease,transform .45s ease;will-change:opacity,transform}
.services-hero__words > span.is-active{opacity:1;transform:none}
.services-hero__lead{margin:0 0 34px;max-width:34.5em;font-family:var(--font-body);font-weight:400;font-size:clamp(16px,1.25vw,18px);line-height:1.5;color:#c4c0ca}
.services-hero__actions{display:flex;align-items:center;flex-wrap:wrap;gap:16px 24px}
/* Hero CTAs, per the supplied spec: equal height, corners clipped top-right and bottom-left as drawn. */
.svc-cta{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:12px;box-sizing:border-box;min-width:14em;height:58px;padding:0 30px;font-family:var(--font-ui);font-weight:600;font-size:16px;line-height:1;letter-spacing:.005em;color:#fff;text-decoration:none;clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,16px 100%,0 calc(100% - 16px));transition:transform .25s,filter .25s}
.svc-cta > span{display:inline-block;transition:transform .25s}
.svc-cta:hover > span{transform:translateX(4px)}
.svc-cta--primary{background:linear-gradient(180deg,#8f62c9 0%,#6a45a3 100%)}
.svc-cta--primary:hover{filter:drop-shadow(0 0 14px rgba(166,127,214,.6))}
.svc-cta--ghost{background:rgba(154,150,163,.55)}
.svc-cta--ghost::before{content:"";position:absolute;inset:1px;background:var(--void);clip-path:polygon(0 0,calc(100% - 15px) 0,100% 15px,100% 100%,15px 100%,0 calc(100% - 15px))}
.svc-cta--ghost:hover{background:var(--ame-glow)}
.svc-cta--ghost:hover > span{transform:none}
.svc-cta--ghost > *{position:relative}
.svc-cta:focus-visible{outline:2px solid var(--ame-light);outline-offset:3px}
.services-hero__rule{margin:30px 0 20px;height:1px;background:var(--line)}
.services-hero__note{margin:0;font-family:var(--font-body);font-weight:400;font-size:clamp(11.5px,.87vw,12.5px);letter-spacing:.06em;color:var(--silver-lo)}
/* Artwork box = the picture's own frame, so the HTML labels can be placed by the picture's fractions. */
.services-hero__art{position:absolute;top:50%;right:0;z-index:1;height:78%;transform:translateY(-50%);aspect-ratio:1942/809;pointer-events:none}
.services-hero__art img{position:absolute;inset:0;width:100%;height:100%;display:block;-webkit-mask-image:linear-gradient(90deg,transparent,#000 18%),linear-gradient(180deg,transparent,#000 10%,#000 90%,transparent);-webkit-mask-composite:source-in;mask-image:linear-gradient(90deg,transparent,#000 18%),linear-gradient(180deg,transparent,#000 10%,#000 90%,transparent);mask-composite:intersect}
.services-hero__stages{position:absolute;inset:0;list-style:none;margin:0;padding:0}
.services-hero__stage{position:absolute;left:74.1%;display:flex;align-items:flex-start;gap:16px;pointer-events:auto;white-space:nowrap}
.services-hero__stage:nth-child(1){top:calc(22.1% - 11px)}
.services-hero__stage:nth-child(2){top:calc(45.2% - 11px)}
.services-hero__stage:nth-child(3){top:calc(68% - 11px)}
.services-hero__stage i{display:none}
.services-hero__stage b{flex:none;font-family:var(--font-body);font-weight:500;font-size:15px;line-height:22px;letter-spacing:.02em;color:var(--ame-glow)}
.services-hero__stage strong{display:block;font-family:var(--font-body);font-weight:600;font-size:16.5px;line-height:22px;color:var(--silver-hi)}
.services-hero__stage small{display:block;margin-top:5px;font-family:var(--font-body);font-weight:400;font-size:12.5px;line-height:1.35;letter-spacing:.03em;color:#b0abb8}
@media(max-width:1180px){
  /* Narrower desktops: the picture is shorter than the hero and vertically centred so the slabs stay clear of the heading. */
  .services-hero__copy{width:56%}
  .services-hero__art{height:42%;top:50%;transform:translateY(-50%)}
  .services-hero__art img{-webkit-mask-image:linear-gradient(90deg,transparent,#000 18%),linear-gradient(180deg,transparent,#000 12%,#000 88%,transparent);-webkit-mask-composite:source-in;mask-image:linear-gradient(90deg,transparent,#000 18%),linear-gradient(180deg,transparent,#000 12%,#000 88%,transparent);mask-composite:intersect}
  .services-hero__stage{gap:12px;left:72.8%;right:5%;white-space:normal}
  .services-hero__stage b{font-size:13px;line-height:18px}
  .services-hero__stage strong{font-size:14px;line-height:18px}
  .services-hero__stage small{font-size:11px;margin-top:3px}
  .services-hero__stage:nth-child(1){top:calc(22.1% - 9px)}
  .services-hero__stage:nth-child(2){top:calc(45.2% - 9px)}
  .services-hero__stage:nth-child(3){top:calc(68% - 9px)}
  .svc-cta{min-width:0;padding:0 22px}
}
@media(max-width:960px){
  .services-hero{min-height:0;display:block;padding:104px 0 40px}
  .services-hero__inner{display:block}
  .services-hero__copy{width:100%}
  .services-hero__title{font-size:clamp(34px,9vw,48px);max-width:none}
  .services-hero__actions .svc-cta{min-width:0}
  /* Stacked: the slabs cropped from the picture at a readable size, then the stages as a list. */
  .services-hero__art{position:relative;top:auto;right:auto;transform:none;height:auto;aspect-ratio:auto;margin:36px var(--gutter) 0;pointer-events:auto}
  .services-hero__art img{position:relative;height:320px;object-fit:cover;object-position:50% center;-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);-webkit-mask-composite:source-over;mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);mask-composite:add}
  .services-hero__stages{position:static;margin-top:16px}
  .services-hero__stage{position:static;white-space:normal;padding:10px 0;border-top:1px solid var(--line)}
  .services-hero__stage:nth-child(1),.services-hero__stage:nth-child(2),.services-hero__stage:nth-child(3){top:auto}
}
@media(max-width:620px){
  .services-hero__actions{flex-direction:column;align-items:stretch}
  .services-hero__art img{height:240px}
}
@media (prefers-reduced-motion: reduce){
  .services-hero__words > span{transition:none}
  .svc-cta,.svc-cta > span{transition:none}
}

/* ---------- Industries page hero ----------
   Reproduction of design/industries-hero-reference.webp (982 x 514): copy left over black, the monolith artwork
   scaled to the hero height and pinned to the right (its lower floor overflows so the monolith sits at the
   reference's 60% to 92% of the width at 1440), feathered into the black on its left edge. Same hero height,
   padding and CTA as the Services hero. Below 960px the hero stacks: copy, then the picture. */
.industries-hero{position:relative;overflow:hidden;background:transparent;min-height:clamp(540px,39.5vw,600px);display:flex;align-items:center;padding:96px 0 40px;border-bottom:1px solid var(--line)}
.industries-hero__inner{position:relative;z-index:2;width:100%;padding:0 var(--gutter)}
.industries-hero__copy{width:56%;max-width:680px}
.industries-hero__eyebrow{margin:0 0 22px;font-family:var(--font-body);font-weight:500;font-size:clamp(11px,.85vw,12.5px);letter-spacing:.22em;text-transform:uppercase;color:var(--ame-glow)}
.industries-hero__title{margin:0 0 20px;font-family:var(--font-head);font-weight:800;line-height:1.04;letter-spacing:-.03em;color:#fff}
.industries-hero__lead{margin:0 0 30px;max-width:440px;font-family:var(--font-body);font-size:16px;line-height:1.55;color:var(--silver-lo)}
.industries-hero__cta{min-width:0}
.industries-hero__art{position:absolute;top:0;right:0;z-index:1;height:108%;aspect-ratio:454/514;-webkit-mask-image:linear-gradient(90deg,rgba(0,0,0,0) 0,#000 24%);mask-image:linear-gradient(90deg,rgba(0,0,0,0) 0,#000 24%);pointer-events:none}
.industries-hero__art img{display:block;width:100%;height:100%;object-fit:cover}
@media(max-width:1180px){
  .industries-hero__art{height:100%}
  /* keep the reference's three heading lines as the column narrows (the sitewide 60px H1 rule needs the
     same priority here) */
  .industries-hero__copy{width:60%}
  .industries-hero__title{font-size:clamp(40px,5vw,60px) !important}
}
@media(max-width:960px){
  .industries-hero{display:block;min-height:0;padding:96px 0 0}
  .industries-hero__copy{width:100%;max-width:640px}
  .industries-hero__art{position:relative;top:auto;right:auto;height:clamp(340px,56vw,460px);width:100%;aspect-ratio:auto;margin-top:28px;-webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,0) 0,#000 10%);mask-image:linear-gradient(180deg,rgba(0,0,0,0) 0,#000 10%)}
  .industries-hero__art img{object-fit:contain;object-position:50% 100%}
  .industries-hero__title{font-size:clamp(34px,7vw,60px) !important}
}
@media(max-width:767px){
  .industries-hero__eyebrow{letter-spacing:.18em}
  .industries-hero__cta{width:100%}
}

/* ---------- Industries page: industry paths ----------
   Reproduction of the supplied reference: header row, then an image stage (46%) and a six-row industry index
   (54%) of equal height. The rows are tabs; the active one has a surface background, a thin purple rail, a
   white title and a short purple progress line, the others stay on the obsidian with hairline separators.
   The index sets the stage height, so switching rows never moves the page. Below 768px everything stacks. */
.industry-paths{width:100%;padding:var(--section-pad) var(--gutter);background:transparent;color:var(--silver-hi)}
.industry-paths__inner{width:100%}
.industry-paths__head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,36%);gap:24px clamp(32px,4vw,72px);align-items:start;margin-bottom:34px}
.industry-paths__eyebrow{margin:0 0 14px;font-family:var(--font-body);font-weight:500;font-size:clamp(11px,.85vw,12.5px);letter-spacing:.22em;text-transform:uppercase;color:var(--ame-glow)}
.industry-paths h2{margin:0;font-family:var(--font-head);font-weight:700;color:var(--silver-hi)}
.industry-paths__support{margin:0;padding-top:34px;max-width:520px;font-family:var(--font-body);font-size:16px;line-height:1.55;color:var(--silver-lo)}
.industry-paths__stage{display:grid;grid-template-columns:minmax(0,44fr) minmax(0,56fr);gap:14px;align-items:stretch}
/* image stage: the panels stack in one cell and fill the index's height */
.industry-paths__media{position:relative;display:grid;min-height:0;overflow:hidden;background:var(--panel)}
.industry-paths__panel{grid-area:1/1;opacity:0;transition:opacity 220ms ease;min-height:0}
.industry-paths__panel.is-active{opacity:1}
.industry-paths__panel img{display:block;width:100%;height:100%;object-fit:cover}
/* index rows */
.industry-paths__index{list-style:none;margin:0;padding:0;display:grid;grid-template-rows:repeat(6,minmax(0,1fr))}
.industry-paths__row{position:relative;display:grid;grid-template-columns:2rem minmax(0,1.38fr) minmax(0,1fr) minmax(0,.95fr);gap:0 clamp(14px,1.4vw,22px);align-items:center;min-height:96px;padding:18px clamp(16px,1.6vw,24px) 18px clamp(20px,1.8vw,28px);border-top:1px solid var(--line);overflow:hidden;transition:background-color 200ms ease}
.industry-paths__row:first-child{border-top:0}
.industry-paths__row::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--ame-glow);transform:scaleX(0);transform-origin:left center;transition:transform 200ms ease}
.industry-paths__row.is-active{background:var(--panel)}
.industry-paths__row.is-active::before{transform:none}
.industry-paths__num{font-family:var(--font-body);font-weight:400;font-size:clamp(16px,1.25vw,19px);color:var(--silver-lo);transition:color 200ms ease}
.industry-paths__row.is-active .industry-paths__num{color:var(--ame-glow)}
.industry-paths__name{position:relative;margin:0;font-family:var(--font-head);font-weight:600;font-size:clamp(17px,1.32vw,24px);line-height:1.15;letter-spacing:-.018em}
/* the whole row is the hit area: the tab button stretches over the row */
.industry-paths__tab{all:unset;display:block;color:#c4c0ca;cursor:pointer;transition:color 200ms ease}
/* the pseudo-element reaches well past the title cell in every direction and the row clips it, so the whole
   row is the hit area without widening the page */
.industry-paths__tab::after{content:"";position:absolute;inset:-300px -3000px}
.industry-paths__row.is-active .industry-paths__tab{color:var(--silver-hi)}
.industry-paths__tab:focus-visible{outline:2px solid var(--ame-light);outline-offset:4px}
/* progress line under the title: grey track, purple head that draws on activation */
.industry-paths__line{position:absolute;left:0;bottom:-12px;width:calc(172% + clamp(14px,1.4vw,22px));height:2px;background:var(--line);opacity:0;transition:opacity 200ms ease}
.industry-paths__line::before{content:"";position:absolute;left:0;top:0;bottom:0;width:22%;background:var(--ame-glow);transform:scaleX(0);transform-origin:left center;transition:transform 240ms ease 60ms}
.industry-paths__row.is-active .industry-paths__line{opacity:1}
.industry-paths__row.is-active .industry-paths__line::before{transform:none}
.industry-paths__behaviour{margin:0;font-family:var(--font-body);font-size:clamp(14px,1.05vw,16px);line-height:1.4;color:var(--silver-lo);transition:color 200ms ease}
.industry-paths__row.is-active .industry-paths__behaviour{color:#c4c0ca}
.industry-paths__outcome{margin:0;font-family:var(--font-body);font-weight:500;font-size:clamp(10px,.76vw,12px);letter-spacing:.14em;white-space:nowrap;text-transform:uppercase;color:var(--silver-lo);transition:color 200ms ease}
.industry-paths__row.is-active .industry-paths__outcome{color:var(--silver-hi)}
@media(max-width:1180px){
  /* three columns: the behaviour sits under the title so titles keep one line */
  .industry-paths__head{grid-template-columns:minmax(0,1fr) minmax(0,40%)}
  .industry-paths__row{grid-template-columns:2rem minmax(0,1.5fr) minmax(0,.9fr);grid-template-rows:auto auto;row-gap:4px;align-content:center;min-height:88px;padding:14px 18px 14px 22px}
  .industry-paths__num{grid-row:1 / span 2;align-self:start;padding-top:2px}
  .industry-paths__behaviour{grid-column:2}
  .industry-paths__outcome{grid-column:3;grid-row:1 / span 2;align-self:center;white-space:normal}
  .industry-paths__line{display:none}
}
@media(max-width:1023px){
  .industry-paths__stage{grid-template-columns:minmax(0,42fr) minmax(0,58fr)}
  .industry-paths__row{grid-template-columns:2rem minmax(0,1fr);grid-template-rows:auto auto auto}
  .industry-paths__num{grid-row:1 / span 3}
  .industry-paths__outcome{grid-column:2;grid-row:3}
}
@media(max-width:767px){
  .industry-paths__head{grid-template-columns:1fr;gap:12px;margin-bottom:24px}
  .industry-paths__support{padding-top:0}
  .industry-paths__stage{grid-template-columns:1fr;gap:16px}
  .industry-paths__media{aspect-ratio:4/5;max-height:480px}
  .industry-paths__row{min-height:56px;padding:14px 16px 14px 18px;row-gap:3px}
  .industry-paths__name{font-size:18px}
  .industry-paths__behaviour{font-size:14px}
  .industry-paths__outcome{font-size:10.5px}
}
@media(max-width:479px){
  .industry-paths{padding-left:24px;padding-right:24px}
}
@media (prefers-reduced-motion: reduce){
  .industry-paths__panel,.industry-paths__row,.industry-paths__row::before,.industry-paths__num,.industry-paths__tab,.industry-paths__line,.industry-paths__line::before,.industry-paths__behaviour,.industry-paths__outcome{transition:none}
}

/* ---------- Industries page: what changes by industry ----------
   Reproduction of the supplied reference: header row, then a 560px panoramic canvas running almost edge to
   edge with three equal journey zones, one stage per zone, one purple journey line through three nodes and
   the summary along the lower edge. The three market panels stack in one cell, so switching never moves the
   page. Activation: image crossfade with a 1.015 to 1 settle, stages fade in sequence, the path draws left to
   right, nodes appear as it reaches them (one pulse each), summary last. Below 768px the header stacks, the
   image takes a portrait crop and the stages become a vertical sequence on one thin purple line. */
.buyer-journey{--image-transition:420ms;--content-transition:220ms;--journey-duration:900ms;--ease-out:cubic-bezier(.22,1,.36,1);width:100%;padding:var(--section-pad) var(--gutter);background:transparent;color:var(--silver-hi)}
.buyer-journey__inner{width:100%}
.buyer-journey__head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,46%);gap:24px clamp(32px,4vw,72px);align-items:end;margin-bottom:28px}
.buyer-journey__eyebrow{margin:0 0 14px;font-family:var(--font-body);font-weight:500;font-size:clamp(11px,.85vw,12.5px);letter-spacing:.22em;text-transform:uppercase;color:var(--ame-glow)}
.buyer-journey h2{margin:0;max-width:12em;font-family:var(--font-head);font-weight:700;color:var(--silver-hi)}
.buyer-journey__aside{display:flex;flex-direction:column;gap:22px;align-self:stretch;justify-content:space-between}
.buyer-journey__support{margin:0;max-width:440px;font-family:var(--font-body);font-size:16px;line-height:1.55;color:var(--silver-lo)}
.buyer-journey__tabs{display:flex;gap:clamp(16px,2.1vw,40px);border-bottom:1px solid var(--line)}
.buyer-journey__tab{all:unset;position:relative;display:inline-flex;align-items:flex-end;min-height:44px;box-sizing:border-box;padding:0 0 10px;margin-bottom:-1px;font-family:var(--font-head);font-weight:600;font-size:clamp(13.5px,1.05vw,16px);line-height:1.3;color:var(--silver-lo);cursor:pointer;white-space:nowrap;transition:color var(--content-transition) ease}
.buyer-journey__tab::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--ame-glow);transform:scaleX(0);transform-origin:left center;transition:transform var(--content-transition) var(--ease-out)}
.buyer-journey__tab:hover{color:#d9d6e0}
.buyer-journey__tab.is-active{color:var(--silver-hi)}
.buyer-journey__tab.is-active::after{transform:none}
.buyer-journey__tab:focus-visible{outline:2px solid var(--ame-light);outline-offset:4px}
/* canvas: almost edge to edge, fixed height, panels stacked */
.buyer-journey__canvas{position:relative;display:grid;height:560px;margin:0 calc(14px - var(--gutter));overflow:hidden;background:var(--panel)}
.journey-panel{position:relative;grid-area:1/1;opacity:0;visibility:hidden;transition:opacity var(--image-transition) ease,visibility 0s linear var(--image-transition)}
.journey-panel.is-active{opacity:1;visibility:visible;transition:opacity var(--image-transition) ease,visibility 0s}
.journey-panel__media{position:absolute;inset:0}
.journey-panel__media img{display:block;width:100%;height:100%;object-fit:cover;transform:scale(1.015);transition:transform var(--image-transition) var(--ease-out)}
.journey-panel.is-active .journey-panel__media img{transform:none}
/* restrained overlay: darker at the base for the summary, a hairline at each third */
.journey-panel__overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,10,15,.22) 0%,rgba(10,10,15,.12) 45%,rgba(10,10,15,.62) 100%);pointer-events:none}
.journey-panel__overlay::before,.journey-panel__overlay::after{content:"";position:absolute;top:0;bottom:0;width:1px;background:rgba(244,244,246,.22)}
.journey-panel__overlay::before{left:33.333%}
.journey-panel__overlay::after{left:66.666%}
/* stages: one per third, centred, at the reference's rows */
.journey-panel__stages{position:absolute;left:0;right:0;top:27%;margin:0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.journey-stage{display:flex;flex-direction:column;align-items:center;text-align:center;padding:0 24px;opacity:0;transform:translateY(8px);transition:opacity var(--content-transition) ease,transform var(--content-transition) var(--ease-out)}
.journey-panel.is-active .journey-stage{opacity:1;transform:none}
.journey-panel.is-active .journey-stage:nth-child(1){transition-delay:120ms}
.journey-panel.is-active .journey-stage:nth-child(2){transition-delay:260ms}
.journey-panel.is-active .journey-stage:nth-child(3){transition-delay:400ms}
.journey-stage__num{font-family:var(--font-head);font-weight:800;font-size:clamp(64px,7.4vw,112px);line-height:1;letter-spacing:-.02em;color:rgba(244,244,246,.34)}
.journey-stage__label{margin-top:6px;font-family:var(--font-body);font-weight:500;font-size:clamp(11px,.85vw,12.5px);letter-spacing:.3em;text-transform:uppercase;color:var(--ame-glow)}
.journey-stage__text{margin-top:12px;font-family:var(--font-body);font-weight:400;font-size:clamp(17px,1.4vw,24px);line-height:1.3;color:var(--silver-hi);text-shadow:0 1px 14px rgba(10,10,15,.55)}
/* journey line and nodes at 60% of the canvas height */
.journey-panel__line{position:absolute;left:0;right:0;top:calc(60% - 60px);height:120px;pointer-events:none}
.journey-panel__line svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.journey-path{fill:none;stroke:var(--ame-glow);stroke-width:1.5;stroke-dasharray:var(--path-length);stroke-dashoffset:var(--path-length)}
.journey-panel.is-active .journey-path{animation:drawJourney var(--journey-duration) var(--ease-out) forwards}
@keyframes drawJourney{to{stroke-dashoffset:0}}
.journey-node{position:absolute;top:50%;width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;background:#e9defc;box-shadow:0 0 0 0 rgba(166,127,214,.7);opacity:0}
.journey-panel.is-active .journey-node{animation:journeyNode 700ms var(--ease-out) forwards;animation-delay:var(--node-delay)}
@keyframes journeyNode{0%{opacity:0;transform:scale(.4);box-shadow:0 0 0 0 rgba(166,127,214,.7)}35%{opacity:1;transform:scale(1.15)}100%{opacity:1;transform:none;box-shadow:0 0 0 14px rgba(166,127,214,0)}}
/* summary along the lower edge */
.journey-panel__summary{position:absolute;left:0;right:0;bottom:26px;margin:0;padding:0 24px;text-align:center;font-family:var(--font-body);font-weight:400;font-size:clamp(12px,.95vw,14px);letter-spacing:.14em;color:#d9d6e0;opacity:0;transition:opacity var(--content-transition) ease}
.journey-panel__summary span{margin:0 10px;color:var(--ame-glow)}
.journey-panel.is-active .journey-panel__summary{opacity:1;transition-delay:calc(var(--journey-duration) + 120ms)}
/* without JS only the first market shows and nothing animates */
html:not(.js) .journey-panel.is-active .journey-stage{transition:none}
@media(max-width:1180px){
  .buyer-journey__tabs{flex-wrap:wrap;gap:0 20px}
  .buyer-journey__canvas{height:500px}
  .journey-stage__text{font-size:clamp(16px,1.6vw,20px)}
}
@media(max-width:1023px){
  .buyer-journey__head{grid-template-columns:minmax(0,1fr) minmax(0,48%)}
  .buyer-journey__tabs{flex-wrap:wrap;gap:0 20px}
  .buyer-journey__canvas{height:460px}
  .journey-panel__stages{top:24%}
}
@media(max-width:767px){
  .buyer-journey__head{grid-template-columns:1fr;gap:16px;align-items:start;margin-bottom:20px}
  .buyer-journey__aside{gap:16px}
  .buyer-journey__tabs{flex-wrap:wrap;gap:4px 22px}
  .buyer-journey__tab{min-height:44px;padding:0 0 6px;display:inline-flex;align-items:flex-end}
  .buyer-journey__canvas{height:auto;margin:0}
  .journey-panel{display:flex;flex-direction:column}
  .journey-panel__media{position:relative;aspect-ratio:4/5;max-height:520px}
  .journey-panel__overlay{bottom:auto;aspect-ratio:4/5;max-height:520px}
  .journey-panel__overlay::before,.journey-panel__overlay::after{display:none}
  .journey-panel__stages{position:relative;top:auto;display:flex;flex-direction:column;gap:22px;padding:24px 0 0 26px;border-left:0}
  .journey-panel__stages::before{content:"";position:absolute;left:5px;top:34px;bottom:8px;width:1px;background:var(--ame)}
  .journey-stage{position:relative;align-items:flex-start;text-align:left;padding:0;flex-direction:row;flex-wrap:wrap;column-gap:14px}
  .journey-stage::before{content:"";position:absolute;left:-26px;top:10px;width:11px;height:11px;border-radius:50%;background:#e9defc}
  .journey-stage__num{font-size:34px;flex:none;width:52px;color:rgba(244,244,246,.34)}
  .journey-stage__label{margin-top:8px;flex:1 1 auto}
  .journey-stage__text{margin-top:6px;flex-basis:100%;font-size:17px;text-shadow:none;padding-left:66px}
  .journey-panel__line{display:none}
  .journey-panel__summary{position:relative;bottom:auto;margin-top:22px;padding:14px 0 0;text-align:left;border-top:1px solid var(--line);font-size:12px}
}
@media(max-width:479px){
  .buyer-journey{padding-left:24px;padding-right:24px}
  .journey-stage__text{padding-left:0}
}
@media (prefers-reduced-motion: reduce){
  .journey-panel,.journey-panel.is-active,.journey-panel__media img,.journey-stage,.buyer-journey__tab,.buyer-journey__tab::after,.journey-panel__summary{transition:none !important}
  .journey-panel__media img{transform:none}
  .journey-panel.is-active .journey-stage{transition-delay:0s}
  .journey-panel.is-active .journey-path,.journey-panel.is-active .journey-node{animation:none}
  .journey-path{stroke-dashoffset:0}
  .journey-panel.is-active .journey-node{opacity:1}
  .journey-panel.is-active .journey-panel__summary{transition-delay:0s}
}

/* ---------- Industries page: the Industry Marketing Blueprint ----------
   Reproduction of the supplied reference: header row, then the vertical lever selector (28%) beside the
   layered sheets (72%). The stage is the artwork's own aspect ratio (1671 x 941) and is a size container,
   so 1em inside it is 1% of the stage width: the front sheet's corners were measured on the artwork
   (208,150 1121,83 1093,868 125,820 of 1671 x 941) and the overlay below is a 56em x 45em rectangle carried
   onto exactly those corners by one perspective transform, at every viewport size. The four lever states
   stack in that overlay, so switching never changes the section's size. Below 768px the selector sits
   under the heading and the overlay leaves the sheet: it becomes a plain block under the artwork. */
.blueprint{--content-duration:220ms;--sheet-duration:420ms;--graph-duration:900ms;--blueprint-ease:cubic-bezier(.22,1,.36,1);width:100%;padding:var(--section-pad) var(--gutter);background:transparent;color:var(--silver-hi);overflow:hidden}
.blueprint__inner{width:100%}
.blueprint__head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,36%);gap:24px clamp(32px,4vw,72px);align-items:start;margin-bottom:26px}
.blueprint__eyebrow{margin:0 0 14px;font-family:var(--font-body);font-weight:500;font-size:clamp(11px,.85vw,12.5px);letter-spacing:.3em;text-transform:uppercase;color:var(--ame-glow)}
.blueprint h2{margin:0;font-family:var(--font-head);font-weight:700;color:var(--silver-hi)}
.blueprint__support{margin:0;padding-top:34px;max-width:480px;font-family:var(--font-body);font-size:16px;line-height:1.55;color:var(--silver-lo)}
.blueprint__body{display:grid;grid-template-columns:minmax(0,28fr) minmax(0,72fr);gap:clamp(20px,3vw,48px);align-items:start}
/* lever selector */
.blueprint__levers{display:flex;flex-direction:column;padding-top:clamp(20px,3.6vw,64px)}
.blueprint__tab{all:unset;position:relative;display:flex;align-items:center;gap:clamp(14px,1.6vw,26px);min-height:clamp(64px,6.4vw,96px);padding:0 clamp(16px,1.6vw,26px);border-bottom:1px solid var(--line);cursor:pointer;color:var(--silver-lo);transition:color var(--content-duration) ease}
.blueprint__tab::before{content:"";position:absolute;left:0;top:14%;bottom:14%;width:2px;background:var(--ame-glow);transform:scaleY(0);transition:transform var(--content-duration) var(--blueprint-ease)}
.blueprint__tab::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:var(--ame-glow);transform:scaleX(0);transform-origin:left center;transition:transform var(--sheet-duration) var(--blueprint-ease)}
.blueprint__num{font-family:var(--font-body);font-weight:400;font-size:clamp(14px,1.15vw,18px);letter-spacing:.06em;color:var(--silver-lo);transition:color var(--content-duration) ease}
.blueprint__title{font-family:var(--font-head);font-weight:600;font-size:clamp(17px,1.5vw,24px);line-height:1.15;letter-spacing:-.015em}
.blueprint__tab:hover{color:#d9d6e0}
.blueprint__tab.is-active{color:var(--silver-hi)}
.blueprint__tab.is-active .blueprint__num{color:var(--ame-glow)}
.blueprint__tab.is-active::before,.blueprint__tab.is-active::after{transform:none}
.blueprint__tab:focus-visible{outline:2px solid var(--ame-light);outline-offset:-2px}
/* stage: the artwork at its own ratio, the overlay projected onto the front sheet */
.blueprint__stage{position:relative;width:100%;aspect-ratio:1671/941;container-type:inline-size;transition:transform var(--sheet-duration) var(--blueprint-ease)}
.blueprint__stage.is-switching{transform:translateX(6px) scale(1.006)}
/* the scaler holds the artwork and the projected overlay together; phones zoom it so the front sheet fills the stage */
.blueprint__scaler{position:absolute;inset:0;transform-origin:0 0}
.blueprint__art{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:contain}
/* 1cqw here is 1% of the stage width (the container is the stage) */
.blueprint__sheet{position:absolute;left:0;top:0;width:56em;height:45em;font-size:1cqw;display:grid;transform-origin:0 0;transform:translate(12.448em,8.977em) perspective(199.95em) rotateZ(-4.197deg) rotateY(-31.293deg) rotateX(20.97deg) scale(.9814,.8855)}
.blueprint-state{grid-area:1/1;position:relative;padding:3.2em 3.4em 2.4em;opacity:0;visibility:hidden;transition:opacity var(--content-duration) ease,visibility 0s linear var(--content-duration)}
.blueprint-state.is-active{opacity:1;visibility:visible;transition:opacity var(--content-duration) ease var(--content-duration),visibility 0s linear var(--content-duration)}
.blueprint-state__label{margin:0 0 1.2em;font-family:var(--font-body);font-weight:500;font-size:max(.85em,10px);letter-spacing:.3em;text-transform:uppercase;color:#c4c0ca}
.blueprint-state__headline{margin:0;max-width:62%;font-family:var(--font-head);font-weight:600;font-size:max(3em,18px);line-height:1.08;letter-spacing:-.025em;color:var(--silver-hi)}
.blueprint-state__graph{position:absolute;left:3em;right:3em;top:17.5em;height:22.5em}
.blueprint-state__graph svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.blueprint-path{fill:none;stroke:var(--ame-glow);stroke-width:3;stroke-linecap:round;stroke-dasharray:var(--path-length);stroke-dashoffset:var(--path-length);filter:drop-shadow(0 0 6px rgba(166,127,214,.28))}
.blueprint-state.is-active .blueprint-path{animation:drawBlueprintPath var(--graph-duration) var(--blueprint-ease) forwards;animation-delay:var(--content-duration)}
@keyframes drawBlueprintPath{to{stroke-dashoffset:0}}
.blueprint-node{position:absolute;width:.9em;height:.9em;margin:-.45em 0 0 -.45em;border-radius:50%;background:#efe6ff;box-shadow:0 0 0 .35em rgba(166,127,214,.35),0 0 0 0 rgba(166,127,214,.5);opacity:0}
.blueprint-state.is-active .blueprint-node{animation:blueprintNode 620ms var(--blueprint-ease) forwards;animation-delay:calc(var(--node-delay) + var(--content-duration))}
@keyframes blueprintNode{0%{opacity:0;transform:scale(.4)}40%{opacity:1;transform:scale(1.2);box-shadow:0 0 0 .35em rgba(166,127,214,.35),0 0 0 .4em rgba(166,127,214,.45)}100%{opacity:1;transform:none;box-shadow:0 0 0 .35em rgba(166,127,214,.35),0 0 0 1.4em rgba(166,127,214,0)}}
/* annotation: label above a thin stem that rises from the node */
.blueprint-annotation{position:absolute;display:flex;flex-direction:column;align-items:flex-start;transform:translate(0,-100%);padding-bottom:.55em;font-family:var(--font-body);font-weight:400;font-size:max(1.15em,12px);line-height:1.2;color:var(--silver-hi);white-space:nowrap;opacity:0;transition:opacity var(--content-duration) ease}
.blueprint-annotation::after{content:"";width:1px;height:3.4em;margin-top:.5em;background:rgba(166,127,214,.85)}
.blueprint-state.is-active .blueprint-annotation{opacity:1;transition-delay:calc(var(--label-delay) + var(--content-duration))}
/* without JS only the first lever shows, drawn */
html:not(.js) .blueprint-state.is-active .blueprint-path{animation:none;stroke-dashoffset:0}
html:not(.js) .blueprint-state.is-active .blueprint-node{animation:none;opacity:1}
@media(max-width:1180px){
  .blueprint__head{grid-template-columns:minmax(0,1fr) minmax(0,40%)}
  .blueprint__body{grid-template-columns:minmax(0,30fr) minmax(0,70fr)}
}
@media(max-width:1023px){
  /* tablets: the selector sits above the stage so the sheets stay wide enough for the projected copy */
  .blueprint__body{grid-template-columns:1fr;gap:22px}
  .blueprint__levers{padding-top:0}
  .blueprint__tab{min-height:56px;padding:0 14px}
  .blueprint__title{font-size:16px}
}
@media(max-width:767px){
  .blueprint__head{grid-template-columns:1fr;gap:12px;margin-bottom:20px}
  .blueprint__support{padding-top:0}
  .blueprint__body{grid-template-columns:1fr;gap:20px}
  .blueprint__tab{min-height:48px;padding:0 14px;gap:14px}
  .blueprint__title{font-size:16px}
  /* phones: the overlay stays on the sheet; the artwork is zoomed so the front sheet fills a square stage and
     the projected copy is set in phone sizes (they scale with the zoom) */
  .blueprint__stage{aspect-ratio:1/.8}
  .blueprint__stage.is-switching{transform:none}
  .blueprint__scaler{inset:auto;left:0;top:0;width:100%;aspect-ratio:1671/941;transform:translate(-3%,3%) scale(1.45)}
  .blueprint-state{padding:2.6em 3em 2em}
  .blueprint-state__label{font-size:7px;letter-spacing:.26em;margin-bottom:.9em}
  .blueprint-state__headline{max-width:78%;font-size:13.5px}
  .blueprint-state__graph{top:17em;height:22em}
  .blueprint-node{width:6px;height:6px;margin:-3px 0 0 -3px;box-shadow:0 0 0 2.5px rgba(166,127,214,.35),0 0 0 0 rgba(166,127,214,.5)}
  .blueprint-annotation{font-size:8px;padding-bottom:.5em}
  .blueprint-annotation::after{height:3em;margin-top:.4em}
}
@media(max-width:479px){
  .blueprint{padding-left:24px;padding-right:24px}
}
@media (prefers-reduced-motion: reduce){
  .blueprint__stage,.blueprint__tab,.blueprint__tab::before,.blueprint__tab::after,.blueprint__num,.blueprint-state,.blueprint-state.is-active,.blueprint-annotation{transition:none !important}
  .blueprint__stage.is-switching{transform:none}
  .blueprint-state.is-active .blueprint-path,.blueprint-state.is-active .blueprint-node{animation:none}
  .blueprint-path{stroke-dashoffset:0}
  .blueprint-state.is-active .blueprint-node{opacity:1}
  .blueprint-state.is-active .blueprint-annotation{transition-delay:0s}
}

/* ---------- Industries page: evidence and direct answers ----------
   Reproduction of the supplied reference: header row, then the evidence ledger (43%) beside the direct
   answers (57%) with one hairline between them. The three evidence states stack in one cell, so switching
   never changes the height; the answers list is given a measured minimum height by site.js so opening a
   longer answer never moves the next section. Below 768px the two areas stack with one horizontal rule. */
.evidence-answers{--evidence-content-duration:220ms;--evidence-line-duration:650ms;--evidence-ease:cubic-bezier(.22,1,.36,1);width:100%;padding:var(--section-pad) var(--gutter);background:transparent;color:var(--silver-hi);overflow:hidden}
.evidence-answers__inner{width:100%}
.evidence-answers__head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,30%);gap:24px clamp(32px,4vw,72px);align-items:start;margin-bottom:34px}
.evidence-answers__eyebrow{margin:0 0 14px;font-family:var(--font-body);font-weight:500;font-size:clamp(11px,.85vw,12.5px);letter-spacing:.3em;text-transform:uppercase;color:var(--ame-glow)}
.evidence-answers h2{margin:0;font-family:var(--font-head);font-weight:700;color:var(--silver-hi)}
.evidence-answers__support{margin:0;padding-top:34px;max-width:420px;font-family:var(--font-body);font-size:16px;line-height:1.55;color:var(--silver-lo)}
.evidence-answers__body{display:grid;grid-template-columns:minmax(0,43fr) minmax(0,57fr);align-items:start;border-top:1px solid var(--line)}
/* ---- evidence ledger ---- */
.evidence-ledger{position:relative;padding:clamp(28px,3vw,44px) clamp(24px,3vw,48px) 0 0}
.evidence-ledger__ghost{position:absolute;left:-.04em;top:.1em;font-family:var(--font-head);font-weight:800;font-size:clamp(72px,8.6vw,138px);line-height:1;letter-spacing:-.02em;text-transform:uppercase;color:rgba(244,244,246,.045);white-space:nowrap;pointer-events:none;user-select:none}
.evidence-ledger__states{position:relative;display:grid;padding-top:clamp(84px,9.4vw,150px);min-height:0}
.evidence-state{grid-area:1/1;opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity var(--evidence-content-duration) ease,transform var(--evidence-content-duration) var(--evidence-ease),visibility 0s linear var(--evidence-content-duration)}
.evidence-state.is-active{opacity:1;visibility:visible;transform:none;transition:opacity var(--evidence-content-duration) ease var(--evidence-content-duration),transform var(--evidence-content-duration) var(--evidence-ease) var(--evidence-content-duration),visibility 0s linear var(--evidence-content-duration)}
.evidence-state__counter{margin:0 0 14px;font-family:var(--font-body);font-weight:500;font-size:clamp(14px,1.1vw,17px);letter-spacing:.06em;color:var(--silver-lo)}
.evidence-state__current{color:var(--ame-glow)}
.evidence-state__statement{margin:0 0 16px;max-width:11em;font-family:var(--font-head);font-weight:700;font-size:clamp(32px,3.6vw,58px);line-height:1.02;letter-spacing:-.03em;color:var(--silver-hi)}
.evidence-state__support{margin:0;max-width:520px;font-family:var(--font-body);font-size:clamp(15px,1.15vw,18px);line-height:1.5;color:#c4c0ca}
.evidence-ledger__tabs{display:flex;flex-direction:column;margin-top:clamp(32px,3.2vw,48px)}
.evidence-tab{all:unset;position:relative;display:grid;grid-template-columns:2.6rem minmax(0,1fr);align-items:center;gap:0 clamp(12px,1.4vw,22px);min-height:clamp(56px,4.6vw,66px);padding:0 0 0 clamp(16px,1.6vw,24px);border-bottom:1px solid var(--line);cursor:pointer;color:var(--silver-lo);transition:color var(--evidence-content-duration) ease}
.evidence-tab::before{content:"";position:absolute;left:0;top:18%;bottom:18%;width:2px;background:var(--ame-glow);transform:scaleY(0);transition:transform var(--evidence-content-duration) var(--evidence-ease)}
.evidence-tab__num{font-family:var(--font-body);font-weight:400;font-size:clamp(14px,1.1vw,17px);letter-spacing:.04em;transition:color var(--evidence-content-duration) ease}
.evidence-tab__label{position:relative;display:block;padding:14px 0;font-family:var(--font-head);font-weight:600;font-size:clamp(11.5px,.9vw,13.5px);letter-spacing:.22em;text-transform:uppercase}
/* purple underline drawn left to right, with one light sweep along it */
.evidence-tab__line{position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--ame-glow);transform:scaleX(0);transform-origin:left center;overflow:visible;pointer-events:none}
.evidence-tab__sweep{position:absolute;top:-2px;left:0;width:34%;height:5px;background:radial-gradient(ellipse at center,rgba(233,222,252,.95) 0%,rgba(166,127,214,.5) 45%,rgba(166,127,214,0) 72%);opacity:0;transform:translateX(-100%)}
.evidence-tab:hover{color:#d9d6e0}
.evidence-tab.is-active{color:var(--silver-hi)}
.evidence-tab.is-active .evidence-tab__num{color:var(--ame-glow)}
.evidence-tab.is-active::before{transform:none}
.evidence-tab.is-active .evidence-tab__line{transform:none;transition:transform var(--evidence-line-duration) var(--evidence-ease)}
.evidence-tab.is-active .evidence-tab__sweep{animation:evidenceSweep var(--evidence-line-duration) var(--evidence-ease) 120ms 1 both}
@keyframes evidenceSweep{0%{opacity:0;transform:translateX(-100%)}15%{opacity:1}100%{opacity:0;transform:translateX(300%)}}
.evidence-tab:focus-visible{outline:2px solid var(--ame-light);outline-offset:-2px}
/* ---- direct answers ---- */
.direct-answers-list{border-left:1px solid var(--line);padding:clamp(28px,3vw,44px) 0 0 clamp(28px,3.4vw,56px)}
.direct-answers-list__eyebrow{margin:0 0 12px;font-family:var(--font-body);font-weight:500;font-size:clamp(11px,.85vw,12.5px);letter-spacing:.3em;text-transform:uppercase;color:var(--ame-glow)}
.answer-item{border-bottom:1px solid var(--line)}
.answer-item__heading{margin:0;font-size:inherit}
.answer-item__trigger{all:unset;box-sizing:border-box;display:grid;grid-template-columns:2.6rem minmax(0,1fr) 22px;align-items:center;gap:0 clamp(12px,1.4vw,22px);width:100%;min-height:44px;padding:clamp(20px,2vw,30px) 0;cursor:pointer;color:var(--silver-lo);transition:color var(--evidence-content-duration) ease}
.answer-item__num{font-family:var(--font-body);font-weight:400;font-size:clamp(14px,1.1vw,17px);letter-spacing:.04em;color:var(--silver-lo);transition:color var(--evidence-content-duration) ease}
.answer-item__question{font-family:var(--font-head);font-weight:600;font-size:clamp(19px,1.7vw,28px);line-height:1.2;letter-spacing:-.02em;color:inherit}
/* thin plus that becomes a minus */
.answer-item__icon{position:relative;width:22px;height:22px;justify-self:end}
.answer-item__icon::before,.answer-item__icon::after{content:"";position:absolute;left:0;top:50%;width:22px;height:1px;background:currentColor;transform:translateY(-50%)}
.answer-item__icon::after{transform:translateY(-50%) rotate(90deg);transition:transform 280ms var(--evidence-ease),opacity 180ms ease}
.answer-item.is-open .answer-item__icon::after{transform:translateY(-50%) rotate(0);opacity:0}
.answer-item__trigger:hover{color:#d9d6e0}
.answer-item.is-open .answer-item__trigger{color:var(--silver-hi)}
.answer-item.is-open .answer-item__num{color:var(--ame-glow)}
.answer-item__trigger:focus-visible{outline:2px solid var(--ame-light);outline-offset:-2px}
/* grid reveal */
.answer-panel{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows 280ms var(--evidence-ease),opacity 180ms ease}
.answer-panel[hidden]{display:grid}
.answer-item.is-open .answer-panel{grid-template-rows:1fr;opacity:1}
.answer-panel__inner{overflow:hidden;min-height:0}
.answer-item__answer{margin:0;padding:0 44px 0 calc(2.6rem + clamp(12px,1.4vw,22px));max-width:760px;font-family:var(--font-body);font-size:clamp(15px,1.15vw,18px);line-height:1.5;color:var(--silver-lo)}
.answer-item__rule{display:block;height:1px;margin:24px 0 clamp(20px,2vw,28px) calc(2.6rem + clamp(12px,1.4vw,22px));background:linear-gradient(90deg,var(--ame-glow) 0%,rgba(166,127,214,.55) 60%,rgba(166,127,214,.12) 100%)}
@media(max-width:1180px){
  .evidence-answers__head{grid-template-columns:minmax(0,1fr) minmax(0,36%)}
  .evidence-state__statement{font-size:clamp(30px,4vw,48px)}
  .answer-item__question{font-size:clamp(18px,2vw,24px)}
}
@media(max-width:1023px){
  .evidence-answers__body{grid-template-columns:minmax(0,46fr) minmax(0,54fr)}
  .evidence-ledger{padding-right:20px}
  .direct-answers-list{padding-left:22px}
}
@media(max-width:767px){
  .evidence-answers__head{grid-template-columns:1fr;gap:12px;margin-bottom:24px}
  .evidence-answers__support{padding-top:0}
  .evidence-answers__body{grid-template-columns:1fr}
  .evidence-ledger{padding:26px 0 30px;border-bottom:1px solid var(--line)}
  .evidence-ledger__ghost{font-size:clamp(52px,16vw,84px)}
  .evidence-ledger__states{padding-top:74px}
  .evidence-state__statement{font-size:clamp(30px,8.2vw,36px)}
  .evidence-ledger__tabs{margin-top:26px}
  .evidence-tab{min-height:52px;padding-left:14px}
  .direct-answers-list{border-left:0;padding:28px 0 0}
  .answer-item__trigger{grid-template-columns:2.2rem minmax(0,1fr) 18px;padding:18px 0;gap:0 12px}
  .answer-item__question{font-size:18px}
  .answer-item__icon,.answer-item__icon::before,.answer-item__icon::after{width:18px}
  .answer-item__icon{height:18px}
  .answer-item__answer{padding:0 0 0 calc(2.2rem + 12px);font-size:15px}
  .answer-item__rule{margin:18px 0 20px calc(2.2rem + 12px)}
}
@media(max-width:479px){
  .evidence-answers{padding-left:24px;padding-right:24px}
}
@media (prefers-reduced-motion: reduce){
  .evidence-state,.evidence-state.is-active,.evidence-tab,.evidence-tab::before,.evidence-tab__num,.evidence-tab.is-active .evidence-tab__line,.answer-item__trigger,.answer-item__num,.answer-item__icon::after,.answer-panel{transition:none !important}
  .evidence-state{transform:none}
  .evidence-tab.is-active .evidence-tab__sweep{animation:none}
}

/* ---------- Method page hero ----------
   Reproduction of the supplied reference: copy left over dark negative space (about 46%), the gateway
   photograph filling the right and bottom edges (about 54%) with its left edge dissolving into the page, and
   a live purple beam drawn through the openings. The picture and the beam SVG share one media wrapper with
   identical size, position and right-anchored cover cropping, so the beam never drifts from the openings.
   Same height, padding, phrase rotator and clipped CTA as the Services hero. */
.method-hero{position:relative;overflow:hidden;background:transparent;min-height:clamp(600px,50vw,720px);display:flex;align-items:center;padding:96px 0 40px;border-bottom:1px solid var(--line)}
.method-hero__inner{position:relative;z-index:2;width:100%;padding:0 var(--gutter)}
.method-hero__copy{width:47%;max-width:720px}
.method-hero__eyebrow{margin:0 0 26px;font-family:var(--font-body);font-weight:500;font-size:clamp(11px,.85vw,12.5px);letter-spacing:.32em;text-transform:uppercase;color:var(--silver-lo)}
.method-hero__title{margin:0 0 22px;font-family:var(--font-head);font-weight:700;color:var(--silver-hi)}
.method-hero__lead{margin:0 0 34px;max-width:34.5em;font-family:var(--font-body);font-weight:400;font-size:clamp(16px,1.25vw,18px);line-height:1.5;color:#c4c0ca}
.method-hero__cta{min-width:0}
.method-hero__rule{margin:30px 0 20px;height:1px;background:var(--line)}
.method-hero__note{margin:0;font-family:var(--font-body);font-weight:400;font-size:clamp(11.5px,.87vw,12.5px);letter-spacing:.06em;color:var(--silver-lo)}
/* media: picture and beam cropped identically, anchored right and bottom */
.method-hero__media{position:absolute;top:0;right:0;bottom:0;width:72%;z-index:1;pointer-events:none;-webkit-mask-image:linear-gradient(90deg,rgba(0,0,0,0) 0,#000 22%);mask-image:linear-gradient(90deg,rgba(0,0,0,0) 0,#000 22%)}
.method-hero__image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center right;display:block}
.method-hero__media::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,10,15,1) 0%,rgba(10,10,15,.9) 6%,rgba(10,10,15,.4) 18%,rgba(10,10,15,0) 30%)}
.method-hero__beam{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible;z-index:1}
/* beam segments: glow under core, each drawn along its own run between an opening and the next slab; the
   timing (gateway lights, segment shoots, hold, fade) is SMIL in the markup on one fixed cycle */
.method-beam{fill:none;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke;stroke-dasharray:1;stroke-dashoffset:1;opacity:0}
.method-beam--glow{stroke:#a67fd6;stroke-width:7;filter:url("#methodBeamGlow")}
.method-beam--core{stroke:url("#methodBeamGradient");stroke-width:2}
.method-beam-pulse{opacity:0}
/* gateway response: a brief, low lift of purple at each opening as its beam fires */
.method-gate{fill:#a67fd6;opacity:.16;filter:url("#methodGateGlow")}
@media(max-width:1180px){
  .method-hero__copy{width:50%}
  /* tablets: a shorter media box scales the picture down so the whole row of gateways stays in the crop */
  .method-hero__media{width:70%;top:auto;height:64%}
}
@media(max-width:960px){
  .method-hero{display:block;min-height:0;padding:96px 0 0}
  .method-hero__copy{width:100%;max-width:640px}
  /* stacked: the picture and beam under the copy at a fixed height, right-anchored so the openings stay in view */
  .method-hero__media{position:relative;top:auto;right:auto;bottom:auto;width:100%;height:clamp(280px,42vw,340px);margin-top:32px;-webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,0) 0,#000 18%);mask-image:linear-gradient(180deg,rgba(0,0,0,0) 0,#000 18%)}
  .method-hero__media::after{background:linear-gradient(180deg,rgba(10,10,15,.6) 0%,rgba(10,10,15,0) 34%)}
}
@media(max-width:767px){
  .method-hero__eyebrow{letter-spacing:.2em}
  .method-hero__cta{width:100%}
}
@media(max-width:480px){
  /* the longest phrase ("commercial decisions.") stays on one line, so the reserved box has no empty row */
  .method-hero__title .services-hero__phrase{font-size:.8em;white-space:nowrap}
}
@media (prefers-reduced-motion: reduce){
  /* the SMIL timelines still run but cannot beat these; the beam sits complete and faint */
  .method-beam{stroke-dashoffset:0 !important;opacity:.42 !important}
  .method-beam-pulse{display:none}
  .method-gate{opacity:.16 !important}
}

/* ---------- Method page: engagement diagnostic ----------
   Implemented from the supplied design: the dial photograph fills the left column (52%), the editorial
   content sits on the right (48%) behind a 1px divider, no CTA. The picture and everything placed on it (the
   stage buttons and the indicator arc) share one frame: a box of the picture's aspect ratio that covers the
   column (the column is a size container, so the frame is max(148cqw, 150cqh), capped at 190cqh on very wide
   screens and at 205cqw below 1180px so the dial always fits) and is positioned so the
   dial's centre (33.9% across the picture) sits at the column's horizontal centre. Percent positions inside
   that frame are therefore picture coordinates, so the triggers sit on the quadrant plates and the arc on the
   groove at every size. The four content panels stack in one cell so stage changes never move the page.
   Phones: header, picture, a two-by-two stage grid, the active content, the note. */
.engagement-path{--ep-ease:cubic-bezier(.22,1,.36,1);--ep-dial-x:33.9%;position:relative;display:grid;grid-template-columns:minmax(0,52fr) minmax(0,48fr);width:100%;min-height:720px;border-top:1px solid var(--line);color:var(--silver-hi)}
/* ---- visual column ---- */
.engagement-path__visual{position:relative;overflow:hidden;background:#07070b;border-right:1px solid var(--line);container-type:size}
.ep-frame,.ep-stages{position:absolute;top:50%;left:50%;width:min(max(148cqw,150cqh),190cqh);aspect-ratio:1536/1024;transform:translate(calc(-1 * var(--ep-dial-x)),-50%)}
.ep-frame__image{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:fill}
.ep-dial{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.ep-dial__arc{fill:none;stroke-linecap:round;stroke-dasharray:var(--ep-len) calc(360 - var(--ep-len));stroke-dashoffset:calc(-1 * var(--ep-start));transition:stroke-dasharray 450ms var(--ep-ease),stroke-dashoffset 450ms var(--ep-ease)}
.ep-dial__arc--core{stroke:#cdb8f2;stroke-width:5}
.ep-dial__arc--glow{stroke:#9d74d2;stroke-width:16;opacity:.6}
/* the picture's own arc at quadrant 02, masked by a soft dark stroke while another quadrant is active */
.ep-dial__cover{fill:none;stroke:#17161c;stroke-width:34;opacity:0;transition:opacity 300ms ease}
.engagement-path.is-away .ep-dial__cover{opacity:.96}
/* stage triggers on the plates */
.ep-stages{list-style:none;margin:0;padding:0;container-type:inline-size}
.ep-stage{position:absolute;transform:translate(-50%,-50%)}
.ep-stage__trigger{all:unset;box-sizing:border-box;display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:1cqw 1.4cqw;text-align:center;cursor:pointer;color:#bdb9c4;text-shadow:0 1px 6px rgba(0,0,0,.85),0 0 14px rgba(0,0,0,.7);transition:color 250ms ease}
.ep-stage__num{font-family:var(--font-head);font-weight:700;font-size:clamp(14px,2cqw,26px);line-height:1;letter-spacing:.02em;transition:color 250ms ease}
.ep-stage__title{margin-top:.55em;font-family:var(--font-body);font-weight:500;font-size:clamp(9px,.95cqw,12.5px);letter-spacing:.2em;text-transform:uppercase;line-height:1.25;white-space:nowrap}
.ep-stage__title::after{content:"";display:block;height:2px;width:0;margin:.55em auto 0;background:var(--ame-glow);box-shadow:0 0 8px rgba(166,127,214,.8);transition:width 450ms var(--ep-ease)}
.ep-stage__trigger:hover{color:var(--silver-hi)}
.ep-stage__trigger.is-active{color:var(--silver-hi)}
.ep-stage__trigger.is-active .ep-stage__num{color:var(--ame-glow)}
.ep-stage__trigger.is-active .ep-stage__title::after{width:2.4em}
.ep-stage__trigger:focus-visible{outline:2px solid var(--ame-light);outline-offset:4px}
/* ---- content column ---- */
.engagement-path__content{display:flex;flex-direction:column;padding:clamp(56px,6vw,80px) var(--gutter) clamp(48px,5vw,64px) clamp(40px,4.6vw,66px)}
.engagement-path__eyebrow{margin:0 0 18px;font-family:var(--font-body);font-weight:500;font-size:clamp(11px,.85vw,12.5px);letter-spacing:.3em;text-transform:uppercase;color:var(--silver-lo)}
.engagement-path h2{margin:0 0 16px;font-family:var(--font-head);font-weight:700;color:var(--silver-hi)}
.engagement-path h2 em{font-style:normal;color:var(--ame-glow)}
.engagement-path__support{margin:0 0 28px;padding-bottom:28px;border-bottom:1px solid var(--line);max-width:36em;font-family:var(--font-body);font-size:16px;line-height:1.55;color:var(--silver-lo)}
.engagement-path__panels{display:grid;flex:1 0 auto}
.ep-panel{grid-area:1/1;opacity:0;visibility:hidden;transition:opacity 220ms ease,visibility 0s linear 220ms}
.ep-panel.is-active{opacity:1;visibility:visible;transition:opacity 0s,visibility 0s}
.ep-panel > *{transition:opacity 250ms ease,transform 450ms var(--ep-ease);transition-delay:calc(var(--i) * 40ms)}
.ep-panel:not(.is-active) > *{opacity:0;transform:translateY(8px);transition-delay:0s}
.ep-panel.is-leaving > *{opacity:0;transform:translateY(-8px);transition:opacity 180ms ease,transform 220ms var(--ep-ease);transition-delay:0s}
.ep-panel__stage{margin:0 0 8px;font-family:var(--font-body);font-weight:500;font-size:clamp(12px,.95vw,14px);letter-spacing:.22em;text-transform:uppercase;color:var(--ame-glow)}
.ep-panel__stage-num{color:var(--silver-hi)}
.ep-panel__descriptor{margin:0 0 18px;font-family:var(--font-body);font-weight:500;font-size:clamp(10.5px,.8vw,12px);letter-spacing:.2em;text-transform:uppercase;color:var(--silver-lo)}
.ep-panel__heading{margin:0 0 14px;font-family:var(--font-head);font-weight:600;font-size:clamp(24px,2.1vw,32px);line-height:1.1;letter-spacing:-.025em;color:var(--silver-hi)}
.ep-panel__desc{margin:0 0 22px;max-width:36em;font-family:var(--font-body);font-size:clamp(15px,1.15vw,18px);line-height:1.5;color:#c4c0ca}
.ep-panel__outcomes{list-style:none;margin:0;padding:0}
.ep-panel__outcomes li{position:relative;padding:6px 0 6px 52px;font-family:var(--font-body);font-size:clamp(15px,1.15vw,18px);line-height:1.45;color:var(--silver-hi)}
.ep-panel__outcomes li::before{content:"";position:absolute;left:0;top:calc(.72em + 6px);width:34px;height:2px;background:var(--ame-glow)}
/* closing note: small, muted, a short purple rule, not a link */
.engagement-path__note{margin:32px 0 0;padding-top:28px;border-top:1px solid var(--line);max-width:22em;font-family:var(--font-body);font-size:clamp(13px,1vw,15px);line-height:1.5;color:var(--silver-lo)}
.engagement-path__note-rule{display:block;width:40px;height:2px;margin-bottom:12px;background:var(--ame-glow)}
@media(max-width:1180px){
  .engagement-path__content{padding-left:clamp(28px,3.4vw,44px)}
}
@media(min-width:2100px){
  .ep-frame{-webkit-mask-image:linear-gradient(90deg,transparent,#000 7%);mask-image:linear-gradient(90deg,transparent,#000 7%)}
}
@media(max-width:1180px){
  /* narrow columns: the dial must fit the column, so the frame is capped and its top and bottom fade */
  .ep-frame,.ep-stages{width:min(max(148cqw,150cqh),205cqw)}
  .ep-frame{-webkit-mask-image:linear-gradient(180deg,transparent,#000 10%,#000 90%,transparent);mask-image:linear-gradient(180deg,transparent,#000 10%,#000 90%,transparent)}
  .ep-stage__title{white-space:normal;max-width:9em;letter-spacing:.14em}
}
@media(max-width:1023px){
  .engagement-path{grid-template-columns:minmax(0,48fr) minmax(0,52fr)}
}
@media(max-width:767px){
  .engagement-path{display:flex;flex-direction:column;min-height:0}
  .engagement-path__content{order:1;display:contents}
  .engagement-path__eyebrow,.engagement-path h2,.engagement-path__support{margin-left:var(--gutter);margin-right:var(--gutter)}
  .engagement-path__eyebrow{order:1;margin-top:var(--section-pad)}
  .engagement-path h2{order:2}
  .engagement-path__support{order:3;border-bottom:0;padding-bottom:0;margin-bottom:24px}
  .engagement-path__visual{order:4;display:flex;flex-direction:column;border-right:0;overflow:visible;background:none;container-type:normal}
  /* the picture at 320px, covered around the dial; the arc keeps the picture's frame inside the crop */
  .ep-frame{position:relative;top:auto;left:auto;transform:none;width:100%;height:320px;aspect-ratio:auto;overflow:hidden;background:#07070b;-webkit-mask-image:none;mask-image:none}
  .ep-frame__image{object-fit:cover;object-position:var(--ep-dial-x) 50%}
  .ep-dial{inset:auto;top:50%;left:var(--ep-dial-x);width:480px;max-width:none;height:320px;aspect-ratio:1536/1024;transform:translate(calc(-1 * var(--ep-dial-x)),-50%)}
  .ep-stages{position:static;transform:none;width:auto;aspect-ratio:auto;display:grid;grid-template-columns:1fr 1fr;gap:1px;margin:0 var(--gutter);border:1px solid var(--line);background:var(--line);container-type:normal}
  .ep-stage{position:static;transform:none;background:var(--void)}
  .ep-stage__trigger{width:100%;min-height:64px;padding:12px 12px;flex-direction:row;justify-content:flex-start;align-items:center;gap:12px;text-align:left;text-shadow:none}
  .ep-stage__num{font-size:18px}
  .ep-stage__title{margin-top:0;max-width:none;font-size:11px;letter-spacing:.16em;white-space:normal}
  .ep-stage__title::after{margin:6px 0 0}
  .engagement-path__panels{order:5;margin:28px var(--gutter) 0}
  .engagement-path__note{order:6;margin:28px var(--gutter) var(--section-pad);max-width:none}
}
@media (prefers-reduced-motion: reduce){
  .ep-dial__arc,.ep-dial__cover,.ep-stage__trigger,.ep-stage__num,.ep-stage__title::after,.ep-panel,.ep-panel > *{transition:none !important}
  .ep-panel:not(.is-active) > *{transform:none}
}

/* ---------- Method page: the evidence contract ----------
   Reproduction of the supplied reference: heading area (eyebrow and H2 left, supporting paragraph right and
   bottom aligned), one full-width hairline, three edge-to-edge accordion rows separated by 1px rules, and a
   closing statement. Each row is one grid: number | title and descriptor | question, trace and explanation |
   decision output | marker. The explanation is laid out in every row and only shown in the active one, so all
   rows share one height and opening a row never moves the page. The trigger is the title button, stretched
   over its whole row with a positioned pseudo-element. Transparent background so the sitewide obsidian
   texture shows through (no texture of its own). */
.evidence-contract{--ec-ease:cubic-bezier(.22,1,.36,1);position:relative;width:100%;padding:var(--section-pad) var(--gutter);background:transparent;color:var(--silver-hi)}
/* a <header> element: the global fixed-header rule must be reset here */
.evidence-contract__header{position:static;top:auto;left:auto;right:auto;z-index:auto;border:0;transition:none;background:none;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(320px,.75fr);gap:24px clamp(48px,8vw,144px);align-items:end;padding-bottom:clamp(28px,3vw,44px)}
.evidence-contract__eyebrow{margin:0 0 16px;font-family:var(--font-body);font-weight:500;font-size:clamp(11px,.85vw,12.5px);letter-spacing:.3em;text-transform:uppercase;color:var(--silver-lo)}
.evidence-contract h2{margin:0;font-family:var(--font-head);font-weight:700;color:var(--silver-hi)}
.evidence-contract h2 em{font-style:normal;color:var(--ame-glow)}
.evidence-contract__support{margin:0;max-width:34em;font-family:var(--font-body);font-size:16px;line-height:1.55;color:var(--silver-lo)}
/* ---- accordion ---- */
.evidence-contract__accordion{border-top:1px solid var(--line)}
.ec-row{position:relative;display:grid;grid-template-columns:clamp(72px,7.5vw,124px) minmax(0,26fr) minmax(0,41fr) minmax(0,21fr) 44px;align-items:center;column-gap:0;min-height:clamp(150px,11vw,176px);padding:clamp(22px,2.2vw,32px) 0;border-bottom:1px solid var(--line);transition:background-color 250ms ease}
.ec-row.is-active{background:linear-gradient(90deg,rgba(20,20,27,.9),rgba(20,20,27,.35) 60%,rgba(20,20,27,0))}
.ec-row__number{margin:0;font-family:var(--font-head);font-weight:700;font-size:clamp(48px,5.4vw,84px);line-height:.8;letter-spacing:-.03em;color:var(--silver-lo);opacity:.4;transition:color 250ms ease,opacity 250ms ease}
.ec-row.is-active .ec-row__number{color:var(--ame-glow);opacity:1}
.ec-row__heading{position:static;align-self:stretch;display:flex;align-items:center;margin:0;padding:0 clamp(20px,2vw,40px);border-left:1px solid var(--line);font-size:inherit;line-height:inherit}
/* the trigger: the title block, with its hit area stretched over the whole row */
.ec-row__trigger{all:unset;box-sizing:border-box;display:flex;flex-direction:column;gap:10px;min-height:44px;justify-content:center;cursor:pointer;color:var(--silver-hi)}
.ec-row__trigger::before{content:"";position:absolute;inset:0;cursor:pointer}
.ec-row__trigger:focus-visible{outline:none}
.ec-row__trigger:focus-visible::before{outline:2px solid var(--ame-light);outline-offset:-4px}
.ec-row__title{font-family:var(--font-head);font-weight:600;font-size:clamp(20px,1.75vw,29px);line-height:1;letter-spacing:.04em;text-transform:uppercase;color:#d9d7de;transition:color 250ms ease}
.ec-row:hover .ec-row__title,.ec-row.is-active .ec-row__title{color:var(--silver-hi)}
.ec-row__descriptor{font-family:var(--font-body);font-weight:500;font-size:clamp(10px,.75vw,11.5px);letter-spacing:.3em;text-transform:uppercase;color:var(--silver-lo)}
/* question, trace and explanation */
.ec-row__body{position:relative;padding:0 clamp(20px,2.4vw,44px) 0 0;pointer-events:none}
.ec-row__question{margin:0 0 10px;font-family:var(--font-body);font-weight:500;font-size:clamp(17px,1.4vw,22px);line-height:1.3;color:var(--silver-hi)}
.ec-row__trace{display:block;position:relative;height:1px;margin:0 0 16px;background:var(--line);opacity:0;transition:opacity 250ms ease}
.ec-row__trace::before{content:"";position:absolute;left:0;top:-1px;width:66%;height:2px;background:var(--ame-glow);transform:scaleX(0);transform-origin:left center;transition:transform 600ms var(--ec-ease)}
.ec-row.is-active .ec-row__trace{opacity:1}
.ec-row.is-active .ec-row__trace::before{transform:scaleX(1)}
.ec-row__panel{visibility:hidden;opacity:0;transform:translateY(6px);transition:opacity 250ms ease,transform 450ms var(--ec-ease),visibility 0s linear 250ms}
.ec-row.is-active .ec-row__panel{visibility:visible;opacity:1;transform:none;transition:opacity 250ms ease 120ms,transform 450ms var(--ec-ease) 120ms,visibility 0s}
.ec-row__explanation{margin:0;font-family:var(--font-body);font-size:16px;line-height:1.5;color:var(--silver-lo)}
/* decision output and marker */
.ec-row__output{align-self:stretch;display:flex;align-items:center;margin:0;padding:0 clamp(16px,1.6vw,40px);border-left:1px solid var(--line);font-family:var(--font-body);font-size:clamp(16px,1.3vw,21px);line-height:1.3;color:var(--silver-lo);transition:color 250ms ease;pointer-events:none}
.ec-row.is-active .ec-row__output{color:var(--ame-glow)}
.ec-row__marker{position:relative;display:block;width:44px;height:44px;justify-self:end;font-family:var(--font-body);font-weight:300;font-size:30px;line-height:44px;text-align:center;color:var(--silver-lo);pointer-events:none}
.ec-row__plus,.ec-row__minus{position:absolute;inset:0;transition:opacity 250ms ease}
.ec-row__minus{opacity:0;color:var(--ame-glow)}
.ec-row.is-active .ec-row__plus{opacity:0}
.ec-row.is-active .ec-row__minus{opacity:1}
/* closing statement: editorial, not a link */
.evidence-contract__closing{margin:clamp(36px,4vw,56px) 0 0;font-family:var(--font-body);font-size:clamp(15px,1.15vw,18px);line-height:1.5;color:var(--silver-lo)}
@media(max-width:1023px){
  .evidence-contract__header{grid-template-columns:minmax(0,1fr) minmax(280px,.9fr);gap:20px 40px}
  .ec-row{grid-template-columns:clamp(64px,7vw,90px) minmax(0,26fr) minmax(0,44fr) minmax(0,22fr) 40px}
  .ec-row__title{letter-spacing:.03em}
}
@media(max-width:767px){
  .evidence-contract__header{display:block;padding-bottom:28px}
  .evidence-contract__support{margin-top:20px;max-width:none}
  /* each row becomes a vertical layout: number and title, question, trace, decision output, explanation;
     the body wrapper dissolves so its children take their own named rows */
  .ec-row{grid-template-columns:auto minmax(0,1fr) 44px;grid-template-areas:"number heading marker" "question question question" "trace trace trace" "output output output" "panel panel panel";align-items:center;row-gap:0;min-height:88px;padding:22px 0 24px}
  .ec-row.is-active{background:linear-gradient(180deg,rgba(20,20,27,.9),rgba(20,20,27,0))}
  .ec-row__number{grid-area:number;font-size:30px;line-height:1;letter-spacing:-.02em;padding-right:16px}
  .ec-row__heading{grid-area:heading;padding:0 0 0 16px;border-left:1px solid var(--line)}
  .ec-row__trigger{gap:6px;min-height:44px}
  .ec-row__title{font-size:22px}
  .ec-row__marker{grid-area:marker;align-self:start}
  .ec-row__body{display:contents}
  .ec-row__question{grid-area:question;margin:18px 0 10px;font-size:18px}
  .ec-row__trace{grid-area:trace;margin:0 0 12px}
  .ec-row__output{grid-area:output;display:block;padding:0;border-left:0;font-size:16px}
  .ec-row__panel{grid-area:panel;padding-top:14px}
  .evidence-contract__closing{margin-top:32px}
}
@media (prefers-reduced-motion: reduce){
  .ec-row,.ec-row__number,.ec-row__title,.ec-row__trace,.ec-row__trace::before,.ec-row__panel,.ec-row__output,.ec-row__plus,.ec-row__minus{transition:none !important}
  .ec-row__panel{transform:none}
}

/* ---------- Method page: what counts commercially ----------
   Reproduction of the supplied reference: two-column heading (eyebrow and H2 left, supporting line right,
   bottom aligned) above the supplied plinth picture, which fills the content width at its own aspect ratio
   so nothing is cropped on desktop. The four outcome tabs, the explanations and the closing note are laid
   over the picture's lower part in picture coordinates (label row at 73% of the height, note at 91%), so they
   sit beneath their markers at any size. The indicator is one tick under the active label and one soft glow
   at that marker's base, both moved by --cc-x with a 600ms travel. Panels are stacked absolutely, so the
   stage height never changes. Phones: the picture becomes a 320px cover crop, the tabs a two-by-two grid
   under it, then the explanation and the note. Transparent background: the sitewide texture shows through. */
.commercial-calibration{--cc-ease:cubic-bezier(.22,1,.36,1);position:relative;width:100%;padding:var(--section-pad) var(--gutter);background:transparent;color:var(--silver-hi)}
.commercial-calibration__head{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(300px,.7fr);gap:24px clamp(40px,6vw,120px);align-items:end;margin-bottom:clamp(20px,2.4vw,36px)}
.commercial-calibration__eyebrow{margin:0 0 16px;font-family:var(--font-body);font-weight:500;font-size:clamp(11px,.85vw,12.5px);letter-spacing:.3em;text-transform:uppercase;color:var(--silver-lo)}
.commercial-calibration h2{margin:0;font-family:var(--font-head);font-weight:700;color:var(--silver-hi)}
.commercial-calibration h2 em{font-style:normal;color:var(--ame-glow)}
.commercial-calibration__support{margin:0;max-width:30em;font-family:var(--font-body);font-size:16px;line-height:1.55;color:var(--silver-lo)}
/* ---- stage: the picture with the live layer over it ---- */
.cc-stage{position:relative;width:100%;aspect-ratio:1672/941;overflow:hidden;background:#07070b}
.cc-stage__image{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:cover;object-position:center 55%;max-width:none}
/* soft glow at the active marker's base (the picture's own glow at marker two stays) */
.cc-glow{position:absolute;left:var(--cc-x);top:54%;width:11%;height:1.6%;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(ellipse at center,rgba(166,127,214,.55),rgba(166,127,214,0) 70%);filter:blur(6px);pointer-events:none;transition:left 600ms var(--cc-ease)}
/* tabs beneath the markers */
.cc-selector{position:absolute;left:0;right:0;top:66%;height:14%}
.cc-tab{all:unset;box-sizing:border-box;position:absolute;left:var(--cc-x);top:0;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:1.4cqw;min-width:44px;min-height:44px;padding:0 .8cqw;cursor:pointer;color:var(--silver-lo);transition:color 300ms ease}
.cc-stage{container-type:inline-size}
.cc-tab__tick{display:block;width:2px;height:1.9cqw;background:currentColor;opacity:.55;transition:opacity 300ms ease}
.cc-tab__label{font-family:var(--font-body);font-weight:500;font-size:clamp(10px,.95cqw,14px);letter-spacing:.24em;text-transform:uppercase;white-space:nowrap;text-shadow:0 1px 8px rgba(0,0,0,.8)}
.cc-tab:hover{color:var(--silver-hi)}
.cc-tab.is-active{color:var(--ame-light)}
.cc-tab.is-active .cc-tab__tick{opacity:0}
.cc-tab:focus-visible .cc-tab__label{outline:2px solid var(--ame-light);outline-offset:6px}
/* the travelling indicator tick, drawn once by the selector */
.cc-selector::before{content:"";position:absolute;left:var(--cc-x);top:0;width:2px;height:1.9cqw;transform:translateX(-50%);background:var(--ame-light);box-shadow:0 0 10px rgba(166,127,214,.9);transition:left 600ms var(--cc-ease)}
/* explanations under the label row, stacked so the stage never changes height */
.cc-panels{position:absolute;left:0;right:0;top:75%;height:12%;pointer-events:none}
.cc-panel{position:absolute;left:clamp(16%,var(--cc-x),84%);top:0;transform:translateX(-50%) translateY(6px);width:min(24em,32%);margin:0;text-align:center;font-family:var(--font-body);font-size:clamp(13px,1.25cqw,18px);line-height:1.45;color:var(--silver-hi);text-shadow:0 1px 8px rgba(0,0,0,.8);opacity:0;visibility:hidden;transition:opacity 300ms ease,transform 450ms var(--cc-ease),visibility 0s linear 300ms}
.cc-panel.is-active{opacity:1;visibility:visible;transform:translateX(-50%);transition:opacity 300ms ease 100ms,transform 450ms var(--cc-ease) 100ms,visibility 0s}
/* closing note along the picture's foot, a hairline either side (decorative) */
.commercial-calibration__note{position:absolute;left:0;right:0;top:91%;display:flex;align-items:center;gap:clamp(16px,2cqw,36px);margin:0;font-family:var(--font-body);font-size:clamp(11px,1cqw,15px);letter-spacing:.14em;color:var(--silver-lo);text-shadow:0 1px 8px rgba(0,0,0,.8)}
.commercial-calibration__note::before,.commercial-calibration__note::after{content:"";flex:1 1 auto;height:1px;background:var(--line)}
.commercial-calibration__note-text{flex:0 0 auto;text-align:center}
@media(max-width:1023px){
  .commercial-calibration__head{grid-template-columns:minmax(0,1fr) minmax(260px,.85fr);gap:20px 32px}
  .cc-tab__label{letter-spacing:.16em}
}
@media(max-width:767px){
  .commercial-calibration__head{display:block;margin-bottom:24px}
  .commercial-calibration__support{margin-top:16px;max-width:none}
  /* the picture as a 320px cover crop, then the selector grid, the explanation and the note in flow */
  .cc-stage{aspect-ratio:auto;overflow:visible;background:none;container-type:normal}
  .cc-stage__image{position:relative;height:320px;object-position:center 58%}
  .cc-glow{display:none}
  .cc-selector{position:static;height:auto;display:grid;grid-template-columns:1fr 1fr;gap:1px;margin-top:20px;border:1px solid var(--line);background:var(--line)}
  .cc-selector::before{display:none}
  .cc-tab{position:static;transform:none;flex-direction:row;justify-content:center;gap:0;min-height:52px;padding:10px 12px;background:var(--void)}
  .cc-tab__tick{display:none}
  .cc-tab__label{font-size:11px;letter-spacing:.14em;white-space:normal;text-align:center;text-shadow:none;position:relative;padding-bottom:6px}
  .cc-tab__label::after{content:"";position:absolute;left:50%;bottom:0;width:0;height:2px;background:var(--ame-light);transform:translateX(-50%);transition:width 450ms var(--cc-ease)}
  .cc-tab.is-active .cc-tab__label::after{width:28px}
  .cc-tab:focus-visible .cc-tab__label{outline-offset:2px}
  .cc-panels{position:relative;top:auto;height:auto;display:grid;margin-top:20px;pointer-events:auto}
  .cc-panel{position:static;grid-area:1/1;width:auto;transform:none;text-align:left;font-size:16px;text-shadow:none;transition:opacity 300ms ease,visibility 0s linear 300ms}
  .cc-panel.is-active{transform:none;transition:opacity 300ms ease 100ms,visibility 0s}
  .commercial-calibration__note{position:static;margin-top:24px;padding-top:20px;border-top:1px solid var(--line);display:block;font-size:13px;letter-spacing:.06em;text-shadow:none}
  .commercial-calibration__note::before,.commercial-calibration__note::after{display:none}
}
@media (prefers-reduced-motion: reduce){
  .cc-glow,.cc-selector::before,.cc-tab,.cc-tab__tick,.cc-tab__label::after,.cc-panel{transition:none !important}
  .cc-panel{transform:translateX(-50%)}
  @media(max-width:767px){.cc-panel{transform:none}}
}

/* ---------- Method page: four moves, audit to scale ----------
   Reproduction of the supplied reference (1536 x 1024): heading upper-left, supporting line upper-right, the
   sculpture under the heading on the left and four static rows on the right, then a full-width rule and the
   closing line. The standalone sculpture picture carries wide black padding (the sculpture itself spans 12 to
   88% of its width and 21 to 76% of its height), so the picture is drawn larger than its column (capped against the
   row block height so it never reaches the rule) and offset in container units until the sculpture sits where the reference has it; its padding runs under the heading and
   past the rule, and a soft mask feathers the picture's edges into the page so no frame shows. Nothing here
   is interactive or animated. Transparent background: the sitewide texture shows through. */
.audit-scale{position:relative;width:100%;padding:var(--section-pad) var(--gutter);background:transparent;color:var(--silver-hi);overflow:hidden}
.audit-scale__head{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,34.5%);gap:20px clamp(32px,4vw,72px);align-items:center}
.audit-scale__eyebrow{margin:0 0 14px;font-family:var(--font-body);font-weight:500;font-size:clamp(11px,.85vw,12.5px);letter-spacing:.34em;text-transform:uppercase;color:var(--silver-lo)}
.audit-scale h2{margin:0;font-family:var(--font-head);font-weight:700;color:var(--silver-hi)}
.audit-scale h2 em{font-style:normal;color:var(--ame-light)}
.audit-scale__support{margin:0;max-width:24em;font-family:var(--font-body);font-size:16px;line-height:1.55;color:var(--silver-lo)}
/* ---- body: sculpture left, four rows right ---- */
.audit-scale__body{position:relative;display:grid;grid-template-columns:minmax(0,54.5fr) minmax(0,45.5fr);align-items:stretch;margin-top:clamp(20px,2.4vw,40px);border-bottom:1px solid #3a3742}
.audit-scale__figure{position:relative;margin:0;min-height:100%;container-type:size;pointer-events:none}
.audit-scale__image{--as-w:min(110cqw,127cqh);position:absolute;left:calc(var(--as-w) * -.109);top:calc(var(--as-w) * -.264);width:var(--as-w);height:auto;max-width:none;display:block;-webkit-mask-image:linear-gradient(180deg,transparent 2%,#000 16%,#000 70%,transparent 86%),linear-gradient(90deg,transparent 0,#000 9%,#000 80%,transparent 97%);mask-image:linear-gradient(180deg,transparent 2%,#000 16%,#000 70%,transparent 86%),linear-gradient(90deg,transparent 0,#000 9%,#000 80%,transparent 97%);-webkit-mask-composite:source-in;mask-composite:intersect}
.audit-scale__list{position:relative;z-index:1;list-style:none;margin:0;padding:0}
.as-row{display:grid;grid-template-columns:clamp(56px,5.7vw,88px) minmax(0,1fr);align-items:start;padding:clamp(20px,1.9vw,30px) 0 clamp(22px,2.3vw,36px) clamp(8px,.8vw,12px);border-top:1px solid #3a3742}
.as-row:first-child{border-top:0;padding-top:clamp(8px,1vw,16px)}
.as-row__index{padding-top:.5em;font-family:var(--font-body);font-weight:400;font-size:clamp(13px,1.15vw,18px);letter-spacing:.04em;color:var(--silver-lo)}
.as-row__body{position:relative}
.as-row__title{margin:0 0 8px;font-family:var(--font-head);font-weight:700;font-size:clamp(24px,2.5vw,40px);line-height:1.08;letter-spacing:-.02em;color:var(--silver-hi)}
.as-row__text{margin:0;max-width:26em;font-family:var(--font-body);font-size:clamp(15px,1.4vw,22px);line-height:1.35;color:#a9a6b0}
/* Fix: lavender title and the short purple accent beside it */
.as-row--key .as-row__title{color:var(--ame-light)}
.as-row--key .as-row__body::before{content:"";position:absolute;left:calc(-1 * clamp(20px,2.2vw,34px));top:0;bottom:0;width:3px;background:var(--ame-glow)}
/* closing line under the full-width rule */
.audit-scale__closing{position:relative;z-index:1;margin:clamp(24px,2.6vw,40px) 0 0;font-family:var(--font-body);font-size:clamp(18px,1.8vw,28px);line-height:1.3;color:var(--silver-hi)}
@media(max-width:1023px){
  .audit-scale__head{grid-template-columns:minmax(0,1fr) minmax(0,42%)}
  .audit-scale__body{grid-template-columns:minmax(0,46fr) minmax(0,54fr)}
  .audit-scale__image{--as-w:min(122cqw,127cqh);left:calc(var(--as-w) * -.115);top:calc(var(--as-w) * -.2)}
}
@media(max-width:767px){
  /* stacked: heading, supporting line, the whole sculpture, the four rows */
  .audit-scale__head{display:block}
  .audit-scale__support{margin-top:14px;max-width:none}
  .audit-scale__body{display:block;margin-top:8px}
  .audit-scale__figure{min-height:0;aspect-ratio:100/88;overflow:hidden;container-type:inline-size}
  .audit-scale__image{left:-6cqw;top:-24cqw;width:112cqw;-webkit-mask-image:linear-gradient(180deg,transparent 17%,#000 21%,#000 76%,transparent 80%),linear-gradient(90deg,transparent 5.4%,#000 11.5%,#000 88.5%,transparent 94.6%);mask-image:linear-gradient(180deg,transparent 17%,#000 21%,#000 76%,transparent 80%),linear-gradient(90deg,transparent 5.4%,#000 11.5%,#000 88.5%,transparent 94.6%)}
  .as-row{grid-template-columns:44px minmax(0,1fr);padding:20px 0 22px}
  .as-row:first-child{padding-top:8px}
  .as-row__title{font-size:26px}
  .as-row__text{font-size:16px;line-height:1.45;max-width:none}
  .as-row--key .as-row__body::before{left:-14px}
  .audit-scale__closing{font-size:20px}
}

/* ---------- Method page: what we commit to ----------
   Reproduction of the supplied reference (1536 x 1024): eyebrow and two-line H2, three equal columns
   (sculpture, tracked label, three-line heading, paragraph) with thin vertical rules between them, then a
   horizontal rule and the closing statement. Each figure is an inline-size container 64cqw tall with the
   floor line at 55.5cqw; the picture is --cm-w cqw wide (4:3), lifted so the fraction --cm-floor of its
   height lands on the floor line and shifted so its centre sits at --cm-cx across the column. The pictures
   are wider than their columns, so a soft mask feathers their dark padding into the page and the rules are
   drawn above them. Static: nothing here is interactive or animated. Transparent background. */
.commitments{position:relative;width:100%;padding:var(--section-pad) var(--gutter);background:transparent;color:var(--silver-hi);overflow:hidden}
.commitments__head{position:relative;z-index:2}
.commitments__eyebrow{margin:0 0 14px;font-family:var(--font-body);font-weight:500;font-size:clamp(11px,.85vw,12.5px);letter-spacing:.3em;text-transform:uppercase;color:var(--silver-lo)}
.commitments h2{margin:0;font-family:var(--font-head);font-weight:700;color:var(--silver-hi)}
.commitments h2 em{display:block;font-style:normal;color:var(--ame-light)}
/* ---- three columns ---- */
.commitments__grid{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:clamp(16px,2vw,32px);padding-bottom:clamp(28px,2.8vw,44px);border-bottom:1px solid #3a3742}
.cm-item{--pl:clamp(24px,3.2vw,50px);--pr:clamp(8px,1.2vw,20px);position:relative;min-width:0;padding:0 var(--pr) 0 var(--pl)}
.cm-item:first-child{--pl:0px;--pr:calc(clamp(8px,1.2vw,20px) + clamp(24px,3.2vw,50px))}
/* the vertical rules, above the pictures */
.cm-item + .cm-item::before{content:"";position:absolute;z-index:2;left:0;top:clamp(8px,1vw,16px);bottom:0;width:1px;background:#3a3742}
/* the figure spans the whole column (the text padding is undone) so the three are equal */
.cm-item__figure{position:relative;z-index:0;margin:0 calc(-1 * var(--pr)) 0 calc(-1 * var(--pl));aspect-ratio:100/64;container-type:inline-size;pointer-events:none}
.cm-item__image{--w:calc(var(--cm-w) * 1cqw);position:absolute;left:calc(var(--cm-cx) * 1cqw - var(--w) / 2);top:calc(55.5cqw - var(--cm-floor) * .75 * var(--w));width:var(--w);height:auto;max-width:none;display:block;-webkit-mask-image:linear-gradient(180deg,transparent 2%,#000 14%,#000 82%,transparent 96%),linear-gradient(90deg,transparent 5%,#000 22%,#000 78%,transparent 95%);mask-image:linear-gradient(180deg,transparent 2%,#000 14%,#000 82%,transparent 96%),linear-gradient(90deg,transparent 5%,#000 22%,#000 78%,transparent 95%);-webkit-mask-composite:source-in;mask-composite:intersect}
.cm-item--no-ranking-promises .cm-item__image{-webkit-mask-image:linear-gradient(180deg,transparent 12%,#000 28%,#000 78%,transparent 94%),linear-gradient(90deg,transparent 2%,#000 12%,#000 88%,transparent 98%);mask-image:linear-gradient(180deg,transparent 12%,#000 28%,#000 78%,transparent 94%),linear-gradient(90deg,transparent 2%,#000 12%,#000 88%,transparent 98%)}
.cm-item__label,.cm-item__heading,.cm-item__text{position:relative;z-index:1}
.cm-item__label{margin:clamp(8px,1vw,16px) 0 clamp(12px,1.3vw,20px);font-family:var(--font-body);font-weight:500;font-size:clamp(10.5px,.82vw,12.5px);letter-spacing:.24em;text-transform:uppercase;color:var(--silver-lo)}
.cm-item__heading{margin:0 0 clamp(14px,1.5vw,24px);font-family:var(--font-head);font-weight:700;font-size:clamp(22px,2.6vw,40px);line-height:1.18;letter-spacing:-.02em;color:var(--silver-hi)}
.cm-item__heading span{display:block}
.cm-item__text{margin:0;max-width:20em;font-family:var(--font-body);font-size:clamp(15px,1.37vw,21px);line-height:1.42;color:#a9a6b0}
/* closing statement under the horizontal rule */
.commitments__closing{position:relative;z-index:1;margin:clamp(22px,2.4vw,36px) 0 0;font-family:var(--font-body);font-size:clamp(15px,1.3vw,20px);line-height:1.4;color:#c4c0ca}
@media(max-width:1023px){
  .cm-item{--pl:22px;--pr:12px}
  .cm-item:first-child{--pl:0px;--pr:34px}
  .cm-item__label{letter-spacing:.14em}
}
@media(max-width:767px){
  /* stacked: each sculpture directly above its copy, horizontal rules between the commitments */
  .commitments__grid{display:block;padding-bottom:28px}
  .cm-item,.cm-item:first-child{--pl:0px;--pr:0px}
  .cm-item + .cm-item{margin-top:28px;padding-top:4px;border-top:1px solid #3a3742}
  .cm-item + .cm-item::before{display:none}
  .cm-item__figure{aspect-ratio:100/58}
  .cm-item__image{--w:calc(var(--cm-w) * .82cqw);left:calc(50cqw - var(--w) / 2);top:calc(50cqw - var(--cm-floor) * .75 * var(--w))}
  .cm-item__label{margin-top:4px;letter-spacing:.22em;font-size:11px}
  .cm-item__heading{font-size:26px}
  .cm-item__text{font-size:16px;line-height:1.5;max-width:none}
  .commitments__closing{font-size:16px}
}

/* ---------- Method page: how we report ----------
   Reproduction of the approved mockup (design/method-reporting-reference.png, 1536 x 1024). Sizes are written
   in mock pixels through --u (one mock pixel at a 1536px viewport, scaled down below it and capped above it),
   with floors so small text stays readable at 1024. Left editorial column (429u) and the bordered report panel
   (908u) with a 44u gap; the panels share one grid cell once JS has run, so the height is the tallest panel's.
   Square corners, thin borders and hairlines only: no cards, icons, images or animation. Transparent
   background so the sitewide texture shows. Below 1024 the intro stacks above the panel. */
.reporting{--u:calc(min(100vw,1536px) / 1536);--rp-grey:#b3b8d2;--rp-purple:#d6bcfb;--rp-rule:#2b2a35;--rp-border:#4f5264;position:relative;width:100%;padding:var(--section-pad) var(--gutter);background:transparent;color:#fff}
.reporting__inner{display:grid;margin-top:calc(6 * var(--u)) !important;grid-template-columns:429fr 908fr;column-gap:calc(44 * var(--u));max-width:calc(1381 * var(--u));margin:0 auto;align-items:start}
/* ---- left editorial column ---- */
.reporting__intro{padding-top:calc(34 * var(--u))}
.reporting__eyebrow{margin:0;font-family:var(--font-body);font-weight:600;font-size:max(11px,calc(15 * var(--u)));line-height:1.2;letter-spacing:.3em;text-transform:uppercase;color:var(--rp-purple)}
.reporting h2{margin:calc(24 * var(--u)) 0 0;font-family:var(--font-head);font-weight:800;font-size:calc(95 * var(--u)) !important;line-height:calc(85 * var(--u)) !important;letter-spacing:-.035em !important;color:#fff}
.reporting h2 span,.reporting h2 em{display:block}
.reporting h2 em{font-style:normal;color:var(--rp-purple)}
.reporting__support{margin:calc(22 * var(--u)) 0 0;font-family:var(--font-body);font-size:max(16px,calc(24 * var(--u)));line-height:1.58;color:var(--rp-grey)}
.reporting__support span{display:block}
.reporting__cadence{margin:calc(58 * var(--u)) 0 0}
.reporting__cadence > div{padding:calc(40 * var(--u)) 0 calc(36 * var(--u));border-top:1px solid var(--rp-rule)}
.reporting__cadence > div + div{padding-top:calc(31 * var(--u))}
.reporting__cadence dt{font-family:var(--font-body);font-weight:700;font-size:max(11px,calc(14.5 * var(--u)));letter-spacing:.3em;text-transform:uppercase;color:var(--rp-purple)}
.reporting__cadence dd{margin:calc(12 * var(--u)) 0 0;font-family:var(--font-body);font-size:max(15px,calc(19.5 * var(--u)));line-height:1.35;color:var(--rp-grey)}
/* ---- report panel ---- */
.rp-panel-shell{border:1px solid var(--rp-border);border-radius:0;padding:calc(34 * var(--u)) calc(36 * var(--u)) calc(28 * var(--u)) calc(42 * var(--u));min-width:0}
.rp-kicker{margin:0;font-family:var(--font-ui);font-weight:700;font-size:max(11px,calc(14 * var(--u)));line-height:1.2;letter-spacing:.28em;text-transform:uppercase;color:#fff}
.rp-title{margin:calc(4 * var(--u)) 0 0;font-family:var(--font-head);font-weight:800;font-size:calc(42 * var(--u));line-height:1.05;letter-spacing:-.03em;text-transform:uppercase;color:#fff}
.rp-date{margin:calc(8 * var(--u)) 0 0;font-family:var(--font-body);font-size:max(14px,calc(19 * var(--u)));line-height:1.3;color:var(--rp-grey)}
/* tabs: 44px minimum targets, a hairline under the row and a 4u lavender bar under the active tab */
.rp-tabs{display:flex;gap:calc(30 * var(--u));margin:calc(21 * var(--u)) 0 0 calc(-10 * var(--u));border-bottom:1px solid #5a5c6c}
.rp-tab{position:relative;min-height:44px;padding:calc(12 * var(--u)) calc(12 * var(--u)) calc(16 * var(--u));background:none;border:0;border-radius:0;font-family:var(--font-body);font-weight:500;font-size:max(15px,calc(19 * var(--u)));line-height:1.2;color:var(--rp-grey);cursor:pointer;white-space:nowrap}
.rp-tab:hover{color:#fff}
.rp-tab.is-active{font-weight:600;color:#fff}
.rp-tab::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:4px;background:var(--rp-purple);transform:scaleX(0);transform-origin:left}
.rp-tab.is-active::after{transform:scaleX(1)}
.rp-tab:focus-visible{outline:2px solid var(--ame-light);outline-offset:2px}
/* panels: stacked in one cell when JS runs, in normal flow without it */
.rp-panels{display:block}
.js .rp-panels{display:grid}
.js .rp-panel{grid-area:1/1}
.js .rp-panel:not(.is-active){visibility:hidden}
.rp-panel{padding-top:calc(38 * var(--u));min-width:0}
.rp-panel:focus-visible{outline:2px solid var(--ame-light);outline-offset:4px}
.rp-heading{margin:0;font-family:var(--font-head);font-weight:700;font-size:max(20px,calc(31 * var(--u)));line-height:1.15;letter-spacing:-.01em;color:#fff}
/* outcomes metrics: four columns, thin vertical rules */
.rp-metrics{list-style:none;display:grid;grid-template-columns:185fr 226fr 220fr 183fr;margin:calc(24 * var(--u)) 0 0;padding:0}
.rp-metric{display:flex;flex-direction:column;min-height:calc(120 * var(--u))}
.rp-metric + .rp-metric{padding-left:calc(31 * var(--u));border-left:1px solid #4c4e5c}
.rp-metric__value{font-family:var(--font-head);font-weight:800;font-size:calc(85 * var(--u));line-height:.86;margin-top:calc(10 * var(--u));letter-spacing:-.02em;font-variant-numeric:tabular-nums;color:#fff}
.rp-metric__label{margin-top:calc(5 * var(--u));font-family:var(--font-head);font-weight:700;font-size:max(15px,calc(22.5 * var(--u)));line-height:1.1;color:#fff}
.rp-note{margin:calc(30 * var(--u)) 0 0;padding-bottom:calc(30 * var(--u));border-bottom:1px solid var(--rp-rule);font-family:var(--font-body);font-size:max(13px,calc(16 * var(--u)));line-height:1.4;color:var(--rp-grey)}
.rp-label{margin:calc(21 * var(--u)) 0 calc(18 * var(--u));font-family:var(--font-body);font-weight:700;font-size:max(11px,calc(13.5 * var(--u)));letter-spacing:.24em;text-transform:uppercase;color:var(--rp-purple)}
/* rows: key and value columns between hairlines (used by "does not claim" and the measurement gaps) */
.rp-rows{margin:0 calc(16 * var(--u)) 0 0;border-top:1px solid var(--rp-rule)}
.rp-row{display:grid;grid-template-columns:294fr 508fr;align-items:baseline;padding:calc(10 * var(--u)) calc(12 * var(--u));border-bottom:1px solid var(--rp-rule)}
.rp-row dt{font-family:var(--font-head);font-weight:700;font-size:max(15px,calc(19 * var(--u)));line-height:1.3;color:#fff}
.rp-row dd{margin:0;font-family:var(--font-body);font-size:max(14px,calc(18.5 * var(--u)));line-height:1.35;color:var(--rp-grey)}
.rp-rows--gaps{border-top:0}
.rp-rows--gaps .rp-row{grid-template-columns:200fr 602fr;padding-top:calc(15 * var(--u));padding-bottom:calc(15 * var(--u))}
.rp-rows--gaps .rp-row:first-child{padding-top:0}
.rp-rows--gaps dd{font-size:max(14px,calc(17.5 * var(--u)))}
/* pipeline: label, decorative bar, visible count */
.rp-bars{list-style:none;margin:calc(26 * var(--u)) calc(16 * var(--u)) 0 0;padding:0}
.rp-bar{display:grid;grid-template-columns:300fr 440fr 50fr;align-items:center;column-gap:calc(16 * var(--u));padding:calc(7 * var(--u)) 0;border-bottom:1px solid var(--rp-rule)}
.rp-bar__label{font-family:var(--font-body);font-size:max(14px,calc(17.5 * var(--u)));line-height:1.3;color:var(--rp-grey)}
.rp-bar__track{display:block;height:calc(12 * var(--u));min-height:8px;background:#1a1922}
.rp-bar__fill{display:block;height:100%;background:#8a6bb8}
/* progress effect: every bar grows from zero together when Pipeline is shown (no stagger, so it does not read as a sequence) */
.rp-bar__fill{transform-origin:left center;transition:transform 1s cubic-bezier(.22,1,.36,1)}
.rp-bars--reset .rp-bar__fill{transform:scaleX(0);transition:none}
.rp-bar__count{font-family:var(--font-head);font-weight:700;font-size:max(15px,calc(19 * var(--u)));text-align:right;color:#fff}
.rp-source{margin:calc(28 * var(--u)) 0 0;font-family:var(--font-body);font-size:max(12px,calc(15 * var(--u)));line-height:1.3;color:var(--rp-grey)}
/* ---- closing ---- */
.reporting__closing{max-width:calc(1386 * var(--u));margin:calc(36 * var(--u)) auto 0;padding-top:calc(24 * var(--u));border-top:1px solid #2c2b36}
.reporting__closing-title{margin:0;font-family:var(--font-head);font-weight:700;font-size:max(20px,calc(30 * var(--u)));line-height:1.2;color:#fff}
.reporting__closing-sub{margin:calc(8 * var(--u)) 0 0;font-family:var(--font-body);font-size:max(15px,calc(19.5 * var(--u)));line-height:1.35;color:#bfc4dc}
/* ---- tablet and phone: intro stacked above the panel ---- */
@media(max-width:1023px){
  .reporting{--u:1px}
  .reporting__inner{grid-template-columns:minmax(0,1fr);row-gap:44px;max-width:760px}
  .reporting__intro{padding-top:0}
  .reporting h2{font-size:clamp(48px,9vw,76px) !important;line-height:.92 !important}
  .reporting__support{margin-top:28px;font-size:18px}
  .reporting__cadence{margin-top:36px;display:grid;grid-template-columns:1fr 1fr;column-gap:32px}
  .reporting__cadence > div,.reporting__cadence > div + div{padding:24px 0 0}
  .reporting__cadence dd{margin-top:10px;font-size:16px}
  .rp-title{font-size:clamp(30px,6vw,40px)}
  .rp-metric__value{font-size:clamp(52px,10vw,76px)}
  .reporting__closing{max-width:760px;margin-top:44px}
}
@media(max-width:640px){
  .reporting__cadence{grid-template-columns:1fr}
  .reporting__cadence > div,.reporting__cadence > div + div{padding-bottom:20px}
  .rp-panel-shell{padding:24px 18px 20px}
  .rp-tabs{margin-left:-8px;gap:4px}
  .rp-tab{padding:12px 8px 14px;font-size:15px}
  .rp-metrics{grid-template-columns:1fr 1fr;row-gap:20px}
  .rp-metric{min-height:0}
  .rp-metric + .rp-metric{padding-left:18px}
  .rp-metric:nth-child(3){padding-left:0;border-left:0}
  .rp-metric:nth-child(n+3){padding-top:20px;border-top:1px solid #4c4e5c}
  .rp-metric__value{font-size:56px}
  .rp-row,.rp-rows--gaps .rp-row{grid-template-columns:1fr;row-gap:4px;padding-left:0;padding-right:0}
  .rp-rows,.rp-bars{margin-right:0}
  .rp-bar{grid-template-columns:minmax(0,1fr) 28px;row-gap:6px;padding:9px 0}
  .rp-bar__label{grid-column:1/2}
  .rp-bar__count{grid-column:2/3;grid-row:1}
  .rp-bar__track{grid-column:1/-1;grid-row:2}
}
@media(max-width:380px){
  .rp-tab{font-size:14px;padding-left:6px;padding-right:6px}
}
@media(prefers-reduced-motion:reduce){.rp-tab::after,.rp-bar__fill{transition:none}}

/* ---------- Method page: find your starting point ----------
   Reproduction of the approved compact mockup (design/method-starting-point-reference.png, 1942 x 809). Sizes are
   mock pixels through --u (the mock's 1942px drawn at a 1536px viewport, about 640px tall there; capped above
   1536, floors keep small text readable at 1024). Left column (996u): eyebrow, H2, the three challenges placed at
   their node coordinates over one SVG stepped path, the selection note. Right column (748u): the instruction,
   then the response behind a thin divider. Rule and disclaimer across the foot. No cards, icons (beyond the CTA
   arrow) or decoration. Transparent background so the sitewide texture shows. Below 1024 everything stacks and
   the path becomes one straight line. */
.starting-point{--u:calc(min(100vw,1536px) / 1942);--sp-lav:#d4aef9;--sp-grey:#b9c1dd;--sp-line:#8c80b4;position:relative;width:100%;padding:calc(24 * var(--u)) var(--gutter) calc(28 * var(--u));background:transparent;color:#fff}
.starting-point__inner{display:grid;grid-template-columns:996fr 748fr;max-width:calc(1744 * var(--u));margin:0 auto}
.sp-eyebrow,.sp-response__eyebrow{margin:0;font-family:var(--font-body);font-weight:500;font-size:max(11px,calc(15 * var(--u)));line-height:1.2;letter-spacing:.36em;text-transform:uppercase;color:#d9dce8}
.starting-point h2{margin:calc(20 * var(--u)) 0 0;font-family:var(--font-head);font-weight:700;font-size:calc(70 * var(--u)) !important;line-height:calc(61 * var(--u)) !important;letter-spacing:-.03em !important;color:#fff}
.starting-point h2 em,.sp-response__heading em{display:block;font-style:normal;color:var(--sp-lav)}
/* ---- challenges on the stepped path ---- */
.sp-choices{position:relative;height:calc(396 * var(--u));margin-top:calc(26 * var(--u))}
.sp-path{position:absolute;left:0;top:0;width:calc(1000 * var(--u));height:calc(380 * var(--u));overflow:visible;pointer-events:none}
.sp-path path{fill:none;stroke:var(--sp-line);stroke-width:2;vector-effect:non-scaling-stroke}
.sp-choice{position:absolute;left:calc((var(--x) - 120) * var(--u));top:calc((var(--y) - 280) * var(--u));display:flex;align-items:flex-start;min-height:44px;padding:0 calc(10 * var(--u)) 0 0;background:none;border:0;border-radius:0;text-align:left;color:inherit;cursor:pointer}
.sp-node{position:relative;flex:none;width:calc(40 * var(--u));height:calc(40 * var(--u));margin-top:calc(10 * var(--u))}
.sp-node::before{content:"";position:absolute;inset:calc(6 * var(--u));border:2px solid #e6e6ee;border-radius:50%;background:var(--void);transition:border-color .25s ease,box-shadow .25s ease,inset .25s ease}
.sp-node::after{content:"";position:absolute;inset:calc(11 * var(--u));border-radius:50%;background:var(--sp-lav);transform:scale(0);transition:transform .25s ease}
.sp-tick{flex:none;width:calc(50 * var(--u));height:2px;margin:calc(29 * var(--u)) 0 0 calc(2 * var(--u));background:#e6e6ee;transition:background-color .25s ease}
.sp-choice__text{display:flex;flex-direction:column;margin-left:calc(18 * var(--u))}
.sp-choice__title{font-family:var(--font-head);font-weight:600;font-size:max(17px,calc(33 * var(--u)));line-height:calc(42 * var(--u));letter-spacing:-.01em;color:#fff;transition:color .25s ease}
.sp-choice__sub{margin-top:calc(1 * var(--u));font-family:var(--font-body);font-size:max(14px,calc(22.5 * var(--u)));line-height:1.3;color:var(--sp-grey)}
.sp-choice__marker{position:relative;margin-top:calc(42 * var(--u));font-family:var(--font-body);font-weight:500;font-size:max(10px,calc(14 * var(--u)));letter-spacing:.36em;text-transform:uppercase;color:var(--sp-lav);visibility:hidden}
.sp-choice__marker::before{content:"";position:absolute;left:0;top:calc(-16 * var(--u));width:calc(60 * var(--u));height:2px;background:var(--sp-lav)}
.sp-choice.is-selected .sp-node::before{inset:calc(3 * var(--u));border-color:var(--sp-lav);box-shadow:0 0 calc(16 * var(--u)) rgba(212,174,249,.45)}
.sp-choice.is-selected .sp-node::after{transform:scale(1)}
.sp-choice.is-selected .sp-tick{background:var(--sp-lav)}
.sp-choice.is-selected .sp-choice__title{color:var(--sp-lav)}
.sp-choice.is-selected .sp-choice__marker{visibility:visible}
.sp-choice:not(.is-selected):hover .sp-choice__title{color:#e9dcfb}
.sp-choice:focus-visible{outline:2px solid var(--ame-light);outline-offset:6px}
.sp-change{margin:max(24px,calc(32 * var(--u))) 0 0;font-family:var(--font-body);font-size:max(13px,calc(19.5 * var(--u)));line-height:1.3;color:#a6aecf}
/* ---- response ---- */
.sp-right{display:flex;flex-direction:column;min-width:0}
.sp-instruction{margin:calc(33 * var(--u)) 0 0;text-align:right;font-family:var(--font-body);font-size:max(13px,calc(19.5 * var(--u)));line-height:1.3;color:#c3cbe6}
.sp-responses{margin-top:calc(46 * var(--u));padding:calc(19 * var(--u)) 0 0 calc(81 * var(--u));border-left:1px solid #5c5e72}
/* only the selected response takes space, so there is no reserved gap under the shorter ones (the section
   grows only while "The numbers don't connect" is selected; it is the page's last section before the footer) */
.js .sp-response:not(.is-active){display:none}
.sp-response{min-width:0}
.js .sp-response.is-active{animation:sp-in .3s ease}
@keyframes sp-in{from{opacity:0}to{opacity:1}}
.sp-response__eyebrow{font-size:max(10px,calc(14.5 * var(--u)))}
.sp-response__heading{margin:calc(14 * var(--u)) 0 0;font-family:var(--font-head);font-weight:700;font-size:calc(66 * var(--u));line-height:calc(60 * var(--u));letter-spacing:-.03em;color:#fff}
.sp-response__text{margin:calc(30 * var(--u)) 0 0;max-width:calc(580 * var(--u));font-family:var(--font-body);font-size:max(15px,calc(28 * var(--u)));line-height:calc(38 * var(--u));color:#f2f2f7}
.sp-focus{list-style:none;display:grid;grid-template-columns:201fr 250fr 216fr;margin:calc(30 * var(--u)) 0 0;padding:0}
.sp-focus li{display:flex;align-items:center;min-height:calc(57 * var(--u));max-width:7em;font-family:var(--font-body);font-size:max(13px,calc(22.5 * var(--u)));line-height:calc(30 * var(--u));color:#fff}
.sp-focus li + li{max-width:none;border-left:1px solid #6a6c80}
.sp-focus li:nth-child(2){justify-content:center;text-align:center}
.sp-focus li:nth-child(3){padding-left:calc(63 * var(--u));padding-right:calc(40 * var(--u))}
/* the CTA is the Method hero's own clipped-corner primary button (.svc-cta, services-hero.css), unchanged */
.sp-response .sp-cta{min-width:0;margin-top:max(16px,calc(24 * var(--u)))}
@media(max-width:767px){.sp-response .sp-cta{width:100%}}
.sp-response__reassurance{margin:calc(17 * var(--u)) 0 0;font-family:var(--font-body);font-size:max(14px,calc(22 * var(--u)));line-height:1.3;color:#bcc5e4}
/* ---- foot ---- */
.starting-point__disclaimer{max-width:calc(1744 * var(--u));margin:calc(30 * var(--u)) auto 0;padding-top:calc(19 * var(--u));border-top:1px solid #8e93b4;font-family:var(--font-body);font-size:max(13px,calc(19 * var(--u)));line-height:1.3;color:#aab2d2}
/* ---- tablet and phone: stacked, straight path ---- */
@media(max-width:1023px){
  .starting-point{--u:1px;padding:32px var(--gutter) 32px}
  .starting-point__inner{display:flex;flex-direction:column;max-width:760px}
  .sp-left,.sp-right{display:contents}
  .sp-eyebrow{order:1;font-size:12px}
  .starting-point h2{order:2;font-size:clamp(36px,7vw,52px) !important;line-height:1.05 !important}
  .sp-instruction{order:3;margin-top:20px;text-align:left;font-size:16px}
  .sp-choices{order:4;height:auto;margin-top:24px;padding:4px 0}
  .sp-path{display:none}
  .sp-choices::before{content:"";position:absolute;left:19px;top:30px;bottom:56px;width:2px;background:var(--sp-line)}
  .sp-choice{position:relative;left:auto;top:auto;width:100%;padding:8px 0}
  .sp-node{width:40px;height:40px;margin-top:0}
  .sp-node::before{inset:6px}.sp-node::after{inset:11px}
  .sp-choice.is-selected .sp-node::before{inset:3px}
  .sp-tick{width:24px;margin-top:19px}
  .sp-choice__text{margin-left:14px}
  .sp-choice__title{font-size:21px;line-height:1.25}
  .sp-choice__sub{font-size:15.5px}
  .sp-choice__marker{display:none}
  .sp-change{order:5;margin-top:14px;font-size:14px}
  .sp-responses{order:6;margin-top:32px;padding:28px 0 0;border-left:0;border-top:1px solid #5c5e72}
  .sp-response__eyebrow{font-size:11.5px}
  .sp-response__heading{margin-top:12px;font-size:clamp(32px,6vw,46px);line-height:1.04}
  .sp-response__text{margin-top:18px;max-width:34em;font-size:18px;line-height:1.45}
  .sp-focus{margin-top:22px;grid-template-columns:repeat(3,minmax(0,1fr))}
  .sp-focus li{font-size:15px;line-height:1.3;min-height:44px;padding:0 12px}
  .sp-focus li:first-child{padding-left:0}
  .sp-focus li:nth-child(3){padding-left:16px;padding-right:0}
  .sp-response__reassurance{margin-top:12px;font-size:15px}
  .starting-point__disclaimer{max-width:760px;margin-top:32px;padding-top:16px;font-size:14px}
}
@media(max-width:480px){
  .sp-focus{grid-template-columns:1fr}
  .sp-focus li,.sp-focus li + li,.sp-focus li:nth-child(2),.sp-focus li:nth-child(3){justify-content:flex-start;text-align:left;max-width:none;min-height:0;padding:9px 0;border-left:0;border-top:1px solid #3a3b4a}
  .sp-focus li:first-child{border-top:0}
}
@media(prefers-reduced-motion:reduce){.sp-node::before,.sp-node::after,.sp-tick,.sp-choice__title{transition:none}.js .sp-response.is-active{animation:none}}

/* ---------- Google Ads management hero ----------
   Reproduction of the approved reference (1659 x 948). Sizes are reference pixels through --u (capped at the
   reference width). Copy column on the left; the artwork pinned to the right edge at the reference's scale
   (1258u wide, 41u from the top, so the laptop sits where the reference puts it), its dark left side fading into
   the page; the caption under the artwork's right edge; a hairline and three service labels across the foot.
   CTAs are the shared .btn-rect / .btn-outline, untouched. Below 900px the artwork moves under the copy. */
.ga-hero{--u:calc(min(100vw,1659px) / 1659);position:relative;overflow:hidden;background:transparent;padding:96px var(--gutter) var(--section-pad);border-bottom:1px solid var(--line)}
.ga-hero__media{position:absolute;right:0;top:calc(36 * var(--u));width:calc(1120 * var(--u));margin:0;z-index:0;pointer-events:none}
.ga-hero__image{display:block;width:100%;height:auto;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 18%,#000 100%),linear-gradient(180deg,#000 82%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 18%,#000 100%),linear-gradient(180deg,#000 82%,transparent 100%);-webkit-mask-composite:source-in;mask-composite:intersect}
.ga-hero__caption{position:absolute;right:calc(62 * var(--u));top:calc(628 * var(--u));margin:0;font-family:var(--font-body);font-size:12px;color:#9b97a6}
.ga-hero__inner{position:relative;z-index:1;max-width:calc(1535 * var(--u));margin:0 auto}
.ga-hero__copy{max-width:max(calc(700 * var(--u)),480px)}
.ga-hero__eyebrow{margin:14px 0 0;font-family:var(--font-ui);font-weight:600;font-size:clamp(11px,.85vw,12.5px);line-height:1.2;letter-spacing:.32em;text-transform:uppercase;color:var(--ame-light)}
/* H1 size, line height and tracking come from the sitewide hero rule in type-scale.css (60px; phones clamp) */
.ga-hero .ga-hero__title{margin:14px 0 0;font-family:var(--font-head);font-weight:700;color:#fff}
.ga-hero__title span,.ga-hero__title em{display:block}
.ga-hero__title em{font-style:normal;background:linear-gradient(90deg,#b98cf0 0%,#ceb5f3 100%);-webkit-background-clip:text;background-clip:text;color:transparent;padding-bottom:.06em}
.ga-hero__lead{margin:20px 0 0;max-width:min(34.5em,calc(560 * var(--u)));font-family:var(--font-body);font-size:16px;line-height:1.55;color:#d4d1dc}
.ga-hero__actions{display:flex;flex-wrap:wrap;gap:16px;margin-top:24px}
.ga-hero__note{margin:18px 0 0;font-family:var(--font-body);font-size:clamp(11.5px,.87vw,12.5px);letter-spacing:.06em;color:var(--silver-lo)}
.ga-hero__labels{list-style:none;display:grid;grid-template-columns:1fr 1fr 1fr;margin:30px 0 0;padding:16px 0 0;border-top:1px solid #3a3742}
.ga-hero__labels li{position:relative;font-family:var(--font-body);font-size:14px;line-height:1.3;color:#d4d1dc}
.ga-hero__labels li:nth-child(2){text-align:center}
.ga-hero__labels li:nth-child(3){text-align:right}
.ga-hero__labels li + li::before{content:"";position:absolute;left:0;top:-3px;bottom:-3px;width:1px;background:#4a4752}
/* tablet and phone: artwork under the copy */
@media(max-width:899px){
  .ga-hero{--u:1px;display:flex;flex-direction:column;padding:96px var(--gutter) var(--section-pad)}
  .ga-hero__inner{display:contents}
  .ga-hero__copy{max-width:none;display:contents}
  .ga-hero .crumbs{order:1}
  .ga-hero__eyebrow{order:2;margin-top:18px}
  .ga-hero .ga-hero__title{order:3;margin-top:14px}
  .ga-hero__lead{order:4;margin-top:20px}
  .ga-hero__actions{order:5;margin-top:26px;gap:12px}
  .ga-hero__note{order:6;margin-top:18px}
  .ga-hero__media{order:7;position:relative;right:auto;top:auto;width:calc(100% + 2 * var(--gutter));margin:24px calc(-1 * var(--gutter)) 0}
  .ga-hero__image{-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 12%,#000 88%,transparent 100%);mask-image:linear-gradient(180deg,transparent 0,#000 12%,#000 88%,transparent 100%)}
  .ga-hero__caption{position:static;padding:4px var(--gutter) 0;text-align:right}
  .ga-hero__labels{order:8;margin-top:28px;padding-top:18px}
}
@media(max-width:560px){
  .ga-hero__media{width:calc(100% + 2 * var(--gutter))}
  .ga-hero__image{width:150%;max-width:none;margin-left:-35%}
  .ga-hero__media{overflow:hidden}
  .ga-hero__actions .btn-rect,.ga-hero__actions .btn-outline{flex:1 1 100%;justify-content:center}
  .ga-hero__labels{grid-template-columns:1fr;padding-top:6px}
  .ga-hero__labels li,.ga-hero__labels li:nth-child(2),.ga-hero__labels li:nth-child(3){text-align:left;padding:10px 0;border-top:1px solid #2b2a33}
  .ga-hero__labels li:first-child{border-top:0}
  .ga-hero__labels li + li::before{display:none}
}

/* ---------- Services page: capability index ----------
   Reproduction of the supplied capability-index mock (design/services-capabilities-reference.webp): intro
   grid (heading 58%, supporting copy 42%), then a full-width editorial index: five edge-to-edge rows on the
   left (58%) and the active capability's detail panel on the right (42%), flush, square, one thin divider.
   Each row is a grid of number, heading (an h3 holding the button, stretched over the whole row) and arrow.
   Every detail panel is server-rendered and stacked in one grid cell, so the height never changes when the
   active capability does. Widths follow the fluid site system: full width with the global gutter, no frame. */
.capabilities{width:100%;padding:clamp(36px,3.4vw,48px) var(--gutter) clamp(40px,3.8vw,56px);background:transparent;border-top:1px solid var(--line)}
.capabilities__intro{display:grid;grid-template-columns:minmax(0,58fr) minmax(0,42fr);gap:clamp(24px,2.8vw,40px);align-items:start;margin-bottom:clamp(18px,1.8vw,26px)}
.capabilities__eyebrow{margin:0 0 18px;font-family:var(--font-body);font-weight:500;font-size:clamp(10.5px,.8vw,12px);letter-spacing:.3em;text-transform:uppercase;color:var(--silver-lo)}
.capabilities__title{margin:0;font-family:var(--font-head);font-weight:700;font-size:clamp(30px,2.95vw,48px);line-height:1.04;letter-spacing:-.03em;color:var(--silver-hi)}
.capabilities__title em{font-style:normal;color:var(--ame-glow)}
.capabilities__support{margin:0;max-width:620px;justify-self:end;font-family:var(--font-body);font-weight:400;font-size:clamp(15px,1.2vw,18px);line-height:1.55;color:var(--silver-lo)}
.capability-index{display:grid;grid-template-columns:minmax(0,58fr) minmax(0,42fr);width:100%;border:1px solid var(--line);background:var(--void)}
.capability-index__list{list-style:none;margin:0;padding:0;display:grid;grid-auto-rows:1fr;border-right:1px solid var(--line)}
.capability-index__item{position:relative;display:grid;grid-template-columns:clamp(64px,7.5vw,128px) minmax(0,1fr) clamp(56px,5vw,88px);align-items:center;min-height:clamp(72px,6vw,88px);padding:clamp(12px,1.1vw,16px) 0;border-top:1px solid var(--line);border-left:4px solid transparent;transition:background-color 300ms ease,border-color 300ms ease}
.capability-index__item:first-child{border-top:0}
.capability-index__num{justify-self:center;font-family:var(--font-body);font-weight:400;font-size:clamp(18px,1.7vw,26px);line-height:1;color:var(--silver-lo);transition:color 300ms ease}
.capability-index__heading{margin:0;font-size:inherit;line-height:inherit}
.capability-index__trigger{display:block;width:100%;margin:0;padding:0;background:none;border:0;color:#d9d6e0;font-family:var(--font-head);font-weight:600;font-size:20px;line-height:1.2;letter-spacing:-.015em;text-align:left;cursor:pointer;transition:color 300ms ease}
/* The button covers the whole row, so the number, summary and arrow are all part of the target. */
.capability-index__trigger::after{content:"";position:absolute;inset:0}
.capability-index__summary{margin:6px 0 0;font-family:var(--font-body);font-weight:400;font-size:clamp(13.5px,1.15vw,17px);line-height:1.4;color:var(--silver-lo);transition:color 300ms ease}
.capability-index__arrow{justify-self:center;width:26px;height:16px;opacity:0;transform:translateX(-6px);transition:opacity 260ms ease,transform 360ms cubic-bezier(.22,1,.36,1)}
.capability-index__arrow svg{display:block;width:26px;height:16px;fill:none;stroke:var(--ame-glow);stroke-width:1.8;stroke-linecap:square}
.capability-index__item:hover{background:rgba(20,20,27,.55)}
.capability-index__item:hover .capability-index__trigger{color:var(--silver-hi)}
.capability-index__item.is-active{background:#14121c;border-left-color:var(--ame-glow)}
.capability-index__item.is-active .capability-index__num{color:var(--ame-glow)}
.capability-index__item.is-active .capability-index__trigger{color:var(--silver-hi)}
.capability-index__item.is-active .capability-index__summary{color:#c4c0ca}
.capability-index__item.is-active .capability-index__arrow{opacity:1;transform:none}
.capability-index__trigger:focus-visible{outline:none}
.capability-index__item:has(.capability-index__trigger:focus-visible){box-shadow:inset 0 0 0 2px var(--ame-light)}
/* Detail panels: all rendered, all in the same grid cell; the inactive ones are invisible and out of the
   accessibility tree, so the cell (and the section) keeps the height of the tallest panel. Without JS every
   panel is shown in turn. */
.capability-index__panels{display:grid;min-width:0}
.capability-detail{grid-area:1/1;min-width:0;padding:clamp(20px,2.2vw,32px) clamp(20px,2.6vw,44px) clamp(20px,2.2vw,30px);opacity:0;transform:translateY(8px);visibility:hidden;transition:opacity 260ms ease,transform 360ms cubic-bezier(.22,1,.36,1),visibility 0s linear 260ms}
.capability-detail.is-active{opacity:1;transform:none;visibility:visible;transition-delay:0s}
html:not(.js) .capability-detail{grid-area:auto;opacity:1;transform:none;visibility:visible;border-top:1px solid var(--line)}
html:not(.js) .capability-detail:first-child{border-top:0}
.capability-detail__eyebrow{margin:0 0 14px;font-family:var(--font-body);font-weight:500;font-size:clamp(10.5px,.8vw,12px);letter-spacing:.3em;text-transform:uppercase;color:var(--silver-lo)}
.capability-detail__title{margin:0 0 12px;font-family:var(--font-head);font-weight:700;font-size:20px;line-height:1.2;letter-spacing:-.03em;color:var(--silver-hi)}
.capability-detail__body{margin:0 0 14px;max-width:620px;font-family:var(--font-body);font-weight:400;font-size:clamp(15px,1.2vw,18px);line-height:1.5;color:#c4c0ca}
.capability-detail__proof{list-style:none;margin:0 0 20px;padding:0;display:grid;grid-template-columns:1fr 1fr}
.capability-detail__proof li{padding:12px clamp(14px,1.6vw,28px) 12px 0;border-top:1px solid var(--line);font-family:var(--font-head);font-weight:600;font-size:clamp(15px,1.2vw,18px);line-height:1.3;color:var(--silver-hi)}
.capability-detail__proof li:nth-child(2n){padding-left:clamp(14px,1.6vw,28px);border-left:1px solid var(--line)}
.capability-detail__proof li:nth-child(-n+2){border-top:0}
.capability-detail__proof li:nth-last-child(-n+2){border-bottom:1px solid var(--line)}
.capability-detail .svc-cta{margin-bottom:16px}
.capability-detail__note a{color:var(--ame-light);text-decoration:underline;text-underline-offset:3px}
/* the LinkedIn Ads sentence would make the Google Ads panel the tallest of the stacked panels between 768 and
   1023px and grow the section, so it is not rendered in that band */
@media(min-width:768px) and (max-width:1023px){.capability-detail__note--link{display:none}}
.capability-detail__note{margin:0;font-family:var(--font-body);font-weight:400;font-size:clamp(12.5px,.95vw,14px);line-height:1.5;letter-spacing:.01em;color:var(--silver-lo)}
@media(max-width:1279px){
  .capability-index{grid-template-columns:minmax(0,55fr) minmax(0,45fr)}
  .capability-index__item{grid-template-columns:56px minmax(0,1fr) 48px;padding:12px 0}
}
@media(max-width:767px){
  .capabilities__intro{grid-template-columns:1fr;align-items:start;gap:18px}
  .capabilities__support{justify-self:start}
  .capability-index{grid-template-columns:1fr}
  .capability-index__list{border-right:0;border-bottom:1px solid var(--line)}
  .capability-index__item{min-height:64px;grid-template-columns:48px minmax(0,1fr) 40px}
  .capability-detail{padding:24px 20px 26px}
  .capability-detail .svc-cta{width:100%;min-width:0}
}
@media(max-width:479px){
  .capability-detail__proof{grid-template-columns:1fr}
  .capability-detail__proof li{border-left:0;padding-left:0;border-top:1px solid var(--line);border-bottom:0}
  .capability-detail__proof li:first-child{border-top:0}
  .capability-detail__proof li:last-child{border-bottom:1px solid var(--line)}
}
@media (prefers-reduced-motion: reduce){
  .capability-index__item,.capability-index__num,.capability-index__trigger,.capability-index__summary,.capability-index__arrow,.capability-detail{transition:none}
}

/* ---------- Services page: Perth Solar Direct proof section ----------
   Reproduction of design/services-proof-reference.webp: two-column header (heading left, context right with
   a hairline on its left), one continuous three-column evidence area (34 / 38 / 28, thin dividers, the
   primary result on a deep-violet wash), and a typographic proof strip. Full width with the global gutter,
   no frame; the site section padding and type scale apply. The result counter and the "after" reveal are
   progressive enhancement driven by site.js; the final values are in the HTML. */
.case-study-proof{width:100%;padding:var(--section-pad) var(--gutter);background:transparent;border-top:1px solid var(--line)}
.case-study-proof__inner{width:100%}
.case-study-proof__header{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(400px,.9fr);gap:0;margin-bottom:24px}
.case-study-proof__lead{padding-right:clamp(24px,3vw,48px)}
.case-study-proof__eyebrow,.case-study-proof__industry{margin:0 0 16px;font-family:var(--font-body);font-weight:500;font-size:clamp(10.5px,.8vw,12px);letter-spacing:.3em;text-transform:uppercase;color:var(--ame-glow)}
.case-study-proof__industry{color:var(--silver-lo);margin-top:26px}
.case-study-proof__title{margin:0;font-family:var(--font-head);font-weight:700;line-height:1.1;letter-spacing:-.03em;color:var(--silver-hi)}
.case-study-proof__title em{font-style:normal;color:var(--ame-glow)}
.case-study-proof__context{border-left:1px solid var(--line);padding-left:clamp(24px,3.4vw,52px);padding-bottom:16px}
.case-study-proof__intro{margin:0;max-width:620px;font-family:var(--font-body);font-weight:400;font-size:16px;line-height:1.55;color:#c4c0ca}
.case-study-proof__evidence{display:grid;grid-template-columns:minmax(0,34fr) minmax(0,38fr) minmax(0,28fr);width:100%;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.case-study-proof__result{display:flex;flex-direction:column;justify-content:center;padding:clamp(24px,3vw,44px) clamp(20px,2.6vw,40px);background:linear-gradient(180deg,#191424,#120f1a);min-width:0}
.case-study-proof__figure{margin:0;font-family:var(--font-head);font-weight:900;font-size:clamp(64px,9.6vw,150px);line-height:1;letter-spacing:-.06em;color:var(--ame-glow);font-variant-numeric:tabular-nums;white-space:nowrap}
/* The percent sign is solid purple: every sheen treatment read as a cut through the glyph. */
.case-study-proof__pct{color:var(--ame-glow)}
.case-study-proof__num{display:inline-block;min-width:1.18em;text-align:right}
.case-study-proof__figure-label{margin:10px 0 0;font-family:var(--font-head);font-weight:800;font-size:clamp(24px,3vw,46px);line-height:1.05;letter-spacing:-.045em;color:var(--silver-hi)}
.case-study-proof__compare{margin:14px 0 0;font-family:var(--font-body);font-weight:400;font-size:clamp(18px,1.8vw,28px);letter-spacing:.01em;color:var(--silver-lo)}
.case-study-proof__changed,.case-study-proof__outcome{padding:clamp(20px,2vw,30px) clamp(20px,2.6vw,40px);min-width:0;border-left:1px solid var(--line)}
.case-study-proof__h3{margin:0 0 14px;font-family:var(--font-head);font-weight:700;font-size:clamp(22px,1.95vw,28px);white-space:nowrap;line-height:1.05;letter-spacing:-.03em;color:var(--silver-hi)}
.case-study-proof__rows{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.case-study-proof__rows li{min-height:44px;padding:10px 0 10px 12px;margin-left:-12px;border-bottom:1px solid var(--line);font-family:var(--font-body);font-weight:400;font-size:clamp(15px,1.15vw,17px);line-height:1.4;color:#d9d6e0;box-shadow:inset 0 0 0 0 var(--ame-glow);transition:color 260ms ease,background-color 260ms ease,border-color 260ms ease,box-shadow 260ms ease,opacity 260ms ease,transform 360ms cubic-bezier(.22,1,.36,1)}
.case-study-proof__rows li:hover,.case-study-proof__rows li:focus-visible{color:var(--silver-hi);background:rgba(20,20,27,.6);box-shadow:inset 2px 0 0 var(--ame-glow);outline:none}
/* The CTA belongs to the middle column on desktop; it is its own grid item so phones can order it last. */
.case-study-proof__cta{grid-column:2;grid-row:2;margin:0 clamp(20px,2.6vw,40px) clamp(20px,2vw,30px);align-self:start;justify-self:start;color:var(--ame-glow);border-color:rgba(166,127,214,.5)}
.case-study-proof__changed{grid-column:2;grid-row:1;padding-bottom:8px}
.case-study-proof__result{grid-column:1;grid-row:1 / span 2}
.case-study-proof__outcome{grid-column:3;grid-row:1 / span 2}
.case-study-proof__evidence{grid-template-rows:auto auto}
.case-study-proof__table{width:100%;border-collapse:collapse;font-family:var(--font-body);font-size:clamp(15px,1.15vw,18px)}
.case-study-proof__table th,.case-study-proof__table td{padding:9px 0;border-bottom:1px solid var(--line);text-align:right;font-weight:400;white-space:nowrap}
.case-study-proof__table th[scope="row"],.case-study-proof__table th:first-child{text-align:left}
.case-study-proof__table thead th{padding:0 0 10px;font-family:var(--font-body);font-weight:500;font-size:clamp(10px,.75vw,11.5px);letter-spacing:.24em;text-transform:uppercase;color:var(--silver-lo);border-bottom:1px solid var(--line)}
.case-study-proof__table tbody th{color:#d9d6e0}
.case-study-proof__table tbody td{color:var(--silver-lo);padding-left:16px}
.case-study-proof__after{color:var(--ame-glow) !important;font-weight:600}
.case-study-proof.is-in .case-study-proof__after{animation:csProofUp 480ms ease both}
@keyframes csProofUp{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.case-study-proof__footnote{margin:12px 0 0;font-family:var(--font-body);font-size:clamp(12.5px,.95vw,15px);line-height:1.5;color:var(--silver-lo)}
.case-study-proof__strip{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:0 clamp(24px,3vw,48px);padding-top:22px}
.case-study-proof__strip p{margin:0;font-family:var(--font-body);font-weight:500;font-size:clamp(10px,.78vw,12px);letter-spacing:.28em;text-transform:uppercase;color:var(--silver-lo)}
.case-study-proof__strip p:last-child{text-align:right}
.case-study-proof__strip::before{content:"";grid-column:2;width:1px;height:26px;background:var(--line)}
.case-study-proof__strip p:first-child{grid-column:1;grid-row:1}
.case-study-proof__strip p:last-child{grid-column:3;grid-row:1}
@media(max-width:1279px){
  .case-study-proof__evidence{grid-template-columns:minmax(0,31fr) minmax(0,37fr) minmax(0,32fr)}
  .case-study-proof__changed,.case-study-proof__outcome{padding:22px 20px}
  .case-study-proof__cta{margin:0 20px 22px}
  .case-study-proof__figure{font-size:clamp(60px,8.4vw,120px)}
}
@media(max-width:1180px){
  /* The 60px heading needs the full width below 1180px, so the header stacks here. */
  .case-study-proof__header{grid-template-columns:1fr;margin-bottom:22px}
  .case-study-proof__context{border-left:0;padding-left:0;padding-bottom:0}
  .case-study-proof__industry{margin-top:20px}
}
@media(max-width:900px){
  .case-study-proof__evidence{grid-template-columns:1fr 1fr;grid-template-rows:auto auto auto}
  .case-study-proof__result{grid-column:1 / -1;grid-row:1;border-bottom:1px solid var(--line)}
  .case-study-proof__changed{grid-column:1;grid-row:2;border-left:0}
  .case-study-proof__cta{grid-column:1;grid-row:3}
  .case-study-proof__outcome{grid-column:2;grid-row:2 / span 2}
}
@media(max-width:767px){
  .case-study-proof__evidence{display:flex;flex-direction:column}
  .case-study-proof__result{border-bottom:1px solid var(--line);padding:28px 20px}
  .case-study-proof__changed,.case-study-proof__outcome{border-left:0;padding:22px 0}
  .case-study-proof__outcome{border-top:1px solid var(--line)}
  .case-study-proof__cta{order:10;margin:0 0 22px;min-height:44px;align-items:center}
  .case-study-proof__figure{font-size:clamp(72px,22vw,120px)}
  .case-study-proof__strip{grid-template-columns:1fr;gap:10px}
  .case-study-proof__strip::before{display:none}
  .case-study-proof__strip p:last-child{grid-column:1;grid-row:auto;text-align:left}
  .case-study-proof__table th,.case-study-proof__table td{white-space:normal}
}
@media (prefers-reduced-motion: reduce){
  .case-study-proof__rows li{transition:none}
  .case-study-proof.is-in .case-study-proof__after{animation:none}
}

/* ---------- Services page: engagement and pricing ledger ----------
   Reproduction of design/services-engagement-reference.webp: two-column header (heading 58%, support 42%),
   one continuous three-column ledger (Start 27 / Diagnose 31 / Build or grow 42) with thin dividers, the
   middle column on a violet wash, and a typographic strip. Full width with the global gutter, no frame; the
   site section padding and type scale apply. Sizes are the reference measurements at 1440. */
.engagement-section{width:100%;padding:var(--section-pad) var(--gutter);background:transparent;border-top:1px solid var(--line)}
.engagement-section__inner{width:100%}
.engagement-section__header{display:grid;grid-template-columns:minmax(0,58fr) minmax(0,42fr);gap:clamp(24px,3vw,48px);align-items:start;margin-bottom:26px}
.engagement-section__eyebrow{margin:0 0 14px;font-family:var(--font-body);font-weight:500;font-size:clamp(11px,.85vw,13px);letter-spacing:.14em;text-transform:uppercase;color:var(--silver-lo)}
.engagement-section__title{margin:0;font-family:var(--font-head);font-weight:700;line-height:1.08;letter-spacing:-.03em;color:var(--silver-hi)}
.engagement-section__title em{font-style:normal;color:var(--ame-glow)}
.engagement-section__support{margin:0;max-width:620px;padding-top:6px;font-family:var(--font-body);font-weight:400;font-size:16px;line-height:1.55;color:#c4c0ca}
.engagement-ledger{display:grid;grid-template-columns:minmax(0,27fr) minmax(0,31fr) minmax(0,42fr);width:100%;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.engagement-ledger__col{display:flex;flex-direction:column;align-items:flex-start;min-width:0;padding:clamp(22px,2.4vw,34px) clamp(18px,1.8vw,26px) clamp(24px,2.4vw,34px);border-left:1px solid var(--line)}
.engagement-ledger__col:first-child{border-left:0;padding-left:0}
.engagement-ledger__col--diagnose{background:linear-gradient(180deg,#171320,#110e18)}
.engagement-ledger__label{margin:0 0 14px;font-family:var(--font-body);font-weight:500;font-size:clamp(11px,.85vw,13px);letter-spacing:.14em;text-transform:uppercase;color:var(--silver-lo)}
.engagement-ledger__title{margin:0 0 12px;font-family:var(--font-head);font-weight:700;font-size:clamp(22px,1.9vw,26px);line-height:1.1;letter-spacing:-.03em;color:var(--silver-hi)}
.engagement-ledger__price{margin:0;font-family:var(--font-head);font-weight:700;font-size:clamp(30px,3vw,44px);line-height:1;letter-spacing:-.03em;color:var(--ame-glow)}
.engagement-ledger__suffix{margin:6px 0 0;font-family:var(--font-body);font-size:clamp(12.5px,.95vw,15px);letter-spacing:.02em;color:var(--silver-lo)}
.engagement-ledger__desc{margin:20px 0 0;max-width:420px;font-family:var(--font-body);font-weight:400;font-size:clamp(15px,1.15vw,17px);line-height:1.5;color:#c4c0ca}
.engagement-ledger__boundary{margin:22px 0 0;padding-top:16px;width:100%;border-top:1px solid var(--line);font-family:var(--font-body);font-size:clamp(13px,1vw,15px);color:var(--silver-lo)}
.engagement-ledger__cta{margin-top:auto;padding-top:0}
.engagement-ledger__col--start .engagement-ledger__cta{margin-top:28px}
.engagement-ledger__outputs{list-style:none;margin:18px 0 0;padding:0;width:100%;border-top:1px solid var(--line)}
.engagement-ledger__outputs li{padding:9px 0 9px 4px;border-bottom:1px solid var(--line);font-family:var(--font-body);font-size:clamp(14px,1.05vw,16px);line-height:1.4;color:#d9d6e0}
.engagement-ledger__credit{margin:18px 0 0;max-width:360px;font-family:var(--font-body);font-size:clamp(13.5px,1vw,15.5px);line-height:1.5;color:#c4c0ca}
.engagement-ledger__credit span{position:relative;display:inline;background-image:linear-gradient(var(--ame-glow),var(--ame-glow));background-repeat:no-repeat;background-size:0 2px;background-position:0 100%;padding-bottom:4px;transition:background-size 900ms cubic-bezier(.22,1,.36,1)}
.engagement-section.is-in .engagement-ledger__credit span{background-size:100% 2px}
/* Engagement rows: whole row is the link; name and price left, arrow, description right. */
.ledger-rows{list-style:none;margin:8px 0 0;padding:0;width:100%;border-top:1px solid var(--line)}
.ledger-rows li{border-bottom:1px solid var(--line)}
.ledger-row{display:grid;grid-template-columns:minmax(0,1.5fr) 22px minmax(0,1fr);align-items:center;gap:0 clamp(12px,1.2vw,18px);padding:16px 0;color:inherit;text-decoration:none;min-height:44px;transition:color 260ms ease,background-color 260ms ease,opacity 260ms ease}
.ledger-row__main{display:flex;flex-direction:column;gap:4px;min-width:0}
.ledger-row strong{font-family:var(--font-head);font-weight:700;font-size:clamp(16px,1.3vw,20px);line-height:1.2;color:var(--silver-hi)}
.ledger-row__price{font-family:var(--font-head);font-weight:700;font-size:clamp(17px,1.4vw,20px);line-height:1.1;letter-spacing:-.02em;color:var(--ame-glow)}
.ledger-row__arrow{width:22px;height:14px;opacity:.55;transition:opacity 260ms ease,transform 360ms cubic-bezier(.22,1,.36,1)}
.ledger-row__arrow svg{display:block;width:22px;height:14px;fill:none;stroke:var(--ame-glow);stroke-width:1.6;stroke-linecap:square}
.ledger-row__desc{font-family:var(--font-body);font-size:clamp(14px,1.05vw,16px);line-height:1.4;color:var(--silver-lo);transition:color 260ms ease}
.ledger-row:hover,.ledger-row:focus-visible{background:rgba(20,20,27,.55);outline:none}
.ledger-row:hover .ledger-row__desc,.ledger-row:focus-visible .ledger-row__desc{color:#d9d6e0}
.ledger-row:hover .ledger-row__arrow,.ledger-row:focus-visible .ledger-row__arrow{opacity:1;transform:translateX(3px)}
.ledger-row:focus-visible{box-shadow:inset 0 0 0 2px var(--ame-light)}
.engagement-ledger__link{margin-top:22px;color:var(--ame-glow);border-color:rgba(166,127,214,.5)}
.engagement-section__strip{display:grid;grid-template-columns:1fr 1fr;gap:0 24px;padding-top:22px}
.engagement-section__strip p{margin:0;font-family:var(--font-body);font-weight:500;font-size:clamp(10.5px,.8vw,12.5px);letter-spacing:.14em;text-transform:uppercase;color:var(--silver-lo)}
.engagement-section__strip p:last-child{text-align:right}
@media(min-width:1440px){
  .ledger-row__price{white-space:nowrap}
}
@media(max-width:1279px){
  .engagement-ledger{grid-template-columns:minmax(0,28fr) minmax(0,32fr) minmax(0,40fr)}
  .engagement-ledger__col{padding:20px 18px 22px}
  .ledger-row{grid-template-columns:minmax(0,1fr) 22px minmax(0,1fr);gap:0 12px}
}
@media(max-width:1023px){
  .engagement-section__header{grid-template-columns:1fr;gap:16px}
  .ledger-row{grid-template-columns:minmax(0,1fr) 22px;grid-template-rows:auto auto}
  /* explicit cells: a row-locked arrow is placed before the auto-placed title and would otherwise take
     column 1, squeezing the title into the 22px arrow column */
  .ledger-row__main{grid-column:1;grid-row:1}
  .ledger-row__desc{grid-column:1 / -1;grid-row:2;margin-top:6px}
  .ledger-row__arrow{grid-column:2;grid-row:1}
}
@media(max-width:767px){
  .engagement-ledger{display:flex;flex-direction:column}
  .engagement-ledger__col{border-left:0;border-top:1px solid var(--line);padding:22px 0}
  .engagement-ledger__col:first-child{border-top:0}
  .engagement-ledger__col--diagnose{padding:22px 20px;margin:0}
  .engagement-ledger__cta{width:100%;min-width:0}
  .engagement-section__strip{grid-template-columns:1fr;gap:10px}
  .engagement-section__strip p:last-child{text-align:left}
}
@media (prefers-reduced-motion: reduce){
  .ledger-row,.ledger-row__arrow,.ledger-row__desc{transition:none}
  .engagement-ledger__credit span{transition:none;background-size:100% 2px}
}

/* ---------- Services page: direct answers stage ----------
   Reproduction of design/services-answers-reference.webp: one uninterrupted obsidian stage with a restrained
   purple glow anchored bottom-left; short rule, eyebrow (the section heading), the active buyer question with
   the oversized purple verdict to its right, a supporting paragraph, a proof band with the CTA at its far
   right, a six-option tab rail and a microcopy line. All six panels are stacked in one grid cell so the
   section height never changes. Full width with the global gutter, no frame. */
.direct-answers{position:relative;width:100%;min-height:640px;overflow:hidden;padding:var(--section-pad) var(--gutter) 0;background:transparent;border-top:1px solid var(--line)}
.direct-answers::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 48% 42% at 0% 100%,rgba(123,86,163,.52) 0%,rgba(123,86,163,.24) 34%,rgba(10,10,15,0) 72%);pointer-events:none}
.direct-answers__inner{position:relative;z-index:1;width:100%}
.direct-answers__rule{width:clamp(180px,22vw,320px);height:2px;background:linear-gradient(90deg,var(--ame-glow),rgba(166,127,214,.15));margin-bottom:22px}
.direct-answers__eyebrow{margin:0 0 30px;font-family:var(--font-body);font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--silver-lo)}
.direct-answers h2.direct-answers__eyebrow{font-size:clamp(11px,.85vw,13px) !important;line-height:1.4 !important;letter-spacing:.14em}
/* Panels: every answer rendered, stacked; inactive ones invisible and out of the tree. */
.direct-answers__panels{display:grid}
.direct-answers__panel{grid-area:1/1;min-width:0;opacity:0;visibility:hidden;transition:opacity 280ms ease,visibility 0s linear 280ms}
.direct-answers__panel.is-active{opacity:1;visibility:visible;transition-delay:0s}
html:not(.js) .direct-answers__panel{grid-area:auto;opacity:1;visibility:visible;border-top:1px solid var(--line);padding-top:32px}
.direct-answers__stage{position:relative;min-height:330px}
.direct-answers__question{position:relative;z-index:1;max-width:62%;margin:0;font-family:var(--font-head);font-weight:700;font-size:clamp(48px,5vw,82px);line-height:.98;letter-spacing:-.045em;color:var(--silver-hi);transform:translateY(8px);transition:transform 360ms cubic-bezier(.22,1,.36,1)}
.direct-answers__panel.is-active .direct-answers__question{transform:none}
/* the verdict face is the reference's condensed black: Archivo at weight 900 and width 75 (the variable font's
   wdth axis, loaded as its own face in the head font link), tight tracking and a closed-up word gap */
.direct-answers__verdict{position:absolute;top:clamp(42px,5vw,76px);right:0;margin:0;font-family:var(--font-head);font-weight:900;font-stretch:75%;font-size:clamp(64px,7vw,118px);line-height:.86;letter-spacing:-.04em;word-spacing:.04em;text-transform:uppercase;color:var(--ame-glow);white-space:nowrap}
.direct-answers__verdict span{display:inline-block;clip-path:inset(0 100% 0 0);transition:clip-path 520ms cubic-bezier(.22,1,.36,1) 80ms}
.direct-answers__panel.is-active .direct-answers__verdict span{clip-path:inset(0 0 0 0)}
.direct-answers__body{margin:30px 0 0;max-width:760px;font-family:var(--font-body);font-weight:400;font-size:clamp(16px,1.3vw,20px);line-height:1.5;color:#c4c0ca}
/* Proof band: four statements with thin dividers and the CTA in the same row at the far right. */
.direct-answers__band{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:0 clamp(20px,2.4vw,40px);margin-top:clamp(26px,3vw,44px);padding-bottom:clamp(28px,3vw,44px)}
.direct-answers__proof{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.direct-answers__proof li{padding:6px clamp(16px,1.8vw,30px) 6px 0;border-left:1px solid var(--line);padding-left:clamp(16px,1.8vw,30px)}
.direct-answers__proof li:first-child{border-left:0;padding-left:0}
.direct-answers__proof-label{display:block;margin-bottom:8px;font-family:var(--font-body);font-weight:500;font-size:clamp(10.5px,.8vw,12px);letter-spacing:.16em;text-transform:uppercase;color:var(--ame-glow)}
.direct-answers__proof-text{display:block;font-family:var(--font-body);font-weight:400;font-size:clamp(15px,1.15vw,18px);line-height:1.35;color:var(--silver-hi)}
.direct-answers__cta{justify-self:end;white-space:nowrap}
/* Question rail: six equal tabs with thin dividers; the active line slides between them. */
.direct-answers__rail{position:relative;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin:0 calc(-1 * var(--gutter))}
.direct-answers__tab{display:flex;align-items:center;gap:14px;min-height:72px;margin:0;padding:0 clamp(16px,1.6vw,28px);background:transparent;border:0;border-left:1px solid var(--line);color:var(--silver-lo);font-family:var(--font-body);font-weight:400;font-size:clamp(14px,1.15vw,17px);line-height:1.2;text-align:left;cursor:pointer;transition:color 260ms ease,background-color 260ms ease}
.direct-answers__tab:first-child{border-left:0;padding-left:var(--gutter)}
.direct-answers__tab-num{font-family:var(--font-body);font-weight:500;font-size:clamp(12px,.95vw,14px);letter-spacing:.06em;color:var(--silver-lo);transition:color 260ms ease}
.direct-answers__tab:hover{color:var(--silver-hi);background:rgba(20,20,27,.5)}
.direct-answers__tab.is-active{color:var(--silver-hi);background:rgba(123,86,163,.14)}
.direct-answers__tab.is-active .direct-answers__tab-num{color:var(--ame-glow)}
.direct-answers__tab:focus-visible{outline:none;box-shadow:inset 0 0 0 2px var(--ame-light)}
.direct-answers__rail-line{position:absolute;top:-1px;height:2px;left:0;width:0;background:var(--ame-glow);transition:left 360ms cubic-bezier(.22,1,.36,1),width 360ms cubic-bezier(.22,1,.36,1)}
html:not(.js) .direct-answers__rail{display:none}
.direct-answers__micro{display:flex;justify-content:space-between;gap:24px;padding:20px 0 22px}
.direct-answers__micro p{margin:0;font-family:var(--font-body);font-weight:500;font-size:clamp(10px,.75vw,11.5px);letter-spacing:.16em;text-transform:uppercase;color:var(--silver-lo)}
@media(max-width:1180px){
  .direct-answers__question{max-width:60%}
  .direct-answers__band{grid-template-columns:1fr;gap:22px 0}
  .direct-answers__cta{justify-self:start}
}
@media(max-width:900px){
  .direct-answers__stage{min-height:0}
  .direct-answers__question{max-width:none;font-size:clamp(40px,6.4vw,60px)}
  .direct-answers__verdict{position:static;margin-top:18px;font-size:clamp(52px,9vw,88px)}
  .direct-answers__proof{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 0}
  .direct-answers__proof li:nth-child(odd){border-left:0;padding-left:0}
  .direct-answers__rail{grid-template-columns:repeat(3,minmax(0,1fr))}
  .direct-answers__tab{min-height:56px;border-top:1px solid var(--line);padding:0 14px}
  .direct-answers__tab:first-child{padding-left:var(--gutter)}
  .direct-answers__tab:nth-child(-n+3){border-top:0}
  .direct-answers__tab:nth-child(4){border-left:0;padding-left:var(--gutter)}
  .direct-answers__rail-line{display:none}
  .direct-answers__tab.is-active{box-shadow:inset 0 2px 0 var(--ame-glow)}
}
@media(max-width:767px){
  .direct-answers{min-height:0}
  .direct-answers__question{font-size:clamp(36px,9.5vw,48px)}
  .direct-answers__verdict{font-size:clamp(44px,13vw,72px);white-space:normal}
  .direct-answers__cta{width:100%;min-width:0;white-space:normal}
  .direct-answers__rail{grid-template-columns:repeat(2,minmax(0,1fr))}
  .direct-answers__tab:nth-child(-n+3){border-top:1px solid var(--line)}
  .direct-answers__tab:nth-child(-n+2){border-top:0}
  .direct-answers__tab:nth-child(4){border-left:1px solid var(--line);padding-left:14px}
  .direct-answers__tab:nth-child(odd){border-left:0;padding-left:var(--gutter)}
  .direct-answers__micro{flex-direction:column;gap:8px}
}
@media (prefers-reduced-motion: reduce){
  .direct-answers *,.direct-answers *::before,.direct-answers *::after{animation:none !important;transition:none !important}
  .direct-answers__question{transform:none}
}

/* ---------- Services page: "One system." related-services stage ----------
   Reproduction of design/services-system-reference.png (1672 x 941): the fractured-obsidian photograph fills
   the section, the eyebrow and H2 sit upper-left, four service markers are placed around the fissure at the
   reference's coordinates (percentages of the section), each tied to the rock by a thin leader line and a
   purple node. CONVERT is active in a square focus field; the others have no box. Static annotation bottom
   right. Full width; the heading and note sit on the global gutter. */
.services-system{position:relative;width:100%;min-height:clamp(680px,52vw,820px);overflow:hidden;background:var(--void);border-top:1px solid var(--line)}
.services-system__image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:55% center;max-width:none}
.services-system__overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,10,15,.82) 0%,rgba(10,10,15,.35) 42%,rgba(10,10,15,.14) 72%,rgba(10,10,15,.48) 100%),linear-gradient(180deg,rgba(10,10,15,.28),rgba(10,10,15,.12) 58%,rgba(10,10,15,.65));pointer-events:none}
.services-system__inner{position:absolute;inset:0;width:100%;padding-inline:var(--gutter)}
.services-system__heading{position:absolute;top:clamp(54px,5vw,78px);left:var(--gutter);z-index:3}
.services-system__rule{display:block;width:80px;height:2px;background:var(--ame-glow);margin-bottom:26px}
.services-system__eyebrow{margin:0;font-family:var(--font-body);font-size:.75rem;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--silver-lo)}
.services-system h2#services-system-title{margin:18px 0 0;font-family:var(--font-head);font-size:clamp(52px,5vw,82px) !important;font-weight:700;line-height:.96 !important;letter-spacing:-.045em;color:var(--silver-hi)}
/* Markers: DOM order FIND, CAPTURE, CONVERT, PROVE; desktop positions are percentages of the section. */
.services-system__markers{list-style:none;margin:0;padding:0;position:absolute;inset:0;z-index:2}
.services-system__markers li{position:absolute}
.services-system__markers li:nth-child(1){left:8%;top:38%}
.services-system__markers li:nth-child(2){left:41%;top:25%}
.services-system__markers li:nth-child(3){left:57%;top:57%}
.services-system__markers li:nth-child(4){right:4%;top:46%}
.service-marker{position:relative;display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:18px;row-gap:6px;align-items:start;padding:14px 18px 12px 14px;border:1px solid transparent;background:transparent;transition:color 280ms ease,border-color 320ms ease,background-color 320ms ease,box-shadow 320ms ease,opacity 280ms ease}
.service-marker__trigger{display:contents}
.service-marker svg{grid-column:1;grid-row:1 / span 2;width:clamp(46px,3.4vw,58px);height:clamp(46px,3.4vw,58px);fill:none;stroke:var(--ame);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;transition:stroke 280ms ease,opacity 280ms ease;opacity:.85}
.service-marker svg .dot{fill:var(--ame);stroke:none;opacity:0;transition:opacity 280ms ease}
.service-marker__verb{grid-column:2;grid-row:1;font-family:var(--font-head);font-weight:700;font-size:clamp(18px,1.55vw,24px);letter-spacing:.14em;text-transform:uppercase;line-height:1.1;color:#d9d6e0;cursor:pointer;transition:color 280ms ease}
.service-marker__links{grid-column:2;grid-row:2;display:flex;flex-direction:column;gap:4px;font-family:var(--font-body);font-size:clamp(14px,1.1vw,17px);line-height:1.35;color:var(--silver-lo)}
.service-marker__links a{color:inherit;text-decoration:none;transition:color 280ms ease}
.service-marker__links a:hover,.service-marker__links a:focus-visible{color:var(--ame-light);outline:none;text-decoration:underline;text-underline-offset:3px}
.service-marker__soon{color:inherit}
.service-marker__annotation{grid-column:1 / -1;margin:14px -18px 0 -14px;padding:14px 18px 2px 14px;border-top:1px solid transparent;font-family:var(--font-body);font-weight:500;font-size:clamp(10px,.78vw,12px);letter-spacing:.2em;text-transform:uppercase;color:var(--ame-glow);opacity:0;visibility:hidden;transition:opacity 280ms ease,visibility 0s linear 280ms}
/* Leader line and node: from the marker down to the rock; up for CONVERT and PROVE, whose nodes sit above. */
.service-marker__leader{position:absolute;left:calc(14px + clamp(23px,1.7vw,29px));top:100%;width:1px;height:clamp(60px,7vw,110px);background:rgba(166,127,214,.55);pointer-events:none}
.service-marker__leader::after{content:"";position:absolute;left:-3.5px;bottom:-4px;width:8px;height:8px;border-radius:50%;background:var(--ame-glow);box-shadow:0 0 8px rgba(166,127,214,.8)}
.service-marker[data-service="prove"] .service-marker__leader{top:auto;bottom:100%}
.service-marker[data-service="prove"] .service-marker__leader::after{bottom:auto;top:-4px}
.service-marker[data-service="convert"] .service-marker__leader{top:auto;bottom:100%;height:clamp(50px,5vw,80px)}
.service-marker[data-service="convert"] .service-marker__leader::after{bottom:auto;top:-4px}
/* Active focus field. */
.service-marker.is-active{background:rgba(20,20,27,.72);border-color:rgba(166,127,214,.48);box-shadow:0 0 32px rgba(123,86,163,.12)}
.service-marker.is-active svg{stroke:var(--ame-glow);opacity:1}
.service-marker.is-active svg .dot{opacity:1}
.service-marker.is-active .service-marker__verb{color:var(--silver-hi)}
.service-marker.is-active .service-marker__links{color:#d9d6e0}
.service-marker.is-active .service-marker__annotation{opacity:1;visibility:visible;border-top-color:rgba(166,127,214,.3);transition-delay:0s}
.service-marker:not(.is-active) .service-marker__annotation{height:0;padding-top:0;margin-top:0;overflow:hidden}
.service-marker__verb:focus-visible{outline:2px solid var(--ame-light);outline-offset:4px}
.service-marker__trigger:focus-visible + .service-marker__links{outline:none}
.services-system__note{position:absolute;right:var(--gutter);bottom:clamp(36px,4vw,56px);z-index:3;display:flex;align-items:center;gap:16px;margin:0;font-family:var(--font-body);font-weight:500;font-size:clamp(10px,.78vw,12px);letter-spacing:.2em;text-transform:uppercase;color:var(--silver-lo)}
.services-system__note-line{display:block;width:clamp(40px,5vw,80px);height:1px;background:#6f6b78}
@media(max-width:1180px){
  .services-system__markers li:nth-child(1){left:5%;top:40%}
  .services-system__markers li:nth-child(2){left:38%;top:24%}
  .services-system__markers li:nth-child(3){left:52%;top:58%}
  .services-system__markers li:nth-child(4){right:3%;top:44%}
}
@media(max-width:900px){
  /* phones and small tablets keep the desktop composition: the photograph, the heading upper-left, the four
     markers around the fissure with their leaders, the note lower-right, all at compact sizes */
  .services-system{min-height:660px}
  .services-system__heading{top:28px}
  .services-system h2#services-system-title{margin-top:12px;font-size:clamp(40px,11vw,56px) !important}
  .services-system__markers li:nth-child(1){left:4%;right:auto;top:33%}
  .services-system__markers li:nth-child(2){left:auto;right:4%;top:20%}
  .services-system__markers li:nth-child(3){left:4%;right:auto;top:64%}
  .services-system__markers li:nth-child(4){left:auto;right:4%;top:50%}
  .service-marker{column-gap:10px;row-gap:4px;padding:10px 12px 8px 10px}
  .service-marker svg{width:34px;height:34px}
  .service-marker__verb{font-size:14px;letter-spacing:.12em}
  .service-marker__links{font-size:13px;gap:2px}
  .service-marker__links a,.service-marker__soon{min-height:24px;display:flex;align-items:center}
  .service-marker__annotation{margin:10px -12px 0 -10px;padding:10px 12px 0 10px;font-size:9px;letter-spacing:.16em}
  .service-marker__leader{left:27px;height:30px}
  .service-marker[data-service="convert"] .service-marker__leader{height:30px}
  .services-system__note{bottom:24px;gap:10px;font-size:10px}
  .services-system__note-line{width:36px}
}
/* ---- Effects. Everything below is progressive enhancement: hidden states only apply once JS runs, the
   section reveals in sequence when it scrolls into view, and the ambient light loops are off under reduced
   motion. ---- */
.services-system__image{transform:scale(1.045);transition:transform 1800ms cubic-bezier(.22,1,.36,1)}
.services-system.is-in .services-system__image{transform:none}
/* A soft light that breathes along the fissure, blended into the photograph. */
.services-system__glow{position:absolute;left:-8%;top:34%;width:116%;height:30%;transform:rotate(-24deg);transform-origin:center;background:radial-gradient(ellipse 50% 50% at 50% 50%,rgba(166,127,214,.34) 0%,rgba(140,96,200,.14) 40%,rgba(10,10,15,0) 72%);mix-blend-mode:screen;opacity:0;pointer-events:none;animation:sysBreathe 6.5s ease-in-out infinite;animation-play-state:paused}
.services-system.is-in .services-system__glow{animation-play-state:running}
@keyframes sysBreathe{0%,100%{opacity:.35}50%{opacity:.75}}
/* Entry sequence. */
html.js .services-system__rule{transform:scaleX(0);transform-origin:left center;transition:transform 700ms cubic-bezier(.22,1,.36,1)}
html.js .services-system.is-in .services-system__rule{transform:none}
html.js .services-system__eyebrow,html.js .services-system h2#services-system-title,html.js .services-system__note{opacity:0;transform:translateY(10px);transition:opacity 600ms ease,transform 700ms cubic-bezier(.22,1,.36,1)}
html.js .services-system.is-in .services-system__eyebrow{opacity:1;transform:none;transition-delay:150ms}
html.js .services-system.is-in h2#services-system-title{opacity:1;transform:none;transition-delay:260ms}
html.js .services-system.is-in .services-system__note{opacity:1;transform:none;transition-delay:1500ms}
html.js .services-system__markers li{opacity:0;transform:translateY(12px);transition:opacity 600ms ease,transform 700ms cubic-bezier(.22,1,.36,1)}
html.js .services-system.is-in .services-system__markers li{opacity:1;transform:none}
html.js .services-system.is-in .services-system__markers li:nth-child(1){transition-delay:450ms}
html.js .services-system.is-in .services-system__markers li:nth-child(2){transition-delay:620ms}
html.js .services-system.is-in .services-system__markers li:nth-child(3){transition-delay:790ms}
html.js .services-system.is-in .services-system__markers li:nth-child(4){transition-delay:960ms}
/* Leader lines draw from the marker to the rock; nodes light up as the line arrives. */
html.js .service-marker__leader{transform:scaleY(0);transform-origin:top center;transition:transform 700ms cubic-bezier(.22,1,.36,1)}
html.js .service-marker[data-service="convert"] .service-marker__leader,html.js .service-marker[data-service="prove"] .service-marker__leader{transform-origin:bottom center}
html.js .services-system.is-in .service-marker__leader{transform:none}
html.js .services-system.is-in li:nth-child(1) .service-marker__leader{transition-delay:900ms}
html.js .services-system.is-in li:nth-child(2) .service-marker__leader{transition-delay:1070ms}
html.js .services-system.is-in li:nth-child(3) .service-marker__leader{transition-delay:1240ms}
html.js .services-system.is-in li:nth-child(4) .service-marker__leader{transition-delay:1410ms}
html.js .service-marker__leader::after{opacity:0;transition:opacity 400ms ease}
html.js .services-system.is-in .service-marker__leader::after{opacity:1}
html.js .services-system.is-in li:nth-child(1) .service-marker__leader::after{transition-delay:1500ms}
html.js .services-system.is-in li:nth-child(2) .service-marker__leader::after{transition-delay:1670ms}
html.js .services-system.is-in li:nth-child(3) .service-marker__leader::after{transition-delay:1840ms}
html.js .services-system.is-in li:nth-child(4) .service-marker__leader::after{transition-delay:2010ms}
/* A slow halo ripples from each node; the active marker's node pulses brighter. */
.service-marker__leader::before{content:"";position:absolute;left:-9.5px;bottom:-10px;width:20px;height:20px;border-radius:50%;border:1px solid rgba(166,127,214,.7);opacity:0;transform:scale(.4);pointer-events:none}
.service-marker[data-service="convert"] .service-marker__leader::before,.service-marker[data-service="prove"] .service-marker__leader::before{bottom:auto;top:-10px}
.services-system.is-in .service-marker__leader::before{animation:sysHalo 3.2s ease-out infinite}
.services-system.is-in li:nth-child(2) .service-marker__leader::before{animation-delay:.8s}
.services-system.is-in li:nth-child(3) .service-marker__leader::before{animation-delay:1.6s}
.services-system.is-in li:nth-child(4) .service-marker__leader::before{animation-delay:2.4s}
@keyframes sysHalo{0%{opacity:0;transform:scale(.4)}12%{opacity:.9}100%{opacity:0;transform:scale(2.2)}}
.services-system.is-in .service-marker.is-active .service-marker__leader::after{animation:sysNode 2.4s ease-in-out infinite}
@keyframes sysNode{0%,100%{box-shadow:0 0 8px rgba(166,127,214,.8)}50%{box-shadow:0 0 16px rgba(206,181,243,1)}}
/* The active field illuminates when it changes hands; the icon's accent dot blinks on. */
.service-marker.is-active{animation:sysField 900ms ease-out}
@keyframes sysField{0%{box-shadow:0 0 0 rgba(123,86,163,0)}40%{box-shadow:0 0 44px rgba(166,127,214,.32)}100%{box-shadow:0 0 32px rgba(123,86,163,.12)}}
.service-marker.is-active svg .dot{animation:sysDot 600ms ease-out}
@keyframes sysDot{0%{opacity:0;transform:scale(.3)}60%{opacity:1;transform:scale(1.5)}100%{transform:scale(1)}}
.service-marker svg .dot{transform-box:fill-box;transform-origin:center}
.service-marker:hover svg{stroke:var(--ame-glow);opacity:1}
@media (prefers-reduced-motion: reduce){
  .services-system *,.services-system *::before,.services-system *::after{animation:none !important;transition:none !important}
}

/* ---------- Sitewide type scale (Ryan, September 2026) ----------
   Every section heading (h2) is 32px on desktop and 28px on phones and every section description is 16px, on every page. Appended last
   in the build so it wins over the section stylesheets. The only exemption is the case-study figure headline
   ("From AUD $125 to AUD $46 per lead."), which is a mock-scaled numeral, and the footer column labels. */
h2:where(:not(.case-study-section h2)){font-size:32px !important;line-height:1.2 !important;letter-spacing:-.015em}
@media(max-width:767px){h2:where(:not(.case-study-section h2)){font-size:28px !important}}
p.lead,.lead,.hero-b2b .lead,.services-hero__lead,.lv-sub,.lv-desc,.ind-support,.proof-section__statement,.ways-to-work__intro,.pricing-section__intro,.case-study-section__intro,.buyer-faq__intro-copy,.fit-check__intro,.capabilities__support{font-size:16px !important;line-height:1.55 !important}
/* Every hero H1 sitewide is 60px (Ryan), and the two homepage headings that mimic it (proof statement, FAQ heading) follow. Phones scale down so nowrap hero lines cannot overflow. */
h1,.proof-section h2,.buyer-faq h2{font-size:60px !important;line-height:1.04 !important;letter-spacing:-.03em}
.case-study-proof h2{font-size:50px !important;line-height:1.06 !important;letter-spacing:-.03em}
.proof-section h2,.buyer-faq h2{font-weight:800}
@media(max-width:767px){h1,.proof-section h2,.buyer-faq h2{font-size:clamp(34px,9.5vw,60px) !important}.case-study-proof h2{font-size:clamp(32px,8.5vw,50px) !important}}

/* ---------- Sitewide section padding (Ryan, September 2026) ----------
   --section-pad (48px since October 2026, previously 70px) from every section edge to its first and last content, on every page. Sections whose mocks carry
   internal spacing (a bordered header, a sheet, an intro column) keep that geometry; their outer padding is
   reduced by the internal offset so the visible gap matches the token (padding cannot go below 0, so where an offset is larger than the token the gap is the offset). Offsets are the measured values at 1440. */
.commercial-levers{padding-top:var(--section-pad) !important;padding-bottom:calc(var(--section-pad) - 8px) !important}
.industries{padding-top:calc(var(--section-pad) - 1px) !important;padding-bottom:calc(var(--section-pad) - 12px) !important}
.proof-section{padding-top:var(--section-pad) !important;padding-bottom:var(--section-pad) !important}
.proof-section__content{padding-top:0 !important;padding-bottom:0 !important}
.ways-to-work{padding-top:calc(var(--section-pad) - 23px) !important;padding-bottom:calc(var(--section-pad) - 9px) !important}
.pricing-section{padding-top:calc(var(--section-pad) - 25px) !important;padding-bottom:var(--section-pad) !important}
.case-study-section{padding-top:calc(var(--section-pad) - 19px) !important;padding-bottom:calc(var(--section-pad) - 16px) !important}
.buyer-faq{padding-top:calc(var(--section-pad) - 40px) !important;padding-bottom:calc(var(--section-pad) - 34px) !important}
.fit-check{padding-top:var(--section-pad) !important;padding-bottom:var(--section-pad) !important}
.fit-check__inner{padding-top:0 !important;padding-bottom:0 !important}
.capabilities{padding-top:var(--section-pad) !important;padding-bottom:var(--section-pad) !important}
section.block{padding-top:var(--section-pad) !important;padding-bottom:var(--section-pad) !important}
.cta-band .wrap,.cta-band{padding-top:var(--section-pad) !important;padding-bottom:var(--section-pad) !important}
.cta-band .wrap{padding-top:0 !important;padding-bottom:0 !important}
.services-hero,.industries-hero,.method-hero{padding-bottom:var(--section-pad) !important}
.page-hero{padding-bottom:var(--section-pad) !important}

/* Phones: every section measured at 390px and brought back to the token (70px from the section edge to the
   first and last content), where a mock's internal spacing behaves differently from desktop. Heroes clear
   the fixed header by the same 96px on every page. */
@media(max-width:767px){
  .hero-b2b{padding-top:96px !important}
  .services-hero{padding-top:96px !important}
  .commercial-levers{padding-bottom:var(--section-pad) !important}
  .proof-section{padding-bottom:calc(var(--section-pad) - 42px) !important}
  .ways-to-work{padding-top:calc(var(--section-pad) - 57px) !important;padding-bottom:calc(var(--section-pad) - 14px) !important}
  .pricing-section{padding-top:calc(var(--section-pad) - 44px) !important}
  .case-study-section{padding-top:calc(var(--section-pad) - 14px) !important;padding-bottom:var(--section-pad) !important}
  .buyer-faq{padding-top:calc(var(--section-pad) - 59px) !important;padding-bottom:calc(var(--section-pad) - 48px) !important}
  .direct-answers{padding-top:calc(var(--section-pad) - 25px) !important;padding-bottom:calc(var(--section-pad) - 22px) !important}
}