/* Manrope + Prompt, self-hosted (SIL OFL 1.1), latin + latin-ext from Google Fonts */
/* Manrope 400 latin-ext */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/manrope-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* Manrope 400 latin */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/manrope-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* Manrope 500 latin-ext */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/manrope-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* Manrope 500 latin */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/manrope-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* Manrope 600 latin-ext */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/assets/fonts/manrope-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* Manrope 600 latin */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/assets/fonts/manrope-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* Manrope 700 latin-ext */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/assets/fonts/manrope-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* Manrope 700 latin */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/assets/fonts/manrope-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* Manrope 800 latin-ext */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url(/assets/fonts/manrope-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* Manrope 800 latin */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url(/assets/fonts/manrope-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* Prompt 500 latin-ext */
@font-face {
  font-family: 'Prompt';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/prompt-500-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* Prompt 500 latin */
@font-face {
  font-family: 'Prompt';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/prompt-500-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* Prompt 600 latin-ext */
@font-face {
  font-family: 'Prompt';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/assets/fonts/prompt-600-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* Prompt 600 latin */
@font-face {
  font-family: 'Prompt';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/assets/fonts/prompt-600-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* Prompt 700 latin-ext */
@font-face {
  font-family: 'Prompt';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/assets/fonts/prompt-700-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* Prompt 700 latin */
@font-face {
  font-family: 'Prompt';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/assets/fonts/prompt-700-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ============================================================
   HALE — Design System v2
   Recalibrated to the real Hale tokens:
   neutral black #0A0A0A · #F5F5F5 white · gold #D3A645 · dark-dominant
   ============================================================ */

:root {
  color-scheme: dark;   /* dark native scrollbars, form controls and pickers */
  --bg:        #0A0A0A;
  --bg-rgb:      10,10,10;
  --surface-rgb: 15,15,15;
  --gold-rgb:    222,167,109;   /* Honey */
  --surface:   #0F0F0F;
  --surface-2: #141414;
  --secondary: #1A1A1A;
  --muted:     #1F1F1F;

  --fg:        #F5F5F5;
  --fg-dim:    #BDBDBD;
  --fg-faint:  #8F8F8F;
  --field-border: #6E6E6E;

  --gold:        #FFD99E;   /* Hay: labels, numbers, lines, icons */
  --gold-bright: #FFE6C0;
  --gold-deep:   #DEA76D;   /* Honey: buttons */
  --gold-glow:   rgba(255,217,158,.12);

  --border:      #242424;
  --border-soft: rgba(245,245,245,0.07);
  --white:       #FAFAFA;

  --font-display: "Prompt", "Helvetica Neue", Arial, sans-serif;
  --font-body:    "Manrope", "Helvetica Neue", Arial, sans-serif;
  --font-mono:    "JetBrains Mono", ui-monospace, SFMono-Regular, monospace;

  --fs-display: clamp(2.85rem, 6.2vw, 5.6rem);
  --fs-h2:      clamp(2rem, 3.9vw, 3.3rem);
  --fs-h3:      clamp(1.3rem, 1.7vw, 1.55rem);
  --fs-lede:    clamp(1.15rem, 1.5vw, 1.4rem);
  --fs-body:    1.0625rem;
  --fs-sm:      0.9375rem;
  --fs-label:   0.72rem;

  --shell: 1200px;
  --gut: clamp(1.25rem, 4vw, 3.25rem);
  --sec-y: clamp(4.5rem, 9vw, 8rem);
  --radius: 0.5rem;
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
}

*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: 1.62;
  color: var(--fg);
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: hidden;
}
img, svg, video, canvas { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { font: inherit; cursor: pointer; }
::selection { background: var(--gold); color: var(--bg); }
:focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; border-radius: 2px; }

.shell { width: 100%; max-width: var(--shell); margin-inline: auto; padding-inline: var(--gut); }
.section { padding-block: var(--sec-y); position: relative; }
.section--tight { padding-block: clamp(3rem, 6vw, 5rem); }

.bg-base    { background: var(--bg); }
.bg-surface { background: var(--surface); }
.bg-raise   { background: var(--secondary); }
.section + .section.bg-base,
.section + .section.bg-surface { border-top: 1px solid var(--border); }

.display { font-family: var(--font-display); font-weight: 600; font-size: var(--fs-display); line-height: 0.98; letter-spacing: -0.01em; }
.h2 { font-family: var(--font-display); font-weight: 600; font-size: var(--fs-h2); line-height: 1.05; letter-spacing: -0.008em; max-width: 20ch; }
.h3 { font-family: var(--font-display); font-weight: 600; font-size: var(--fs-h3); line-height: 1.14; letter-spacing: -0.01em; }
.lede { font-size: var(--fs-lede); line-height: 1.5; color: var(--fg-dim); max-width: 46ch; }

.eyebrow { font-family: var(--font-body); font-weight: 700; font-size: var(--fs-label); letter-spacing: 0.15em; text-transform: uppercase; color: var(--gold); display: inline-flex; align-items: center; gap: 0.8em; }
.eyebrow::before { content: ""; width: 24px; height: 1px; background: var(--gold); opacity: 0.8; }
.gold { color: var(--gold); }

.waterline { display: flex; align-items: center; gap: 1rem; font-family: var(--font-body); font-weight: 700; font-size: var(--fs-label); letter-spacing: 0.2em; text-transform: uppercase; color: var(--fg-faint); }
.waterline::before { content: ""; flex: 1; height: 1px; background: var(--border); }
.waterline .gauge { color: var(--gold); }

.btn { display: inline-flex; align-items: center; gap: 0.6em; padding: 0.9em 1.55em; font-family: var(--font-body); font-weight: 700; font-size: 0.95rem; border-radius: var(--radius); border: 1px solid transparent; transition: transform .35s var(--ease), background .3s var(--ease), color .3s var(--ease), border-color .3s var(--ease); }
.btn .arw { transition: transform .35s var(--ease); }
.btn:hover .arw { transform: translateX(4px); }
.btn--primary { background: var(--gold-deep); color: var(--bg); }
.btn--primary:hover { background: var(--gold); }
.btn--ghost { background: transparent; color: var(--fg); border-color: var(--border); }
.btn--ghost:hover { border-color: var(--fg-dim); background: rgba(245,245,245,0.03); }

/* HEADER */
.site-header { position: fixed; inset: 0 0 auto 0; z-index: 60; transition: background .4s var(--ease), border-color .4s var(--ease), backdrop-filter .4s var(--ease); border-bottom: 1px solid transparent; }
.site-header.is-stuck { background: rgba(var(--bg-rgb),0.72); backdrop-filter: blur(14px) saturate(1.1); border-bottom-color: var(--border); }
.nav { display: flex; align-items: center; justify-content: space-between; gap: 2rem; height: 76px; }
.nav__brand img { height: 24px; width: auto; }
.nav__menu { display: flex; align-items: center; gap: clamp(1rem, 2.4vw, 2.1rem); list-style: none; padding: 0; }
.nav__menu a { font-weight: 500; font-size: 0.95rem; color: var(--fg-dim); transition: color .25s var(--ease); }
.nav__menu a:hover { color: var(--fg); }
.nav__actions { display: flex; align-items: center; gap: 1rem; }
.nav__toggle { display: none; }

/* HERO */
.hero { position: relative; min-height: 100svh; display: flex; align-items: center; padding-top: 120px; padding-bottom: clamp(2.5rem, 5vw, 4.5rem); overflow: hidden; isolation: isolate; background: var(--bg); }
#hero-particles { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; }
.hero__glow { position: absolute; inset: 0; z-index: -1; pointer-events: none; background: radial-gradient(60% 50% at 50% 42%, var(--gold-glow), transparent 70%), linear-gradient(180deg, transparent 60%, var(--bg) 100%); }
.hero__inner { width: 100%; text-align: center; display: flex; flex-direction: column; align-items: center; }
.hero__eyebrow { margin-bottom: 1.8rem; }
.hero h1 { font-family: var(--font-display); font-weight: 600; font-size: var(--fs-display); line-height: 0.98; letter-spacing: -0.01em; max-width: 18ch; margin-bottom: 1.6rem; text-wrap: balance; }
.hero__category { font-size: var(--fs-lede); line-height: 1.45; color: var(--fg-dim); max-width: 44ch; margin-bottom: 1.6rem; }
.hero__category b { color: var(--fg); font-weight: 500; }
.hero__cluster { max-width: 56ch; margin-bottom: 2.4rem; }
.hero__cluster p { color: var(--fg-dim); margin-bottom: 0.9rem; }
.hero__cluster p strong { color: var(--fg); font-weight: 500; }
.hero__cta { display: flex; flex-wrap: wrap; gap: 0.9rem; justify-content: center; margin-bottom: 3.2rem; }
.hero__trust { width: 100%; border-top: 1px solid var(--border); padding-top: 1.8rem; }
.hero__trust p { font-family: var(--font-body); font-size: 0.72rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--fg-faint); margin-bottom: 1.3rem; }
.logos { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: clamp(1.1rem, 3vw, 2.8rem); list-style: none; padding: 0; }
.logos li { font-family: var(--font-display); font-weight: 600; font-size: clamp(0.9rem, 1.1vw, 1.05rem); letter-spacing: -0.01em; color: var(--fg-dim); opacity: 0.7; transition: opacity .3s var(--ease), color .3s var(--ease); }
.logos li:hover { opacity: 1; color: var(--fg); }

/* PRESSURE */
.pressure__grid { display: grid; grid-template-columns: 1fr; gap: clamp(2rem, 5vw, 4rem); }
@media (min-width: 900px) { .pressure__grid { grid-template-columns: 0.9fr 1.1fr; align-items: start; } }
.pressure__list { display: grid; gap: 0; }
.pressure__item { padding: 1.5rem 0 1.5rem 1.7rem; border-top: 1px solid var(--border); position: relative; }
.pressure__item:last-child { border-bottom: 1px solid var(--border); }
.pressure__item::before { content: ""; position: absolute; left: 0; top: 2.05rem; width: 9px; height: 9px; border: 1.5px solid var(--gold); border-radius: 50%; }
.pressure__item p { color: var(--fg-dim); }
.pressure__item p b { color: var(--fg); font-weight: 500; }
.pressure__root { margin-top: 2rem; font-family: var(--font-display); font-weight: 600; font-size: clamp(1.4rem, 2.2vw, 2rem); line-height: 1.2; letter-spacing: -0.01em; color: var(--fg); max-width: 22ch; }
.pressure__root span { color: var(--gold); }

/* MECHANISM */
.mechanism { overflow: hidden; }
.mechanism__media { position: absolute; inset: 0; z-index: 0; opacity: 0.45; display: flex; align-items: center; justify-content: center; pointer-events: none; }
.mechanism__media img { width: 130%; max-width: none; mix-blend-mode: screen; }
.mechanism__inner { position: relative; z-index: 1; }
.mechanism__body { max-width: 54ch; }
.mechanism__body p { color: var(--fg-dim); margin-top: 1.3rem; font-size: var(--fs-lede); }
.mechanism__body p strong { color: var(--fg); font-weight: 500; }
.mechanism__kicker { margin-top: 2.4rem; font-family: var(--font-display); font-weight: 600; font-size: clamp(1.2rem, 1.9vw, 1.6rem); line-height: 1.25; color: var(--fg); max-width: 26ch; }
.mechanism__kicker span { color: var(--gold); }

/* AUDIENCE */
.aud__head { max-width: var(--shell); margin-bottom: clamp(2.5rem, 5vw, 4rem); }
.aud__grid { display: grid; gap: 1px; background: var(--border); border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; }
@media (min-width: 860px) { .aud__grid { grid-template-columns: repeat(3, 1fr); } }
.aud__card { background: var(--surface); padding: clamp(1.8rem, 2.6vw, 2.6rem); border-top: 2px solid var(--gold); transition: background .4s var(--ease); }
.aud__card:hover { background: var(--secondary); }
.aud__card h3 { margin: 0 0 0.9rem; max-width: 18ch; }
.aud__card p { color: var(--fg-dim); font-size: var(--fs-sm); }

/* SERVICES */
.svc__head { display: grid; gap: 1.5rem; margin-bottom: clamp(2.5rem, 5vw, 3.8rem); }
@media (min-width: 900px) { .svc__head { grid-template-columns: 1.1fr 0.9fr; align-items: end; } }
.svc__list { display: grid; gap: 0; }
.svc__row { display: grid; grid-template-columns: auto 1fr; gap: clamp(1rem, 3vw, 3rem); align-items: baseline; padding-block: clamp(1.5rem, 2.6vw, 2.1rem); border-top: 1px solid var(--border); transition: padding-left .4s var(--ease), background .3s var(--ease); }
.svc__row:last-child { border-bottom: 1px solid var(--border); }
.svc__row:hover { padding-left: 0.7rem; }
.svc__row .k { font-family: var(--font-display); font-weight: 600; font-size: clamp(1.2rem, 1.7vw, 1.55rem); letter-spacing: -0.01em; color: var(--fg); min-width: clamp(9rem, 16vw, 15rem); transition: color .3s var(--ease); }
.svc__row:hover .k { color: var(--gold); }
.svc__row .v { color: var(--fg-dim); max-width: 56ch; }

/* MODEL */
.model { overflow: hidden; }
.model__head { max-width: 40ch; margin-bottom: clamp(2.5rem, 5vw, 4rem); }
.model__grid { display: grid; gap: clamp(2rem, 4vw, 3rem); align-items: center; }
@media (min-width: 960px) { .model__grid { grid-template-columns: 1fr 0.85fr; } }
.model__steps { display: grid; gap: 0; }
.model__step { display: grid; grid-template-columns: auto 1fr; gap: 1.4rem; padding-block: 1.35rem; border-top: 1px solid var(--border); }
.model__step:last-child { border-bottom: 1px solid var(--border); }
.model__step .n { font-family: var(--font-body); font-weight: 500; font-size: 0.95rem; color: var(--gold); width: 2rem; padding-top: 0.3rem; }
.model__step h3 { font-size: 1.2rem; margin-bottom: 0.35rem; }
.model__step p { color: var(--fg-dim); font-size: var(--fs-sm); max-width: 46ch; }
.model__viz { position: relative; display: flex; align-items: center; justify-content: center; min-height: 320px; }
.model__viz img { width: 100%; max-width: 460px; mix-blend-mode: screen; opacity: 0.95; }
.model__viz::after { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at center, var(--gold-glow), transparent 62%); pointer-events: none; }

/* TEAM */
.team { overflow: hidden; }
.team__grid { display: grid; gap: clamp(2rem, 5vw, 4rem); }
@media (min-width: 900px) { .team__grid { grid-template-columns: 1fr 1fr; align-items: center; } }
.team__body p { color: var(--fg-dim); margin-top: 1.3rem; max-width: 48ch; }
.team__body p strong { color: var(--fg); font-weight: 500; }
.team__pts { list-style: none; padding: 0; margin-top: 2rem; display: grid; gap: 0; }
.team__pts li { padding: 0.95rem 0 0.95rem 1.9rem; border-top: 1px solid var(--border); position: relative; color: var(--fg-dim); font-size: var(--fs-sm); }
.team__pts li:last-child { border-bottom: 1px solid var(--border); }
.team__pts li::before { content: ""; position: absolute; left: 0; top: 1.35rem; width: 9px; height: 9px; border: 1.5px solid var(--gold); border-radius: 50%; }
.team__viz { position: relative; min-height: 340px; display: flex; align-items: center; justify-content: center; }
.team__viz img { width: 100%; mix-blend-mode: screen; opacity: 0.92; }

/* PROOF */
.proof__head { max-width: 42ch; margin-bottom: clamp(2.5rem, 5vw, 3.5rem); }
.proof__clients { display: grid; gap: 1px; background: var(--border); border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; margin-bottom: clamp(2rem, 4vw, 3rem); }
@media (min-width: 760px) { .proof__clients { grid-template-columns: repeat(2, 1fr); } }
.proof__client { background: var(--surface); padding: clamp(1.6rem, 2.4vw, 2.3rem); }
.proof__client h3 { font-size: 1.25rem; margin-bottom: 0.7rem; }
.proof__client p { color: var(--fg-dim); font-size: var(--fs-sm); max-width: 48ch; }
.proof__results { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1px; background: var(--border); border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; }
@media (min-width: 760px) { .proof__results { grid-template-columns: repeat(3, 1fr); } }
.proof__stat { background: var(--surface); padding: clamp(1.4rem, 2.2vw, 2rem); }
.proof__stat .big { font-family: var(--font-display); font-weight: 600; font-size: clamp(2rem, 3vw, 2.7rem); color: var(--gold); letter-spacing: -0.01em; line-height: 1; }
.proof__stat .lbl { margin-top: 0.6rem; color: var(--fg-dim); font-size: var(--fs-sm); }

/* AUDIT */
.audit { overflow: hidden; }

.audit__scrim { position: absolute; inset: 0; z-index: 0; background: linear-gradient(180deg, var(--bg) 0%, rgba(var(--bg-rgb),0.72) 100%); }
.audit__inner { position: relative; z-index: 1; }
.audit__head { max-width: 52ch; margin-bottom: clamp(2.5rem, 5vw, 3.5rem); }
.audit__head p { color: var(--fg-dim); margin-top: 1.3rem; font-size: var(--fs-lede); }
.audit__cols { display: grid; gap: clamp(1.5rem, 4vw, 3rem); }
@media (min-width: 820px) { .audit__cols { grid-template-columns: 1fr 1fr; } }
.audit__col { background: rgba(var(--surface-rgb),0.7); border: 1px solid var(--border); border-radius: var(--radius); padding: clamp(1.6rem, 2.6vw, 2.4rem); backdrop-filter: blur(2px); }
.audit__col h3 { margin-bottom: 1.2rem; font-size: 1.15rem; }
.audit__col ul { list-style: none; padding: 0; display: grid; gap: 0.75rem; }
.audit__col li { color: var(--fg-dim); font-size: var(--fs-sm); padding-left: 1.4rem; position: relative; }
.audit__col li::before { content: ""; position: absolute; left: 0; top: 0.62em; width: 6px; height: 6px; background: var(--gold); border-radius: 50%; }
.audit__cta { margin-top: clamp(2rem, 4vw, 3rem); }

/* CLOSE + FOOTER */
.close__inner { max-width: 42ch; margin-inline: auto; text-align: center; }
.close h2 { margin: 0 auto 1.4rem; }
.close p { color: var(--fg-dim); font-size: var(--fs-lede); margin-bottom: 2rem; }
.close p strong { color: var(--fg); font-weight: 500; }
.close__cta { display: flex; flex-wrap: wrap; gap: 0.9rem; justify-content: center; }

.site-footer { background: var(--bg); padding-block: clamp(3.5rem, 7vw, 6rem) 2.5rem; border-top: 1px solid var(--border); }
.footer__top { display: grid; gap: clamp(2.5rem, 5vw, 4rem); padding-bottom: clamp(2.5rem, 5vw, 4rem); border-bottom: 1px solid var(--border); }
@media (min-width: 900px) { .footer__top { grid-template-columns: 1.3fr 1fr; align-items: end; } }
.footer__cta-head { font-family: var(--font-display); font-weight: 600; font-size: clamp(1.8rem, 3.4vw, 2.7rem); line-height: 1.06; letter-spacing: -0.008em; max-width: 18ch; }
.footer__nav { display: grid; grid-template-columns: repeat(2, 1fr); gap: 2rem 1rem; margin-block: clamp(2.5rem, 5vw, 3.5rem); }
@media (min-width: 620px) { .footer__nav { grid-template-columns: repeat(4, 1fr); } }
.footer__col h4 { font-family: var(--font-body); font-weight: 500; font-size: var(--fs-label); letter-spacing: 0.18em; text-transform: uppercase; color: var(--fg-faint); margin-bottom: 1.1rem; }
.footer__col ul { list-style: none; padding: 0; display: grid; gap: 0.6rem; }
.footer__col a { color: var(--fg-dim); font-size: var(--fs-sm); transition: color .25s var(--ease); }
.footer__col a:hover { color: var(--fg); }
.footer__bottom { display: flex; flex-wrap: wrap; gap: 1rem; align-items: center; justify-content: space-between; }
.footer__bottom img { height: 22px; }
.footer__bottom .fine { color: var(--fg-faint); font-size: var(--fs-sm); font-family: var(--font-body); letter-spacing: 0.04em; }

/* REVEAL */
.reveal-ready .reveal { opacity: 0; transform: translateY(22px); transition: opacity .8s var(--ease), transform .8s var(--ease); }
.reveal-ready .reveal.is-in { opacity: 1; transform: none; }
[data-stagger] > * { transition-delay: calc(var(--i, 0) * 70ms); }
.no-js .reveal { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .reveal { opacity: 1 !important; transform: none !important; transition: none; } }

/* MOBILE NAV */
@media (max-width: 860px) {
  .nav__menu, .nav__actions .btn { display: none; }
  .nav__toggle { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; background: transparent; border: 1px solid var(--border); border-radius: var(--radius); }
  .nav__toggle span, .nav__toggle span::before, .nav__toggle span::after { content: ""; display: block; width: 20px; height: 1.5px; background: var(--fg); transition: transform .3s var(--ease), opacity .3s var(--ease); }
  .nav__toggle span { position: relative; }
  .nav__toggle span::before { position: absolute; top: -6px; }
  .nav__toggle span::after { position: absolute; top: 6px; }
  .site-header.is-open .nav__toggle span { background: transparent; }
  .site-header.is-open .nav__toggle span::before { transform: translateY(6px) rotate(45deg); }
  .site-header.is-open .nav__toggle span::after { transform: translateY(-6px) rotate(-45deg); }
  .mobile-menu { position: fixed; inset: 76px 0 auto 0; z-index: 55; background: rgba(var(--bg-rgb),0.97); backdrop-filter: blur(14px); border-bottom: 1px solid var(--border); padding: 1.5rem var(--gut) 2.2rem; display: grid; gap: 0.4rem; transform: translateY(-8px); opacity: 0; pointer-events: none; transition: opacity .3s var(--ease), transform .3s var(--ease); }
  .site-header.is-open .mobile-menu { opacity: 1; transform: none; pointer-events: auto; }
  .mobile-menu a { padding: 0.8rem 0; font-family: var(--font-display); font-size: 1.4rem; border-bottom: 1px solid var(--border); }
  .mobile-menu .btn { margin-top: 1.2rem; justify-content: center; }
}
@media (min-width: 861px) { .mobile-menu { display: none; } }

/* ============================================================
   v3 additions — reference alignment
   ============================================================ */
:root { --font-serif: "Prompt", "Helvetica Neue", Arial, sans-serif; }

/* Logo marquee */
.marquee-band { padding-block: clamp(2.5rem, 5vw, 3.2rem); border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); overflow: hidden; }
.marquee-band > p { text-align: center; font-family: var(--font-body); font-weight: 700; font-size: var(--fs-label); letter-spacing: 0.15em; text-transform: uppercase; color: var(--fg-dim); max-width: 60ch; margin: 0 auto 2rem; padding-inline: var(--gut); }
.marquee { position: relative; width: 100%; overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); }
.marquee__track { display: flex; width: max-content; gap: clamp(2.5rem, 6vw, 5rem); animation: marquee 38s linear infinite; }
.marquee__track span { font-family: var(--font-display); font-weight: 600; font-size: clamp(1.1rem, 1.6vw, 1.5rem); letter-spacing: -0.01em; color: var(--fg-dim); white-space: nowrap; opacity: 0.72; }
@keyframes marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .marquee__track { animation: none; flex-wrap: wrap; justify-content: center; } }

/* Section background texture layer */
.bg-layer { position: absolute; inset: 0; z-index: 0; background-size: cover; background-position: center; pointer-events: none; }
.bg-layer + * { position: relative; z-index: 1; }
.has-layer { position: relative; overflow: hidden; }

/* Gold final-CTA section */
.gold-cta { position: relative; background: var(--gold); color: var(--bg); text-align: center; overflow: hidden; }
.gold-cta__glow { position: absolute; inset: 0; z-index: 0; pointer-events: none; background: radial-gradient(circle at 50% 45%, hsl(41 85% 72% / 0.85) 0%, transparent 55%); animation: goldpulse 5s ease-in-out infinite; }
@keyframes goldpulse { 0%,100% { opacity: 0.5; transform: scale(1); } 50% { opacity: 0.9; transform: scale(1.08); } }
@media (prefers-reduced-motion: reduce) { .gold-cta__glow { animation: none; } }
.gold-cta__inner { position: relative; z-index: 1; max-width: 46ch; margin-inline: auto; }
.gold-cta .eyebrow { color: rgba(var(--bg-rgb),0.55); }
.gold-cta .eyebrow::before { background: rgba(var(--bg-rgb),0.4); }
.gold-cta h2 { font-family: var(--font-serif); font-weight: 600; font-size: clamp(2.4rem, 5.5vw, 4.6rem); line-height: 0.98; letter-spacing: -0.01em; color: var(--bg); margin-bottom: 1.6rem; text-wrap: balance; }
.gold-cta p { font-size: var(--fs-lede); color: rgba(var(--bg-rgb),0.72); margin-bottom: 2.4rem; margin-inline: auto; max-width: 44ch; }
.gold-cta .btn--dark { background: var(--bg); color: var(--gold); }
.gold-cta .btn--dark:hover { background: #1A1A1A; }
.gold-cta .btn--outline { background: transparent; color: var(--bg); border-color: rgba(var(--bg-rgb),0.35); }
.gold-cta .btn--outline:hover { border-color: var(--bg); }
.gold-cta__cta { display: flex; flex-wrap: wrap; gap: 0.9rem; justify-content: center; }

/* Pre-footer band */
.prefooter { border-top: 1px solid var(--border); background: var(--surface); padding-block: clamp(2.5rem, 5vw, 4rem); }
.prefooter__inner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1.5rem; }
.prefooter__inner p { font-family: var(--font-display); font-weight: 600; font-size: clamp(1.3rem, 2.2vw, 1.9rem); letter-spacing: -0.015em; color: var(--fg); max-width: 24ch; }

/* Pressure viz + fix viz (brand animations) */
.viz-wrap { position: relative; display: flex; align-items: center; justify-content: center; min-height: 300px; }
.viz-wrap::before { content: ""; position: absolute; inset: 12%; background: radial-gradient(circle, var(--gold-glow), transparent 65%); filter: blur(30px); }
.viz-wrap img { position: relative; width: 100%; max-width: 460px; mix-blend-mode: screen; }

/* ============================================================
   INTERIOR PAGES — shared system
   ============================================================ */
.shell--narrow { max-width: 900px; }

/* Page hero (interior) */
.page-hero { position: relative; padding-top: 150px; padding-bottom: clamp(3rem, 6vw, 5rem); overflow: hidden; border-bottom: 1px solid var(--border); }
.page-hero__glow { position: absolute; inset: 0; z-index: 0; pointer-events: none; background: radial-gradient(70% 60% at 50% 0%, var(--gold-glow), transparent 70%); }
.page-hero__inner { position: relative; z-index: 1; max-width: var(--shell); }
.page-hero h1 { max-width: 18ch; }
.page-hero h1 { font-family: var(--font-display); font-weight: 600; font-size: clamp(2.4rem, 5vw, 4.2rem); line-height: 1; letter-spacing: -0.01em; margin: 1.4rem 0; text-wrap: balance; }
.page-hero__sub { font-size: var(--fs-lede); line-height: 1.5; color: var(--fg-dim); max-width: 54ch; }
.page-hero__cta { display: flex; flex-wrap: wrap; gap: 0.9rem; margin-top: 2.2rem; }

/* Section header block */
.sec-head { margin-bottom: clamp(2rem, 4vw, 3rem); }
.sec-head h2 { font-family: var(--font-display); font-weight: 600; font-size: var(--fs-h2); line-height: 1.05; letter-spacing: -0.008em; max-width: 22ch; margin-top: 0.9rem; }
.sec-head p { color: var(--fg-dim); margin-top: 1.1rem; max-width: 60ch; font-size: var(--fs-lede); line-height: 1.5; }
.prose { color: var(--fg-dim); font-size: var(--fs-lede); line-height: 1.6; max-width: 62ch; display: grid; gap: 1.1rem; }
.prose strong { color: var(--fg); font-weight: 500; }

/* Pills */
.pill { display: inline-block; font-family: var(--font-body); font-weight: 500; font-size: 0.8rem; padding: 0.35em 0.85em; border-radius: 999px; background: rgba(var(--gold-rgb),0.1); color: var(--gold); }
.pill--muted { background: var(--secondary); color: var(--fg-dim); border: 1px solid var(--border); }

/* Generic card */
.card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: clamp(1.5rem, 2.4vw, 2rem); transition: border-color .3s var(--ease), background .3s var(--ease); }
a.card:hover { border-color: rgba(var(--gold-rgb),0.5); }
.card h3 { font-size: 1.15rem; margin-bottom: 0.6rem; }
.card p { color: var(--fg-dim); font-size: var(--fs-sm); }

/* Card grids */
.grid-2 { display: grid; gap: 1rem; }
.grid-3 { display: grid; gap: 1rem; }
@media (min-width: 720px) { .grid-2 { grid-template-columns: repeat(2,1fr); } .grid-3 { grid-template-columns: repeat(2,1fr); } }
@media (min-width: 980px) { .grid-3 { grid-template-columns: repeat(3,1fr); } }

/* Service hub cards */
.svc-card { display: flex; flex-direction: column; height: 100%; }
.svc-card .eyebrow { margin-bottom: 1rem; }
.svc-card h3 { font-family: var(--font-display); font-weight: 600; font-size: 1.3rem; letter-spacing: -0.01em; margin-bottom: 0.7rem; }
.svc-card p { color: var(--fg-dim); font-size: var(--fs-sm); flex: 1; }
.svc-card .go { margin-top: 1.3rem; display: inline-flex; align-items: center; gap: 0.5em; font-weight: 700; font-size: 0.9rem; color: var(--gold); }
.svc-card:hover .go .arw { transform: translateX(4px); }
.go .arw { transition: transform .3s var(--ease); }

/* Channel / feature list (title + desc rows) */
.feature-list { display: grid; gap: 0; }
.feature-row { padding: 1.3rem 0; border-top: 1px solid var(--border); display: grid; grid-template-columns: 1fr; gap: 0.3rem; }
@media (min-width: 720px) { .feature-row { grid-template-columns: 15rem 1fr; gap: 1.5rem; } }
.feature-row:last-child { border-bottom: 1px solid var(--border); }
.feature-row .ft { font-family: var(--font-display); font-weight: 600; font-size: 1.05rem; color: var(--fg); }
.feature-row .fd { color: var(--fg-dim); font-size: var(--fs-sm); }

/* Problem list (check/dot rows) */
.check-list { display: grid; gap: 1rem; }
.check-list li { list-style: none; display: grid; grid-template-columns: auto 1fr; gap: 0.85rem; align-items: start; }
.check-list li .ico { width: 20px; height: 20px; flex-shrink: 0; margin-top: 0.15rem; color: var(--gold); }
.check-list li p { color: var(--fg-dim); }
.check-list li p strong, .check-list li p b { color: var(--fg); font-weight: 500; }

/* Numbered process steps */
.steps { display: grid; gap: 1.6rem; }
.steps li { list-style: none; display: grid; grid-template-columns: auto 1fr; gap: 1.3rem; align-items: start; }
.steps .num { width: 2.5rem; height: 2.5rem; border-radius: 999px; background: var(--gold); color: var(--bg); display: flex; align-items: center; justify-content: center; font-family: var(--font-display); font-weight: 600; flex-shrink: 0; }
.steps h3 { font-size: 1.15rem; margin-bottom: 0.3rem; }
.steps p { color: var(--fg-dim); font-size: var(--fs-sm); }

/* Related services grid */
.related-grid { display: grid; gap: 1rem; }
@media (min-width: 720px) { .related-grid { grid-template-columns: repeat(2,1fr); } }
.related-grid a { display: block; }
.related-grid .eyebrow { margin-bottom: 0.7rem; }
.related-grid h4 { font-family: var(--font-display); font-weight: 600; font-size: 1.1rem; }
.related-grid p { color: var(--fg-dim); font-size: var(--fs-sm); margin-top: 0.3rem; }

/* FAQ accordion */
.faq { display: grid; gap: 0; border-top: 1px solid var(--border); }
.faq details { border-bottom: 1px solid var(--border); }
.faq summary { cursor: pointer; list-style: none; padding: 1.35rem 2.5rem 1.35rem 0; position: relative; font-family: var(--font-display); font-weight: 600; font-size: 1.08rem; letter-spacing: -0.01em; color: var(--fg); }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; position: absolute; right: 0.4rem; top: 1.2rem; font-size: 1.5rem; color: var(--gold); transition: transform .3s var(--ease); font-family: var(--font-body); font-weight: 400; }
.faq details[open] summary::after { transform: rotate(45deg); }
.faq .faq__a { padding: 0 2.5rem 1.5rem 0; color: var(--fg-dim); font-size: var(--fs-sm); line-height: 1.6; }

/* CTA band */
.cta-band { border-top: 1px solid var(--border); text-align: center; }
.cta-band__inner { max-width: 44ch; margin-inline: auto; }
.cta-band h2 { font-family: var(--font-display); font-weight: 600; font-size: clamp(1.9rem, 3.6vw, 3rem); line-height: 1.05; letter-spacing: -0.008em; margin-bottom: 1.2rem; }
.cta-band p { color: var(--fg-dim); font-size: var(--fs-lede); margin-bottom: 2rem; }
.cta-band__cta { display: flex; flex-wrap: wrap; gap: 0.9rem; justify-content: center; }

/* Breadcrumb */
.crumb { font-family: var(--font-body); font-size: 0.85rem; color: var(--fg-faint); margin-bottom: 0.5rem; }
.crumb a { color: var(--fg-dim); } .crumb a:hover { color: var(--gold); }

/* Hero video (brand Landing animation) */
.hero__video { position: absolute; inset: 0; z-index: -3; width: 100%; height: 100%; object-fit: cover; }
.hero .hero__scrim { position: absolute; inset: 0; z-index: -2; background: linear-gradient(180deg, rgba(var(--bg-rgb),0.55) 0%, rgba(var(--bg-rgb),0.32) 42%, rgba(var(--bg-rgb),0.86) 100%); }
.hero .hero__glow { z-index: -1; }
@media (prefers-reduced-motion: reduce) { .hero__video { display: none; } }

/* Logo marquee — image logos */
.marquee__track img { height: 30px; width: auto; opacity: 0.6; transition: opacity .3s var(--ease); flex-shrink: 0; }
.marquee__track img:hover { opacity: 1; }
.marquee__track { align-items: center; }
.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; }

/* ---- Generative canvas backgrounds ---- */
.fx-host { position: relative; overflow: hidden; }
.fx-bg { position: absolute; inset: 0; z-index: 0; width: 100%; height: 100%; pointer-events: none; }
.fx-host > .shell { position: relative; z-index: 1; }
.hero .fx-bg { z-index: -3; }
.gold-cta .fx-bg { z-index: 0; }
.gold-cta .gold-cta__inner { position: relative; z-index: 2; }
.gold-cta .gold-cta__glow { z-index: 1; }
/* single-column section content that used to be two-column viz layouts */
.section-solo { max-width: 62ch; }

/* ---- Signature SVG animations + section textures ---- */
.fx-svg { width: 100%; max-width: 460px; height: auto; }
.split { display: grid; gap: clamp(2rem, 5vw, 4rem); align-items: center; }
@media (min-width: 900px) { .split { grid-template-columns: 1fr 1fr; } .split--textfirst { grid-template-columns: 1.05fr 0.95fr; } }
.split .viz { display: flex; align-items: center; justify-content: center; }

/* GrowthChart draw (on reveal) — exact Base44 timing */
.reveal-ready .gc .gc-grey, .reveal-ready .gc .gc-gold { stroke-dasharray: 1; stroke-dashoffset: 1; }
.gc .gc-gold { filter: drop-shadow(0 0 8px hsl(41 62% 55% / 0.6)); }
.gc .gc-arrow { filter: drop-shadow(0 0 6px hsl(41 62% 55% / 0.6)); }
.gc .gc-dot { filter: drop-shadow(0 0 8px hsl(41 62% 55% / 0.7)); }
.reveal-ready .gc .gc-area, .reveal-ready .gc .gc-arrow { opacity: 0; }
.reveal-ready .gc .gc-node { opacity: 0; transform: scale(0); transform-box: view-box; transform-origin: 310px 122px; }
.reveal.is-in .gc .gc-grey  { animation: gcDraw 1.4s cubic-bezier(.25,.4,.25,1) forwards; }
.reveal.is-in .gc .gc-gold  { animation: gcDraw 1.2s cubic-bezier(.25,.4,.25,1) 1.5s forwards; }
.reveal.is-in .gc .gc-area  { animation: gcArea 0.8s ease 1.6s forwards; }
.reveal.is-in .gc .gc-arrow { animation: gcFade 0.4s ease 2.6s forwards; }
.reveal.is-in .gc .gc-node  { animation: gcPop 0.5s ease 1.3s forwards; }
.reveal.is-in .gc .gc-pulse { animation: gcPulse 2s ease-out infinite; }
@keyframes gcDraw { to { stroke-dashoffset: 0; } }
@keyframes gcArea { to { opacity: 0.15; } }
@keyframes gcFade { to { opacity: 1; } }
@keyframes gcPop { to { opacity: 1; transform: scale(1); } }
@keyframes gcPulse { 0% { r: 10; opacity: .6; } 100% { r: 20; opacity: 0; } }

/* ExperienceNetwork */
.en-glow { animation: enPulse 4.5s ease-in-out infinite; transform-origin: center; transform-box: fill-box; }
.en-dot { animation-name: enTwinkle; animation-iteration-count: infinite; animation-timing-function: ease-in-out; }
@keyframes enPulse { 0%,100% { opacity: .12; } 50% { opacity: .32; } }
@keyframes enTwinkle { 0%,100% { opacity: .35; } 50% { opacity: 1; } }

@media (prefers-reduced-motion: reduce) {
  .gc .gc-grey, .gc .gc-gold { stroke-dashoffset: 0 !important; animation: none; }
  .gc .gc-arrow, .gc .gc-node { opacity: 1 !important; transform: none !important; animation: none; }
  .gc .gc-area { opacity: .15 !important; animation: none; }
  .gc .gc-pulse { animation: none; opacity: 0; }
  .en-glow, .en-dot { animation: none; opacity: .6; }
}

/* Section textures (subtle, full-bleed) */
.tex-bg { position: absolute; inset: 0; z-index: 0; background-size: cover; background-position: center; pointer-events: none; }
.tex-wood { background-image: url("../assets/img/wood.jpg"); opacity: .20; }
.tex-marble { background-image: url("../assets/img/marble.jpg"); opacity: .15; }
.tex-storm { background-image: url("../assets/img/clouds.jpg"); opacity: .30; }
.tex-scrim { position: absolute; inset: 0; z-index: 0; background: linear-gradient(180deg, rgba(var(--bg-rgb),.5) 0%, rgba(var(--bg-rgb),.86) 100%); pointer-events: none; }
.warm-glow { position: absolute; inset: 0; z-index: 0; pointer-events: none; background: radial-gradient(55% 45% at 45% 42%, rgba(178,64,32,0.14), transparent 68%); }

/* Streamline wave field (services) */
.streamline { position: absolute; inset: 0; z-index: 0; width: 100%; height: 100%; opacity: .5; }
.sl-drift { animation: slDrift 26s ease-in-out infinite alternate; transform-origin: center; }
@keyframes slDrift { from { transform: translateX(-2.5%) scaleY(1); } to { transform: translateX(2.5%) scaleY(1.04); } }
@media (prefers-reduced-motion: reduce) { .sl-drift { animation: none; } }

/* Industries hub cards */
.ind-grid { display: grid; gap: 1rem; grid-template-columns: 1fr; }
@media (min-width: 720px) { .ind-grid { grid-template-columns: 1fr 1fr; } }
.ind-card { display: flex; flex-direction: column; gap: .75rem; text-decoration: none; }
.ind-card h3 { color: var(--gold); }
.ind-card__clients { font-size: .82rem; color: var(--fg-dim); margin-top: auto; }
.ind-card__clients span { color: var(--fg); font-weight: 700; }
.ind-card__cta { font-size: .8rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--fg); }

/* Team bios */
.bios { display: grid; gap: 1rem; grid-template-columns: 1fr; }
@media (min-width: 760px) { .bios { grid-template-columns: 1fr 1fr; } }
.bio { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 1.75rem; }
.bio__name { font-family: var(--font-display); font-size: 1.35rem; }
.bio__role { color: var(--gold); font-weight: 700; font-size: .85rem; letter-spacing: .04em; text-transform: uppercase; margin: .35rem 0 1rem; }
.bio__text { color: var(--fg-dim); font-size: .95rem; line-height: 1.6; }
.bio__text + .bio__text { margin-top: .75rem; }
.bio__links { margin-top: 1rem; display: flex; flex-wrap: wrap; gap: .75rem; font-size: .82rem; }
.bio__links a { color: var(--fg); font-weight: 600; }

/* Contact form */
.contact-grid { display: grid; gap: clamp(2rem,5vw,4rem); grid-template-columns: 1fr; align-items: start; }
@media (min-width: 900px) { .contact-grid { grid-template-columns: 0.95fr 1.05fr; } }
.contact-intro { display: grid; gap: clamp(1.6rem,3vw,2.2rem); align-content: start; }
.contact-intro .contact-info { margin-top: .4rem; padding-top: 1.6rem; border-top: 1px solid var(--border); }
.contact-form-wrap { border: 1px solid var(--border); border-radius: var(--radius-lg,20px); background: rgba(var(--surface-rgb),.5); backdrop-filter: blur(6px); padding: clamp(1.6rem,3.5vw,2.6rem); }
.contact-intro .sec-head h2 { font-size: clamp(1.35rem, 2.2vw, 1.75rem); line-height: 1.18; max-width: 18ch; }
.page-hero--tight { padding-bottom: clamp(1.4rem, 2.6vw, 2.2rem); }
.contact-body { padding-top: clamp(1.25rem, 2.4vw, 2rem); }

/* About: team cards with headshots */
.team-card { display: flex; align-items: center; gap: 1.1rem; }
.team-card__photo { width: 72px; height: 72px; border-radius: 50%; object-fit: cover; flex-shrink: 0; border: 1px solid var(--border); background: var(--secondary); }
/* About: "Our Experience" logo band — compact header like the homepage */
.marquee-band .sec-head { margin-bottom: clamp(1.4rem,3vw,2rem); }
.marquee-band .sec-head h2 { font-size: clamp(1.3rem, 2vw, 1.65rem); line-height: 1.2; letter-spacing: 0; }

/* Team page: bio headshots */
.bio__head { display: flex; align-items: center; gap: 1rem; margin-bottom: 1.1rem; }
.bio__photo { width: 66px; height: 66px; border-radius: 50%; object-fit: cover; flex-shrink: 0; border: 1px solid var(--border); background: var(--secondary); }
.bio__head .bio__name { font-size: 1.25rem; }
.bio__head .bio__role { margin: .2rem 0 0; }

/* About: tabbed intro section */
.tabs { position: relative; z-index: 1; }
.tabs__nav { display: flex; flex-wrap: wrap; gap: 0 clamp(1.4rem,3vw,2.4rem); border-bottom: 1px solid var(--border); margin-bottom: clamp(1.8rem,4vw,2.8rem); }
.tabs__tab { appearance: none; background: none; border: none; cursor: pointer; font-family: var(--font-body); font-weight: 600; font-size: clamp(.9rem,1.4vw,1.05rem); color: var(--fg-dim); padding: .8rem 0; position: relative; transition: color .2s var(--ease); }
.tabs__tab:hover { color: var(--fg); }
.tabs__tab.is-active { color: var(--gold); }
.tabs__tab.is-active::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: var(--gold); }
.tabs__panel { display: none; }
.tabs__panel.is-active { display: block; animation: tabFade .4s var(--ease); }
@keyframes tabFade { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }

/* About: "What We Believe" icon chips */
.check-list--belief li { grid-template-columns: auto 1fr; align-items: start; }
.check-list--belief li .ico { width: 52px; height: 52px; padding: 12px; box-sizing: border-box; background: var(--gold); color: var(--bg); border-radius: 13px; }
.check-list--belief li p { align-self: center; }

/* About: "Our Experience" logo band header centered + full width */
.marquee-band .sec-head { text-align: center; }
.marquee-band .sec-head h2 { margin-inline: auto; max-width: none; }
.marquee-band .eyebrow { display: flex; justify-content: center; }

/* About: "Led by people" clickable team grid with photos */
.team-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 1.2rem; margin-top: clamp(1.6rem,3vw,2.4rem); }
@media (min-width: 620px) { .team-grid { grid-template-columns: repeat(3,1fr); } }
@media (min-width: 920px) { .team-grid { grid-template-columns: repeat(4,1fr); } }
.team-member { display: block; text-align: center; padding: 1.5rem 1rem; border: 1px solid var(--border); border-radius: var(--radius); background: rgba(var(--surface-rgb),.5); transition: border-color .25s var(--ease), transform .25s var(--ease), background .25s var(--ease); }
.team-member:hover { border-color: var(--gold); transform: translateY(-4px); background: rgba(22,22,22,.6); }
.team-member__photo { position: relative; width: 96px; height: 96px; margin: 0 auto 1rem; border-radius: 50%; overflow: hidden; background: var(--secondary); border: 1px solid var(--border); display: grid; place-items: center; color: var(--gold); font-family: var(--font-display); font-weight: 600; font-size: 1.5rem; }
.team-member__photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.team-member__name { font-family: var(--font-display); font-weight: 600; color: var(--fg); font-size: 1.05rem; line-height: 1.2; }
.team-member__role { color: var(--gold); font-size: .76rem; font-weight: 600; letter-spacing: .03em; text-transform: uppercase; margin-top: .35rem; line-height: 1.3; }

/* Highlighted text (gold underline) — homepage-style emphasis */
.hl { background: linear-gradient(var(--gold),var(--gold)) 0 92%/100% .1em no-repeat; padding-bottom: .02em; }

/* Industries index — industry card icons */
.ind-card { position: relative; overflow: hidden; transition: border-color .25s var(--ease), transform .25s var(--ease); }
a.ind-card:hover { transform: translateY(-3px); }
.ind-card__ico { width: 34px; height: 34px; color: var(--gold); margin-bottom: 1.1rem; display: block; }
.ind-card__ico svg { width: 100%; height: 100%; display: block; }

/* Industries index — "Same system" growth-model visual */
.sys-layout { display: grid; gap: clamp(2rem,4vw,3rem); }
@media (min-width: 900px) { .sys-layout { grid-template-columns: 1fr 1fr; gap: clamp(2.5rem,5vw,4.5rem); align-items: center; } }
.sys-visual { border: 1px solid var(--border); border-radius: var(--radius-lg,20px); background: rgba(var(--surface-rgb),.5); backdrop-filter: blur(6px); padding: clamp(1.8rem,3.5vw,2.6rem); }
.sys-model { display: grid; }
.sys-stage { position: relative; display: grid; grid-template-columns: auto 1fr; gap: 1.1rem; align-items: start; padding-bottom: 1.7rem; }
.sys-stage:last-child { padding-bottom: 0; }
.sys-stage::before { content: ""; position: absolute; left: 16px; top: 34px; bottom: -2px; width: 1px; background: linear-gradient(180deg, var(--gold), rgba(var(--gold-rgb),.15)); }
.sys-stage:last-child::before { display: none; }
.sys-dot { width: 34px; height: 34px; border-radius: 50%; background: var(--gold); color: var(--bg); display: grid; place-items: center; font-family: var(--font-display); font-weight: 700; font-size: .9rem; position: relative; z-index: 1; }
.sys-stage h4 { font-family: var(--font-display); font-weight: 600; color: var(--fg); font-size: 1.1rem; margin-top: .35rem; }
.sys-stage p { color: var(--fg-dim); font-size: var(--fs-sm); margin-top: .2rem; }
.form { display: grid; gap: 1.25rem; }
.form label { display: block; font-size: .82rem; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; color: var(--fg); margin-bottom: .5rem; }
.form input[type=text], .form input[type=email], .form input[type=tel], .form input[type=url], .form textarea, .form select {
  width: 100%; padding: .85rem 1rem; background: var(--secondary); border: 1px solid var(--field-border);
  border-radius: 10px; color: var(--fg); font: inherit; font-size: .95rem; }
.form textarea { min-height: 120px; resize: vertical; }
.form input:focus-visible, .form textarea:focus-visible, .form select:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; border-color: var(--gold); }
.form__choices { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem .9rem; }
.form__choices label { display: flex; align-items: center; gap: .5rem; text-transform: none; letter-spacing: 0; font-weight: 500; color: var(--fg-dim); margin: 0; cursor: pointer; }
.form__choices input { accent-color: var(--gold); }
.form__note { font-size: .82rem; color: var(--fg-dim); }
.form__ok { display: none; padding: 1rem 1.25rem; border: 1px solid var(--gold); border-radius: 10px; color: var(--fg); background: rgba(var(--gold-rgb),.08); }
.form__err { display: none; padding: 1rem 1.25rem; border: 1px solid #c0533f; border-radius: 10px; color: var(--fg); background: rgba(192,83,63,.1); }
.contact-info { display: grid; gap: 1.5rem; align-content: start; }
.contact-info h3 { font-size: .85rem; letter-spacing: .05em; text-transform: uppercase; color: var(--gold); margin-bottom: .4rem; }
.contact-info a { color: var(--fg); }

/* Content hubs */
.def-block { display: grid; gap: 1.5rem; grid-template-columns: 1fr; margin-top: 1.5rem; }
@media (min-width: 640px) { .def-block { grid-template-columns: 1fr 1fr; } }
.def { border-left: 2px solid var(--gold); padding-left: 1.25rem; }
.def__word { font-family: var(--font-display); font-size: 1.2rem; }
.def__pron { color: var(--fg-dim); font-style: italic; font-size: .9rem; }
.def__def { color: var(--fg); margin-top: .35rem; }
.chips { display: flex; flex-wrap: wrap; gap: .6rem; }
.chip { padding: .45rem .9rem; border: 1px solid var(--border); border-radius: 999px; font-size: .82rem; color: var(--fg-dim); }
.empty-state { border: 1px dashed var(--border); border-radius: var(--radius); padding: 2.5rem; text-align: center; color: var(--fg-dim); }
.res-grid { display: grid; gap: 1rem; grid-template-columns: 1fr; }
@media (min-width: 720px) { .res-grid { grid-template-columns: 1fr 1fr; } }
.res-card { display: flex; flex-direction: column; gap: .5rem; }
.res-card .tag { font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; color: var(--gold); font-weight: 700; }

/* ---- Dropdown navigation ---- */
.nav__primary .nav__menu > li { position: relative; }
.has-menu > a { display: inline-flex; align-items: center; gap: 6px; }
.nav__caret { transition: transform .25s var(--ease); opacity: .65; }
.has-menu.is-open .nav__caret { transform: rotate(180deg); }
.has-menu::after { content: ""; position: absolute; left: 0; right: 0; top: 100%; height: 16px; } /* hover bridge */

.nav__panel {
  position: absolute; top: calc(100% + 12px); left: 50%; transform: translate(-50%, 8px);
  min-width: 232px; background: rgba(13,13,13,0.98); backdrop-filter: blur(16px) saturate(1.1);
  border: 1px solid var(--border); border-radius: 14px; padding: 8px;
  display: grid; gap: 2px; box-shadow: 0 26px 64px -22px rgba(0,0,0,.72);
  opacity: 0; visibility: hidden; pointer-events: none;
  transition: opacity .22s var(--ease), transform .22s var(--ease);
}
.has-menu.is-open > .nav__panel, .no-js .has-menu:hover > .nav__panel {
  opacity: 1; visibility: visible; pointer-events: auto; transform: translate(-50%, 0);
}
.nav__panel a { display: block; padding: 9px 12px; border-radius: 9px; color: var(--fg-dim); font-size: .9rem; font-weight: 500; transition: background .2s var(--ease), color .2s var(--ease); }
.nav__panel a:hover { background: var(--secondary); color: var(--fg); }
.nav__panel-all { color: var(--gold) !important; font-weight: 700 !important; margin-top: 4px; border-top: 1px solid var(--border); border-radius: 0; }

.nav__panel--wide { min-width: 540px; left: 0; transform: translate(0, 8px); padding: 12px; }
.has-menu.is-open > .nav__panel--wide, .no-js .has-menu:hover > .nav__panel--wide { transform: translate(0, 0); }
.np__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 2px; }
.np__grid a { display: grid; gap: 2px; padding: 10px 12px; }
.np__k { color: var(--fg); font-weight: 600; font-size: .9rem; }
.np__v { color: var(--fg-dim); font-size: .78rem; line-height: 1.35; }

@media (max-width: 860px) {
  .m-group { border-bottom: 1px solid var(--border); }
  .m-group summary { display: flex; align-items: center; justify-content: space-between; padding: 0.8rem 0; font-family: var(--font-display); font-size: 1.35rem; cursor: pointer; list-style: none; color: var(--fg); }
  .m-group summary::-webkit-details-marker { display: none; }
  .m-group summary .nav__caret { width: 13px; height: 9px; transition: transform .25s var(--ease); }
  .m-group[open] summary .nav__caret { transform: rotate(180deg); }
  .m-group__body { display: grid; gap: 1px; padding: 0.1rem 0 0.9rem 0.15rem; }
  .m-group__body a { font-family: var(--font-body) !important; font-size: 1rem !important; padding: 0.55rem 0 !important; border-bottom: none !important; color: var(--fg-dim) !important; }
  .mobile-menu .m-flat { color: var(--fg); }
}

/* ---- Case study pages ---- */
.pullquote { border-left: 3px solid var(--gold); padding-left: clamp(1.4rem, 3vw, 2.2rem); }
.pullquote blockquote { font-family: var(--font-display); font-weight: 600; font-size: clamp(1.35rem, 3vw, 2rem); line-height: 1.32; color: var(--fg); }
.pullquote cite { display: block; margin-top: 1.1rem; color: var(--gold); font-style: normal; font-weight: 600; font-size: 0.95rem; letter-spacing: .01em; }
.cs-metrics { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1px; background: var(--border); border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; }
@media (min-width: 760px) { .cs-metrics { grid-template-columns: repeat(4, 1fr); } }
.cs-metric { background: var(--surface); padding: clamp(1.5rem, 2.6vw, 2.2rem); }
.cs-metric .big { font-family: var(--font-display); font-weight: 600; font-size: clamp(2rem, 4vw, 2.9rem); color: var(--gold); line-height: 1; }
.cs-metric .lbl { color: var(--fg-dim); font-size: var(--fs-sm); margin-top: 0.6rem; }
.review-flag { background: rgba(var(--gold-rgb),0.1); border-top: 1px solid var(--gold); border-bottom: 1px solid var(--gold); }
.review-flag .shell { padding-top: 0.9rem; padding-bottom: 0.9rem; display: flex; gap: 0.8rem; align-items: baseline; }
.review-flag .tag { color: var(--gold); font-weight: 700; font-size: 0.72rem; letter-spacing: 0.12em; text-transform: uppercase; white-space: nowrap; }
.review-flag p { color: var(--fg-dim); font-size: 0.9rem; margin: 0; }
@media (max-width: 620px) { .review-flag .shell { flex-direction: column; gap: 0.35rem; } }
.cs-card__metric { color: var(--gold); font-family: var(--font-display); font-weight: 600; font-size: 1.05rem; margin: 0.3rem 0 0; }

/* case study cards on hub */
.cs-card { display: flex; flex-direction: column; }
.cs-card__metric { color: var(--gold); font-family: var(--font-display); font-weight: 600; font-size: 1.05rem; margin: 0.5rem 0 0; }
.cs-card__more { margin-top: auto; padding-top: 1rem; color: var(--fg-dim); font-size: 0.85rem; font-weight: 500; transition: color .2s var(--ease); }
.cs-card:hover .cs-card__more { color: var(--gold); }
.cs-card__flag { display: inline-block; margin-top: 0.7rem; align-self: flex-start; background: rgba(var(--gold-rgb),0.12); border: 1px solid var(--gold); color: var(--gold); font-size: 0.68rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; padding: 0.25rem 0.55rem; border-radius: 999px; }

/* real proof cards */
a.proof__client { transition: background .2s var(--ease); }
a.proof__client:hover { background: var(--secondary); }
.proof__by { margin-top: 1rem; color: var(--gold); font-size: 0.82rem; font-weight: 600; }
.proof__by span { color: var(--fg-dim); font-weight: 500; }

/* ---- Interior page-hero backgrounds ---- */
.page-hero__fx { position: absolute; inset: 0; z-index: 0; width: 100%; height: 100%; }
.page-hero .tex-bg.page-hero__tex { z-index: 0; }
.page-hero__scrim { position: absolute; inset: 0; z-index: 0; pointer-events: none; background: linear-gradient(180deg, rgba(var(--bg-rgb),.35) 0%, rgba(var(--bg-rgb),.82) 100%); }

/* ---- Insights articles ---- */
.article__meta { display: flex; flex-wrap: wrap; gap: 0.6rem 1.2rem; align-items: center; color: var(--fg-dim); font-size: 0.85rem; margin-top: 1.2rem; }
.article__meta .chip { background: var(--secondary); border: 1px solid var(--border); color: var(--gold); padding: 0.25rem 0.7rem; border-radius: 999px; font-size: 0.72rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
.article-body { color: var(--fg-dim); font-size: var(--fs-lede); line-height: 1.65; max-width: 66ch; margin: 0 auto; }
.article-body > * { margin: 0 0 1.15rem; }
.article-body h2 { font-family: var(--font-display); font-weight: 600; color: var(--fg); font-size: clamp(1.5rem, 3vw, 2rem); line-height: 1.15; margin-top: 2.6rem; letter-spacing: -0.01em; }
.article-body h3 { color: var(--fg); font-size: 1.15rem; font-weight: 700; margin-top: 1.8rem; }
.article-body strong { color: var(--fg); font-weight: 600; }
.article-body ul { padding-left: 1.2rem; display: grid; gap: 0.5rem; }
.article-body ul li { padding-left: 0.3rem; }
.article-body a { color: var(--gold); text-decoration: underline; text-underline-offset: 3px; }
.callout { border-left: 3px solid var(--gold); background: var(--surface); padding: 1.2rem 1.4rem; border-radius: 0 var(--radius) var(--radius) 0; color: var(--fg); font-size: 1.02rem; }
.takeaways { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: clamp(1.4rem, 3vw, 2rem); margin: 2.4rem auto 0; max-width: 66ch; }
.takeaways h3 { color: var(--gold); font-size: 0.78rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; margin-bottom: 1rem; }
.takeaways ul { list-style: none; padding: 0; display: grid; gap: 0.8rem; }
.takeaways li { padding-left: 1.6rem; position: relative; color: var(--fg-dim); }
.takeaways li::before { content: "→"; position: absolute; left: 0; color: var(--gold); font-weight: 700; }
.article-card__meta { display: flex; gap: 0.8rem; align-items: center; color: var(--fg-dim); font-size: 0.78rem; margin-top: 0.6rem; }

/* ============ SECTION VARIETY PASS ============ */

/* --- AUDIENCE: sticky header + outlined-numeral editorial rows --- */
.aud2 { display: grid; gap: 2.5rem; position: relative; z-index: 1; }
@media (min-width: 960px) { .aud2 { grid-template-columns: 0.8fr 1.2fr; gap: clamp(3rem,6vw,5.5rem); align-items: start; }
  .aud2__head { position: sticky; top: 118px; } }
.aud2__rows { display: grid; }
.aud2__row { display: grid; grid-template-columns: auto 1fr; gap: clamp(1.1rem,2.5vw,2rem); padding: clamp(1.6rem,3vw,2.4rem) 0; border-top: 1px solid var(--border); align-items: start; }
.aud2__row:last-child { border-bottom: 1px solid var(--border); }
.aud2__n { font-family: var(--font-display); font-weight: 600; font-size: clamp(2rem,4.5vw,3.2rem); line-height: .85; color: transparent; -webkit-text-stroke: 1px rgba(var(--gold-rgb),.55); }
.aud2__row h3 { font-family: var(--font-display); font-weight: 600; color: var(--fg); font-size: clamp(1.2rem,2.4vw,1.6rem); line-height: 1.2; margin-bottom: .6rem; }
.aud2__row p { color: var(--fg-dim); max-width: 46ch; }

/* --- SERVICES: bento mosaic, varied tile sizes --- */
.svc2 { display: grid; gap: 1rem; position: relative; z-index: 1; }
@media (min-width: 640px) { .svc2 { grid-template-columns: repeat(2,1fr); } }
@media (min-width: 980px) { .svc2 { grid-template-columns: repeat(3,1fr); grid-auto-rows: 1fr; } }
.svc2__tile { display: flex; flex-direction: column; justify-content: flex-end; gap: .5rem; padding: clamp(1.3rem,2.6vw,2rem); background: rgba(var(--surface-rgb),.72); backdrop-filter: blur(6px); border: 1px solid var(--border); border-radius: var(--radius); transition: border-color .25s var(--ease), background .25s var(--ease), transform .25s var(--ease); }
.svc2__tile:hover { border-color: var(--gold); background: rgba(26,26,26,.8); transform: translateY(-3px); }
.svc2__tile h3 { font-family: var(--font-display); font-weight: 600; color: var(--fg); font-size: clamp(1.1rem,2.2vw,1.45rem); line-height: 1.15; }
.svc2 > a:nth-child(1) .svc2__ico { width: 32px; height: 32px; }
.svc2__tile p { color: var(--fg-dim); font-size: var(--fs-sm); max-width: 40ch; }
.svc2__tile .go { color: var(--gold); font-size: .82rem; font-weight: 700; opacity: 0; transform: translateX(-4px); transition: opacity .25s var(--ease), transform .25s var(--ease); }
.svc2__tile:hover .go { opacity: 1; transform: none; }

/* --- MODEL: horizontal connected pipeline --- */
.model2 { display: grid; gap: 1.8rem; position: relative; z-index: 1; }
@media (min-width: 900px) { .model2 { grid-template-columns: repeat(5,1fr); gap: 1.1rem; } }
.model2__stage { position: relative; padding-left: 2.4rem; }
.model2__stage::before { content: ""; position: absolute; left: 8px; top: 22px; bottom: -1.8rem; width: 1px; background: linear-gradient(180deg,var(--gold),rgba(var(--gold-rgb),.15)); }
.model2__stage:last-child::before { display: none; }
@media (min-width: 900px) { .model2__stage { padding-left: 0; padding-top: 2.5rem; }
  .model2__stage::before { left: 18px; right: -1.1rem; top: 8px; bottom: auto; width: auto; height: 1px; background: linear-gradient(90deg,var(--gold),rgba(var(--gold-rgb),.2)); } }
.model2__dot { position: absolute; left: 0; top: 12px; width: 18px; height: 18px; border-radius: 50%; background: var(--gold); color: var(--bg); font-size: .68rem; font-weight: 800; display: grid; place-items: center; }
@media (min-width: 900px) { .model2__dot { top: 0; left: 0; } }
.model2__stage h3 { font-family: var(--font-display); font-weight: 600; color: var(--fg); font-size: 1.15rem; margin-bottom: .45rem; }
.model2__stage p { color: var(--fg-dim); font-size: var(--fs-sm); }

/* --- TEAM: statement + roster strip --- */
.team2 { position: relative; z-index: 1; display: grid; gap: clamp(2.2rem,4vw,3.4rem); }
.team2__lead { max-width: 30ch; font-family: var(--font-display); font-weight: 600; font-size: clamp(1.6rem,3.4vw,2.5rem); line-height: 1.18; color: var(--fg); }
.team2__split { display: grid; gap: 2rem; }
@media (min-width: 900px) { .team2__split { grid-template-columns: 1fr 1fr; gap: clamp(2.5rem,5vw,4.5rem); align-items: start; } }
.team2__pts { list-style: none; padding: 0; display: grid; gap: .1rem; }
.team2__pts li { display: grid; grid-template-columns: auto 1fr; gap: .9rem; align-items: baseline; padding: .85rem 0; border-bottom: 1px solid var(--border); color: var(--fg-dim); font-size: var(--fs-sm); }
.team2__pts li::before { content: "—"; color: var(--gold); }
.team2__roster { display: flex; flex-wrap: wrap; gap: .6rem; }
.team2__av { position: relative; width: 60px; height: 60px; border-radius: 50%; display: grid; place-items: center; background: var(--secondary); border: 1px solid var(--border); color: var(--gold); font-family: var(--font-display); font-weight: 600; font-size: .95rem; letter-spacing: .02em; overflow: hidden; }
.team2__av img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.team2__rosterlbl { color: var(--fg-dim); font-size: .8rem; margin-top: .9rem; }

/* --- PROOF: full-width stat ribbon + offset testimonials --- */
.proof2__ribbon { display: grid; grid-template-columns: repeat(2,1fr); gap: 1px; background: var(--border); border-block: 1px solid var(--border); position: relative; z-index: 1; margin-bottom: clamp(2.2rem,4vw,3.4rem); }
@media (min-width: 700px) { .proof2__ribbon { grid-template-columns: repeat(3,1fr); } }
@media (min-width: 1050px) { .proof2__ribbon { grid-template-columns: repeat(6,1fr); } }
.proof2__cell { background: var(--bg); padding: clamp(1.2rem,2.4vw,1.9rem) clamp(.9rem,2vw,1.3rem); }
.proof2__cell .big { font-family: var(--font-display); font-weight: 600; color: var(--gold); font-size: clamp(1.6rem,3.2vw,2.4rem); line-height: 1; }
.proof2__cell .lbl { color: var(--fg-dim); font-size: .76rem; margin-top: .45rem; line-height: 1.35; }
.proof2__quotes { display: grid; gap: 1.2rem; position: relative; z-index: 1; }
@media (min-width: 900px) { .proof2__quotes { grid-template-columns: 1fr 1fr; gap: 1.6rem; align-items: start; }
  .proof2__quotes > a:nth-child(2) { margin-top: 3rem; } }
.proof2__q { display: block; padding: clamp(1.5rem,3vw,2.3rem); border: 1px solid var(--border); border-radius: var(--radius); background: rgba(var(--surface-rgb),.66); backdrop-filter: blur(6px); transition: border-color .25s var(--ease), transform .25s var(--ease); }
.proof2__q:hover { border-color: var(--gold); transform: translateY(-3px); }
.proof2__q blockquote { font-family: var(--font-display); font-weight: 600; font-size: clamp(1.1rem,2.2vw,1.45rem); line-height: 1.32; color: var(--fg); margin-bottom: 1.1rem; }
.proof2__q .who { color: var(--gold); font-size: .84rem; font-weight: 700; }
.proof2__q .stat { color: var(--fg-dim); font-size: .8rem; margin-top: .3rem; }

/* --- AUDIT: contained panel, CTA inline (not centered) --- */
.audit2 { position: relative; z-index: 1; border: 1px solid var(--border); border-radius: var(--radius-lg,20px); background: rgba(12,12,12,.74); backdrop-filter: blur(10px); padding: clamp(1.6rem,4vw,3.4rem); }
.audit2__top { display: grid; gap: 1.4rem; margin-bottom: clamp(1.8rem,3.5vw,2.6rem); }
@media (min-width: 900px) { .audit2__top { grid-template-columns: 1fr 1fr; gap: clamp(2.4rem,5vw,4rem); align-items: start; } }
.audit2__cols { display: grid; gap: clamp(1.6rem,3.5vw,3rem); padding-top: clamp(1.6rem,3vw,2.2rem); border-top: 1px solid var(--border); }
@media (min-width: 760px) { .audit2__cols { grid-template-columns: 1fr 1fr; } }
.audit2__cols h3 { color: var(--gold); font-size: .74rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; margin-bottom: 1rem; }
.audit2__cols ul { list-style: none; padding: 0; display: grid; gap: .6rem; }
.audit2__cols li { color: var(--fg-dim); font-size: var(--fs-sm); padding-left: 1.3rem; position: relative; }
.audit2__cols li::before { content: "→"; position: absolute; left: 0; color: var(--gold); }
.audit2__foot { margin-top: clamp(1.8rem,3.5vw,2.6rem); padding-top: clamp(1.4rem,3vw,2rem); border-top: 1px solid var(--border); display: flex; flex-wrap: wrap; gap: 1rem 1.6rem; align-items: center; justify-content: space-between; }
.audit2__foot p { color: var(--fg-dim); font-size: var(--fs-sm); max-width: 42ch; margin: 0; }

/* --- GOLD CTA: split, left-aligned (was all centered) --- */
.gold-cta { text-align: left; }
.gold-cta .gold-cta__inner { max-width: none; margin-inline: 0; display: grid; gap: 1.8rem; }
@media (min-width: 900px) { .gold-cta .gold-cta__inner { grid-template-columns: 1.25fr .75fr; align-items: end; gap: clamp(2.5rem,5vw,4.5rem); } }
.gold-cta .eyebrow { justify-content: flex-start !important; }
.gold-cta p { margin-inline: 0; }
.gold-cta__cta { justify-content: flex-start; }
@media (min-width: 900px) { .gold-cta__cta { justify-content: flex-end; } }

/* ============================================================
   HOMEPAGE REFINEMENTS — July 2026
   ============================================================ */

/* --- Service tiles: gold line-icon so tiles aren't empty boxes --- */
.svc2__tile { position: relative; overflow: hidden; }
.svc2__ico { width: 32px; height: 32px; color: var(--gold); margin-bottom: auto; display: block; }
.svc2__ico svg { width: 100%; height: 100%; display: block; }
.svc2__tile::after { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: 0; transition: opacity .3s var(--ease); background: radial-gradient(130% 90% at 100% 0%, var(--gold-glow), transparent 55%); }
.svc2__tile:hover::after { opacity: 1; }

/* --- Team credentials: icon cards instead of a plain bullet list --- */
.team2__pts { grid-template-columns: 1fr; gap: .7rem; }
@media (min-width: 560px) { .team2__pts { grid-template-columns: 1fr 1fr; } }
.team2__pts li { display: grid; grid-template-columns: auto 1fr; gap: .85rem; align-items: flex-start; padding: 1rem 1.1rem; border: 1px solid var(--border); border-bottom: 1px solid var(--border); border-radius: var(--radius); background: rgba(var(--surface-rgb),.5); transition: border-color .25s var(--ease), transform .25s var(--ease), background .25s var(--ease); }
.team2__pts li:hover { border-color: var(--gold); transform: translateY(-2px); background: rgba(22,22,22,.6); }
.team2__pts li::before { content: none; }
.team2__pts .pt-ico { width: 22px; height: 22px; color: var(--gold); flex-shrink: 0; margin-top: .1rem; }
.team2__pts .pt-ico svg { width: 100%; height: 100%; display: block; }
.team2__pts li span:last-child { color: var(--fg-dim); font-size: var(--fs-sm); line-height: 1.4; }

/* --- Proof: warm depth + hero stat + category labels --- */
.proof2__glow { position: absolute; inset: 0; z-index: 0; pointer-events: none; background: radial-gradient(48% 55% at 82% 8%, var(--gold-glow), transparent 60%); }
.proof2__hero { position: relative; z-index: 1; display: flex; flex-wrap: wrap; align-items: baseline; gap: .4rem 1.6rem; margin: clamp(1.8rem,3.5vw,2.6rem) 0 clamp(1.4rem,3vw,2rem); }
.proof2__hero .num { font-family: var(--font-display); font-weight: 700; color: var(--gold); font-size: clamp(3.4rem,8.5vw,6.4rem); line-height: .88; letter-spacing: -.02em; }
.proof2__hero .cap { color: var(--fg-dim); font-size: var(--fs-lede); line-height: 1.45; max-width: 30ch; }
.proof2__cell { position: relative; transition: background .3s var(--ease); }
.proof2__cell:hover { background: var(--surface); }
.proof2__cat { display: block; margin-top: .5rem; color: var(--gold-deep); font-family: var(--font-body); font-weight: 700; font-size: .64rem; letter-spacing: .11em; text-transform: uppercase; }

/* --- Audit: device mockup so the section reads visual, not wordy --- */
.audit2__device { position: relative; z-index: 1; }
.device { border-radius: 12px; overflow: hidden; border: 1px solid var(--border); background: #0d0d0d; box-shadow: 0 34px 70px -34px rgba(0,0,0,.85); }
.device__bar { display: flex; align-items: center; gap: .45rem; padding: .7rem .9rem; background: #141414; border-bottom: 1px solid var(--border); }
.device__bar i { width: 10px; height: 10px; border-radius: 50%; background: #2a2a2a; display: block; }
.device__bar span { margin-left: .6rem; color: var(--fg-faint); font-size: .72rem; letter-spacing: .02em; }
.device__screen { display: block; width: 100%; height: auto; }

/* --- Eyebrows: more breathing room --- */
.eyebrow { gap: 1em; margin-bottom: 1.1rem; }
.eyebrow::before { width: 30px; }

/* --- Growth model: two-column head fills the right side --- */
.model2__head { display: grid; gap: 1.3rem; }
@media (min-width: 900px) { .model2__head { grid-template-columns: 1.05fr .95fr; gap: clamp(2rem,5vw,4.5rem); align-items: end; } .model2__head .lede { max-width: 44ch; } }

/* --- Proof: heading left, hero stat right --- */
.proof2__top { display: grid; gap: clamp(1.8rem,3vw,2.4rem); margin-bottom: clamp(1.8rem,3.5vw,2.8rem); }
@media (min-width: 900px) { .proof2__top { grid-template-columns: 1fr auto; align-items: center; gap: clamp(2.5rem,6vw,5rem); } }
.proof2__top .proof2__hero { margin: 0; }
@media (min-width: 900px) { .proof2__hero { flex-direction: column; align-items: flex-end; text-align: right; gap: .7rem; } .proof2__hero .cap { max-width: 32ch; } }

/* ============================================================
   SERVICES PAGE (redesign — reused across similar pages)
   ============================================================ */

/* Animated aurora background — gentle drift, distinct from the homepage's particles/lines */
.svc-section { position: relative; overflow: hidden; }
.svc-section > .shell { position: relative; z-index: 1; }
.svc-aurora { position: absolute; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; }
.svc-aurora span { position: absolute; display: block; border-radius: 50%; filter: blur(70px); }
.svc-aurora .a1 { width: 46vw; height: 46vw; max-width: 620px; max-height: 620px; left: -8vw; top: -14vw; background: radial-gradient(circle, rgba(var(--gold-rgb),.13), transparent 68%); animation: svcDrift1 24s ease-in-out infinite; }
.svc-aurora .a2 { width: 38vw; height: 38vw; max-width: 520px; max-height: 520px; right: -6vw; top: 22%; background: radial-gradient(circle, rgba(178,64,32,.10), transparent 68%); animation: svcDrift2 30s ease-in-out infinite; }
.svc-aurora .a3 { width: 34vw; height: 34vw; max-width: 460px; max-height: 460px; left: 40%; bottom: -16vw; background: radial-gradient(circle, rgba(var(--gold-rgb),.10), transparent 68%); animation: svcDrift3 27s ease-in-out infinite; }
@keyframes svcDrift1 { 0%,100% { transform: translate(0,0); } 50% { transform: translate(7vw,5vw); } }
@keyframes svcDrift2 { 0%,100% { transform: translate(0,0); } 50% { transform: translate(-6vw,4vw); } }
@keyframes svcDrift3 { 0%,100% { transform: translate(0,0); } 50% { transform: translate(4vw,-6vw); } }
@media (prefers-reduced-motion: reduce) { .svc-aurora span { animation: none; } }

/* What We Do — two-column intro (left-aligned) + a row of the jobs */
.svc-intro { display: grid; gap: 1.4rem; }
@media (min-width: 900px) { .svc-intro { grid-template-columns: 1.1fr .9fr; gap: clamp(2rem,5vw,4.5rem); align-items: end; } .svc-intro .prose { max-width: 46ch; } }
.svc-jobs { list-style: none; padding: 0; margin: clamp(2.4rem,5vw,3.6rem) 0 0; display: grid; gap: 1px; background: var(--border); border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; }
@media (min-width: 560px) { .svc-jobs { grid-template-columns: repeat(2,1fr); } }
@media (min-width: 1040px) { .svc-jobs { grid-template-columns: repeat(5,1fr); } }
.svc-jobs li { background: var(--bg); padding: clamp(1.2rem,2vw,1.55rem); display: grid; gap: .6rem; align-content: start; transition: background .3s var(--ease); }
.svc-jobs li:hover { background: var(--surface); }
.svc-jobs .ji { width: 26px; height: 26px; color: var(--gold); }
.svc-jobs h3 { font-family: var(--font-display); font-weight: 600; font-size: 1rem; color: var(--fg); line-height: 1.2; }
.svc-jobs p { color: var(--fg-dim); font-size: .84rem; line-height: 1.4; }

/* Explore services — punched-up cards with icon + corner index + hover glow */
.svc-card { position: relative; overflow: hidden; transition: border-color .25s var(--ease), transform .25s var(--ease); }
a.svc-card:hover { transform: translateY(-3px); border-color: var(--gold); }
.svc-card__ico { width: 30px; height: 30px; color: var(--gold); margin-bottom: 1.1rem; }
.svc-card .eyebrow { position: absolute; top: clamp(1.4rem,2.4vw,1.9rem); right: clamp(1.4rem,2.4vw,1.9rem); margin: 0; opacity: .45; }
.svc-card .eyebrow::before { display: none; }
.svc-card::after { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: 0; transition: opacity .3s var(--ease); background: radial-gradient(120% 80% at 100% 0%, var(--gold-glow), transparent 55%); }
.svc-card:hover::after { opacity: 1; }
.svc-card > * { position: relative; z-index: 1; }

/* The Hale Difference — two cards side by side with visuals */
.svc-diff { display: grid; gap: 1.2rem; }
@media (min-width: 820px) { .svc-diff { grid-template-columns: 1fr 1fr; gap: clamp(1.4rem,3vw,2rem); } }
.svc-diff__card { border: 1px solid var(--border); border-radius: var(--radius-lg,20px); background: rgba(var(--surface-rgb),.5); backdrop-filter: blur(6px); padding: clamp(1.8rem,3.5vw,2.8rem); display: grid; gap: 1rem; align-content: start; transition: border-color .25s var(--ease), transform .25s var(--ease); }
.svc-diff__card:hover { border-color: var(--gold); transform: translateY(-3px); }
.svc-diff__ico { width: 42px; height: 42px; color: var(--gold); }
.svc-diff__card h2 { font-family: var(--font-display); font-weight: 600; font-size: clamp(1.5rem,2.6vw,2rem); line-height: 1.1; color: var(--fg); letter-spacing: -.01em; margin: 0; }
.svc-diff__card p { color: var(--fg-dim); font-size: var(--fs-sm); line-height: 1.6; margin: 0; }

/* Service DETAIL page punch-ups (reusable across all service pages) */
.svc-intro--top { align-items: start; }
@media (min-width: 900px) { .svc-intro--top .prose { max-width: 52ch; } }
.check-list--cards { grid-template-columns: 1fr; }
@media (min-width: 640px) { .check-list--cards { grid-template-columns: repeat(2,1fr); } }
@media (min-width: 1000px) { .check-list--cards.cl-3 { grid-template-columns: repeat(3,1fr); } }
.check-list--cards li { border: 1px solid var(--border); border-radius: var(--radius); background: rgba(var(--surface-rgb),.5); padding: clamp(1.3rem,2.4vw,1.7rem); transition: border-color .25s var(--ease), transform .25s var(--ease); }
.check-list--cards li:hover { border-color: var(--gold); transform: translateY(-3px); }
.check-list--cards li .ico { width: 24px; height: 24px; }
@media (min-width: 760px) { .model2--3 { grid-template-columns: repeat(3,1fr); } .model2--4 { grid-template-columns: repeat(4,1fr); } }
@media (min-width: 900px) { .model2--6 { grid-template-columns: repeat(6,1fr); } }

/* Feature list -> icon card grid (reuses the site card look) */
.feature-list { display: grid; gap: 1rem; grid-template-columns: 1fr; }
@media (min-width: 620px) { .feature-list { grid-template-columns: repeat(2,1fr); } }
@media (min-width: 1000px) { .feature-list { grid-template-columns: repeat(3,1fr); } }
.feature-card { border: 1px solid var(--border); border-radius: var(--radius); background: rgba(var(--surface-rgb),.5); padding: clamp(1.3rem,2.4vw,1.7rem); display: grid; gap: .6rem; align-content: start; transition: border-color .25s var(--ease), transform .25s var(--ease); }
.feature-card:hover { border-color: var(--gold); transform: translateY(-3px); }
.feature-card__ico { width: 26px; height: 26px; color: var(--gold); }
.feature-card__ico svg { width: 100%; height: 100%; display: block; }
.feature-card h3 { font-family: var(--font-display); font-weight: 600; font-size: 1.02rem; color: var(--fg); line-height: 1.2; margin: 0; }
.feature-card p { color: var(--fg-dim); font-size: .86rem; line-height: 1.45; margin: 0; }

/* Related services condensed to a thin band */
.svc-band-sec { padding-block: clamp(1.3rem,2.6vw,1.9rem) !important; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.svc-band { display: grid; gap: 1rem; }
@media (min-width: 860px) { .svc-band { grid-template-columns: auto 1fr; align-items: center; gap: 2.2rem; } }
.svc-band__label { color: var(--fg-dim); font-size: var(--fs-sm); font-weight: 600; margin: 0; }
.svc-band__links { display: flex; flex-wrap: wrap; gap: .6rem; }
.svc-band__links a { display: inline-flex; align-items: center; gap: .45em; padding: .5em 1.05em; border: 1px solid var(--border); border-radius: 999px; color: var(--fg); font-size: .85rem; font-weight: 500; transition: border-color .2s var(--ease), color .2s var(--ease), background .2s var(--ease); }
.svc-band__links a::after { content: "\2192"; color: var(--gold); }
.svc-band__links a:hover { border-color: var(--gold); color: var(--gold); background: rgba(var(--gold-rgb),.06); }

/* ============================================================
   SERVICE-PAGE DATA VISUALS (charts / animated graphics)
   ============================================================ */
.page-hero--split .page-hero__inner { display: grid; gap: clamp(2rem,5vw,3.5rem); }
@media (min-width: 940px) { .page-hero--split .page-hero__inner { grid-template-columns: 1.05fr .95fr; align-items: center; } .page-hero--split .page-hero__text { max-width: none; } }
.page-hero__viz { position: relative; }
.viz-matrix, .viz-radar { width: 100%; height: auto; max-width: 440px; margin-inline: auto; display: block; overflow: visible; }
.viz-frame { border: 1px solid var(--border); border-radius: var(--radius-lg,20px); background: rgba(var(--surface-rgb),.45); backdrop-filter: blur(6px); padding: clamp(1.4rem,3vw,2.1rem); }
.viz-label { fill: var(--fg-dim); font-family: var(--font-body); font-size: 11px; font-weight: 700; letter-spacing: .1em; }
.viz-label--gold { fill: var(--gold); }

.viz-draw { stroke-dasharray: 1; stroke-dashoffset: 1; }
.reveal.is-in .viz-draw { animation: vizDraw 1s ease forwards; }
@keyframes vizDraw { to { stroke-dashoffset: 0; } }
@keyframes vizFade { to { opacity: 1; } }
@keyframes vizPop { to { opacity: 1; transform: scale(1); } }

/* Priority matrix */
.pm-zone { opacity: 0; }
.reveal.is-in .pm-zone { animation: vizFade .8s ease .35s forwards; }
.reveal-ready .pm-dot { opacity: 0; transform: scale(0); transform-box: fill-box; transform-origin: center; }
.reveal.is-in .pm-dot { animation: vizPop .5s cubic-bezier(.2,.8,.3,1.5) forwards; }
.pm-hot { filter: drop-shadow(0 0 6px hsl(41 62% 55% / .6)); }
.pm-pulse { opacity: 0; transform-box: fill-box; transform-origin: center; }
.reveal.is-in .pm-pulse { animation: pmPulse 2.6s ease-out 1.5s infinite; }
@keyframes pmPulse { 0% { r: 6; opacity: .5; } 100% { r: 22; opacity: 0; } }

/* Diagnostic radar */
.reveal-ready .rd-ring, .reveal-ready .rd-spoke, .reveal-ready .rd-vtx { opacity: 0; }
.reveal.is-in .rd-ring { animation: vizFade .7s ease forwards; }
.reveal.is-in .rd-spoke { animation: vizFade .7s ease .2s forwards; }
.reveal.is-in .rd-vtx { animation: vizFade .5s ease 1s forwards; }
.reveal-ready .rd-shape { opacity: 0; transform: scale(.3); transform-box: fill-box; transform-origin: center; filter: drop-shadow(0 0 10px hsl(41 62% 55% / .35)); }
.reveal.is-in .rd-shape { animation: rdGrow .9s cubic-bezier(.2,.7,.3,1) .4s forwards; }
@keyframes rdGrow { to { opacity: 1; transform: scale(1); } }

/* Process stepper (model2) — dots pop + line draws */
.reveal-ready .model2__dot { opacity: 0; transform: scale(.4); transform-origin: center; }
.reveal.is-in .model2__dot { animation: vizPop .45s var(--ease) forwards; }
.model2__stage:nth-child(1) .model2__dot { animation-delay: .05s; }
.model2__stage:nth-child(2) .model2__dot { animation-delay: .17s; }
.model2__stage:nth-child(3) .model2__dot { animation-delay: .29s; }
.model2__stage:nth-child(4) .model2__dot { animation-delay: .41s; }
.model2__stage:nth-child(5) .model2__dot { animation-delay: .53s; }
.model2__stage:nth-child(6) .model2__dot { animation-delay: .65s; }
@media (min-width: 900px) {
  .model2__stage::before { transform: scaleX(0); transform-origin: left; }
  .reveal.is-in .model2__stage::before { animation: lineGrow .5s var(--ease) forwards; }
  .model2__stage:nth-child(1)::before { animation-delay: .2s; }
  .model2__stage:nth-child(2)::before { animation-delay: .32s; }
  .model2__stage:nth-child(3)::before { animation-delay: .44s; }
  .model2__stage:nth-child(4)::before { animation-delay: .56s; }
  .model2__stage:nth-child(5)::before { animation-delay: .68s; }
}
@keyframes lineGrow { to { transform: scaleX(1); } }

@media (prefers-reduced-motion: reduce) {
  .pm-zone,.pm-dot,.rd-ring,.rd-spoke,.rd-vtx,.rd-shape,.model2__dot { opacity: 1 !important; transform: none !important; animation: none !important; }
  .viz-draw { stroke-dashoffset: 0 !important; animation: none; }
  .model2__stage::before { transform: none !important; animation: none; }
  .pm-pulse { display: none; }
}
.no-js .pm-zone,.no-js .pm-dot,.no-js .rd-ring,.no-js .rd-spoke,.no-js .rd-vtx,.no-js .rd-shape,.no-js .model2__dot,.no-js .vb-row { opacity: 1 !important; transform: none !important; }
.no-js .viz-draw { stroke-dashoffset: 0 !important; }
.no-js .model2__stage::before { transform: none !important; }
.no-js .pm-pulse { display: none; }

/* Gold dot-matrix background (for otherwise-flat sections) */
.tex-dots { position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background-image: radial-gradient(circle, rgba(var(--gold-rgb),0.12) 1.2px, transparent 1.5px);
  background-size: 24px 24px;
  -webkit-mask-image: radial-gradient(ellipse 85% 78% at 50% 42%, #000 30%, transparent 100%);
  mask-image: radial-gradient(ellipse 85% 78% at 50% 42%, #000 30%, transparent 100%); }

/* Radar intro row: center-aligned + caption to balance the copy */
@media (min-width: 900px) { .svc-intro--viz { align-items: center; } }
.svc-intro--viz .viz-radar { max-width: 480px; }
.viz-caption { text-align: center; color: var(--fg-dim); font-size: .9rem; line-height: 1.55; margin: 1.4rem auto 0; padding-top: 1.3rem; border-top: 1px solid var(--border); max-width: 34ch; }

/* "Strategy brief" deliverable graphic */
.viz-brief { width: 100%; height: auto; max-width: 440px; margin-inline: auto; display: block; }
.vb-row { opacity: 0; transform: translateX(-8px); }
.reveal.is-in .vb-row { animation: vbRow .5s var(--ease) forwards; }
@keyframes vbRow { to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .vb-row { opacity: 1 !important; transform: none !important; animation: none !important; } }

/* Compounding-growth chart (paid vs organic) */
.viz-growth, .viz-surfaces { width: 100%; height: auto; max-width: 460px; margin-inline: auto; display: block; overflow: visible; }
.page-hero__viz .viz-growth { max-width: 540px; } /* hero chart: the drawing fills its frame; the viewBox is cropped to what is drawn */
.page-hero__viz .viz-frame { padding: clamp(1rem,2vw,1.4rem); }
.cg-paid, .cg-organic { stroke-dasharray: 1; stroke-dashoffset: 1; }
.reveal.is-in .cg-paid { animation: vizDraw 1.1s ease .3s forwards; }
.reveal.is-in .cg-organic { animation: vizDraw 1.3s ease .6s forwards; }
.cg-organic { filter: drop-shadow(0 0 8px hsl(41 62% 55% / .55)); }
.cg-area, .cg-fade { opacity: 0; }
.reveal.is-in .cg-area { animation: cgArea .8s ease 1.5s forwards; }
.reveal.is-in .cg-fade { animation: vizFade .6s ease .3s forwards; }
@keyframes cgArea { to { opacity: .14; } }

/* Search-surfaces visibility bars */
.sf-bar { transform: scaleX(0); transform-box: fill-box; transform-origin: left center; }
.reveal.is-in .sf-bar { animation: sfBar .8s var(--ease) forwards; }
@keyframes sfBar { to { transform: scaleX(1); } }

@media (prefers-reduced-motion: reduce) {
  .cg-paid,.cg-organic { stroke-dashoffset: 0 !important; animation: none; }
  .cg-area { opacity: .14 !important; animation: none; }
  .cg-fade { opacity: 1 !important; animation: none; }
  .sf-bar { transform: none !important; animation: none; }
}
.no-js .cg-paid,.no-js .cg-organic { stroke-dashoffset: 0 !important; }
.no-js .cg-area { opacity: .14 !important; }
.no-js .cg-fade { opacity: 1 !important; }
.no-js .sf-bar { transform: none !important; }

/* Compact CTA-style "explore services" band (reused on all service pages) */
/* Tight, band-like section: single row of vertical tiles on desktop */
.svc-explore-sec { padding-block: clamp(2.4rem,5vw,3.6rem) !important; }
.svc-explore { display: grid; grid-template-columns: repeat(2,1fr); gap: .7rem; margin: clamp(1.3rem,2.6vw,1.9rem) auto 0; }
@media (min-width: 560px) { .svc-explore { grid-template-columns: repeat(3,1fr); } }
@media (min-width: 860px) { .svc-explore { grid-template-columns: repeat(5,1fr); } }
/* 6-tile variant (pages outside the core-6 set, e.g. SEO, whose related grid lists all six) */
@media (min-width: 560px) { .svc-explore--6 { grid-template-columns: repeat(3,1fr); } }
@media (min-width: 980px) { .svc-explore--6 { grid-template-columns: repeat(6,1fr); } }
.svc-explore a { display: flex; flex-direction: column; align-items: center; text-align: center; gap: .6rem; padding: 1.15rem .9rem 1rem; border: 1px solid var(--border); border-radius: var(--radius); background: rgba(var(--surface-rgb),.5); transition: border-color .25s var(--ease), transform .25s var(--ease), background .25s var(--ease); }
.svc-explore a:hover { border-color: var(--gold); transform: translateY(-3px); background: rgba(22,22,22,.6); }
.svc-explore .se-ico { width: 26px; height: 26px; color: var(--gold); flex-shrink: 0; }
.svc-explore .se-ico svg { width: 100%; height: 100%; display: block; }
.svc-explore .se-name { font-family: var(--font-display); font-weight: 600; color: var(--fg); font-size: .98rem; line-height: 1.25; }
.svc-explore .se-arw { color: var(--gold); font-size: 1.05rem; transition: transform .2s var(--ease); }
.svc-explore a:hover .se-arw { transform: translateY(3px); }
.svc-explore-cta { text-align: center; margin-top: clamp(1.4rem,2.8vw,2rem); }

/* Problem tabs: mini visual per panel */
.viz-mini { width: 100%; height: auto; max-width: 380px; margin-inline: auto; display: block; overflow: visible; }
.tabs__panel .svc-intro { margin: 0; }
.tabs__panel h3 { font-family: var(--font-display); font-weight: 600; font-size: clamp(1.45rem,2.6vw,2rem); color: var(--fg); line-height: 1.15; margin-bottom: 1rem; letter-spacing: -.01em; }
.tabs__panel .svc-intro p { color: var(--fg-dim); font-size: var(--fs-lede); line-height: 1.6; }
.tabs-cta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem 1.6rem; margin-top: clamp(1.8rem,3.6vw,2.8rem); padding-top: clamp(1.6rem,3vw,2.2rem); border-top: 1px solid var(--border); }
.tabs-cta__lead { margin: 0; max-width: 42ch; color: var(--fg); font-family: var(--font-display); font-weight: 600; font-size: clamp(1.05rem,1.8vw,1.3rem); line-height: 1.3; }
@media (max-width: 640px) { .tabs-cta { justify-content: flex-start; } .tabs-cta .btn { width: 100%; justify-content: center; } }

/* Industry "brands we've helped" cards: real client logos */
.brand-card__logo { height: 38px; width: auto; max-width: 175px; object-fit: contain; object-position: left center; display: block; margin-bottom: 1.15rem; filter: brightness(0) invert(1); }

.brand-card__logo--color { filter: none; }

/* Our Work: richer case-study cards */
.related-grid--3 { }
@media (min-width: 900px) { .related-grid--3 { grid-template-columns: repeat(3,1fr); } }
.cs-card { padding: clamp(1.4rem,2.4vw,1.8rem); }
.cs-card__brand { margin: 0 0 .9rem; min-height: 34px; display: flex; align-items: center; }
.cs-card__brand .brand-card__logo { height: 30px; max-width: 150px; margin-bottom: 0; }
.cs-card__desc { color: var(--fg-dim); font-size: var(--fs-sm); margin: .55rem 0 0; line-height: 1.55; }
.cs-card__stats { display: flex; gap: 1.8rem; margin: 1.15rem 0 .2rem; padding-top: 1.1rem; border-top: 1px solid var(--border); }
.cs-card__stat b { display: block; font-family: var(--font-display); font-weight: 800; font-size: clamp(1.5rem,2.2vw,1.85rem); color: var(--gold); line-height: 1; }
.cs-card__stat span { font-size: .68rem; color: var(--fg-dim); text-transform: uppercase; letter-spacing: .09em; margin-top: .35rem; display: block; }

/* Footer legal block: address + copyright, right-aligned */
.footer__legal { display: flex; flex-direction: column; gap: .3rem; text-align: right; }
.footer__legal .fine { font-style: normal; }
.footer__legal a.fine { text-decoration: none; }
.footer__legal a.fine:hover, .footer__legal a.fine:focus-visible { color: var(--fg); text-decoration: underline; text-underline-offset: 3px; }
.form__note a { color: var(--gold); text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 620px) { .footer__legal { text-align: left; } }

/* Contact page: team locations map */
.contact-map { margin-top: 1rem; }
.contact-map__svg { width: 100%; height: auto; max-width: 280px; display: block; }
.contact-map__cap { margin: 0 0 .55rem; color: var(--fg-dim); font-size: calc(var(--fs-sm) - 1px); }
.cm-pulse { animation: cmPulse 2.8s ease-out infinite; }
@keyframes cmPulse { 0% { r: 4px; opacity: .6; } 70% { opacity: 0; } 100% { r: 15px; opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .cm-pulse { animation: none; opacity: .22; } }


/* ============================================================
   rev1 — owner review 2026-10-15 + UX / WCAG 2.2 AA pass
   ============================================================ */

/* Type: no stranded single words; readable labels */
h1, h2, h3, .h2, .h3, .display, blockquote { text-wrap: balance; }
p, li, dd, figcaption { text-wrap: pretty; }
.eyebrow { font-size: 0.82rem; letter-spacing: 0.14em; }
:focus-visible { outline: 2px solid var(--gold-bright); outline-offset: 3px; }

/* Skip link */
.skip-link { position: absolute; left: 1rem; top: -100px; z-index: 100; background: var(--gold); color: var(--bg); font-weight: 700; padding: .7rem 1rem; border-radius: var(--radius); }
.skip-link:focus { top: 1rem; }
#main { scroll-margin-top: 90px; }
[id] { scroll-margin-top: 96px; }

/* Header: full wordmark */
.nav__brand { display: inline-flex; align-items: center; min-height: 44px; }
.nav__brand img { height: 40px; width: auto; }
@media (max-width: 860px) { .nav__brand img { height: 34px; } }
.nav__menu > li { display: flex; align-items: center; }
.nav__top { padding-block: .6rem; }
.nav__menu a.nav__top[aria-current] { color: var(--fg); }
.nav__sub { display: inline-grid; place-items: center; width: 24px; height: 32px; margin-left: 2px; padding: 0; background: none; border: 0; color: var(--fg-dim); border-radius: 6px; }
.nav__sub:hover { color: var(--fg); }
.nav__panel a[aria-current="page"] { color: var(--gold); }
.mobile-menu a[aria-current="page"] { color: var(--gold) !important; }
@media (max-width: 860px) {
  .mobile-menu[hidden] { display: none; }
  .mobile-menu { opacity: 1; transform: none; pointer-events: auto; max-height: calc(100vh - 76px); overflow-y: auto; }
}

/* Footer */
.site-footer .shell { display: grid; gap: clamp(2.2rem, 5vw, 3.5rem); }
@media (min-width: 980px) { .site-footer .shell { grid-template-columns: 0.9fr 2.1fr; } .footer__bottom { grid-column: 1 / -1; } }
.footer__logo img { height: 56px; width: auto; }
.footer__tag { color: var(--fg-dim); margin-top: 1.2rem; max-width: 34ch; font-size: var(--fs-sm); }
.footer__offices { margin-top: 1.1rem; color: var(--fg); font-weight: 600; font-size: 0.95rem; }
.footer__sep { color: var(--gold); }
.footer__contact { margin-top: .6rem; }
.footer__contact a { color: var(--fg); text-decoration: underline; text-underline-offset: 3px; text-decoration-color: rgba(var(--gold-rgb),.6); }
.footer__nav { margin-block: 0; }
.footer__h { font-family: var(--font-body); font-weight: 700; font-size: 0.78rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--fg-faint); margin-bottom: 1.1rem; }
.footer__col a { display: inline-block; padding-block: 2px; }
.footer__col a[aria-current="page"] { color: var(--gold); }
.footer__bottom { padding-top: 1.6rem; border-top: 1px solid var(--border); }
.footer__bottom .fine { color: var(--fg-faint); }
.footer__bottom a { color: var(--fg-dim); text-decoration: underline; text-underline-offset: 3px; }
.footer__bottom .fine { display: flex; flex-wrap: wrap; gap: .6rem 1rem; align-items: center; }
.motion-btn { background: none; border: 1px solid var(--border); color: var(--fg-dim); border-radius: 999px; padding: .35rem .85rem; font-size: .82rem; min-height: 32px; }
.motion-btn:hover { color: var(--fg); border-color: var(--fg-dim); }

/* Motion off (visitor's choice): stop every CSS loop */
.motion-paused *, .motion-paused *::before, .motion-paused *::after { animation: none !important; transition: none !important; }
.motion-paused .marquee__track { flex-wrap: wrap; justify-content: center; width: auto; }

/* Background video + its pause button */
.bgv { position: absolute; inset: 0; z-index: -3; width: 100%; height: 100%; object-fit: cover; }
.bgv-toggle { position: absolute; right: var(--gut); bottom: 1.2rem; z-index: 3; display: inline-flex; align-items: center; gap: .5rem; min-height: 36px; padding: .4rem .8rem; border-radius: 999px; border: 1px solid rgba(245,245,245,.28); background: rgba(var(--bg-rgb),.55); color: var(--fg); font-size: .8rem; font-weight: 600; backdrop-filter: blur(6px); }
.bgv-toggle:hover { border-color: var(--fg); }
.bgv-toggle .vt-ico-play { display: none; }
.bgv-toggle.is-paused .vt-ico-play { display: inline; }
.bgv-toggle.is-paused .vt-ico-pause { display: none; }
@media (prefers-reduced-motion: reduce) { .bgv { display: none; } }

/* ---- rev1 homepage ---- */
html { scroll-padding-top: 96px; }
.hero .hero__scrim { background: linear-gradient(180deg, rgba(var(--bg-rgb),.70) 0%, rgba(var(--bg-rgb),.62) 40%, rgba(var(--bg-rgb),.70) 70%, rgba(var(--bg-rgb),.94) 100%); }
.hero .bgv { z-index: -3; }
@media (prefers-reduced-motion: reduce) { .bgv { display: block; } .bgv-toggle { display: none; } }
.hero__category { color: #D6D6D6; }

.logo-band { padding-block: clamp(2.6rem, 5vw, 3.6rem); border-block: 1px solid var(--border); background: var(--bg); }
.logo-band__label { text-align: center; font-family: var(--font-body); font-weight: 700; font-size: .85rem; letter-spacing: .14em; text-transform: uppercase; color: var(--fg-dim); margin-bottom: clamp(1.6rem, 3vw, 2.2rem); }
.logo-grid { list-style: none; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: clamp(1.6rem, 3.4vw, 3rem) clamp(2rem, 4.5vw, 3.8rem); }
.logo-grid img { width: auto; max-width: 180px; object-fit: contain; opacity: .92; }
@media (max-width: 620px) { .logo-grid img { max-width: 132px; transform: scale(.82); } .logo-grid { gap: 1.2rem 1.6rem; } }

.pressure3 { display: grid; gap: clamp(2rem, 5vw, 4rem); align-items: center; position: relative; z-index: 1; }
@media (min-width: 960px) { .pressure3 { grid-template-columns: .85fr 1.15fr; } }
.pressure3__list { list-style: none; padding: 0; margin-top: 2rem; display: grid; gap: 1rem; max-width: 46ch; }
.pressure3__list li { position: relative; padding-left: 1.7rem; font-size: var(--fs-lede); line-height: 1.45; color: var(--fg-dim); }
.pressure3__list li::before { content: ""; position: absolute; left: 0; top: .6em; width: 9px; height: 9px; border: 1.5px solid var(--gold); border-radius: 50%; }
.gc-wrap { margin: 0; }
.gc--staged { width: 100%; height: auto; overflow: visible; }
.gc--staged text { font-family: var(--font-body); font-size: 15px; font-weight: 600; fill: #D6D6D6; }
.gc--staged .gc-gold-t { fill: var(--gold-bright); font-weight: 700; }
.reveal-ready .gc-lbl { opacity: 0; }
.reveal-ready .reveal.is-in .gc-lbl { animation: gcFade .5s ease forwards; }
.reveal-ready .reveal.is-in .gc-lbl--1 { animation-delay: .7s; }
.reveal-ready .reveal.is-in .gc-lbl--2 { animation-delay: 1.2s; }
.reveal-ready .reveal.is-in .gc-lbl--3 { animation-delay: 1.6s; }
.reveal-ready .reveal.is-in .gc-lbl--4 { animation-delay: 2.7s; }
.gc .gc-node { transform-origin: 400px 180px; }

.proof3__top { position: relative; z-index: 1; display: grid; gap: clamp(1.8rem, 4vw, 3rem); align-items: end; margin-bottom: clamp(2.2rem, 4vw, 3.2rem); }
@media (min-width: 960px) { .proof3__top { grid-template-columns: 1fr 1fr; } }
.proof3__top .lede { margin-top: 1.2rem; }
.roi { margin: 0; padding: clamp(1.4rem, 3vw, 2rem); border: 1px solid rgba(var(--gold-rgb),.45); border-radius: var(--radius); background: rgba(var(--bg-rgb),.6); }
.roi__eq { font-family: var(--font-display); font-weight: 700; line-height: 1; letter-spacing: -.02em; font-size: clamp(2.6rem, 6.4vw, 4.6rem); display: flex; flex-wrap: wrap; align-items: baseline; gap: .1em .3em; }
.roi__in { color: var(--fg); } .roi__op { color: var(--fg-dim); font-weight: 500; } .roi__out { color: var(--gold); }
.roi figcaption { margin-top: .9rem; color: var(--fg-dim); font-size: var(--fs-sm); }
.proof3__h { position: relative; z-index: 1; font-family: var(--font-body); font-weight: 700; font-size: .85rem; letter-spacing: .14em; text-transform: uppercase; color: var(--fg-dim); margin: 0 0 1rem; }
.cases, .quotes { list-style: none; padding: 0; position: relative; z-index: 1; display: grid; gap: 1rem; }
@media (min-width: 860px) { .cases, .quotes { grid-template-columns: repeat(3, 1fr); } }
.cases { margin-bottom: clamp(2.4rem, 5vw, 3.4rem); }
.case { display: flex; flex-direction: column; height: 100%; padding: clamp(1.4rem, 2.6vw, 2rem); border: 1px solid var(--border); border-radius: var(--radius); background: rgba(var(--surface-rgb),.78); transition: border-color .25s var(--ease), transform .25s var(--ease); }
.case:hover { border-color: var(--gold); transform: translateY(-3px); }
.case__logo { width: auto; max-width: 160px; object-fit: contain; object-position: left center; margin-bottom: 1.4rem; }
.case__big { font-family: var(--font-display); font-weight: 700; color: var(--gold); font-size: clamp(2rem, 3.4vw, 2.6rem); line-height: 1; }
.case__big--2 { font-size: clamp(1.4rem, 2.2vw, 1.7rem); margin-top: 1rem; }
.case__lbl { color: var(--fg-dim); font-size: var(--fs-sm); margin-top: .35rem; }
.case__more { margin-top: auto; padding-top: 1.3rem; color: var(--fg); font-weight: 700; font-size: .9rem; }
.case:hover .case__more .arw { transform: translateX(4px); display: inline-block; }
.case__flag, .quote__flag { display: inline-block; align-self: flex-start; margin-top: .9rem; font-size: .72rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--gold); border: 1px dashed var(--gold); border-radius: 999px; padding: .25rem .6rem; }
.quote { margin: 0; height: 100%; display: flex; flex-direction: column; padding: clamp(1.4rem, 2.6vw, 2rem); border: 1px solid var(--border); border-radius: var(--radius); background: rgba(var(--surface-rgb),.78); }
.quote__logo { width: auto; max-width: 150px; object-fit: contain; object-position: left center; margin-bottom: 1.2rem; }
.quote blockquote { margin: 0; font-family: var(--font-display); font-weight: 600; font-size: clamp(1.05rem, 1.6vw, 1.22rem); line-height: 1.38; color: var(--fg); }
.quote figcaption { margin-top: auto; padding-top: 1.2rem; color: var(--gold); font-weight: 700; font-size: .88rem; display: grid; gap: .35rem; }
.quote figcaption a { color: var(--fg-dim); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.quote figcaption a:hover { color: var(--fg); }
.proof3__all { position: relative; z-index: 1; margin-top: 2rem; }

.mechanism__body p { color: var(--fg-dim); }

.svc3 { list-style: none; padding: 0; display: grid; gap: 1rem; position: relative; z-index: 1; }
@media (min-width: 640px) { .svc3 { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1000px) { .svc3 { grid-template-columns: repeat(3, 1fr); } }
.svc3__tile { height: 100%; display: flex; flex-direction: column; gap: .6rem; padding: clamp(1.4rem, 2.6vw, 2rem); border: 1px solid var(--border); border-radius: var(--radius); background: rgba(var(--surface-rgb),.82); transition: border-color .25s var(--ease), transform .25s var(--ease); }
.svc3__tile:hover { border-color: var(--gold); transform: translateY(-3px); }
.svc3__tile .svc2__ico { margin-bottom: .6rem; }
.svc3__tile h3 { font-family: var(--font-display); font-weight: 600; font-size: clamp(1.2rem, 2vw, 1.45rem); }
.svc3__tile > p { color: var(--fg-dim); font-size: var(--fs-sm); }
.svc3__terms { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .4rem; }
.svc3__terms li { font-size: .78rem; font-weight: 600; color: var(--fg); border: 1px solid #3A3A3A; border-radius: 999px; padding: .2rem .6rem; background: rgba(245,245,245,.04); }
.svc3__go { margin-top: auto; padding-top: .9rem; color: var(--gold); font-weight: 700; font-size: .9rem; }
.svc3__tile:hover .svc3__go .arw { transform: translateX(4px); display: inline-block; }

.model3__head { position: relative; z-index: 1; max-width: 60ch; margin-bottom: clamp(2.2rem, 4vw, 3.2rem); }
.model3__head .lede { margin-top: 1.2rem; max-width: 60ch; }
.model3 { list-style: none; padding: 0; position: relative; z-index: 1; display: grid; gap: 1rem; counter-reset: lever; }
@media (min-width: 900px) { .model3 { grid-template-columns: repeat(3, 1fr); } }
.model3__lever { position: relative; padding: clamp(1.5rem, 2.8vw, 2.2rem); border: 1px solid var(--border); border-radius: var(--radius); background: rgba(12,12,12,.8); }
.model3__n { display: grid; place-items: center; width: 2.4rem; height: 2.4rem; border-radius: 50%; background: var(--gold); color: var(--bg); font-family: var(--font-display); font-weight: 700; margin-bottom: 1.2rem; }
.model3__lever h3 { font-family: var(--font-display); font-weight: 600; font-size: 1.5rem; }
.model3__q { color: var(--fg); font-size: var(--fs-lede); line-height: 1.35; margin: .5rem 0 .8rem; }
.model3__lever p { color: var(--fg-dim); font-size: var(--fs-sm); }
.model3__kpi { margin-top: 1rem; padding-top: .9rem; border-top: 1px solid var(--border); color: var(--gold) !important; font-weight: 700; font-size: .85rem !important; }
@media (min-width: 900px) { .model3__lever:not(:last-child)::after { content: ""; position: absolute; top: 2.9rem; right: -1rem; width: 1rem; height: 1px; background: var(--gold); } }
.model3__how { position: relative; z-index: 1; margin-top: clamp(1.8rem, 3.5vw, 2.6rem); display: flex; flex-wrap: wrap; align-items: center; gap: .6rem 1.2rem; }
.model3__how-h { font-weight: 700; font-size: .85rem; letter-spacing: .14em; text-transform: uppercase; color: var(--fg-dim); }
.model3__steps { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: .4rem; counter-reset: step; }
.model3__steps li { counter-increment: step; font-size: .88rem; font-weight: 600; color: var(--fg); padding: .3rem .75rem; border: 1px solid #3A3A3A; border-radius: 999px; }
.model3__steps li::before { content: counter(step) ". "; color: var(--gold); }

.team3 { position: relative; z-index: 1; display: grid; gap: clamp(2rem, 5vw, 4rem); align-items: center; }
@media (min-width: 960px) { .team3 { grid-template-columns: 1.1fr .9fr; } }
.team3 .team2__lead { margin-top: 1.4rem; font-size: clamp(1.3rem, 2.4vw, 1.75rem); }
.team3__body { color: var(--fg-dim); margin: 1.2rem 0 1.8rem; max-width: 52ch; }
.leaders { list-style: none; padding: 0; display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }
.leader { text-align: center; padding: 1.4rem 1rem; border: 1px solid var(--border); border-radius: var(--radius); background: rgba(var(--surface-rgb),.6); }
.leader img { width: 96px; height: 96px; border-radius: 50%; object-fit: cover; margin: 0 auto 1rem; border: 1px solid var(--border); }
.leader__name { font-family: var(--font-display); font-weight: 600; font-size: 1.05rem; color: var(--fg); }
.leader__role { color: var(--gold); font-size: .8rem; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; margin-top: .35rem; }

.audit2__lede { color: var(--fg-dim); margin-top: 1.3rem; max-width: 56ch; }
.audit2__close { font-family: var(--font-display); font-weight: 600; font-size: clamp(1.2rem, 2.2vw, 1.6rem) !important; color: var(--fg) !important; max-width: 30ch !important; }

/* Gold bands become dark with a gold edge until the brand colours are confirmed (owner: talk to Hillary). */
.gold-cta { background: var(--surface); color: var(--fg); border-top: 1px solid var(--gold); }
.gold-cta__glow { background: radial-gradient(circle at 20% 40%, var(--gold-glow), transparent 60%); }
.gold-cta h2 { color: var(--fg); }
.gold-cta p { color: var(--fg-dim); }
.gold-cta .eyebrow { color: var(--gold); }
.gold-cta .eyebrow::before { background: var(--gold); }
.gold-cta .btn--dark { background: var(--gold); color: var(--bg); }
.gold-cta .btn--dark:hover { background: var(--gold-bright); }
.gold-cta .btn--outline { color: var(--fg); border-color: var(--field-border); }
.gold-cta .btn--outline:hover { border-color: var(--fg); }
.gold-cta .fx-bg { opacity: .35; }
/* Service tiles: the "Explore" cue is always visible (was hover-only). */
.svc2__tile .go { opacity: 1; transform: none; }
/* The texture images carry a light band on their right edge: overscan it out of view (parents clip). */
.tex-bg { right: -14%; }
.roi__eq { font-size: clamp(2.2rem, 4.6vw, 3.7rem); white-space: nowrap; }
@media (max-width: 420px) { .roi__eq { white-space: normal; } }
.leaders { grid-template-columns: 1fr; gap: .8rem; }
.leader { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 0 1.1rem; text-align: left; padding: 1rem 1.2rem; }
.leader img { grid-row: span 2; width: 72px; height: 72px; margin: 0; }
.leader__role { margin-top: .15rem; }

/* ---- rev1 forms (contact + growth-audit application) ---- */
.form__field, .form__group { display: grid; gap: .45rem; }
.form label, .form legend { text-transform: none; letter-spacing: 0; font-size: .95rem; font-weight: 700; color: var(--fg); margin-bottom: 0; }
.form .req, .form .opt { font-weight: 500; font-size: .82rem; color: var(--fg-dim); }
.form__group { border: 0; padding: 0; margin: 0; min-width: 0; }
.form__group legend { padding: 0; margin-bottom: .55rem; }
.form__choices label { min-height: 32px; font-size: .92rem; color: var(--fg); }
.form__choices input { width: 18px; height: 18px; flex-shrink: 0; }
@media (max-width: 520px) { .form__choices { grid-template-columns: 1fr; } }
.form__hint { color: var(--fg-dim); font-size: .85rem; margin: -.1rem 0 .1rem; }
.form__field-err { color: #FF9B87; font-size: .88rem; font-weight: 600; margin-top: .2rem; }
.form [aria-invalid="true"] { border-color: #FF9B87 !important; }
fieldset[aria-invalid="true"] { border-left: 2px solid #FF9B87; padding-left: .8rem; }
.form__err { display: block; padding: .9rem 1.1rem; border: 1px solid #FF9B87; border-radius: 10px; color: var(--fg); background: rgba(255,155,135,.08); }
.form__err[hidden] { display: none; }
.form__intro, .form__prefill { color: var(--fg-dim); font-size: .92rem; }
.form__prefill { color: var(--gold); }
.form__step { font-family: var(--font-display); font-weight: 600; font-size: 1.15rem; color: var(--fg); padding-top: .9rem; border-top: 1px solid var(--border); margin-top: .4rem; }
.form__step:first-of-type { border-top: 0; padding-top: 0; }
.form__hp { position: absolute; left: -9999px; top: auto; width: 1px; height: 1px; overflow: hidden; }
.form__done { padding: clamp(1.4rem, 3vw, 2rem); border: 1px solid var(--gold); border-radius: 12px; background: rgba(var(--gold-rgb),.08); display: grid; gap: .8rem; }
.form__done[hidden] { display: none; }
.form__done h3 { font-family: var(--font-display); font-size: 1.5rem; }
.form__done h3:focus { outline: none; }
.form__done p { color: var(--fg-dim); }
.form__review { color: var(--fg) !important; border-top: 1px dashed var(--gold); padding-top: .8rem; }
.form button[type=submit] { justify-self: start; }

/* ---- Growth audit page ---- */
.ga-fit { display: grid; gap: clamp(2rem, 5vw, 4.5rem); }
@media (min-width: 960px) { .ga-fit { grid-template-columns: 1.1fr .9fr; align-items: start; } }
.ga-criteria { list-style: none; padding: 0; margin-top: 2rem; display: grid; gap: 0; counter-reset: c; }
.ga-criteria li { counter-increment: c; padding: 1.3rem 0 1.3rem 3.2rem; border-top: 1px solid var(--border); position: relative; }
.ga-criteria li:last-child { border-bottom: 1px solid var(--border); }
.ga-criteria li::before { content: "0" counter(c); position: absolute; left: 0; top: 1.15rem; font-family: var(--font-display); font-weight: 600; font-size: 1.6rem; color: transparent; -webkit-text-stroke: 1px rgba(var(--gold-rgb),.7); }
.ga-criteria h3 { font-family: var(--font-display); font-weight: 600; font-size: 1.25rem; }
.ga-criteria p { color: var(--fg-dim); margin-top: .35rem; }
.ga-sub { font-family: var(--font-display); font-weight: 600; font-size: 1.35rem; margin-bottom: 1.3rem; }
.ga-budget { margin-top: 1.6rem; padding: 1rem 1.2rem; border-left: 2px solid var(--gold); background: var(--surface); color: var(--fg); }
.ga-steps { list-style: none; padding: 0; display: grid; gap: 1rem; }
@media (min-width: 900px) { .ga-steps { grid-template-columns: repeat(5, 1fr); } }
.ga-steps li { padding: 1.4rem; border: 1px solid var(--border); border-radius: var(--radius); background: rgba(var(--bg-rgb),.6); }
.ga-steps__n { display: grid; place-items: center; width: 2.2rem; height: 2.2rem; border-radius: 50%; background: var(--gold); color: var(--bg); font-weight: 700; font-family: var(--font-display); margin-bottom: 1rem; }
.ga-steps h3 { font-family: var(--font-display); font-weight: 600; font-size: 1.1rem; margin-bottom: .4rem; }
.ga-steps p { color: var(--fg-dim); font-size: var(--fs-sm); }
.ga-scope { border-top: 0; padding-top: 0; }
.ga-apply { display: grid; gap: clamp(2rem, 5vw, 4rem); }
/* Apply section: the markup runs heading, form, then How it works and the quote, so phones reach the form first
   (Korey, 2026-11-11). Wide screens keep the old look: heading with How it works and the quote on the left, form on the right. */
@media (min-width: 1000px) {
  .ga-apply { grid-template-columns: .8fr 1.2fr; grid-template-rows: auto 1fr; grid-template-areas: "head form" "aside form"; row-gap: 0; align-items: start; }
  .ga-apply__head { grid-area: head; } .ga-apply__form { grid-area: form; } .ga-apply__aside { grid-area: aside; }
}
.ga-apply__lede { color: var(--fg-dim); margin: 1.2rem 0 2rem; font-size: var(--fs-lede); }
@media (max-width: 999.98px) { .ga-apply__lede { margin-bottom: 0; } }
.ga-quote { height: auto; }
/* The High Liner quote on /growth-audit/ carries the same harbour photo as on the homepage, but stays left-aligned in its column. */
.ga-quote.quote--brand { text-align: left; }
.ga-quote.quote--brand .logo-box { justify-content: flex-start; }
.ga-quote.quote--brand .quote__logo { object-position: left center; }
.ga-quote.quote--brand > * { justify-self: start; align-self: flex-start; }
.ga-quote.quote--brand figcaption { justify-items: start; text-align: left; }
.page-hero .crumb a { color: var(--fg-dim); text-decoration: underline; text-underline-offset: 3px; }
.crumb { color: var(--fg-dim); }
.sec-head p.eyebrow { font-size: .82rem; color: var(--gold); margin-top: 0; line-height: 1.4; max-width: none; }
.footer__bottom .fine:first-child { display: block; }
.audit-callout { padding: clamp(1.4rem, 3vw, 2rem); border: 1px solid rgba(var(--gold-rgb),.5); border-radius: var(--radius); background: rgba(var(--gold-rgb),.06); }
.audit-callout h2 { font-family: var(--font-display); font-weight: 600; font-size: clamp(1.5rem, 2.6vw, 2rem); margin-bottom: .8rem; }
.audit-callout p:not(.eyebrow) { color: var(--fg-dim); margin-bottom: 1.4rem; }

/* ---- rev1 shared closing band (one CTA per page; dark until brand colours are confirmed) ---- */
.close-band { background: var(--surface); border-top: 1px solid rgba(var(--gold-rgb),.6); position: relative; overflow: hidden; }
.close-band::before { content: ""; position: absolute; inset: 0; background: radial-gradient(50% 80% at 15% 30%, var(--gold-glow), transparent 70%); pointer-events: none; }
.close-band__inner { position: relative; display: grid; gap: 1.8rem; align-items: center; }
@media (min-width: 900px) { .close-band__inner { grid-template-columns: 1.3fr .7fr; } .close-band__cta { justify-content: flex-end; } }
.close-band h2 { max-width: 24ch; }
.close-band p { color: var(--fg-dim); margin-top: 1rem; font-size: var(--fs-lede); max-width: 48ch; }
.close-band__cta { display: flex; flex-wrap: wrap; gap: .9rem; }

/* ---- rev1 About ---- */
.about-who { display: grid; gap: clamp(1.6rem, 4vw, 4rem); }
@media (min-width: 960px) { .about-who { grid-template-columns: .9fr 1.1fr; align-items: start; } }
.about-story, .about-better, .about-team { display: grid; gap: clamp(2rem, 5vw, 4.5rem); align-items: center; }
@media (min-width: 960px) { .about-story { grid-template-columns: .8fr 1.2fr; } .about-better { grid-template-columns: 1.1fr .9fr; align-items: start; } .about-team { grid-template-columns: 1fr 1fr; } }
.founders { margin: 0; }
.founders__photos { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem; }
.founders__photos img { width: 100%; height: auto; aspect-ratio: 1; object-fit: cover; border-radius: var(--radius); border: 1px solid var(--border); }
.founders figcaption { margin-top: .8rem; color: var(--fg-dim); font-size: var(--fs-sm); }
.about-believe__h { font-family: var(--font-display); font-weight: 600; font-size: clamp(1.25rem, 2vw, 1.55rem); line-height: 1.25; margin-bottom: 1.4rem; }
.about-team__p { color: var(--fg-dim); margin: 1.2rem 0 1.6rem; max-width: 46ch; }
.about-clients { color: var(--fg-dim); text-align: center; max-width: 80ch; margin: 0 auto; font-size: var(--fs-sm); }
.check-list--belief p { color: var(--fg-dim); }
.about-better .check-list--cards { grid-template-columns: 1fr; gap: .8rem; }
.about-better .check-list--cards li { grid-template-columns: auto 1fr; gap: 1rem; padding: 1.1rem 1.2rem; }
.about-better .check-list--belief li .ico { width: 40px; height: 40px; padding: 9px; border-radius: 10px; }
.about-better .check-list--belief li p { align-self: start; }
/* ---- rev1 Our Work + case studies ---- */
.cases--work { margin-bottom: 0; }
.case--wide .case__cat { color: var(--gold); font-weight: 700; font-size: .78rem; letter-spacing: .1em; text-transform: uppercase; }
.case--wide .case__desc { color: var(--fg); margin: .6rem 0 1.2rem; font-size: 1.02rem; line-height: 1.45; }
.case__stats { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem; padding-top: 1rem; border-top: 1px solid var(--border); }
.case__stats p { display: grid; gap: .2rem; }
.case__stats .case__big { font-size: clamp(1.7rem, 2.6vw, 2.2rem); }
.cs-hero__logo { display: block; width: auto; max-width: 220px; margin: 1.2rem 0 .4rem; }

/* ---- rev1 Industries ---- */
.pp-list { list-style: none; padding: 0; display: grid; gap: 1rem; position: relative; z-index: 1; }
.pp-row { display: grid; gap: 1.2rem; align-items: center; padding: clamp(1.3rem, 2.6vw, 1.9rem); border: 1px solid var(--border); border-radius: var(--radius); background: rgba(12,12,12,.78); }
@media (min-width: 860px) { .pp-row { grid-template-columns: 1.2fr .8fr; } }
.pp-row h3 { font-family: var(--font-display); font-weight: 600; font-size: 1.3rem; margin-bottom: .4rem; }
.pp-row p { color: var(--fg-dim); }
.pp-viz svg { width: 100%; max-width: 320px; height: auto; margin-inline: auto; }
.sys-diagram { margin: 0 auto clamp(1.8rem, 4vw, 2.8rem); max-width: 640px; }
.sys-diagram svg { width: 100%; height: auto; overflow: visible; }
.sd-lines { stroke: rgba(var(--gold-rgb),.55); stroke-width: 1.2; fill: none; }
.sd-lines polygon { stroke: rgba(var(--gold-rgb),.35); fill: rgba(var(--gold-rgb),.04); }
.sd-node { fill: var(--gold); }
.sys-diagram text { font-family: var(--font-body); font-size: 14px; font-weight: 700; fill: #E6E6E6; }
.sd-core { fill: var(--bg); stroke: var(--gold); stroke-width: 2; }
.sys-diagram .sd-core-t { font-family: var(--font-display); font-size: 15px; fill: var(--gold); }
.feature-list { position: relative; z-index: 1; }
.svc-intro:not(.svc-intro--viz) { display: block; max-width: 70ch; }
.svc-intro:not(.svc-intro--viz) > div > p:not(.eyebrow) { font-size: var(--fs-lede); color: var(--fg-dim); line-height: 1.55; margin-top: 1rem; }
.rosette { margin: clamp(1.5rem, 4vw, 2.5rem) auto; max-width: 620px; }
.rosette svg { width: 100%; height: auto; overflow: visible; }
.ro-c circle { fill: rgba(var(--gold-rgb),.05); stroke: rgba(var(--gold-rgb),.6); stroke-width: 1.3; }
.rosette text { font-family: var(--font-body); font-size: 15px; font-weight: 700; fill: #E6E6E6; }
.rosette .sd-core-t { font-family: var(--font-display); fill: var(--gold); font-size: 14px; }
.selective { position: relative; z-index: 1; margin-top: clamp(1.8rem, 4vw, 2.6rem); padding: 1.1rem 1.3rem; border-left: 2px solid var(--gold); background: rgba(var(--bg-rgb),.6); color: var(--fg); max-width: 70ch; }

/* ---- rev1 Services ---- */
.platforms { padding-block: 1.6rem; border-bottom: 1px solid var(--border); background: var(--bg); }
.platforms .shell { display: flex; flex-wrap: wrap; align-items: center; gap: .8rem 1.4rem; }
.platforms__h { font-weight: 700; font-size: .82rem; letter-spacing: .14em; text-transform: uppercase; color: var(--fg-dim); }
.platforms__list { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: .5rem; }
.platforms__list li { font-weight: 600; font-size: .92rem; color: var(--fg); border: 1px solid #3A3A3A; border-radius: 999px; padding: .3rem .85rem; }
.qc { display: grid; gap: clamp(2rem, 5vw, 4rem); }
@media (min-width: 960px) { .qc { grid-template-columns: 1fr 1fr; align-items: start; } }
.qc__lede { color: var(--fg-dim); margin: 1.2rem 0 1.4rem; font-size: var(--fs-lede); }
.qc__signs { list-style: none; padding: 0; display: grid; gap: .8rem; }
.qc__signs li { position: relative; padding: .9rem 1rem .9rem 2.6rem; border: 1px solid var(--border); border-radius: var(--radius); color: var(--fg); background: rgba(var(--bg-rgb),.5); }
.qc__signs li::before { content: "?"; position: absolute; left: .9rem; top: .85rem; width: 1.2rem; height: 1.2rem; border-radius: 50%; border: 1.5px solid var(--gold); color: var(--gold); font-size: .75rem; font-weight: 800; display: grid; place-items: center; }

/* Hover lift only on things you can click (owner: hover boxes "don't work") */
.feature-card:hover, .check-list--cards li:hover, .svc-diff__card:hover, .team2__pts li:hover { transform: none; border-color: var(--border); }
.svc-jobs li:hover { background: inherit; }
.feature-card, .check-list--cards li, .svc-diff__card { transition: none; }
.bullet { padding-block: clamp(2.6rem, 6vw, 4.5rem); background: var(--bg); border-bottom: 1px solid var(--border); text-align: center; }
.bullet__q { font-family: var(--font-display); font-weight: 700; font-size: clamp(2rem, 4.6vw, 3.6rem); line-height: 1.05; color: var(--fg); max-width: 22ch; margin: 0 auto; }
.bullet__s { color: var(--fg-dim); margin: 1rem auto 0; font-size: var(--fs-lede); max-width: 48ch; }
.team-wide { color: var(--fg-dim); font-size: var(--fs-lede); margin-top: 1.2rem; max-width: 62ch; }
/* Insights: cards stand off the background (owner: white on black "just isn't showing up") */
.insights-list .cs-card, .res-card { background: #1A1A1A; border-color: #333; }
.insights-list .cs-card h3 { color: #FFFFFF; }
.insights-list .cs-card p { color: #D0D0D0; }
/* Reflow at 320px (WCAG 1.4.10) */
.contact-grid > *, .ga-apply > *, .qc > *, .about-story > *, .about-better > * { min-width: 0; }
@media (max-width: 400px) {
  .contact-form-wrap { padding: 1.1rem; }
  .cf-turnstile { transform: scale(.86); transform-origin: 0 0; height: 56px; }
}
.form > *, .form__field > *, .form__group { min-width: 0; }
.form select, .form input, .form textarea { max-width: 100%; }
.notes h2 { margin: 2.6rem 0 1.2rem; font-size: clamp(1.6rem, 3vw, 2.2rem); }
.notes h2:first-child { margin-top: 0; }
.notes__list { display: grid; gap: .9rem; padding-left: 1.2rem; color: var(--fg-dim); }
.notes__list strong { color: var(--fg); }
.notes__foot { margin-top: 2.4rem; padding: 1rem 1.2rem; border-left: 2px solid var(--gold); background: var(--surface); }

/* Logos sit in a fixed-height box so cards line up across a row (owner: logos askew) */
.logo-box { display: flex; align-items: center; height: 64px; margin-bottom: 1.2rem; }
.logo-box img { margin: 0 !important; max-height: 100%; }
.quote .logo-box { height: 52px; }
.logo-box--hero { height: 72px; margin: 1.2rem 0 1rem; }
.case { display: flex; flex-direction: column; }
.case--wide .case__desc { flex: 0 0 auto; }
.case--wide .case__stats { margin-top: auto; }
.case > .case__more { margin-top: auto; }
.case--wide > .case__more { margin-top: 0; padding-top: 1.1rem; }
.quote figcaption { margin-top: auto; }
/* Row-by-row alignment across cards (subgrid): logo, labels, numbers and links line up. */
@media (min-width: 860px) {
  .cases > li, .quotes > li { display: grid; grid-template-rows: subgrid; }
  .cases > li > .case, .quotes > li > .quote { display: grid; grid-template-rows: subgrid; grid-row: 1 / -1; row-gap: 0; align-content: start; }
  .cases > li { grid-row: span 7; }
  .cases--work > li { grid-row: span 6; }
  .quotes > li { grid-row: span 3; }
  .case > *, .quote > * { align-self: start; }
  .case > .case__more, .case--wide > .case__more { align-self: end; margin-top: 0; }
  .case > .case__btn { align-self: end; justify-self: start; margin-top: 1.1rem; }
  .case__flag { align-self: end; justify-self: start; }
  .case--wide .case__stats { margin-top: 0; align-self: end; }
  .quote figcaption { align-self: end; }
}
@media (min-width: 860px) { .case--wide .case__stats { align-self: start; } .case--wide .case__desc { align-self: start; } }
.form[hidden] { display: none; }
[data-done-live][hidden], [data-done-review][hidden] { display: none; }

/* Hero: gold smoke video (Pexels 3051360, seamless loop) under a 75% black layer.
   Measured: body text #D6D6D6 stays >= 7:1 over the clip's brightest gold; fades to the page at the bottom. */
.hero--smoke .hero__scrim { background: linear-gradient(180deg, rgba(var(--bg-rgb),.75) 0%, rgba(var(--bg-rgb),.75) 72%, rgba(var(--bg-rgb),1) 100%); }
.hero--smoke .hero__glow { display: none; }
.hero--smoke .hero__eyebrow { color: #F3DDA6; }
.hero--smoke .hero__eyebrow::before { background: #F3DDA6; }
.hero--smoke .btn--ghost { background: rgba(var(--bg-rgb),.55); border-color: rgba(245,245,245,.4); }
.hero--smoke .btn--ghost:hover { background: rgba(var(--bg-rgb),.75); border-color: var(--fg); }
.viz-note { margin-top: .5rem; text-align: center; font-size: .75rem; letter-spacing: .1em; text-transform: uppercase; color: var(--fg-faint); }

/* Header logo: full wordmark at the top of the page, H mark once scrolled (Korey, 2026-10-15) */
.nav__brand { position: relative; width: 74px; height: 40px; }
.nav__brand .brand-full, .nav__brand .brand-mark { position: absolute; left: 0; top: 50%; transform-origin: left center; transition: opacity .3s var(--ease), transform .35s var(--ease); }
.nav__brand .brand-full { height: 40px; width: auto; transform: translateY(-50%); }
.nav__brand .brand-mark { height: 30px; width: auto; opacity: 0; transform: translateY(-50%) scale(.7); }
.site-header.is-compact .brand-full { opacity: 0; transform: translateY(-50%) scale(.75); }
.site-header.is-compact .brand-mark { opacity: 1; transform: translateY(-50%) scale(1); }
@media (max-width: 860px) { .nav__brand { width: 63px; height: 34px; } .nav__brand .brand-full { height: 34px; } .nav__brand .brand-mark { height: 26px; } }
@media (prefers-reduced-motion: reduce) { .nav__brand .brand-full, .nav__brand .brand-mark { transition: none; } }
/* Phone header: when the hero's main button slides under the header (js/hale.js sets .is-docked), the Apply button docks in the middle of
   the header and follows the reader down the page; when the hero button is back in view it lets go (Korey, 2026-11-11).
   It is always laid out, so nothing moves when it appears; hidden uses visibility, so it is also out of the tab order.
   Hidden while the menu is open (the menu has its own button). Narrow phones get the short label; the accessible name stays the full one. */
.nav__apply-short { display: none; }
@media (max-width: 860px) {
  .nav { gap: .75rem; }
  .nav__primary { display: none; }
  .nav__brand, .nav__toggle { flex-shrink: 0; }
  .nav__actions { gap: .5rem; }
  .nav__actions .nav__apply { display: inline-flex; justify-content: center; min-height: 44px; padding: 0 .9em; font-size: .875rem; line-height: 1.2; white-space: nowrap; opacity: 0; visibility: hidden; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -20%) scale(.92); transform-origin: center; transition: opacity .3s var(--ease), transform .35s var(--ease), background .3s var(--ease), visibility 0s linear .35s; }
  .site-header.is-docked:not(.is-open) .nav__apply { opacity: 1; visibility: visible; transform: translate(-50%, -50%); transition: opacity .3s var(--ease), transform .35s var(--ease), background .3s var(--ease), visibility 0s; }
}
/* Label rule, measured 2026-11-11: the full label needs 190px and the room is the viewport minus 167px, so it fits from about 357px.
   Full label from 375px up (18px to spare); below that "Apply for an Audit" (145px). */
@media (max-width: 374.98px) { .nav__apply-long { display: none; } .nav__apply-short { display: inline; } }
@media (max-width: 860px) and (prefers-reduced-motion: reduce) { .nav__actions .nav__apply, .site-header.is-docked:not(.is-open) .nav__apply { transition: none; transform: translate(-50%, -50%); } }
/* audit fixes */
.audit2__top { grid-template-columns: 1fr !important; }
@media (min-width: 960px) { .pressure3 { grid-template-columns: .7fr 1.3fr; } }
.gc-wrap { max-width: none; }
.proof3__also { position: relative; z-index: 1; font-weight: 700; font-size: .85rem; letter-spacing: .14em; text-transform: uppercase; color: var(--fg-dim); margin: -1.2rem 0 1rem; }
.logo-grid--sm { position: relative; z-index: 1; justify-content: flex-start; gap: 1.2rem 2.2rem; margin-bottom: clamp(2.4rem, 5vw, 3.4rem); }
.logo-grid--sm img { opacity: .85; }
.close-band__logo { height: 34px; width: auto; margin-bottom: 1.2rem; opacity: .9; }
.insights-list .cs-card { background: #242424; border-color: #3D3D3D; }
.insights-list .cs-card:hover { border-color: var(--gold); }
/* Sections whose illustration was removed: content takes the full width */
.svc-intro--viz:not(:has(.viz-frame)) { grid-template-columns: 1fr !important; }
@media (min-width: 860px) { .svc-intro--viz:not(:has(.viz-frame)) .check-list--cards { grid-template-columns: repeat(2, 1fr) !important; } }
.check-list { padding-left: 0; }

/* rev1: storm backgrounds from the July 2025 design (homepage + About, Work, Team heroes) */
.hero--storm .hero__scrim { background: linear-gradient(180deg, rgba(var(--bg-rgb),.52) 0%, rgba(var(--bg-rgb),.48) 45%, rgba(var(--bg-rgb),.62) 75%, rgba(var(--bg-rgb),1) 100%); }
.page-hero--video { padding-bottom: clamp(4.6rem, 8vw, 6rem); }
.page-hero--video .bgv { z-index: 0; }
.page-hero--video .page-hero__scrim { background: linear-gradient(180deg, rgba(var(--bg-rgb),.8) 0%, rgba(var(--bg-rgb),.8) 40%, rgba(var(--bg-rgb),.6) 62%, rgba(var(--bg-rgb),.64) 80%, rgba(var(--bg-rgb),.94) 100%); }
/* Section animations (growth sphere, team network): transparent WebP that plays once when scrolled into view */
.sec-anim { margin: 0; pointer-events: none; }
.sec-anim img { display: block; width: 100%; height: auto; }
.model3__top { position: relative; z-index: 1; display: grid; gap: 1.5rem; margin-bottom: clamp(2.2rem, 4vw, 3.2rem); }
.model3__top .model3__head { margin-bottom: 0; }
.sec-anim--sphere { width: min(200px, 55vw); justify-self: center; }
@media (min-width: 900px) { .model3__top { grid-template-columns: minmax(0, 1fr) clamp(220px, 24vw, 300px); align-items: center; } .sec-anim--sphere { width: 100%; } }
.sec-anim--network { width: min(100%, 280px); margin-top: 1.8rem; }
@media (min-width: 960px) { .sec-anim--network { width: min(100%, 400px); margin-top: 2.6rem; } }
/* Franchise page proof block (HALO deck, Orangetheory Canada) */
.fr-proof__body { display: grid; gap: clamp(1.6rem, 4vw, 3rem); }
.fr-proof__body p { color: var(--fg-dim); max-width: 58ch; margin-bottom: 1rem; }
.fr-proof__stats { list-style: none; padding: 0; margin: 0; display: grid; gap: 1px; background: var(--border); border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; }
.fr-proof__stats li { background: var(--surface); padding: 1.3rem 1.5rem; }
.fr-proof__stats .case__lbl { color: var(--fg-dim); }
@media (min-width: 900px) { .fr-proof__body { grid-template-columns: 1.2fr .8fr; align-items: start; } }
.about-selective { list-style: none; padding: 0; margin: 1.2rem 0 0; display: grid; gap: .7rem; }
.about-selective li { position: relative; padding-left: 1.4rem; color: var(--fg-dim); }
.about-selective li::before { content: ""; position: absolute; left: 0; top: .62em; width: .5rem; height: .5rem; border-radius: 50%; background: var(--gold); }
/* Unnamed case studies (Our Work) */
.ucases { list-style: none; padding: 0; display: grid; gap: 1rem; }
@media (min-width: 760px) { .ucases { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1100px) { .ucases { grid-template-columns: repeat(3, 1fr); } }
.ucase { position: relative; display: flex; flex-direction: column; gap: .8rem; padding: clamp(1.4rem, 2.4vw, 1.9rem); background: var(--bg); border: 1px solid var(--border); border-radius: var(--radius); }
.ucase__h { font-family: var(--font-display); font-weight: 600; font-size: clamp(1.1rem, 1.8vw, 1.3rem); line-height: 1.25; color: var(--fg); }
.ucase .case__stats { margin-top: auto; }
.ucase__k { color: var(--fg); font-weight: 700; margin-top: .4rem; }
.ucase__ch { margin-top: .4rem; }
.ucase .case__flag { align-self: flex-start; }
/* Unnamed case tiles: the case page's own generic hero photo behind the tile (assets/brand/generic/cases/<slug>-tile.webp),
   under the same dark wash as the photo quote cards, so text keeps 4.5:1 or better. */
.ucase--photo { position: relative; overflow: hidden; isolation: isolate; }
.ucase--photo::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--case-img) center / cover no-repeat; opacity: .9; }
.ucase--photo::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(10,10,10,.62) 0%, rgba(10,10,10,.8) 32%, rgba(10,10,10,.9) 62%, rgba(10,10,10,.95) 100%); }
/* Growth graph with the master deck stages (slide 15) */
.gc--staged .gc-num { font-family: var(--font-body); font-size: 14px; font-weight: 800; fill: #E6E6E6; }
.gc--staged .gc-small { font-size: 13px; letter-spacing: .04em; text-transform: uppercase; }
.gc .gc-node { transform-origin: 400px 190px; }
.gc-key { display: grid; gap: 1rem 2rem; margin-top: 1.2rem; font-size: var(--fs-sm); color: var(--fg-dim); }
@media (min-width: 560px) { .gc-key { grid-template-columns: 1fr 1fr; } }
.gc-key__h { color: var(--fg); font-weight: 700; margin-bottom: .35rem; }
.gc-key--hale .gc-key__h { color: var(--gold-bright); }
.gc-key ol { padding-left: 1.4rem; display: grid; gap: .2rem; }

/* Unnamed case tiles: even grid; each story has its own page (/our-work/<slug>/), opened with a clear button. */
.ucase__btn { align-self: flex-start; margin-top: .4rem; min-height: 44px; border-color: rgba(var(--gold-rgb),.55); }
.ucase__btn:hover, .ucase__btn:focus-visible { border-color: var(--gold); color: var(--gold-bright); }
.ucase__btn .arw { transition: transform .25s var(--ease); }
.ucase__btn:hover .arw { transform: translateX(3px); }
/* Launch build: backfilled unnamed cards end in the same button as the Work page cards (the whole card is the link). */
.case > .case__btn { align-self: flex-start; margin-top: auto; }
.case:hover > .case__btn, .case:focus-visible > .case__btn { border-color: var(--gold); color: var(--gold-bright); }
.case:hover > .case__btn .arw { transform: translateX(3px); }

/* Scrollbars (page and scrolling panels): a slim dark pill that turns gold on hover.
   Chrome/Safari use the ::-webkit-scrollbar styles (the standard properties would override them and add arrow buttons);
   Firefox gets the standard properties. */
::-webkit-scrollbar { width: 12px; height: 12px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #3A3A3A; border-radius: 999px; border: 3px solid var(--bg); }
::-webkit-scrollbar-thumb:hover { background: var(--gold); }
::-webkit-scrollbar-corner { background: transparent; }
@supports not selector(::-webkit-scrollbar) {
  html { scrollbar-width: thin; scrollbar-color: #3A3A3A transparent; }
}

/* Brand imagery from the 2026 master deck (assets/brand/), each used where the deck uses it:
   dark growth rings behind "$1 in = $X out" (slide 12), the dark mountain range behind callouts (slides 68-70),
   the root texture as a quiet ground for closing calls to action, and the tree-ring logo beside the name's definition. */
.roi--rings { position: relative; overflow: hidden; border-color: var(--gold); background:
  linear-gradient(180deg, rgba(var(--bg-rgb),.62), rgba(var(--bg-rgb),.74)),
  image-set(url("../assets/brand/rings-dark.webp") type("image/webp"), url("../assets/brand/rings-dark.jpg") type("image/jpeg")) center / cover; }
.roi--rings::after { content: ""; position: absolute; top: 10px; right: 10px; width: 14px; height: 14px; pointer-events: none;
  background: linear-gradient(var(--gold), var(--gold)) center / 1px 100% no-repeat, linear-gradient(var(--gold), var(--gold)) center / 100% 1px no-repeat; opacity: .85; }
.tex-peaks { background-image: image-set(url("../assets/brand/peaks-dark.webp") type("image/webp"), url("../assets/brand/peaks-dark.jpg") type("image/jpeg")); background-position: center 30%; opacity: .85; }
.close-band { background:
  linear-gradient(90deg, rgba(var(--surface-rgb),.9) 0%, rgba(var(--surface-rgb),.72) 100%),
  image-set(url("../assets/brand/roots-dark.webp") type("image/webp"), url("../assets/brand/roots-dark.jpg") type("image/jpeg")) center / cover,
  var(--surface); }
.why-grid { display: grid; gap: clamp(2rem, 5vw, 4rem); align-items: center; }
@media (min-width: 900px) { .why-grid { grid-template-columns: 1.1fr .9fr; } }
.why-img { display: block; border-radius: var(--radius); overflow: hidden; border: 1px solid var(--border); max-width: 460px; justify-self: center; }
.why-img img { display: block; width: 100%; height: auto; }

/* "Spend better to earn more" (HALO deck slides 22-23): before = outline, with Hale = solid gold.
   The solid bar starts at the before height and grows (or shrinks) to the after height when revealed. */
.sb-chart { margin: clamp(1.6rem, 4vw, 2.6rem) 0 0; padding: clamp(1.4rem, 3.4vw, 2.4rem); border: 1px solid var(--border); border-radius: var(--radius); background: rgba(var(--bg-rgb),.45); }
.sb-legend { display: flex; flex-wrap: wrap; gap: .6rem 1.8rem; margin-bottom: clamp(1.4rem, 3vw, 2rem); font-size: var(--fs-sm); color: var(--fg-dim); }
.sb-key { display: inline-flex; align-items: center; gap: .6rem; }
.sb-key::before { content: ""; width: 14px; height: 14px; border-radius: 3px; flex: none; }
.sb-key--before::before { border: 1.5px solid var(--fg-faint); }
.sb-key--after::before { background: var(--gold); }
.sb-bars { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(.6rem, 2.4vw, 2rem); }
.sb-pair { height: clamp(170px, 26vw, 260px); display: flex; align-items: flex-end; justify-content: center; gap: clamp(4px, 1vw, 10px); border-bottom: 1px solid var(--border); }
.sb-bar { width: clamp(18px, 4.2vw, 46px); border-radius: 4px 4px 0 0; }
.sb-bar--before { height: calc(var(--b) * 1%); border: 1.5px solid var(--fg-faint); border-bottom: 0; }
.sb-bar--after { height: calc(var(--a) * 1%); background: linear-gradient(180deg, var(--gold-bright), var(--gold-deep)); transition: height 1.1s var(--ease) .25s; }
.reveal-ready .sb-chart:not(.is-in) .sb-bar--after { height: calc(var(--b) * 1%); }
.sb-lbl { margin: .8rem 0 0; text-align: center; font-weight: 700; color: var(--fg); font-size: clamp(.82rem, 1.6vw, 1rem); letter-spacing: .04em; text-transform: uppercase; }
.sb-word { margin: .2rem 0 0; text-align: center; font-size: var(--fs-sm); color: var(--gold-bright); }
.sb-word--lower::before { content: "\2193\00a0"; }
.sb-word--higher::before { content: "\2191\00a0"; }
.sb-chart figcaption { margin-top: 1.2rem; font-size: var(--fs-sm); color: var(--fg-faint); }
@media (prefers-reduced-motion: reduce) { .sb-bar--after { transition: none; } }
.motion-paused .sb-bar--after { transition: none; }

/* Team: org chart by role (team/index.html #org). */
.org { display: grid; gap: clamp(1.8rem, 4vw, 2.6rem); margin-top: clamp(1.6rem, 4vw, 2.4rem); }
.org__h { font-family: var(--font-body); font-size: .8rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--gold); padding-bottom: .7rem; margin-bottom: 1.1rem; border-bottom: 1px solid var(--border); }
.org__people { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 1.4rem 1.2rem; }
.org__p img { display: block; width: 100%; max-width: 132px; aspect-ratio: 1; height: auto; object-fit: cover; border-radius: var(--radius); border: 1px solid var(--border); filter: grayscale(1); }
.org__name { margin-top: .7rem; font-weight: 700; color: var(--fg); line-height: 1.3; }
.org__role { margin-top: .15rem; font-size: var(--fs-sm); color: var(--fg-dim); line-height: 1.4; }
#org .case__flag { margin-top: .4rem; }

/* ===== rev3: Matt's Oct 16 review (site-wide) ===== */
/* Cards and panels: Horizon from the 2026 deck, slightly transparent, over the current black, so they
   stand out instead of getting lost black-on-black. Palette previews keep their own (more specific) rules. */
:is(.card, .bio, .case, .ucase, .quote, .pp-row, .model3__lever, .audit__col, .audit2, .sb-chart, .takeaways, .callout, .cs-metric,
    .fr-proof__stats li, .res-card, .insights-list .cs-card, .svc2__tile, .svc3__tile, .team-member, .contact-form-wrap, .ga-step, .ga-review,
    .svc-diff__card, .feature-card, .check-list--cards li)
  { background: rgba(58,58,72,.55); border-color: rgba(165,164,180,.24); }
:is(.case, .svc3__tile, .svc2__tile, .res-card, .card):hover { border-color: rgba(var(--gold-rgb),.6); }
/* Callouts get the extra colour Matt liked in the deep palette: headings inside the page body are gold. */
main h3, main .h3 { color: var(--gold); }
/* Forms: clearer fields on the Horizon panel. */
.form input[type=text], .form input[type=email], .form input[type=tel], .form input[type=url], .form textarea, .form select
  { background: rgba(10,10,12,.6); border-color: #8E8D9C; }
/* Numbered steps: solid numbers, not outlines. */
.aud2__n, .ga-criteria li::before { color: var(--gold); -webkit-text-stroke: 0; }
/* No visible pause controls (owner decision). Background video still never plays under reduced motion,
   and the button stays reachable for keyboard users: it appears when focused. */
.motion-btn { display: none; }
.bgv-toggle:not(:focus-visible) { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0; }
/* One wayfinding system: the gold eyebrow label. Breadcrumbs are not shown. */
.crumb { display: none; }
/* In-page links land with the section's content near the top of the screen, not mid-screen. */
section.section[id] { scroll-margin-top: calc(1.5rem - var(--sec-y)); }
/* Footer: the sitemap columns sit evenly spaced, sized to their links, with their headings level with the top of the logo. */
@media (min-width: 980px) {
  .site-footer .footer__nav { grid-template-columns: repeat(4, auto); justify-content: space-between; column-gap: 2.5rem; align-self: start; }
  .site-footer .footer__col a { white-space: nowrap; }
  .site-footer .footer__brand, .site-footer .footer__nav { align-self: start; }
  .site-footer .footer__h { line-height: 1; margin-top: .2rem; }
}

/* ===== rev3: homepage ===== */
/* Hero: more air between the headline, the paragraph and the buttons. */
.hero h1 { margin-bottom: clamp(1.8rem, 3vw, 2.4rem); }
.hero__category { margin-bottom: clamp(2rem, 3.4vw, 2.6rem); max-width: 50ch; }
/* Client logo wall (Pilothouse-style grid). */
.logo-wall { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(2, 1fr); border-top: 1px solid var(--border); border-left: 1px solid var(--border); }
.logo-wall li { display: flex; align-items: center; justify-content: center; min-height: 104px; padding: 1.2rem 1rem; border-right: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.logo-wall img { width: auto; max-width: 100%; object-fit: contain; opacity: .9; transition: opacity .25s var(--ease); }
.logo-wall li:hover img { opacity: 1; }
@media (min-width: 560px) { .logo-wall { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 820px) { .logo-wall { grid-template-columns: repeat(5, 1fr); } }
@media (min-width: 1100px) { .logo-wall { grid-template-columns: repeat(7, 1fr); } .logo-wall li { min-height: 120px; } }
@media (max-width: 559px) { .logo-wall img { transform: scale(.85); } }
/* Growth graph: each number appears with its key item, in order along the line. */
.gc-key { align-items: start; }
.gc-key__list { padding-left: 1.4rem; display: grid; gap: .25rem; }
.gc-key--hale { color: var(--gold-bright); }
.reveal-ready .gc-k { opacity: 0; }
.reveal-ready .reveal.is-in .gc-k { animation: gcFade .5s ease forwards; }
.reveal-ready .reveal.is-in .gc-n1 { animation-delay: .25s; }
.reveal-ready .reveal.is-in .gc-n2 { animation-delay: .55s; }
.reveal-ready .reveal.is-in .gc-n3 { animation-delay: .85s; }
.reveal-ready .reveal.is-in .gc-n4 { animation-delay: 1.2s; }
.reveal-ready .reveal.is-in .gc-n5 { animation-delay: 1.65s; }
.reveal-ready .reveal.is-in .gc-n6 { animation-delay: 2s; }
.reveal-ready .reveal.is-in .gc-n7 { animation-delay: 2.4s; }
@media (prefers-reduced-motion: reduce) { .reveal-ready .gc-k { opacity: 1; animation: none; } }
.motion-paused .gc-k { opacity: 1 !important; animation: none !important; }
/* Proof: less space above the story, more below it before the examples. */
.proof3__top { margin-bottom: clamp(1.6rem, 3vw, 2.2rem); }
@media (min-width: 960px) { .proof3__top { grid-template-columns: 1fr; } .proof3__top .lede { max-width: 60ch; } }
.roi-story { position: relative; z-index: 1; display: grid; gap: clamp(1.6rem, 4vw, 3rem); align-items: center; margin-bottom: clamp(3.6rem, 7vw, 5.6rem);
  padding: clamp(1.6rem, 4vw, 3rem); border: 1px solid rgba(var(--gold-rgb),.45); border-radius: var(--radius); background: rgba(10,10,10,.55); }
@media (min-width: 900px) { .roi-story { grid-template-columns: 1fr 1.15fr; } }
.roi-story__h { font-family: var(--font-display); font-size: clamp(1.5rem, 2.6vw, 2rem); margin-bottom: .9rem; }
.roi-story__copy p { color: var(--fg-dim); max-width: 44ch; }
.roi-story__copy p + p { margin-top: .7rem; }
.roi-story__fig { margin: 0; }
.roi-story__k { font-size: .78rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--fg-dim); margin-bottom: .5rem; }
.roi-story__eq { font-family: var(--font-display); font-weight: 700; line-height: 1; letter-spacing: -.02em; font-size: clamp(2.6rem, 6.2vw, 4.8rem); display: flex; flex-wrap: wrap; align-items: baseline; gap: .1em .3em; font-variant-numeric: tabular-nums; }
.roi-story__eq sup { font-size: .4em; color: var(--fg-dim); vertical-align: super; margin-left: .05em; }
.roi-story__vs { margin-top: 1.4rem; padding-top: 1.2rem; border-top: 1px solid var(--border); display: flex; flex-wrap: wrap; align-items: baseline; gap: .3rem 1.2rem; }
.roi-story__vs .roi-story__k { margin: 0; }
.roi-story__vs-v { font-family: var(--font-display); font-weight: 600; font-size: clamp(1.5rem, 3vw, 2.1rem); color: var(--fg); font-variant-numeric: tabular-nums; }
.roi-story__note { margin-top: 1.2rem; font-size: .8rem; color: var(--fg-faint); }
/* Audit panel: report graphic beside the copy. */
@media (min-width: 900px) { .audit2__top.has-device { grid-template-columns: 1fr 1fr !important; align-items: center; } }
.device__cap { margin-top: .7rem; font-size: .8rem; color: var(--fg-faint); text-align: center; }
.reveal-ready .reveal .hs-bar { transform: scaleX(0); transform-box: fill-box; transform-origin: left; }
.reveal-ready .reveal.is-in .hs-bar { transform: scaleX(1); transition: transform 1s var(--ease) .3s; }
.reveal-ready .reveal .hs-ring { stroke-dashoffset: 171; }
.reveal-ready .reveal.is-in .hs-ring { stroke-dashoffset: 0; transition: stroke-dashoffset 1.2s var(--ease) .2s; }
@media (prefers-reduced-motion: reduce) { .reveal-ready .reveal .hs-bar { transform: none; } .reveal-ready .reveal .hs-ring { stroke-dashoffset: 0; } }
@media (min-width: 900px) { .roi-story__eq { font-size: clamp(2.4rem, 4.2vw, 3.9rem); white-space: nowrap; } }
@media (max-width: 559px) { .logo-wall { grid-template-columns: repeat(3, 1fr); } .logo-wall li { min-height: 84px; padding: .8rem .5rem; } .logo-wall img { transform: scale(.72); } }

/* ===== rev3: Growth Audit page ===== */
.ga-sub2 { margin-bottom: 1.6rem; }
@media (min-width: 960px) { .ga-fit { grid-template-columns: 1fr 1fr; } }
.check-list--lg { gap: 1.1rem; }
.check-list--lg li p { font-size: 1.12rem; line-height: 1.5; }
.check-list--lg li .ico { width: 24px; height: 24px; }
/* Steps flow left to right (top to bottom on phones), with arrows between them. */
@media (min-width: 900px) { .ga-steps--flow { grid-template-columns: repeat(3, 1fr); gap: 1.4rem 2.6rem; } }
.ga-steps--flow li { position: relative; }
.ga-steps li { background: rgba(58,58,72,.55); border-color: rgba(165,164,180,.24); }
.ga-steps--flow li:not(:last-child)::after { content: ""; position: absolute; width: 12px; height: 12px; border-top: 2px solid var(--gold); border-right: 2px solid var(--gold);
  left: 50%; bottom: -.95rem; transform: translateX(-50%) rotate(135deg); }
@media (min-width: 900px) {
  .ga-steps--flow li:not(:last-child)::after { left: auto; bottom: auto; right: -1.75rem; top: 2.1rem; transform: rotate(45deg); }
  .ga-steps--flow li:nth-child(3)::after { display: none; }
}
.ga-steps--flow li:last-child { border-color: rgba(var(--gold-rgb),.6); }
/* What's included: report graphic beside bigger lists. */
.ga-scope2 { display: grid; gap: clamp(2rem, 4vw, 3.4rem); align-items: center; }
@media (min-width: 1000px) { .ga-scope2 { grid-template-columns: .95fr 1.05fr; } }
.ga-scope--lg { grid-template-columns: 1fr !important; gap: 2rem; }
@media (min-width: 640px) and (max-width: 999px) { .ga-scope--lg { grid-template-columns: 1fr 1fr !important; } }
.ga-scope--lg h3 { font-size: .85rem !important; }
.ga-scope--lg li { font-size: 1.08rem !important; color: var(--fg) !important; }
/* Tools we review. */
.ga-tools { margin-top: clamp(3rem, 6vw, 4.4rem); }
.ga-tools__h { font-family: var(--font-body); font-size: .85rem !important; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--fg-dim) !important; margin-bottom: 1.2rem; }
.tools { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(2, 1fr); gap: .7rem; }
@media (min-width: 640px) { .tools { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1000px) { .tools { grid-template-columns: repeat(5, 1fr); } }
.tool { display: flex; align-items: center; gap: .7rem; min-height: 60px; padding: .8rem 1rem; border: 1px solid rgba(165,164,180,.24); border-radius: var(--radius); background: rgba(58,58,72,.4); color: var(--fg); font-weight: 600; font-size: .95rem; }
.tool svg { width: 22px; height: 22px; flex-shrink: 0; color: #EFEBE2; }
.tool--name span { font-family: var(--font-display); letter-spacing: .01em; }
@media (max-width: 389.98px) { .tools { grid-template-columns: minmax(0, 1fr); } } /* two columns push the page to 379px wide on small phones */
.ga-tools__note { margin-top: 1rem; color: var(--fg-dim); font-size: var(--fs-sm); }
/* How we do it. */
.how-we { list-style: none; padding: 0; display: grid; gap: 1rem; }
@media (min-width: 700px) { .how-we { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1100px) { .how-we { grid-template-columns: repeat(4, 1fr); } }
.how-we li { padding: clamp(1.3rem, 2.4vw, 1.8rem); border: 1px solid rgba(165,164,180,.24); border-radius: var(--radius); background: rgba(58,58,72,.55); }
.how-we h3 { font-family: var(--font-display); font-size: 1.15rem; margin-bottom: .5rem; }
.how-we p { color: var(--fg-dim); font-size: var(--fs-sm); }
.how-not { margin-top: clamp(1.6rem, 3vw, 2.4rem); padding: clamp(1.4rem, 3vw, 2rem); border-left: 3px solid var(--gold); background: rgba(var(--gold-rgb),.07); border-radius: 0 var(--radius) var(--radius) 0; }
.how-not__k { font-size: .78rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--gold); margin-bottom: .5rem; }
.how-not__t { font-family: var(--font-display); font-weight: 600; font-size: clamp(1.2rem, 2.2vw, 1.55rem); line-height: 1.3; color: var(--fg); max-width: 56ch; }
/* Apply: short process beside the form. */
.ga-apply__how { margin: 0 0 2rem; padding: 1.3rem 1.4rem; border: 1px solid rgba(165,164,180,.24); border-radius: var(--radius); background: rgba(58,58,72,.4); }
.ga-apply__how-h { font-size: .78rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--gold); margin-bottom: .7rem; }
.ga-apply__how ol { padding-left: 1.2rem; display: grid; gap: .45rem; color: var(--fg-dim); font-size: var(--fs-sm); }

/* ===== rev3: About page ===== */
.why-p { margin-top: 1.6rem; color: var(--fg-dim); font-size: var(--fs-lede); max-width: 46ch; }
.about-story2 { display: grid; gap: clamp(2rem, 5vw, 4rem); align-items: center; }
@media (min-width: 960px) { .about-story2 { grid-template-columns: .8fr 1.2fr; } }
.about-story2 > *, .model-row > *, .about-sel > * { min-width: 0; }
/* Story told in full, each part with its picture beside it (master deck slides 17-18). */
.model-row { display: grid; gap: clamp(1.6rem, 4vw, 3.4rem); align-items: center; margin-top: clamp(3rem, 6vw, 5rem); padding-top: clamp(2.4rem, 5vw, 3.6rem); border-top: 1px solid var(--border); }
@media (min-width: 960px) { .model-row { grid-template-columns: 1fr 1fr; } .model-row--hale .prose { order: 2; } }
.model-row__h { font-family: var(--font-display); font-size: clamp(1.4rem, 2.4vw, 1.9rem); margin-bottom: 1rem; }
.model-fig { margin: 0; padding: clamp(1.2rem, 3vw, 1.8rem); border: 1px solid rgba(165,164,180,.24); border-radius: var(--radius); background: rgba(58,58,72,.4); }
.model-fig figcaption { margin-top: 1.1rem; color: var(--fg-dim); font-size: var(--fs-sm); }
.pyr { display: grid; gap: .35rem; justify-items: center; }
.pyr__row { width: var(--w); padding: .55rem .6rem; text-align: center; border-radius: 6px; background: #2b2b33; color: var(--fg-dim); font-size: .82rem; font-weight: 600; }
.pyr__row--mgmt { background: #3d3d48; color: var(--fg); }
.pyr__row--face { background: rgba(192,83,63,.28); color: #F1D6CF; box-shadow: inset 0 0 0 1px rgba(192,83,63,.6); }
.pyr__clients { width: 100%; display: flex; justify-content: space-between; gap: .3rem; margin-top: .3rem; }
.pyr__clients span { flex: 1; text-align: center; padding: .35rem .2rem; border: 1px dashed rgba(165,164,180,.5); border-radius: 999px; font-size: .68rem; color: var(--fg-faint); letter-spacing: .04em; text-transform: uppercase; }
.pyr__key { width: 100%; display: flex; flex-wrap: wrap; gap: .4rem 1rem; justify-content: center; margin-top: .7rem; font-size: .75rem; color: var(--fg-faint); }
.pyr__k::before { content: ""; display: inline-block; width: .7rem; height: .7rem; border-radius: 2px; margin-right: .4rem; vertical-align: -.05rem; }
.pyr__k--mgmt::before { background: #3d3d48; }
.pyr__k--face::before { background: rgba(192,83,63,.5); }
.hm { display: grid; justify-items: center; }
.hm__partners { width: 70%; padding: .8rem; text-align: center; border-radius: 8px; background: var(--gold); color: #0A0A0A; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; font-size: .82rem; }
.hm__link { width: 2px; height: 1.4rem; background: var(--gold); }
.hm__core { width: 86%; padding: .9rem; border: 1px solid rgba(var(--gold-rgb),.7); border-radius: 10px; display: grid; gap: .4rem; }
.hm__core-k { font-size: .7rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--gold); text-align: center; }
.hm__row { padding: .6rem; text-align: center; border-radius: 6px; background: #3d3d48; color: var(--fg); font-weight: 600; font-size: .85rem; }
.hm__row--sr { background: rgba(var(--gold-rgb),.22); box-shadow: inset 0 0 0 1px rgba(var(--gold-rgb),.6); }
.hm__contract { width: 100%; margin-top: .8rem; padding: .7rem .9rem; border: 1px dashed rgba(165,164,180,.55); border-radius: 10px; text-align: center; display: grid; gap: .15rem; font-size: .8rem; color: var(--fg-dim); }
.hm__contract strong { color: var(--fg); font-size: .85rem; }
/* Better means selective: the point and its secondary line on the left, what it means on the right, both starting level. */
.about-sel { display: grid; gap: clamp(1.8rem, 4vw, 4rem); align-items: start; }
@media (min-width: 960px) { .about-sel { grid-template-columns: 1fr 1fr; } .about-sel > :last-child { padding-top: 2.1rem; } }
.about-sel__sub { margin-top: 1.2rem; font-family: var(--font-display); font-weight: 600; font-size: clamp(1.15rem, 2vw, 1.4rem); line-height: 1.35; color: var(--fg); max-width: 34ch; }
.about-sel__p { margin-top: 1rem; color: var(--fg-dim); max-width: 46ch; }
.about-sel__h { font-family: var(--font-display); font-size: 1.2rem; margin-bottom: .2rem; }
.about-sel .about-selective li { font-size: 1.04rem; }
.about-senior .check-list--cards { grid-template-columns: 1fr; }
@media (min-width: 760px) { .about-senior .check-list--cards { grid-template-columns: repeat(2, 1fr); } }
.logo-band__label--lg { font-family: var(--font-display); font-size: clamp(1.4rem, 2.6vw, 2rem); letter-spacing: -.005em; text-transform: none; color: var(--fg); font-weight: 600; }
.about-senior .check-list--belief li .ico { width: 44px; height: 44px; padding: 10px; border-radius: 11px; }
.about-senior .check-list--belief li p { align-self: start; }

/* ===== rev3: Team page ===== */
.team-intro { display: grid; gap: 1.4rem clamp(2rem, 5vw, 4rem); margin-bottom: clamp(2rem, 4vw, 3rem); }
@media (min-width: 960px) { .team-intro { grid-template-columns: 1fr 1fr; align-items: end; } }
.team-intro .prose p { color: var(--fg-dim); }
.org__p { display: flex; flex-direction: column; align-items: flex-start; }
.org__more { margin-top: .5rem; padding: .3rem .75rem; border: 1px solid rgba(var(--gold-rgb),.6); border-radius: 999px; background: none; color: var(--gold); font: inherit; font-size: .8rem; font-weight: 700; cursor: pointer; }
.org__more:hover, .org__more:focus-visible { background: var(--gold); color: #0A0A0A; }
.no-js .org__more { display: none; }
.org__ph { width: 100%; max-width: 132px; aspect-ratio: 1; display: grid; place-items: center; border-radius: var(--radius); border: 1px dashed rgba(165,164,180,.5); background: rgba(58,58,72,.4); color: var(--fg-dim); font-family: var(--font-display); font-weight: 600; font-size: 1.6rem; }
.org__p--tbc .case__flag { margin-top: .4rem; }
.bio-dlg { margin: auto; width: min(720px, calc(100% - 2rem)); max-height: min(88dvh, 860px); padding: 0; border: 1px solid var(--border); border-radius: var(--radius); background: #17171c; color: var(--fg-dim); overflow: hidden; }
.bio-dlg::backdrop { background: rgba(0,0,0,.7); backdrop-filter: blur(3px); }
.bio-dlg__in { position: relative; display: grid; gap: 1rem; max-height: inherit; overflow-y: auto; padding: clamp(1.4rem, 3.6vw, 2.4rem); }
.bio-dlg__x { position: absolute; top: .8rem; right: .8rem; width: 40px; height: 40px; display: grid; place-items: center; border: 1px solid var(--border); border-radius: 50%; background: none; color: var(--fg); cursor: pointer; }
.bio-dlg__head { display: flex; align-items: center; gap: 1.2rem; padding-right: 2.6rem; }
.bio-dlg__head img { width: 96px; height: 96px; object-fit: cover; border-radius: 50%; border: 1px solid var(--border); }
.bio-dlg__name { font-family: var(--font-display); font-size: clamp(1.4rem, 3vw, 1.8rem); color: var(--fg); }
.bio-dlg__role { color: var(--gold); font-weight: 700; font-size: .85rem; letter-spacing: .06em; text-transform: uppercase; margin-top: .3rem; }
.bio-dlg__links a { color: var(--fg); text-decoration: underline; text-underline-offset: 3px; }
/* Careers */
.roles { padding: clamp(1.4rem, 3vw, 2rem); border: 1px solid rgba(165,164,180,.24); border-radius: var(--radius); background: rgba(58,58,72,.4); display: grid; gap: 1rem; justify-items: start; }
.roles__none { color: var(--fg); font-size: var(--fs-lede); }
.roles__how { color: var(--fg-dim); }
.roles__how a { color: var(--fg); text-decoration: underline; text-underline-offset: 3px; }

/* ===== rev3: Services ===== */
/* Tighter rhythm on service and industry pages (Matt: "clunky... so far apart"). */
body:has(.svc-section) main .section:not(.close-band) { padding-block: clamp(3.4rem, 6.4vw, 5.6rem); }
body:has(.svc-section) main .sec-head { margin-bottom: clamp(1.4rem, 3vw, 2.2rem); }
.cases__all { margin-top: 1.6rem; }
.why-bullet { margin-top: 1rem; font-family: var(--font-display); font-weight: 600; font-size: clamp(1.1rem, 2vw, 1.35rem); color: var(--gold); max-width: 52ch; }
/* Website development: Lighthouse before/after. */
.lh { display: grid; gap: clamp(2rem, 5vw, 4rem); align-items: center; }
@media (min-width: 980px) { .lh { grid-template-columns: 1fr 1fr; } }
.lh > * { min-width: 0; }
.lh-proj { margin-top: 1.6rem; padding: 1.2rem 1.3rem; border: 1px solid rgba(165,164,180,.24); border-radius: var(--radius); background: rgba(58,58,72,.4); display: grid; gap: .5rem; justify-items: start; }
.lh-proj__k { font-size: .75rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--gold); }
.lh-proj__h { font-family: var(--font-display); font-weight: 600; font-size: 1.15rem; color: var(--fg); }
.lh-proj ul { padding-left: 1.1rem; color: var(--fg-dim); font-size: var(--fs-sm); display: grid; gap: .25rem; }
.lh-fig { margin: 0; padding: clamp(1.2rem, 3vw, 1.8rem); border: 1px solid rgba(165,164,180,.24); border-radius: var(--radius); background: rgba(58,58,72,.4); }
.lh-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.2rem; }
.lh-item__k { font-size: .8rem; font-weight: 700; color: var(--fg-dim); margin-bottom: .5rem; text-align: center; }
.lh-pair { display: flex; align-items: center; justify-content: center; gap: .5rem; }
.lh-ring { width: 64px; height: 64px; }
.lh-ring text { font: 800 17px var(--font-body); fill: var(--fg); }
.lh-ring--before { color: #c0533f; }
.lh-ring--after { color: #3fb27f; }
.lh-arrow { color: var(--gold); font-weight: 700; }
.lh-fig figcaption { margin-top: 1rem; color: var(--fg-faint); font-size: .8rem; text-align: center; }
/* Analytics: dashboards. */
.dash { display: grid; gap: clamp(2rem, 5vw, 4rem); align-items: center; }
@media (min-width: 980px) { .dash { grid-template-columns: 1fr 1.05fr; } }
.dash > * { min-width: 0; }
.dash-fig { margin: 0; }
.check-list--cards.check-list--belief li .ico { width: 44px; height: 44px; padding: 10px; border-radius: 11px; }

/* ===== rev3: Industries ===== */
/* Logo bar that rotates through every brand (pauses on hover/focus; static under reduced motion or paused animations). */
.logo-band--marquee { overflow: hidden; }
.marquee { display: flex; overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.marquee__track { list-style: none; padding: 0; margin: 0; display: flex; align-items: center; gap: clamp(2.4rem, 5vw, 4rem); padding-right: clamp(2.4rem, 5vw, 4rem); flex-shrink: 0; animation: marquee 48s linear infinite; }
.marquee__track img { width: auto; max-width: none; opacity: .9; }
.marquee:hover .marquee__track, .marquee:focus-within .marquee__track { animation-play-state: paused; }
@keyframes marquee { to { transform: translateX(-100%); } }
@media (prefers-reduced-motion: reduce) {
  .marquee { flex-wrap: wrap; justify-content: center; -webkit-mask-image: none; mask-image: none; }
  .marquee__track { animation: none; flex-wrap: wrap; justify-content: center; padding: 0 var(--gut); row-gap: 1.6rem; }
  .marquee__track[aria-hidden="true"] { display: none; }
}
.motion-paused .marquee__track { animation-play-state: paused; }
/* Industries we know well: client logos on each card. */
.ind-grid--know { display: grid; gap: 1rem; grid-template-columns: 1fr; }
@media (min-width: 700px) { .ind-grid--know { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1050px) { .ind-grid--know { grid-template-columns: repeat(3, 1fr); } }
.ind-grid--know .ind-card { display: flex; flex-direction: column; gap: .7rem; }
.ind-card__logos { display: flex; flex-wrap: wrap; align-items: center; gap: .8rem 1.4rem; margin-top: auto; padding-top: .8rem; border-top: 1px solid rgba(165,164,180,.2); min-height: 52px; }
.ind-card__logos img { width: auto; opacity: .9; }
/* Resources: a picture of what each resource is. */
.res-card__viz { display: block; width: 120px; color: var(--gold); margin-bottom: .4rem; }
.res-card__viz svg { width: 100%; height: auto; display: block; }
.res-card .btn--ghost { border: 1px solid rgba(var(--gold-rgb),.6); padding-inline: 1.1rem; }
.case--unnamed .case__cat { font-size: .76rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--fg-dim); min-height: 2.6em; }

/* ===== rev4: co-founder review, Oct 22 ===== */
/* Homepage: answer the "what got you here" problem list. */
.pressure3__answer { margin-top: 1.8rem; max-width: 40ch; padding-left: 1.1rem; border-left: 3px solid var(--gold); font-family: var(--font-display); font-weight: 600; font-size: clamp(1.15rem, 1.8vw, 1.35rem); line-height: 1.4; color: var(--fg); }
/* Homepage: the $1 in = $6.20 out story takes over the section. */
.roi2 { position: relative; z-index: 1; text-align: center; margin-bottom: clamp(3.6rem, 7vw, 5.6rem); }
.roi2__head .h2 { margin-inline: auto; }
.roi2__head .lede { margin: 1.2rem auto 0; max-width: 58ch; }
.roi2__fig { margin: clamp(2.4rem, 5vw, 3.6rem) auto 0; padding: clamp(2rem, 5vw, 3.4rem) clamp(1rem, 3vw, 2.4rem); border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.roi2__title { font-size: .85rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--gold); margin-bottom: 1.2rem; }
.roi2__eq { font-family: var(--font-display); font-weight: 700; line-height: 1; letter-spacing: -.03em; font-size: clamp(2.7rem, 9.4vw, 7.4rem); display: flex; flex-wrap: wrap; justify-content: center; align-items: baseline; gap: .05em .28em; font-variant-numeric: tabular-nums; }
@media (min-width: 700px) { .roi2__eq { flex-wrap: nowrap; white-space: nowrap; } }
.roi2__eq sup { font-size: .32em; color: var(--fg-dim); vertical-align: super; margin-left: .04em; }
.roi2__vs { margin-top: clamp(1.4rem, 3vw, 2rem); display: flex; flex-wrap: wrap; justify-content: center; align-items: baseline; gap: .3rem 1rem; }
.roi2__k { font-size: .8rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--fg-dim); }
.roi2__vs-v { font-family: var(--font-display); font-weight: 600; font-size: clamp(1.4rem, 2.8vw, 2rem); color: var(--fg); font-variant-numeric: tabular-nums; }
.roi2__note { margin-top: 1.4rem; font-size: .8rem; color: var(--fg-faint); }
/* Homepage: example cards and quotes get a brand wash (an approved photo can go in --brand-img), text centred. */
.case--brand, .quote--brand { position: relative; overflow: hidden; isolation: isolate; text-align: center; }
.case--brand::before, .quote--brand::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--brand-img, none) center / cover no-repeat, radial-gradient(120% 80% at 50% 0%, var(--brand-c) 0%, transparent 70%); opacity: .55; }
.case--brand::after, .quote--brand::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(10,10,10,.1) 0%, rgba(10,10,10,.72) 55%, rgba(10,10,10,.88) 100%); }
.case--saje, .quote--saje { --brand-c: #7c9a74; }
.case--tentree, .quote--tentree { --brand-c: #3f7a5c; }
.case--orangetheory, .quote--orangetheory { --brand-c: #f26b21; }
.case--fratello, .quote--fratello { --brand-c: #8a4b2a; }
.quote--highliner { --brand-c: #1d4e6b; }
.quote--vitruvi { --brand-c: #8a5a3c; }
/* Vitruvi: soft steam is a faint texture, so its photo shows at full strength under a lighter wash than the other photo cards.
   Checked: the quote text keeps at least 4.5:1 contrast even over the brightest steam behind it. */
.quote--brand.quote--vitruvi[style*="--brand-img"]::before { opacity: 1; background-position: center 85%, center; }
.quote--brand.quote--vitruvi[style*="--brand-img"]::after { background: linear-gradient(180deg, rgba(10,10,10,.42) 0%, rgba(10,10,10,.66) 35%, rgba(10,10,10,.74) 70%, rgba(10,10,10,.82) 100%); }
/* Next to the growth audit form the harbour photo shows in greyscale (owner, Nov 11 2026); the homepage card keeps its colour. */
.ga-quote.quote--highliner::before { filter: grayscale(1); }
.case--brand .logo-box, .quote--brand .logo-box { justify-content: center; }
.case--brand .case__logo, .quote--brand .quote__logo { object-position: center; }
.case--brand > *, .quote--brand > * { justify-self: center; }
.case--brand .case__flag { align-self: center; }
.quote--brand blockquote { font-weight: 400; color: var(--fg-dim); }
.quote--brand figcaption { justify-items: center; }
.hl { background: var(--gold); color: #141414; padding: 0 .18em; border-radius: 2px; -webkit-box-decoration-break: clone; box-decoration-break: clone; font-weight: 600; }
/* Homepage: "How we get there" centred under the three levers. */
.model3__how { justify-content: center; text-align: center; }
/* Careers: purpose and promise (master deck), then values. */
.promise__grid { display: grid; gap: clamp(2rem, 5vw, 4.5rem); align-items: center; }
@media (min-width: 960px) { .promise__grid { grid-template-columns: 1.1fr .9fr; } }
.promise__h { font-family: var(--font-display); font-weight: 700; line-height: 1.02; letter-spacing: -.02em; font-size: clamp(2.8rem, 7vw, 5.4rem); }
.promise__sub { margin-top: 1.4rem; font-size: var(--fs-lede); color: var(--fg-dim); max-width: 40ch; }
.promise__k { font-size: .82rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--fg-dim); margin-bottom: 1rem; }
.promise__list { list-style: none; padding: 0; margin: 0; display: grid; gap: .9rem; }
.promise__list li { padding: 1.2rem 1.4rem; border: 1px solid var(--border); border-left: 3px solid var(--gold); border-radius: var(--radius); background: rgba(58,58,72,.45); }
.promise__list h3 { color: var(--gold); font-size: 1.25rem; letter-spacing: .02em; }
.promise__list p { margin-top: .3rem; color: var(--fg-dim); }
.values { list-style: none; padding: 0; display: grid; gap: 1rem; }
@media (min-width: 860px) { .values { grid-template-columns: repeat(3, 1fr); } }
.values li { padding: clamp(1.4rem, 2.6vw, 2rem); border: 1px solid var(--border); border-radius: var(--radius); background: rgba(58,58,72,.45); }
.values__l { display: inline-grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: var(--gold); color: #141414; font-family: var(--font-display); font-weight: 700; font-size: 1.2rem; margin-bottom: 1rem; }
.values h3 { color: var(--gold); font-size: 1.25rem; }
.values p { margin-top: .5rem; color: var(--fg-dim); }
/* Two-column section heads: the paragraph starts level with the headline (not the bottom of the column). */
@media (min-width: 900px) {
  .team-intro, .svc-intro, .svc__head { align-items: start; }
  .team-intro > :last-child:not(:first-child), .svc-intro > :last-child:not(:first-child) { padding-top: calc(var(--fs-label) * 1.3 + 1.1rem); }
}
.org__plus { display: flex; align-items: center; gap: 1.2rem; margin-top: clamp(1.6rem, 3vw, 2.4rem); padding: 1.2rem 1.4rem; border: 1px dashed rgba(var(--gold-rgb),.55); border-radius: var(--radius); max-width: 640px; }
.org__plus-ico { flex: none; display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; background: var(--gold); color: #141414; font-family: var(--font-display); font-weight: 600; font-size: 2.4rem; line-height: 1; padding-bottom: .12em; }
.org__plus p { color: var(--fg-dim); }
.org__plus strong { color: var(--fg); }
/* Growth Audit: funnel order. "You're in the right place if" leads, big. */
.ga-hero h1 .hl { padding: 0 .12em; border-radius: 4px; }
.sec-head h2.fit2__h { max-width: none; font-family: var(--font-display); font-weight: 700; line-height: 1.04; letter-spacing: -.02em; font-size: clamp(2.3rem, 5.6vw, 4.2rem); }
.fit2__grid { list-style: none; padding: 0; display: grid; gap: 1rem; margin-top: clamp(1.6rem, 3vw, 2.4rem); }
@media (min-width: 760px) { .fit2__grid { grid-template-columns: repeat(2, 1fr); } }
.fit2__c { display: flex; gap: 1rem; align-items: flex-start; padding: clamp(1.3rem, 2.6vw, 1.9rem); border: 1px solid var(--border); border-left: 3px solid var(--gold); border-radius: var(--radius); background: rgba(58,58,72,.45); }
.fit2__c .ico { flex: none; width: 28px; height: 28px; color: var(--gold); margin-top: .15rem; }
.fit2__c p { font-size: clamp(1.1rem, 1.6vw, 1.3rem); line-height: 1.45; color: var(--fg-dim); }
.fit2__c strong { color: var(--fg); }
.fit2__cta, .flow__cta { margin-top: clamp(1.8rem, 3.5vw, 2.6rem); display: flex; flex-wrap: wrap; align-items: center; gap: .8rem 1.4rem; }
.fit2__note { color: var(--fg-dim); font-size: var(--fs-sm); }
/* What we review: tools up top, lists left, HALE score right. */
.ga-tools--top { margin: 0 0 clamp(2.4rem, 5vw, 3.4rem); }
@media (min-width: 1000px) { .ga-scope2--flip { grid-template-columns: 1.05fr .95fr; } }
/* How it works: one track that fills left to right, steps light up in turn. */
.flow { position: relative; margin-top: clamp(1.6rem, 3vw, 2.4rem); }
.flow__steps { list-style: none; padding: 0; margin: 0; display: grid; gap: 1.6rem; position: relative; }
.flow__s { position: relative; padding-left: 3.4rem; }
.flow__n { position: absolute; left: 0; top: 0; display: grid; place-items: center; width: 2.5rem; height: 2.5rem; border-radius: 50%; background: var(--bg); border: 2px solid var(--gold); color: var(--gold); font-family: var(--font-display); font-weight: 700; transition: background .4s var(--ease), color .4s var(--ease), transform .4s var(--ease); }
.flow__s h3 { font-family: var(--font-display); font-weight: 600; font-size: 1.12rem; }
.flow__s p { margin-top: .35rem; color: var(--fg-dim); font-size: var(--fs-sm); line-height: 1.5; }
.flow__track { position: absolute; left: calc(1.25rem - 1px); top: 1.25rem; bottom: 1.25rem; width: 2px; background: rgba(var(--gold-rgb),.22); }
.flow__fill { position: absolute; inset: 0; background: var(--gold); transform-origin: top; transform: scaleY(1); }
@media (min-width: 980px) {
  .flow__steps { grid-template-columns: repeat(6, 1fr); gap: 1.4rem; }
  .flow__s { padding: 3.6rem 0 0; }
  .flow__n { left: 0; }
  .flow__track { left: 1.25rem; right: calc(100% / 6 - 1.25rem); top: calc(1.25rem - 1px); bottom: auto; width: auto; height: 2px; }
  .flow__fill { transform-origin: left; }
  .flow__s:not(:last-child)::after { content: ""; position: absolute; top: calc(1.25rem - 5px); right: 1.1rem; width: 9px; height: 9px; border-top: 2px solid var(--gold); border-right: 2px solid var(--gold); transform: rotate(45deg); opacity: .8; }
}
.reveal-ready .flow .flow__fill { transform: scaleY(0); }
@media (min-width: 980px) { .reveal-ready .flow .flow__fill { transform: scaleX(0); } }
.reveal-ready .flow.is-in .flow__fill { transform: none; transition: transform 1.6s cubic-bezier(.3,.6,.3,1) .2s; }
.reveal-ready .flow .flow__s { opacity: .35; transition: opacity .5s var(--ease); }
.reveal-ready .flow.is-in .flow__s { opacity: 1; }
.reveal-ready .flow.is-in .flow__n { background: var(--gold); color: #141414; transform: scale(1.06); }
.flow.is-in .flow__s:nth-child(1), .flow.is-in .flow__s:nth-child(1) .flow__n { transition-delay: .2s; }
.flow.is-in .flow__s:nth-child(2), .flow.is-in .flow__s:nth-child(2) .flow__n { transition-delay: .45s; }
.flow.is-in .flow__s:nth-child(3), .flow.is-in .flow__s:nth-child(3) .flow__n { transition-delay: .7s; }
.flow.is-in .flow__s:nth-child(4), .flow.is-in .flow__s:nth-child(4) .flow__n { transition-delay: .95s; }
.flow.is-in .flow__s:nth-child(5), .flow.is-in .flow__s:nth-child(5) .flow__n { transition-delay: 1.2s; }
.flow.is-in .flow__s:nth-child(6), .flow.is-in .flow__s:nth-child(6) .flow__n { transition-delay: 1.45s; }
.flow__n { background: var(--gold); color: #141414; }
.reveal-ready .flow .flow__n { background: var(--bg); color: var(--gold); }
.reveal-ready .flow.is-in .flow__n { background: var(--gold); color: #141414; }
/* Industries: one row per category, text left and evenly sized logos right. */
.ind-rows { display: grid; gap: 1rem; }
.ind-row { display: grid; gap: 1.4rem clamp(2rem, 5vw, 4rem); align-items: center; padding: clamp(1.4rem, 3vw, 2.2rem); border: 1px solid var(--border); border-radius: var(--radius); background: rgba(58,58,72,.45); }
@media (min-width: 900px) { .ind-row { grid-template-columns: 1fr 1.1fr; } }
.ind-row h3 { color: var(--gold); font-size: clamp(1.2rem, 2vw, 1.45rem); }
.ind-row__txt p { margin-top: .5rem; color: var(--fg-dim); max-width: 52ch; }
.ind-row__links { display: flex; flex-wrap: wrap; gap: .4rem 1.4rem; margin-top: 1rem !important; }
.ind-row__go { font-size: .8rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--fg); text-decoration: none; }
.ind-row__go:hover { color: var(--gold); }
.ind-row__logos { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: .8rem; }
.ind-row__logos li { display: grid; place-items: center; height: 84px; padding: .6rem; border-radius: 10px; background: rgba(10,10,10,.35); }
.ind-row__logos img { width: auto; max-width: 100%; object-fit: contain; opacity: .92; }
/* About: agency pyramid with side brackets; Hale's model as the pyramid turned upside down. */
.model-row__k { color: var(--gold) !important; font-weight: 600; margin-bottom: .9rem; }
.pyr2 { display: grid; grid-template-columns: 1fr auto; gap: .9rem; align-items: stretch; }
.pyr2__rows { display: grid; gap: .35rem; justify-items: center; }
.pyr2__brackets { list-style: none; margin: 0; padding: 0; display: grid; grid-template-rows: 3fr 2fr; gap: .35rem; width: 8.2rem; }
.pyr2__b { position: relative; display: flex; align-items: center; padding-left: 1rem; font-size: .78rem; font-weight: 700; line-height: 1.25; }
.pyr2__b::before { content: ""; position: absolute; left: 0; top: .25rem; bottom: .25rem; width: .45rem; border: 2px solid currentColor; border-left: 0; border-radius: 0 6px 6px 0; }
.pyr2__b--mgmt { color: #a5a4b4; }
.pyr2__b--face { color: #e39a8b; }
.inv { display: grid; justify-items: center; }
.inv__you { padding: .65rem 2.2rem; border-radius: 999px; background: var(--gold); color: #141414; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; font-size: .85rem; }
.inv__link { position: relative; width: 2px; height: 2.4rem; background: var(--gold); }
.inv__link span { position: absolute; left: .7rem; top: 50%; transform: translateY(-50%); white-space: nowrap; font-size: .72rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--gold); }
.inv__rows { width: 100%; display: grid; gap: .4rem; justify-items: center; }
.inv__row { width: var(--w); display: grid; gap: .1rem; padding: .7rem .8rem; text-align: center; border-radius: 8px; background: #3d3d48; }
.inv__row span { font-weight: 700; font-size: .92rem; color: var(--fg); }
.inv__row em { font-style: normal; font-size: .76rem; color: var(--fg-dim); }
.inv__row--sr { padding: 1rem .8rem; background: rgba(var(--gold-rgb),.24); box-shadow: inset 0 0 0 1.5px var(--gold); }
.inv__row--sr span { font-size: 1.08rem; color: var(--fg); }
.inv__row--ct { background: transparent; border: 1px dashed rgba(165,164,180,.55); }
.pyr2 .pyr__row { min-width: max-content; white-space: nowrap; }
@media (max-width: 520px) { .pyr2__brackets { width: 6.4rem; } .pyr2 .pyr__row { font-size: .74rem; } }
/* Homepage: partner statuses under the logo wall. */
.partners__label { margin-top: clamp(2rem, 4vw, 2.8rem); }
.partners { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: .7rem; }
.partner { display: inline-flex; align-items: center; gap: .6rem; padding: .55rem 1rem; border: 1px solid rgba(var(--gold-rgb),.45); border-radius: 999px; font-size: .88rem; color: var(--fg-dim); }
.partner svg { width: 18px; height: 18px; color: var(--fg); flex: none; }
.partner strong { color: var(--fg); font-weight: 700; }
/* Saje: credit for Google's case study. */
.cs-credit { display: flex; align-items: center; gap: .6rem; margin-top: 1.6rem; color: var(--fg-dim); font-size: var(--fs-sm); }
.cs-credit__g { display: inline-flex; color: var(--fg); }
/* 15 logos: 5 across on desktop (3 full rows), 3 across on phones. */
@media (min-width: 1100px) { .logo-wall { grid-template-columns: repeat(5, 1fr); } }
/* Count-up digits: fixed-width slots (width set by js/hale.js) so the number never changes width. */
/* Counters (js/hale.js): the real number stays in the text, transparent; the counting digits are drawn over it. */
.cnt-on { position: relative; color: transparent; }
.cnt-overlay::after { content: attr(data-shown); position: absolute; left: 0; top: 0; line-height: normal; color: var(--cnt-c, currentColor); white-space: nowrap; }
@media print, (forced-colors: active) { .cnt-on { color: var(--cnt-c, currentColor) !important; } .cnt-overlay { display: none !important; } }
.ga-hero h1 { line-height: 1.14; }
.ga-hero h1 .hl { padding: 0 .12em .02em; }
/* Growth Audit form: optional questions behind one toggle. */
.form__more { margin: .4rem 0 1.4rem; border: 1px solid var(--border); border-radius: var(--radius); padding: 0 1.2rem; }
.form__more > summary { cursor: pointer; list-style: none; padding: 1rem 0; font-weight: 700; color: var(--fg); display: flex; align-items: center; gap: .6rem; }
.form__more > summary::-webkit-details-marker { display: none; }
.form__more > summary::before { content: "+"; display: inline-grid; place-items: center; width: 1.5rem; height: 1.5rem; border-radius: 50%; border: 1.5px solid var(--gold); color: var(--gold); font-weight: 700; line-height: 1; }
.form__more[open] > summary::before { content: "\2212"; }
.form__more > summary:focus-visible { outline: 2px solid var(--gold); outline-offset: 4px; border-radius: 4px; }
.form__more[open] { padding-bottom: 1rem; }
.form__more > .form__hint { margin: -.3rem 0 1rem; }
/* Text-only intros stay at a reading width, but an intro holding a grid of cards uses the full width like the sections around it. */
.svc-intro:not(.svc-intro--viz):has(.check-list--cards) { max-width: none; }
/* Brand photo behind a case card or quote: photo up top, fading to near-black where the text sits. */
:is(.case--brand, .quote--brand)[style*="--brand-img"]::before { opacity: .9; background: var(--brand-img) center / cover no-repeat; }
:is(.case--brand, .quote--brand)[style*="--brand-img"]::after { background: linear-gradient(180deg, rgba(10,10,10,.6) 0%, rgba(10,10,10,.8) 30%, rgba(10,10,10,.9) 60%, rgba(10,10,10,.95) 100%); }
/* About: a small label naming what each diagram shows. */
.model-fig .model-fig__k { margin: 0 0 1rem; text-align: center; font-size: .78rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--fg-dim); }
/* Phones: the rows' inline --w widths would squeeze the labels, so widen the steps (inline custom properties beat stylesheet ones, hence width). */
@media (max-width: 520px) { .pyr2 .pyr__row { padding-inline: .5rem; } .pyr2 .pyr__row:nth-child(1) { width: 66%; } .pyr2 .pyr__row:nth-child(2) { width: 74%; } .pyr2 .pyr__row:nth-child(3) { width: 82%; } .pyr2 .pyr__row:nth-child(4) { width: 91%; } .pyr2 .pyr__row:nth-child(5) { width: 100%; } }
/* Growth graph: the hovered stage lights up on the graph and in the list. */
.gc-k { padding: .22rem .45rem; margin-left: -.45rem; border-radius: 6px; transition: color .15s var(--ease), background-color .15s var(--ease); }
.gc-k.is-hot { color: var(--fg); background: rgba(var(--gold-rgb), .18); }
.gc-key--hale .gc-k.is-hot { color: var(--gold-bright); }
.gc-lbl.is-hot > circle:not(.gc-ring) { fill: var(--gold); stroke: var(--gold); }
.gc--staged .gc-lbl.is-hot .gc-num { fill: #141414; }
/* No gaps between list items (padding instead), so moving down the list never passes over empty space;
   decorative graph shapes ignore the pointer so they can't steal it from a number; circles switch with their digit. */
.gc-key .gc-key__list { gap: 0; }
.gc .gc-grey, .gc .gc-gold, .gc .gc-area, .gc .gc-arrow, .gc .gc-node, .gc > line { pointer-events: none; }
/* Growth graph, stages 5-7 (Hale's steps): each "ignites" once as the gold line reaches it (a ring draws
   and fades, the disc flashes gold), then rests with a slightly heavier gold stroke. On hover the ring draws
   and holds. Delays match the gold line's draw (measured along the path, with its easing). */
.gc .gc-ring { fill: none; stroke-dasharray: 1; stroke-dashoffset: 1; opacity: 0; transition: stroke-dashoffset .35s var(--ease), opacity .2s var(--ease); }
.gc .gc-lbl:is(.gc-n5, .gc-n6, .gc-n7) > circle:not(.gc-ring) { stroke-width: 2; }
.gc .gc-lbl.is-hot .gc-ring { stroke-dashoffset: 0; opacity: .9; }
.reveal-ready .reveal.is-in .gc-lbl.gc-n5 { animation-delay: 1.4s; }
.reveal-ready .reveal.is-in .gc-lbl.gc-n6 { animation-delay: 1.65s; }
.reveal-ready .reveal.is-in .gc-lbl.gc-n7 { animation-delay: 1.9s; }
.reveal-ready .reveal.is-in .gc-lbl:is(.gc-n5, .gc-n6, .gc-n7) .gc-ring { animation: gcRing .95s var(--ease) backwards; }
.reveal-ready .reveal.is-in .gc-lbl:is(.gc-n5, .gc-n6, .gc-n7) > circle:not(.gc-ring) { animation: gcIgnite .9s var(--ease) backwards; }
.reveal-ready .reveal.is-in .gc-lbl.gc-n5 :is(.gc-ring, circle) { animation-delay: 1.55s; }
.reveal-ready .reveal.is-in .gc-lbl.gc-n6 :is(.gc-ring, circle) { animation-delay: 1.8s; }
.reveal-ready .reveal.is-in .gc-lbl.gc-n7 :is(.gc-ring, circle) { animation-delay: 2.05s; }
@keyframes gcRing { 0% { stroke-dashoffset: 1; opacity: .95; } 50% { stroke-dashoffset: 0; opacity: .95; } 100% { stroke-dashoffset: 0; opacity: 0; } }
@keyframes gcIgnite { 0% { fill: #151515; } 30% { fill: hsl(41 62% 55% / .45); } 100% { fill: #151515; } }
/* The one-shot animations use fill-mode "backwards" (not "both"), so once they finish the hover styles above apply
   and nothing replays when the pointer leaves. */
@media (prefers-reduced-motion: reduce) { .gc .gc-lbl .gc-ring, .gc .gc-lbl > circle { animation: none !important; } .gc .gc-ring { transition: none; } }
.motion-paused .gc .gc-lbl .gc-ring, .motion-paused .gc .gc-lbl > circle { animation: none !important; }

/* ===== long-form service guides ===== */
.guide { max-width: 70ch; margin-inline: auto; }
.guide__lede { color: var(--fg-dim); font-size: var(--fs-lede); line-height: 1.6; margin: 0 0 1.6rem; }
.guide__toc { border: 1px solid var(--border); border-radius: var(--radius); padding: 1rem 1.3rem; margin: 0 0 1.6rem; background: rgba(58,58,72,.3); }
.guide__toc-h { margin: 0 0 .5rem; font-size: .75rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--gold); }
.guide__toc ol { margin: 0; padding-left: 1.2rem; display: grid; gap: .25rem 2rem; }
@media (min-width: 720px) { .guide__toc ol { grid-template-columns: 1fr 1fr; } }
.guide__toc a { color: var(--fg); text-decoration: none; border-bottom: 1px solid transparent; }
.guide__toc a:hover, .guide__toc a:focus-visible { border-bottom-color: var(--gold); }
.guide__cta { margin: 2rem 0; }
.guide__body { max-width: none; margin: 0; }
.guide__sec { scroll-margin-top: 6rem; }
.guide__h { font-family: var(--font-display); font-weight: 600; color: var(--fg); font-size: clamp(1.45rem, 3vw, 1.9rem); line-height: 1.15; letter-spacing: -0.01em; margin: 2.4rem 0 1rem; }
.guide__sec:first-child .guide__h { margin-top: 0; }
.guide__sec h4 { color: var(--gold); font-size: 1.1rem; font-weight: 700; margin: 1.6rem 0 .5rem; }
.guide__sec > p, .guide__sec > ul, .guide__sec > ol { margin: 0 0 1.1rem; }
.guide__sec ul, .guide__sec ol { padding-left: 1.2rem; display: grid; gap: .5rem; }
.guide-wrap .sec-head { max-width: 70ch; margin-inline: auto; }

/* Case-study heroes use the client's own photo (approved brand imagery) instead of the storm loop; Work tiles get the homepage photo wash. */
.page-hero--photo { position: relative; overflow: hidden; isolation: isolate; padding-bottom: clamp(4.6rem, 8vw, 6rem); }
.page-hero--photo .page-hero__photo { position: absolute; z-index: -2; top: 0; right: 0; width: min(58%, 860px); height: 100%; object-fit: cover; object-position: center; opacity: .95;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.55) 26%, #000 52%); mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.55) 26%, #000 52%); }
.page-hero--photo .page-hero__scrim { z-index: -1; background: linear-gradient(90deg, rgba(var(--bg-rgb),.9) 0%, rgba(var(--bg-rgb),.55) 45%, rgba(var(--bg-rgb),.1) 100%), linear-gradient(180deg, rgba(var(--bg-rgb),.25) 0%, rgba(var(--bg-rgb),.9) 100%); }
@media (max-width: 860px) {
  .page-hero--photo .page-hero__photo { width: 100%; -webkit-mask-image: none; mask-image: none; opacity: .55; }
  .page-hero--photo .page-hero__scrim { background: linear-gradient(180deg, rgba(var(--bg-rgb),.78) 0%, rgba(var(--bg-rgb),.86) 55%, rgba(var(--bg-rgb),.96) 100%); }
}
.case--wide.case--brand { text-align: left; }
.case--wide.case--brand .logo-box { justify-content: flex-start; }
.case--wide.case--brand .case__logo { object-position: left center; }
.case--wide.case--brand > * { justify-self: start; }
.guide .btn { text-decoration: none; }
.guide .btn--primary, .guide .btn--primary:visited { color: var(--bg); }

/* ===== service guides as designed sections (cards, checklists, steps) ===== */
#guide .section { padding-block: clamp(3rem, 5.6vw, 5rem); }
.gd-lead { font-family: var(--font-display); font-weight: 500; font-size: clamp(1.15rem, 2.1vw, 1.5rem); line-height: 1.4; color: var(--fg); max-width: 56ch; margin: 0 0 1.6rem; padding-left: 1.1rem; border-left: 3px solid var(--gold); }
.gd-lead--intro { color: var(--fg-dim); }
.gd-sec { scroll-margin-top: 5rem; }
.gd-sec .shell { display: grid; gap: clamp(1.2rem, 3vw, 2.2rem); }
@media (min-width: 980px) { .gd-sec .shell { grid-template-columns: minmax(14rem, 22rem) 1fr; gap: clamp(2rem, 5vw, 4.5rem); align-items: start; } .gd-head { position: sticky; top: 6.5rem; } }
.gd-h { font-family: var(--font-display); font-weight: 600; color: var(--fg); font-size: clamp(1.5rem, 2.8vw, 2.1rem); line-height: 1.12; letter-spacing: -0.01em; margin: 0; }
.gd-h::before { content: ""; display: block; width: 2.4rem; height: 3px; background: var(--gold); margin-bottom: 1rem; }
.gd-body { min-width: 0; display: grid; gap: 1.2rem; }
.gd-body > .gd-lead { margin-bottom: .2rem; }
.gd-p { margin: 0; color: var(--fg-dim); font-size: var(--fs-lede); line-height: 1.6; max-width: 66ch; }
.gd-p strong, .gd-card strong { color: var(--fg); font-weight: 600; }
.gd-grid { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr)); }
.gd-card { padding: 1.2rem 1.3rem; border: 1px solid rgba(165,164,180,.24); border-radius: var(--radius); background: rgba(58,58,72,.4); }
.gd-card h4 { margin: 0 0 .5rem; color: var(--gold); font-size: 1.05rem; font-weight: 700; line-height: 1.25; }
.gd-card p { margin: 0 0 .6rem; color: var(--fg-dim); line-height: 1.55; }
.gd-card p:last-child { margin-bottom: 0; }
.gd-card--note { border-left: 3px solid var(--gold); background: rgba(58,58,72,.3); }
.gd-card--note p { color: var(--fg); }
.gd-checks { list-style: none; margin: 0; padding: 0; display: grid; gap: .7rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr)); }
.gd-checks li { position: relative; padding: .85rem 1rem .85rem 2.6rem; border: 1px solid rgba(165,164,180,.2); border-radius: var(--radius); background: rgba(58,58,72,.28); color: var(--fg-dim); line-height: 1.5; }
.gd-checks li::before { content: ""; position: absolute; left: 1rem; top: 1.05rem; width: .8rem; height: .45rem; border-left: 2px solid var(--gold); border-bottom: 2px solid var(--gold); transform: rotate(-45deg); }
.gd-steps { list-style: none; counter-reset: gds; margin: 0; padding: 0; display: grid; gap: .9rem; }
.gd-steps li { counter-increment: gds; position: relative; padding: 1rem 1.2rem 1rem 4rem; border: 1px solid rgba(165,164,180,.24); border-radius: var(--radius); background: rgba(58,58,72,.4); color: var(--fg-dim); line-height: 1.55; }
.gd-steps li::before { content: counter(gds); position: absolute; left: 1.1rem; top: .95rem; width: 2rem; height: 2rem; border-radius: 50%; background: var(--gold); color: var(--bg); font-weight: 700; display: grid; place-items: center; }
.gd-steps strong { color: var(--gold); font-weight: 700; }
.gd-cta .shell { display: flex; justify-content: flex-start; }
.gd-cta { padding-block: clamp(1.6rem, 3vw, 2.4rem) !important; }
#guide .guide__cta { margin: 0; }
.gd-intro .guide__cta { margin-top: .4rem; }
/* The guide's own heading sits under the page's headline, so it is a section heading in size. */
.gd-intro .sec-head h2 { font-size: clamp(1.7rem, 3.2vw, 2.4rem); line-height: 1.12; max-width: 28ch; }
/* Longer client testimonials (shown in full): a little smaller and lighter so a whole quote reads comfortably in a tile. */
.quote--long blockquote { font-size: clamp(.98rem, 1.3vw, 1.08rem); font-weight: 500; line-height: 1.5; }

/* ===== rev3 (Nov 10): case-study backgrounds, case pages for unnamed clients, testimonials spread across pages ===== */
/* Testimonials: plain quotes (no highlights), one or two per page. */
@media (min-width: 860px) { .quotes--duo { grid-template-columns: repeat(2, 1fr); } }
.quote-sec .eyebrow { margin-bottom: 1.2rem; }
.quote--solo { max-width: 920px; height: auto; }
.quote--solo blockquote { font-size: clamp(1.02rem, 1.5vw, 1.18rem); font-weight: 500; line-height: 1.55; }
.quote--solo .logo-box { margin-bottom: 1rem; }
.quote--solo figcaption, .quote--solo .logo-box { align-self: flex-start; }
.quote--solo.quote--brand, .quotes--duo .quote--brand { text-align: left; }
.quote--solo.quote--brand > *, .quotes--duo .quote--brand > * { justify-self: start; }
.quote--solo.quote--brand .logo-box, .quotes--duo .quote--brand .logo-box { justify-content: flex-start; }
.quote--solo.quote--brand .quote__logo, .quotes--duo .quote--brand .quote__logo { object-position: left center; }
.quote--solo.quote--brand figcaption, .quotes--duo .quote--brand figcaption { justify-items: start; }

/* Certified partners: bigger badges; an even 2 x 2 grid on phones. */
.partners { gap: .8rem; }
.partner { gap: .75rem; padding: .85rem 1.3rem; font-size: 1.02rem; }
.partner svg { width: 26px; height: 26px; }
@media (max-width: 640px) {
  .partners { display: grid; grid-template-columns: 1fr 1fr; gap: .7rem; }
  .partner { justify-content: center; text-align: center; padding: .8rem .7rem; font-size: .95rem; border-radius: 14px; flex-direction: column; gap: .45rem; }
  .partner svg { width: 26px; height: 26px; }
}

/* Case-study section backgrounds: the client's own imagery, muted, behind the text (a photo, or the logo as a watermark).
   Unnamed cases use a plain gold chart-line drawing instead (no brand imagery). */
.cs-bg { position: relative; overflow: hidden; isolation: isolate; }
.cs-art { position: absolute; inset: 0; z-index: -1; pointer-events: none; overflow: hidden; }
.cs-art__img { position: absolute; top: 0; right: 0; width: min(56%, 860px); height: 100%; object-fit: cover; object-position: center; opacity: .26; filter: saturate(.75);
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.6) 30%, #000 70%); mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.6) 30%, #000 70%); }
.cs-art--left .cs-art__img { right: auto; left: 0; -webkit-mask-image: linear-gradient(270deg, transparent 0%, rgba(0,0,0,.6) 30%, #000 70%); mask-image: linear-gradient(270deg, transparent 0%, rgba(0,0,0,.6) 30%, #000 70%); }
.cs-art--faint .cs-art__img { opacity: .16; }
.cs-art::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(var(--bg-rgb),.35) 0%, rgba(var(--bg-rgb),0) 30%, rgba(var(--bg-rgb),0) 70%, rgba(var(--bg-rgb),.45) 100%); }
.cs-art__mark { position: absolute; right: 4%; top: 50%; transform: translateY(-50%); width: min(44%, 520px); height: 78%; max-height: 380px; object-fit: contain; object-position: right center; opacity: .05; }
.cs-art--lines { background: url("/assets/brand/generic/case-lines.svg") right -2% center / auto 112% no-repeat; opacity: .32;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, transparent 30%, #000 62%); mask-image: linear-gradient(90deg, transparent 0%, transparent 30%, #000 62%); }
.cs-art--bottom .cs-art__img { object-position: center bottom; }
.cs-art--lines.cs-art--left { background-position: left -2% center; -webkit-mask-image: linear-gradient(270deg, transparent 0%, transparent 30%, #000 62%); mask-image: linear-gradient(270deg, transparent 0%, transparent 30%, #000 62%); }
.cs-art--lines::after { display: none; }
.cs-bg .cs-metric { background: rgba(var(--surface-rgb),.82); }
@media (max-width: 860px) {
  .cs-art__img, .cs-art--left .cs-art__img { width: 100%; -webkit-mask-image: linear-gradient(180deg, rgba(0,0,0,.25) 0%, #000 45%, rgba(0,0,0,.25) 100%); mask-image: linear-gradient(180deg, rgba(0,0,0,.25) 0%, #000 45%, rgba(0,0,0,.25) 100%); opacity: .22; }
  .cs-art--faint .cs-art__img { opacity: .16; }
  .cs-art__mark { right: 50%; transform: translate(50%, -50%); width: 80%; height: 50%; object-position: center; opacity: .06; }
  .cs-art--lines { background-size: auto 70%; background-position: right -30% bottom 0; opacity: .24; -webkit-mask-image: none; mask-image: none; }
}

/* Unnamed case pages: the same layout as the named ones, with no logo and no client imagery.
   Generic Hale textures (mountains, tree rings, roots) stand in for the client's photos. */
.page-hero--generic .page-hero__photo { object-position: center 40%; opacity: .8; }
.cs-more-wrap { margin-top: clamp(2rem, 4vw, 3rem); }
.model2__stage p.cs-step { font-size: var(--fs-lede); line-height: 1.55; }
.cs-metrics--1 { grid-template-columns: 1fr; max-width: 420px; }
.cs-metrics--3 > .cs-metric:last-child { grid-column: 1 / -1; }
@media (min-width: 760px) {
  .cs-metrics--3 > .cs-metric:last-child { grid-column: auto; }
  .cs-metrics--2 { grid-template-columns: repeat(2, 1fr); }
  .cs-metrics--3 { grid-template-columns: repeat(3, 1fr); }
}
.cs-channels { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem 1rem; margin-top: 1.8rem; }
.cs-channels__h { margin: 0; color: var(--fg); font-family: var(--font-body); font-weight: 700; font-size: var(--fs-sm); letter-spacing: .12em; text-transform: uppercase; }
.cs-channels ul { display: flex; flex-wrap: wrap; gap: .6rem; list-style: none; margin: 0; padding: 0; }
.cs-channels li { padding: .4rem .9rem; border: 1px solid rgba(var(--gold-rgb),.4); border-radius: 999px; color: var(--fg-dim); font-size: var(--fs-sm); background: rgba(var(--bg-rgb),.6); }
.cs-more { display: flex; flex-wrap: wrap; gap: .9rem; justify-content: space-between; }
.cs-more a { display: grid; gap: .25rem; flex: 1 1 18rem; padding: 1.1rem 1.3rem; border: 1px solid var(--border); border-radius: var(--radius); background: var(--bg); color: var(--fg); text-decoration: none; transition: border-color .25s var(--ease); }
.cs-more a:hover, .cs-more a:focus-visible { border-color: var(--gold); }
.cs-more__k { color: var(--gold); font-size: .78rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.cs-more__t { font-family: var(--font-display); font-weight: 600; font-size: 1.05rem; line-height: 1.3; }
.cs-more a:last-child { text-align: right; }
@media (max-width: 640px) { .cs-more a:last-child { text-align: left; } }

/* Work page: short client quotes under "Proof, not promises." (B10), kept compact so the first case studies stay in view. */
.page-hero--work { padding-top: 132px; padding-bottom: 4.4rem; }
.page-hero--work .page-hero__cta { margin-top: clamp(1.2rem, 2vw, 1.6rem); }
.page-hero--work h1 { margin: .9rem 0 1.4rem; }
.wq { list-style: none; margin: 0; padding: 0; max-width: 640px; }
.wq li { margin: 0; padding: .2rem 0 .2rem 1.1rem; border-left: 2px solid var(--gold); }
.wq blockquote { margin: 0; color: var(--fg); font-family: var(--font-display); font-weight: 500; font-size: clamp(1.05rem, 1.6vw, 1.25rem); line-height: 1.4; }
.wq figure { margin: 0; }
.wq figcaption { margin-top: .5rem; color: var(--gold); font-weight: 700; font-size: .82rem; }
.work-featured { padding-top: clamp(2rem, 3.4vw, 2.8rem); }
.work-featured .sec-head { margin-bottom: clamp(1.2rem, 2vw, 1.6rem); }
@media (max-width: 760px) {
  .page-hero--work { padding-top: 112px; }
}

/* ga4: cookie banner (js/analytics.js). A compact card fixed to the bottom left (full width on phones, 16px gutter), so showing or
   hiding it never moves the page (CLS 0). Accept all and Decline all carry equal weight on purpose; Just the basics uses the same
   style. The settings view (three switches) swaps in inside the same card and scrolls if the screen is short. */
.consent { position: fixed; z-index: 70; left: 0; bottom: 0; width: 100%; max-width: 30rem; padding: 0 16px 16px; pointer-events: none; }
.consent[hidden], .consent [hidden] { display: none; }
/* Fade in when the banner appears (js/analytics.js adds .is-in a frame after showing it); no motion for reduced motion. */
.consent .consent__box { opacity: 0; transform: translateY(12px); transition: opacity .45s var(--ease), transform .45s var(--ease); }
.consent.is-in .consent__box { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .consent .consent__box { transition: none; transform: none; } }
.consent__box { pointer-events: auto; display: flex; flex-direction: column; gap: .8rem; max-height: calc(100vh - 32px); overflow-y: auto;
  background: var(--surface-2); color: var(--fg); border: 1px solid var(--field-border); border-radius: var(--radius);
  padding: 1rem 1.1rem; box-shadow: 0 18px 48px rgba(0,0,0,.55); }
.consent__view { display: flex; flex-direction: column; gap: .8rem; margin: 0; }
.consent__text { margin: 0; font-size: var(--fs-sm); line-height: 1.55; color: var(--fg); }
.consent__text a, .consent__more { font-size: var(--fs-sm); color: var(--gold); text-decoration: underline; text-underline-offset: 3px; white-space: nowrap; }
.consent__actions { display: grid; grid-template-columns: repeat(3, 1fr); gap: .5rem; }
.consent__btn { min-height: 44px; padding: .55em .45em; justify-content: center; text-align: center; line-height: 1.2; white-space: nowrap;
  background: transparent; color: var(--fg); border-color: var(--gold-deep); }
.consent__btn:hover { background: var(--gold-deep); color: var(--bg); }
/* Accept all is the encouraged choice (owner, Nov 11 2026): it always shows the filled hover style; hovering it lightens it a little. */
.consent__btn--accept { background: var(--gold-deep); color: var(--bg); }
.consent__btn--accept:hover { background: var(--gold); color: var(--bg); }
.consent__btn:focus-visible, .consent__link:focus-visible, .consent__more:focus-visible { outline: 2px solid var(--gold-bright); outline-offset: 3px; }
.consent__link { align-self: flex-start; min-height: 32px; padding: 0; background: none; border: 0; font: inherit; font-size: var(--fs-sm);
  color: var(--gold); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.consent fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
.consent__title { padding: 0; margin: 0 0 .3rem; font-family: var(--font-display); font-weight: 600; font-size: 1.05rem; color: var(--gold); }
.consent__opt { display: grid; grid-template-columns: 1fr auto; gap: .2rem 1rem; align-items: center; padding: .65rem 0; border-top: 1px solid var(--border); }
.consent__opt label { grid-column: 1; grid-row: 1; font-weight: 700; font-size: var(--fs-sm); color: var(--fg); cursor: pointer; }
.consent__desc { grid-column: 1; grid-row: 2; margin: 0; font-size: .8125rem; line-height: 1.45; color: var(--fg-dim); }
.consent__opt input { grid-column: 2; grid-row: 1 / span 2; position: relative; width: 46px; height: 26px; margin: 0; cursor: pointer;
  -webkit-appearance: none; appearance: none; border: 1px solid var(--field-border); border-radius: 13px; background: var(--bg); }
.consent__opt input::before { content: ""; position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; border-radius: 50%;
  background: var(--fg-dim); transition: transform .15s ease; }
.consent__opt input:checked { background: var(--gold-deep); border-color: var(--gold-deep); }
.consent__opt input:checked::before { transform: translateX(20px); background: var(--bg); }
.consent__opt input:focus-visible { outline: 2px solid var(--gold-bright); outline-offset: 3px; }
.consent__row { display: flex; align-items: center; gap: 1rem; }
.consent__row .consent__btn { flex: 0 0 auto; padding: .55em 1.3em; }
.consent .case__flag { margin-top: 0; }
/* Settings sits in the text line, after Read more, so the card has one row of buttons. */
.consent__link--inline { display: inline; min-height: 0; vertical-align: baseline; }
/* Phones (owner, Nov 11 2026: "takes up almost the whole page", then "still half my screen"): a slim bottom bar, two short lines of
   text and one row of three buttons (Accept all, Decline all, Just the basics), about 110px on an iPhone 13 mini. Buttons stay 44px tall. */
@media (max-width: 480px) {
  .consent { max-width: none; padding: 0 8px 8px; }
  .consent__box { padding: .6rem .7rem; gap: .45rem; }
  .consent__view[data-consent-view="banner"] { gap: .45rem; }
  .consent__view[data-consent-view="banner"] .consent__text { font-size: .78rem; line-height: 1.4; }
  .consent__view[data-consent-view="banner"] .consent__text a, .consent__link--inline { font-size: inherit; }
  .consent__actions { grid-template-columns: repeat(3, 1fr); gap: .35rem; }
  .consent__btn { min-height: 44px; padding: .35em .25em; font-size: .8125rem; }
}
/* Very narrow phones: "Just the basics" may wrap onto two lines rather than overflow. */
@media (max-width: 359.98px) { .consent__btn { white-space: normal; } }
}
@media (prefers-reduced-motion: reduce) { .consent__opt input::before { transition: none; } }
@media print { .consent { display: none; } }
/* Named case page facts box (Fratello: industry, reach, founded, relationship, from the case-study slide). */
.cs-facts { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1px; margin: clamp(1.8rem, 3.5vw, 2.6rem) 0 0; background: var(--border); border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; }
.cs-facts > div { background: rgba(var(--surface-rgb),.82); padding: 1.1rem 1.3rem; }
.cs-facts > div:first-child, .cs-facts > div:last-child { grid-column: 1 / -1; }
.cs-facts dt { color: var(--gold); font-size: .72rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.cs-facts dd { margin: .45rem 0 0; color: var(--fg); font-size: var(--fs-sm); line-height: 1.5; }
@media (min-width: 760px) { .cs-facts { grid-template-columns: 1fr 1fr 1fr 2fr; } .cs-facts > div:first-child, .cs-facts > div:last-child { grid-column: auto; } }
.cs-results-note { margin-top: clamp(1.6rem, 3vw, 2.2rem); }
.nowrap { white-space: nowrap; }
