/* ==========================================================================
   Otimiz v2 site skin: every marketing page except the homepage.
   Requires /css/v2-base.css first (fonts, tokens, header, footer, buttons,
   FAQ rows, contour texture). Restyles the EXISTING page DOM and class names
   (the ones css/style.css + css/pages.css used to style) with the v2 tokens
   and the Hyros-derived component shapes; neither of those two files is
   loaded on a v2 page. Built 2026-09-17, docs/SITE-V2-2026-09-17.md.
   ========================================================================== */

/* ---------- Legacy token bridge ----------
   Inline style attributes in the frozen page markup (comparison tables, the
   s-case quote, footer links) and the styles injected by js/audit-cta.js still
   reference the old style.css custom properties. They resolve to v2 values here
   instead of falling back to nothing. */
:root {
  --blue: var(--brand-600);
  --blue-deep: #1A4CCB;
  --blue-dark: #163F9C;
  --blue-ink: var(--ink-900);
  --ink: var(--ink-900);
  --body: var(--ink-600);
  --muted: var(--ink-450);
  --bg: var(--paper-page);
  --bg-soft: var(--paper-panel);
  --line: var(--border-subtle);
  --blue-tint: var(--brand-100);
  --shadow-soft: var(--shadow-card);
  --shadow-lift: var(--shadow-win);
  /* booking-flow.css tokens (book/ only, harmless elsewhere) */
  --surface: var(--paper-page);
  --edge: var(--border-strong);
  --zp-brand: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20800%20600%22%20preserveAspectRatio=%22xMidYMid%20slice%22%3E%3Cg%20fill=%22none%22%20stroke=%22rgba%2831,88,234,0.075%29%22%20stroke-width=%2214%22%20stroke-linecap=%22round%22%3E%3Cpath%20d=%22M-80%20-63%20C-25%20-63%20-25%20-23%2030%20-23%20C85%20-23%2085%20-4%20140%20-4%20C195%20-4%20195%20-36%20250%20-36%20C305%20-36%20305%20-63%20360%20-63%20C415%20-63%20415%20-50%20470%20-50%20C525%20-50%20525%20-13%20580%20-13%20C635%20-13%20635%20-11%20690%20-11%20C745%20-11%20745%20-49%20800%20-49%20C855%20-49%20855%20-70%20910%20-70%22/%3E%3Cpath%20d=%22M-80%200%20C-25%200%20-25%20-4%2030%20-4%20C85%20-4%2085%2022%20140%2022%20C195%2022%20195%2049%20250%2049%20C305%2049%20305%2038%20360%2038%20C415%2038%20415%20-2%20470%20-2%20C525%20-2%20525%20-4%20580%20-4%20C635%20-4%20635%2026%20690%2026%20C745%2026%20745%2051%20800%2051%20C855%2051%20855%2041%20910%2041%22/%3E%3Cpath%20d=%22M-80%2091%20C-25%2091%20-25%20106%2030%20106%20C85%20106%2085%20114%20140%20114%20C195%20114%20195%2094%20250%2094%20C305%2094%20305%2087%20360%2087%20C415%2087%20415%2079%20470%2079%20C525%2079%20525%2077%20580%2077%20C635%2077%20635%2092%20690%2092%20C745%2092%20745%20108%20800%20108%20C855%20108%20855%20111%20910%20111%22/%3E%3Cpath%20d=%22M-80%20141%20C-25%20141%20-25%20116%2030%20116%20C85%20116%2085%20125%20140%20125%20C195%20125%20195%20151%20250%20151%20C305%20151%20305%20170%20360%20170%20C415%20170%20415%20169%20470%20169%20C525%20169%20525%20151%20580%20151%20C635%20151%20635%20133%20690%20133%20C745%20133%20745%20126%20800%20126%20C855%20126%20855%20138%20910%20138%22/%3E%3Cpath%20d=%22M-80%20247%20C-25%20247%20-25%20231%2030%20231%20C85%20231%2085%20215%20140%20215%20C195%20215%20195%20216%20250%20216%20C305%20216%20305%20236%20360%20236%20C415%20236%20415%20253%20470%20253%20C525%20253%20525%20251%20580%20251%20C635%20251%20635%20232%20690%20232%20C745%20232%20745%20217%20800%20217%20C855%20217%20855%20214%20910%20214%22/%3E%3Cpath%20d=%22M-80%20319%20C-25%20319%20-25%20332%2030%20332%20C85%20332%2085%20300%20140%20300%20C195%20300%20195%20279%20250%20279%20C305%20279%20305%20273%20360%20273%20C415%20273%20415%20310%20470%20310%20C525%20310%20525%20333%20580%20333%20C635%20333%20635%20320%20690%20320%20C745%20320%20745%20282%20800%20282%20C855%20282%20855%20266%20910%20266%22/%3E%3Cpath%20d=%22M-80%20374%20C-25%20374%20-25%20349%2030%20349%20C85%20349%2085%20343%20140%20343%20C195%20343%20195%20345%20250%20345%20C305%20345%20305%20372%20360%20372%20C415%20372%20415%20388%20470%20388%20C525%20388%20525%20391%20580%20391%20C635%20391%20635%20379%20690%20379%20C745%20379%20745%20356%20800%20356%20C855%20356%20855%20344%20910%20344%22/%3E%3Cpath%20d=%22M-80%20392%20C-25%20392%20-25%20400%2030%20400%20C85%20400%2085%20422%20140%20422%20C195%20422%20195%20447%20250%20447%20C305%20447%20305%20463%20360%20463%20C415%20463%20415%20442%20470%20442%20C525%20442%20525%20424%20580%20424%20C635%20424%20635%20396%20690%20396%20C745%20396%20745%20390%20800%20390%20C855%20390%20855%20407%20910%20407%22/%3E%3Cpath%20d=%22M-80%20497%20C-25%20497%20-25%20515%2030%20515%20C85%20515%2085%20504%20140%20504%20C195%20504%20195%20478%20250%20478%20C305%20478%20305%20469%20360%20469%20C415%20469%20415%20477%20470%20477%20C525%20477%20525%20503%20580%20503%20C635%20503%20635%20511%20690%20511%20C745%20511%20745%20484%20800%20484%20C855%20484%20855%20463%20910%20463%22/%3E%3Cpath%20d=%22M-80%20561%20C-25%20561%20-25%20529%2030%20529%20C85%20529%2085%20542%20140%20542%20C195%20542%20195%20582%20250%20582%20C305%20582%20305%20595%20360%20595%20C415%20595%20415%20550%20470%20550%20C525%20550%20525%20527%20580%20527%20C635%20527%20635%20552%20690%20552%20C745%20552%20745%20585%20800%20585%20C855%20585%20855%20581%20910%20581%22/%3E%3Cpath%20d=%22M-80%20642%20C-25%20642%20-25%20648%2030%20648%20C85%20648%2085%20622%20140%20622%20C195%20622%20195%20599%20250%20599%20C305%20599%20305%20583%20360%20583%20C415%20583%20415%20604%20470%20604%20C525%20604%20525%20639%20580%20639%20C635%20639%20635%20650%20690%20650%20C745%20650%20745%20632%20800%20632%20C855%20632%20855%20593%20910%20593%22/%3E%3C/g%3E%3C/svg%3E");
  --zp-ink: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20800%20600%22%20preserveAspectRatio=%22xMidYMid%20slice%22%3E%3Cg%20fill=%22none%22%20stroke=%22rgba%2831,30,29,0.045%29%22%20stroke-width=%2214%22%20stroke-linecap=%22round%22%3E%3Cpath%20d=%22M-80%20-63%20C-25%20-63%20-25%20-23%2030%20-23%20C85%20-23%2085%20-4%20140%20-4%20C195%20-4%20195%20-36%20250%20-36%20C305%20-36%20305%20-63%20360%20-63%20C415%20-63%20415%20-50%20470%20-50%20C525%20-50%20525%20-13%20580%20-13%20C635%20-13%20635%20-11%20690%20-11%20C745%20-11%20745%20-49%20800%20-49%20C855%20-49%20855%20-70%20910%20-70%22/%3E%3Cpath%20d=%22M-80%200%20C-25%200%20-25%20-4%2030%20-4%20C85%20-4%2085%2022%20140%2022%20C195%2022%20195%2049%20250%2049%20C305%2049%20305%2038%20360%2038%20C415%2038%20415%20-2%20470%20-2%20C525%20-2%20525%20-4%20580%20-4%20C635%20-4%20635%2026%20690%2026%20C745%2026%20745%2051%20800%2051%20C855%2051%20855%2041%20910%2041%22/%3E%3Cpath%20d=%22M-80%2091%20C-25%2091%20-25%20106%2030%20106%20C85%20106%2085%20114%20140%20114%20C195%20114%20195%2094%20250%2094%20C305%2094%20305%2087%20360%2087%20C415%2087%20415%2079%20470%2079%20C525%2079%20525%2077%20580%2077%20C635%2077%20635%2092%20690%2092%20C745%2092%20745%20108%20800%20108%20C855%20108%20855%20111%20910%20111%22/%3E%3Cpath%20d=%22M-80%20141%20C-25%20141%20-25%20116%2030%20116%20C85%20116%2085%20125%20140%20125%20C195%20125%20195%20151%20250%20151%20C305%20151%20305%20170%20360%20170%20C415%20170%20415%20169%20470%20169%20C525%20169%20525%20151%20580%20151%20C635%20151%20635%20133%20690%20133%20C745%20133%20745%20126%20800%20126%20C855%20126%20855%20138%20910%20138%22/%3E%3Cpath%20d=%22M-80%20247%20C-25%20247%20-25%20231%2030%20231%20C85%20231%2085%20215%20140%20215%20C195%20215%20195%20216%20250%20216%20C305%20216%20305%20236%20360%20236%20C415%20236%20415%20253%20470%20253%20C525%20253%20525%20251%20580%20251%20C635%20251%20635%20232%20690%20232%20C745%20232%20745%20217%20800%20217%20C855%20217%20855%20214%20910%20214%22/%3E%3Cpath%20d=%22M-80%20319%20C-25%20319%20-25%20332%2030%20332%20C85%20332%2085%20300%20140%20300%20C195%20300%20195%20279%20250%20279%20C305%20279%20305%20273%20360%20273%20C415%20273%20415%20310%20470%20310%20C525%20310%20525%20333%20580%20333%20C635%20333%20635%20320%20690%20320%20C745%20320%20745%20282%20800%20282%20C855%20282%20855%20266%20910%20266%22/%3E%3Cpath%20d=%22M-80%20374%20C-25%20374%20-25%20349%2030%20349%20C85%20349%2085%20343%20140%20343%20C195%20343%20195%20345%20250%20345%20C305%20345%20305%20372%20360%20372%20C415%20372%20415%20388%20470%20388%20C525%20388%20525%20391%20580%20391%20C635%20391%20635%20379%20690%20379%20C745%20379%20745%20356%20800%20356%20C855%20356%20855%20344%20910%20344%22/%3E%3Cpath%20d=%22M-80%20392%20C-25%20392%20-25%20400%2030%20400%20C85%20400%2085%20422%20140%20422%20C195%20422%20195%20447%20250%20447%20C305%20447%20305%20463%20360%20463%20C415%20463%20415%20442%20470%20442%20C525%20442%20525%20424%20580%20424%20C635%20424%20635%20396%20690%20396%20C745%20396%20745%20390%20800%20390%20C855%20390%20855%20407%20910%20407%22/%3E%3Cpath%20d=%22M-80%20497%20C-25%20497%20-25%20515%2030%20515%20C85%20515%2085%20504%20140%20504%20C195%20504%20195%20478%20250%20478%20C305%20478%20305%20469%20360%20469%20C415%20469%20415%20477%20470%20477%20C525%20477%20525%20503%20580%20503%20C635%20503%20635%20511%20690%20511%20C745%20511%20745%20484%20800%20484%20C855%20484%20855%20463%20910%20463%22/%3E%3Cpath%20d=%22M-80%20561%20C-25%20561%20-25%20529%2030%20529%20C85%20529%2085%20542%20140%20542%20C195%20542%20195%20582%20250%20582%20C305%20582%20305%20595%20360%20595%20C415%20595%20415%20550%20470%20550%20C525%20550%20525%20527%20580%20527%20C635%20527%20635%20552%20690%20552%20C745%20552%20745%20585%20800%20585%20C855%20585%20855%20581%20910%20581%22/%3E%3Cpath%20d=%22M-80%20642%20C-25%20642%20-25%20648%2030%20648%20C85%20648%2085%20622%20140%20622%20C195%20622%20195%20599%20250%20599%20C305%20599%20305%20583%20360%20583%20C415%20583%20415%20604%20470%20604%20C525%20604%20525%20639%20580%20639%20C635%20639%20635%20650%20690%20650%20C745%20650%20745%20632%20800%20632%20C855%20632%20855%20593%20910%20593%22/%3E%3C/g%3E%3C/svg%3E");
}

/* ---------- Page shell ---------- */
.subpage { background: var(--paper-page); }
.container { max-width: var(--container); margin: 0 auto; padding: 0 var(--gutter); }
.container--narrow { max-width: calc(820px + 2 * var(--gutter)); }
h4, h5, h6, ul, ol, figure, blockquote, fieldset { margin: 0; }
fieldset { padding: 0; border: 0; }
::selection { background: var(--brand-600); color: var(--white); }

/* ---------- Section rhythm ----------
   Soft sections were full-bleed tinted bands; they stay full-bleed but drop to
   the warm panel paper with hairlines, the way Hyros bands its stats strip. */
.s-section { padding: 88px 0; position: relative; }
.s-section--soft { background: var(--paper-panel); border-top: 1px solid var(--border-subtle); border-bottom: 1px solid var(--border-subtle); }
.s-section--soft + .s-section--soft { border-top: 0; }
.shero + .s-section--soft { border-top: 0; }

/* ---------- Mono eyebrow (replaces the pill) ---------- */
.eyebrow {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: var(--font-mono); font-size: 11px; font-weight: 500;
  letter-spacing: .12em; text-transform: uppercase; line-height: 1.4;
  color: var(--ink-500); background: none; border: 0; padding: 0; border-radius: 0;
}
.eyebrow__emoji { display: none; } /* Hyros has no emoji glyphs; the eyebrow text survives */
.eyebrow--light { color: var(--ink-500); background: none; border: 0; backdrop-filter: none; }

/* ---------- Breadcrumb ---------- */
.crumbs { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; font-family: var(--font-mono); font-size: 11px; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-500); }
.crumbs a { color: var(--ink-500); transition: color var(--fast) ease; }
.crumbs a:hover { color: var(--brand-600); }
.crumbs__sep { opacity: .45; }
.crumbs__current { color: var(--ink-900); }

/* ---------- Buttons (old modifier names, v2 shapes) ---------- */
.btn { font-family: var(--font-body); font-weight: 400; }
.btn--primary { background: var(--brand-600); color: var(--white); }
.btn--primary:hover { background: #1A4CCB; color: var(--white); }
.btn--white { background: var(--brand-600); color: var(--white); box-shadow: none; }
.btn--white:hover { background: #1A4CCB; }
.btn--ghost { background: var(--white); color: rgba(31,30,29,.9); border: 1px solid var(--border-strong); box-shadow: none; }
.btn--ghost:hover { background: var(--brand-100); border-color: var(--border-brand); color: var(--ink-900); }
.btn--lg { padding: 15px 26px; font-size: 15px; }
.btn--ghost.btn--lg { padding: 14px 26px; }
.btn--sm { padding: 10px 14px; font-size: 13.5px; }
.btn--ghost.btn--sm { padding: 9px 14px; }
.btn:disabled { opacity: .6; cursor: wait; }

/* ---------- Subpage hero (.shero) ---------- */
.shero { position: relative; padding: 52px 0 44px; overflow: hidden; background: none; }
.shero__grid { display: none; }
.shero__inner { position: relative; z-index: 1; max-width: 840px; }
.shero__inner:not(.shero__inner--split) { margin-left: auto; margin-right: auto; text-align: center; }
.shero__inner:not(.shero__inner--split) .crumbs,
.shero__inner:not(.shero__inner--split) .shero__cta,
.shero__inner:not(.shero__inner--split) .trust-inline,
.shero__inner:not(.shero__inner--split) .post-meta { justify-content: center; }
.shero__inner:not(.shero__inner--split) .shero__lead { margin-left: auto; margin-right: auto; }
.shero .crumbs { margin-bottom: 26px; }
.shero .eyebrow { margin-bottom: 0; }
.shero__title {
  margin-top: 16px;
  font-family: var(--font-display); font-weight: 400; font-size: 50px; line-height: 1.12;
  letter-spacing: -0.01em; color: var(--ink-900); font-variation-settings: 'opsz' 64;
  text-wrap: balance;
}
.shero__title em { font-style: normal; color: var(--brand-600); background: none; -webkit-text-fill-color: currentColor; }
.shero__lead { margin-top: 20px; max-width: 640px; font-size: 18px; line-height: 1.55; color: var(--ink-600); letter-spacing: 0; text-wrap: pretty; }
.shero__cta { margin-top: 28px; display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.trust-inline { display: flex; align-items: center; gap: 10px; margin-top: 22px; flex-wrap: wrap; }
.trust-inline .star { width: 14px; height: 14px; }
.trust-inline__text { font-size: 13.5px; color: var(--ink-600); letter-spacing: 0; }
.trust-inline__text a { color: var(--brand-600); text-decoration: underline; text-decoration-color: rgba(31,88,234,.35); text-underline-offset: 3px; }
.trust-inline__text a:hover { text-decoration-color: var(--brand-600); }

/* Split hero: copy left, media in the pale-blue contour panel that the homepage hero uses */
.shero__inner--split { display: grid; grid-template-columns: 500px 1fr; gap: 52px; align-items: center; max-width: none; }
.shero__copy { min-width: 0; }
.shero__media {
  position: relative; min-width: 0; overflow: hidden;
  border: 1px solid var(--border-brand); border-radius: var(--radius-lg); background: var(--brand-100);
  padding: 32px;
}
.shero__media::before {
  content: ""; position: absolute; inset: -30%; width: 160%; height: 160%; pointer-events: none; z-index: 0;
  background: var(--zp-brand) center / 100% 100% no-repeat; transform: rotate(-18deg); transform-origin: 50% 50%;
}
.shero__media img {
  position: relative; z-index: 1; width: 100%; height: auto; display: block;
  border-radius: var(--radius-card); border: 1px solid var(--border-subtle); background: var(--white);
  box-shadow: var(--shadow-win);
}
.shero__media#audit-form { padding: 0; border: 0; background: none; overflow: visible; border-radius: 0; }
.shero__media#audit-form::before { display: none; }
.shero__media#audit-form { scroll-margin-top: calc(var(--header-h) + 24px); }

/* ---------- Section heads, prose ---------- */
.s-head { max-width: 720px; margin-bottom: 40px; display: flex; flex-direction: column; gap: 14px; align-items: flex-start; }
.s-head--center { margin-left: auto; margin-right: auto; align-items: center; text-align: center; }
.s-title {
  font-family: var(--font-display); font-weight: 500; font-size: 40px; line-height: 1.12;
  letter-spacing: -0.012em; color: var(--ink-900); font-variation-settings: 'opsz' 64; text-wrap: balance;
}
.s-sub { font-size: 16px; line-height: 1.6; color: var(--ink-600); max-width: 640px; letter-spacing: 0; }
.s-sub strong { color: var(--ink-900); font-weight: 500; }
.s-sub a { color: var(--brand-600); text-decoration: underline; text-decoration-color: rgba(31,88,234,.35); text-underline-offset: 3px; }
.s-prose p { font-size: 16.5px; line-height: 1.65; color: var(--ink-600); margin-bottom: 18px; max-width: 720px; letter-spacing: 0; }
.s-prose p:last-child { margin-bottom: 0; }
.s-prose strong { color: var(--ink-900); font-weight: 500; }
.s-prose a { color: var(--brand-600); text-decoration: underline; text-decoration-color: rgba(31,88,234,.35); text-underline-offset: 3px; }
.s-prose .s-head { margin-bottom: 26px; }
.s-lead-para { font-size: 18px; line-height: 1.55; color: var(--ink-900); }

/* ---------- Problem callout ---------- */
.s-problem {
  background: var(--white); border: 1px solid var(--border-subtle); border-left: 1px solid var(--border-subtle);
  border-radius: var(--radius-card); padding: 26px 28px; max-width: 760px; box-shadow: var(--shadow-card);
}
.s-problem__tag {
  display: inline-block; font-family: var(--font-mono); font-size: 11px; font-weight: 500; letter-spacing: .1em; text-transform: uppercase;
  color: var(--brand-600); background: var(--brand-100); border: 1px solid var(--border-brand);
  padding: 5px 9px; border-radius: var(--radius-xs); margin-bottom: 14px;
}
.s-problem p { color: var(--ink-700); font-size: 15px; line-height: 1.6; letter-spacing: 0; }

/* ---------- Two-column intro ---------- */
.s-split { display: grid; grid-template-columns: 1.15fr .85fr; gap: 48px; align-items: start; }

/* ---------- Cards: steps, features, services, posts ---------- */
.card-lift { transition: transform .2s var(--ease), box-shadow .2s var(--ease), border-color .2s var(--ease); }
.steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.step {
  position: relative; background: var(--white); border: 1px solid var(--border-subtle); border-radius: var(--radius-card);
  padding: 26px 24px 24px; transition: transform .2s var(--ease), box-shadow .2s var(--ease), border-color .2s var(--ease);
}
.step:hover { transform: translateY(-2px); box-shadow: var(--shadow-hover); border-color: var(--border-brand); }
.step__num {
  display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: var(--radius-xs);
  background: var(--brand-100); color: var(--brand-600); font-family: var(--font-mono); font-size: 11.5px; letter-spacing: .04em;
  margin-bottom: 16px;
}
.step__title { font-family: var(--font-display); font-weight: 500; font-size: 20px; line-height: 1.25; letter-spacing: -0.005em; color: var(--ink-900); font-variation-settings: 'opsz' 48; margin-bottom: 8px; }
.step__desc { color: var(--ink-600); font-size: 14.5px; line-height: 1.6; letter-spacing: 0; }
.step__desc a { color: var(--brand-600); text-decoration: underline; text-decoration-color: rgba(31,88,234,.35); text-underline-offset: 3px; }

.feature-grid { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px; }
.feature-grid > .feature { flex: 0 1 calc((100% - 14px) / 2); min-width: 0; }
.feature {
  display: flex; gap: 16px; background: var(--white); border: 1px solid var(--border-subtle); border-radius: var(--radius-card);
  padding: 22px 24px; transition: transform .2s var(--ease), box-shadow .2s var(--ease), border-color .2s var(--ease);
}
.feature:hover { transform: translateY(-2px); box-shadow: var(--shadow-hover); border-color: var(--border-brand); }
.feature__ico { flex: none; width: 40px; height: 40px; border-radius: 10px; background: var(--brand-100); color: var(--brand-600); display: flex; align-items: center; justify-content: center; }
.feature__ico svg { width: 20px; height: 20px; }
.feature__title { font-family: var(--font-display); font-weight: 500; font-size: 18px; line-height: 1.3; color: var(--ink-900); font-variation-settings: 'opsz' 48; margin-bottom: 6px; }
.feature__desc { color: var(--ink-600); font-size: 14.5px; line-height: 1.6; letter-spacing: 0; }
.feature__desc a { color: var(--brand-600); text-decoration: underline; text-decoration-color: rgba(31,88,234,.35); text-underline-offset: 3px; }

.svc-grid, .post-grid { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px; }
.svc-grid > .svc-card, .post-grid > .post-card { flex: 0 1 calc((100% - 28px) / 3); min-width: 0; }
.svc-card, .post-card {
  display: flex; flex-direction: column; background: var(--white); border: 1px solid var(--border-subtle); border-radius: var(--radius-card);
  padding: 28px 26px 26px; position: relative; overflow: hidden;
  transition: transform .2s var(--ease), box-shadow .2s var(--ease), border-color .2s var(--ease);
}
.svc-card:hover, .post-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-hover); border-color: var(--border-brand); }
.svc-card__ico { width: 44px; height: 44px; border-radius: 10px; background: var(--brand-100); color: var(--brand-600); display: flex; align-items: center; justify-content: center; margin-bottom: 20px; }
.svc-card__ico svg { width: 22px; height: 22px; }
.svc-card__title, .post-card__title { font-family: var(--font-display); font-weight: 500; font-size: 21px; line-height: 1.25; letter-spacing: -0.005em; color: var(--ink-900); font-variation-settings: 'opsz' 48; margin-bottom: 10px; }
.svc-card__desc, .post-card__excerpt { color: var(--ink-600); font-size: 14.5px; line-height: 1.6; flex: 1; letter-spacing: 0; }
.svc-card__link, .post-card__link { margin-top: 20px; display: inline-flex; align-items: center; gap: 6px; font-size: 13.5px; font-weight: 500; color: var(--brand-600); }
.svc-card__link svg, .post-card__link svg { width: 14px; height: 14px; transition: transform .2s var(--ease); }
.svc-card:hover .svc-card__link svg, .post-card:hover .post-card__link svg { transform: translateX(3px); }
.post-card__tag { align-self: flex-start; font-family: var(--font-mono); font-size: 11px; font-weight: 500; letter-spacing: .1em; text-transform: uppercase; color: var(--brand-600); margin-bottom: 14px; }
.post-card__meta { margin-top: 16px; font-family: var(--font-mono); font-size: 11.5px; letter-spacing: .02em; color: var(--ink-450); }

/* ---------- Result / mini-case panel: the tinted contour panel ---------- */
.s-case {
  position: relative; overflow: hidden; display: grid; grid-template-columns: 1.3fr .7fr; gap: 40px; align-items: center;
  background: var(--brand-100); border: 1px solid var(--border-brand); border-radius: var(--radius-lg);
  padding: 48px 52px; color: var(--ink-900); box-shadow: none;
}
.s-case::before, .cta__panel::before {
  content: ""; position: absolute; inset: -30%; width: 160%; height: 160%; pointer-events: none; z-index: 0;
  background: var(--zp-brand) center / 100% 100% no-repeat; transform: rotate(-18deg); transform-origin: 50% 50%;
}
.cta__panel::before { background-image: var(--zp-ink); }
.s-case > * { position: relative; z-index: 1; }
.s-case__label { color: var(--ink-500); }
.s-case__quote { font-family: var(--font-display); font-weight: 500; font-size: 24px; line-height: 1.4; letter-spacing: -0.005em; color: var(--ink-900); font-variation-settings: 'opsz' 48; }
.s-case__quote span { color: var(--brand-600); }
.s-case__stat { text-align: center; border-left: 1px solid var(--border-brand); padding-left: 36px; }
.s-case__num { font-family: var(--font-display); font-weight: 400; font-size: 56px; line-height: 1; letter-spacing: -0.015em; color: var(--brand-600); font-variation-settings: 'opsz' 64; }
.s-case__cap { color: var(--ink-600); font-size: 14px; line-height: 1.5; margin-top: 12px; letter-spacing: 0; }

/* ---------- Results list, testimonial figure ---------- */
.s-list { list-style: none; padding: 0; display: grid; gap: 12px; max-width: 720px; }
.s-list li { position: relative; padding-left: 30px; color: var(--ink-600); font-size: 15.5px; line-height: 1.55; letter-spacing: 0; }
.s-list li::before { content: ""; position: absolute; left: 0; top: 3px; width: 18px; height: 18px; border-radius: 50%; background: var(--brand-100); border: 1px solid var(--border-brand); }
.s-list li::after { content: ""; position: absolute; left: 5px; top: 8px; width: 8px; height: 4px; border-left: 1.6px solid var(--brand-600); border-bottom: 1.6px solid var(--brand-600); transform: rotate(-45deg); }
.s-list li strong { color: var(--ink-900); font-weight: 500; }

.s-quote { max-width: 820px; margin: 0 auto; background: var(--white); border: 1px solid var(--border-subtle); border-radius: var(--radius-panel); padding: 36px 40px; }
.s-quote__text { font-family: var(--font-display); font-weight: 500; font-size: 22px; line-height: 1.45; letter-spacing: -0.005em; color: var(--ink-900); font-variation-settings: 'opsz' 48; border-left: 2px solid var(--brand-600); padding-left: 18px; }
.s-quote__cite { display: block; margin-top: 18px; font-style: normal; font-size: 13.5px; color: var(--ink-500); letter-spacing: 0; }
.s-quote__cite strong { color: var(--ink-900); font-weight: 500; }
.s-quote .upwork-link { font-size: 12px; padding: 6px 10px; }
.s-quote .upwork-link__logo { height: 13px; }
.upwork-link__label { text-decoration: none; }
.upwork-link__ext { width: 12px; height: 12px; color: rgba(31,30,29,.5); transition: transform .2s var(--ease); }
.upwork-link:hover .upwork-link__ext { transform: translate(1px,-1px); }

/* ---------- Tools strip ---------- */
.tools { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.tools__chip {
  display: inline-flex; align-items: center; gap: 9px; padding: 9px 14px;
  background: var(--white); border: 1px solid var(--border-subtle); border-radius: 8px;
  font-size: 13.5px; color: var(--ink-900); letter-spacing: 0; box-shadow: none;
  transition: transform .2s var(--ease), box-shadow .2s var(--ease), border-color .2s var(--ease);
}
.tools__chip:hover { transform: translateY(-2px); box-shadow: var(--shadow-hover); border-color: var(--border-brand); }
.tools__chip img { height: 18px; width: auto; max-width: 80px; object-fit: contain; }

/* ---------- Related links ---------- */
.related { display: flex; flex-wrap: wrap; gap: 8px; }
.related a {
  padding: 9px 14px; border-radius: var(--radius-sm); border: 1px solid var(--border-strong); background: var(--white);
  font-size: 13.5px; color: var(--ink-900); letter-spacing: 0;
  transition: background-color var(--fast) ease, border-color var(--fast) ease, color var(--fast) ease;
}
.related a:hover { background: var(--brand-100); border-color: var(--border-brand); color: var(--ink-900); }

/* ---------- Article (guides, comparisons, legal, privacy) ---------- */
.post-meta { display: flex; align-items: center; gap: 12px; margin-top: 22px; font-size: 13.5px; color: var(--ink-600); flex-wrap: wrap; letter-spacing: 0; }
.post-meta__author { display: inline-flex; align-items: center; gap: 8px; color: var(--ink-900); }
.post-meta__author img { width: 30px; height: 30px; border-radius: 50%; object-fit: cover; object-position: top; }
.post-meta__sep { opacity: .45; }
.article { max-width: 760px; margin: 0 auto; }
.article > * + * { margin-top: 20px; }
.article__lead { font-size: 20px; line-height: 1.55; color: var(--ink-900); font-weight: 400; letter-spacing: 0; }
.article h2 { font-family: var(--font-display); font-weight: 500; font-size: 34px; line-height: 1.15; letter-spacing: -0.012em; color: var(--ink-900); font-variation-settings: 'opsz' 64; margin-top: 48px; text-wrap: balance; scroll-margin-top: calc(var(--header-h) + 16px); }
.article h3 { font-family: var(--font-display); font-weight: 500; font-size: 24px; line-height: 1.25; letter-spacing: -0.005em; color: var(--ink-900); font-variation-settings: 'opsz' 48; margin-top: 32px; scroll-margin-top: calc(var(--header-h) + 16px); }
.article h2 + h3 { margin-top: 20px; }
.article p { font-size: 17px; line-height: 1.7; color: var(--ink-600); letter-spacing: 0; }
.article p strong, .article li strong { color: var(--ink-900); font-weight: 500; }
.article a { color: var(--brand-600); text-decoration: underline; text-underline-offset: 3px; text-decoration-color: rgba(31,88,234,.35); transition: text-decoration-color var(--fast) ease; }
.article a:hover { text-decoration-color: var(--brand-600); }
.article ul, .article ol { padding-left: 24px; color: var(--ink-600); font-size: 17px; line-height: 1.7; letter-spacing: 0; }
.article li { margin-top: 8px; }
.article li::marker { color: var(--ink-450); }
.article blockquote {
  margin: 32px 0 0; padding: 4px 0 4px 20px; border-left: 2px solid var(--brand-600); background: none; border-radius: 0;
  font-family: var(--font-display); font-weight: 500; font-size: 22px; line-height: 1.4; letter-spacing: -0.005em; color: var(--ink-900); font-variation-settings: 'opsz' 48;
}
.article blockquote p { font: inherit; color: inherit; }
.article img { border-radius: var(--radius-card); border: 1px solid var(--border-subtle); }
.article code { font-family: var(--font-mono); font-size: .92em; background: var(--paper-muted); padding: 1px 5px; border-radius: 4px; }
.article hr { border: 0; border-top: 1px solid var(--border-subtle); margin-top: 32px; }
.article table { width: 100%; border-collapse: collapse; }

/* Comparison table (its cells carry inline padding/border styles that now resolve through the token bridge) */
.cmp-table-wrap { border: 1px solid var(--border-subtle); border-radius: var(--radius-card); background: var(--white); }
.cmp-table-wrap table.cmp-table { border: 0 !important; border-radius: 0 !important; font-size: 15px !important; }
.cmp-table th { font-family: var(--font-mono) !important; font-weight: 500 !important; font-size: 11.5px !important; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-500) !important; background: var(--paper-card); }
.cmp-table thead tr { background: var(--paper-card) !important; color: var(--ink-500) !important; }
.cmp-table td { line-height: 1.5; letter-spacing: 0; }
.cmp-table td[style*="font-weight:600"] { font-weight: 500 !important; }
.cmp-table-hint { font-family: var(--font-mono); font-size: 11.5px; color: var(--ink-500); letter-spacing: .02em; }

.takeaways { max-width: 760px; margin: 0 auto; background: var(--paper-panel); border: 1px solid var(--border-panel); border-left: 1px solid var(--border-panel); border-radius: var(--radius-card); padding: 24px 28px; }
.article > .takeaways { margin-top: 28px; }
.takeaways h2 { margin-top: 0; font-family: var(--font-mono); font-size: 11px; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-500); line-height: 1.4; }
.takeaways ul { margin-top: 12px; padding-left: 20px; color: var(--ink-700); font-size: 15.5px; line-height: 1.6; }
.takeaways li { margin-top: 6px; }

.author-card { display: flex; gap: 18px; align-items: center; max-width: 760px; margin: 44px auto 0; padding: 22px 24px; background: var(--white); border: 1px solid var(--border-subtle); border-radius: var(--radius-card); }
.author-card__img { width: 64px; height: 64px; border-radius: 50%; object-fit: cover; object-position: top; flex: none; }
.author-card__name { font-family: var(--font-display); font-weight: 500; font-size: 18px; color: var(--ink-900); font-variation-settings: 'opsz' 48; }
.author-card__role { font-family: var(--font-mono); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-500); margin: 3px 0 8px; }
.author-card__bio { font-size: 14.5px; line-height: 1.6; color: var(--ink-600); letter-spacing: 0; }

/* ---------- FAQ on subpages (rows come from v2-base.css; answers here are a bare <p>, no .faq__a-in) ---------- */
.s-faq .faq__list { max-width: 820px; margin: 32px auto 0; }
.s-faq .s-head--center { margin-bottom: 0; }
.faq__q > span:nth-child(2) { flex: 1; }
.faq__a p a { color: var(--brand-600); text-decoration: underline; text-decoration-color: rgba(31,88,234,.35); text-underline-offset: 3px; }

/* ---------- CTA panel (guarantee-panel treatment, identical to the homepage's .bx__panel) ---------- */
.cta { padding-top: 0; }
.cta.s-section--soft { background: none; border: 0; }
.cta__panel {
  position: relative; overflow: hidden; border-radius: var(--radius-panel); padding: 72px 32px 68px; text-align: center;
  display: flex; flex-direction: column; align-items: center;
  background: var(--paper-panel); border: 1px solid var(--border-panel); box-shadow: none;
}
.cta__panel > * { position: relative; z-index: 1; }
.cta__glow { display: none; }
.cta__title { margin-top: 18px; font-family: var(--font-display); font-weight: 500; font-size: 44px; line-height: 1.1; letter-spacing: -0.012em; color: var(--ink-900); font-variation-settings: 'opsz' 64; max-width: 720px; text-wrap: balance; }
.cta__subtitle { margin-top: 14px; color: var(--ink-600); font-size: 16px; line-height: 1.6; max-width: 640px; letter-spacing: 0; }
.cta .btn--white, .cta .btn--primary { margin-top: 30px; }
.cta__email {
  margin-top: 10px; display: inline-flex; align-items: center; justify-content: center;
  background: var(--tan-100); color: var(--ink-900); border: 1px solid transparent; border-radius: var(--radius-sm);
  padding: 12px 22px; font-size: 15px; line-height: 1; letter-spacing: 0;
  transition: background-color var(--fast) ease, border-color var(--fast) ease;
}
.cta__email:hover { background: var(--white); border-color: var(--border-strong); color: var(--ink-900); }

/* ---------- Audit form (audit/), beating the page's inline <style> on specificity ---------- */
body .aud-card { background: var(--white); border: 1px solid var(--border-subtle); border-radius: var(--radius-card); box-shadow: var(--shadow-win); padding: 28px 28px 26px; }
body .aud-card__title { font-family: var(--font-display); font-weight: 500; font-size: 22px; line-height: 1.25; color: var(--ink-900); font-variation-settings: 'opsz' 48; }
body .aud-card__step { font-family: var(--font-mono); font-size: 11px; font-weight: 500; letter-spacing: .1em; text-transform: uppercase; color: var(--brand-600); }
body .aud-card__sub { color: var(--ink-600); font-size: 14.5px; line-height: 1.55; margin: 8px 0 20px; letter-spacing: 0; }
body .aud-prog { background: var(--brand-100); border-radius: 999px; }
body .aud-prog__bar { background: var(--brand-600); }
body .aud-field__label { font-size: 13px; font-weight: 500; color: var(--ink-900); }
body .aud-field__opt { font-weight: 400; color: var(--ink-450); }
body .aud-field__help { font-size: 12.5px; color: var(--ink-500); }
body .aud-card input[type="text"], body .aud-card input[type="email"], body .aud-card input[type="url"], body .aud-card select, body .aud-card textarea {
  border: 1px solid var(--border-strong); border-radius: 8px; background: var(--white); font-family: var(--font-body); font-size: 15px; color: var(--ink-900); padding: 12px 14px; letter-spacing: 0;
}
body .aud-card input:hover, body .aud-card select:hover, body .aud-card textarea:hover { border-color: rgba(31,88,234,.45); }
body .aud-card input:focus, body .aud-card select:focus, body .aud-card textarea:focus { border-color: var(--brand-600); box-shadow: var(--focus-ring); outline: none; }
body .aud-card select { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2355534E' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'><path d='m6 9 6 6 6-6'/></svg>"); }
body .aud-back { font-family: var(--font-body); font-size: 13.5px; font-weight: 400; color: var(--ink-600); }
body .aud-back:hover { color: var(--brand-600); }
body .aud-note { font-size: 12.5px; color: var(--ink-500); letter-spacing: 0; }
body .aud-note a { color: var(--brand-600); }
body .aud-err { font-size: 13.5px; color: #B42318; font-weight: 500; }
body .aud-done__tick { background: var(--brand-100); color: var(--brand-600); }
body .aud-done p { color: var(--ink-600); font-size: 14.5px; line-height: 1.6; }
body .aud-done strong { color: var(--ink-900); font-weight: 500; }
.aud-reveal .container { text-align: center; }
body .aud-reveal__text { font-family: var(--font-display); font-weight: 400; font-size: 38px; line-height: 1.22; letter-spacing: -0.01em; color: var(--ink-900); font-variation-settings: 'opsz' 64; max-width: 720px; }
body .aud-reveal__w { color: rgba(31,30,29,.28); }
body .aud-reveal__w.is-on { color: var(--ink-900); }
@media (prefers-reduced-motion: reduce) { body .aud-reveal__w { color: var(--ink-900); transition: none; } }

/* ---------- Injected audit capture block (js/audit-cta.js appends its own <style>; these win on specificity) ---------- */
body .acta { background: var(--paper-panel); border: 1px solid var(--border-panel); border-radius: var(--radius-panel); padding: 32px 32px 28px; box-shadow: none; }
body .acta__eyebrow { font-family: var(--font-mono); font-size: 11px; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-500); }
body .acta__eyebrow [aria-hidden="true"] { display: none; }
body .acta__title { font-family: var(--font-display); font-weight: 500; font-size: 27px; line-height: 1.2; letter-spacing: -0.01em; color: var(--ink-900); font-variation-settings: 'opsz' 64; margin: 14px 0 8px; }
body .acta__lead { color: var(--ink-600); font-size: 15px; line-height: 1.6; letter-spacing: 0; margin-bottom: 20px; }
body .acta__label { font-size: 13px; font-weight: 500; color: var(--ink-900); }
body .acta input[type=email], body .acta input[type=text] { border: 1px solid var(--border-strong); border-radius: 8px; background: var(--white); font-family: var(--font-body); font-size: 15px; color: var(--ink-900); padding: 12px 14px; letter-spacing: 0; }
body .acta input[type=email]:hover, body .acta input[type=text]:hover { border-color: rgba(31,88,234,.45); }
body .acta input[type=email]:focus, body .acta input[type=text]:focus { border-color: var(--brand-600); box-shadow: var(--focus-ring); outline: none; }
body .acta__submit .btn { padding: 13px 22px; font-size: 15px; }
body .acta__hint { font-size: 12.5px; color: var(--ink-500); letter-spacing: 0; }
body .acta__hint a { color: var(--brand-600); }
body .acta__err { font-size: 13.5px; color: #B42318; }
body .acta__done p { color: var(--ink-600); font-size: 15px; line-height: 1.6; }
body .acta__done strong { color: var(--ink-900); font-weight: 500; }

/* ---------- ROI calculator (automation-roi-calculator/), beating the inline <style> ---------- */
body .roi-tool, body .roi-checklist { background: var(--white); border: 1px solid var(--border-subtle); border-radius: var(--radius-card); padding: 26px; box-shadow: var(--shadow-card); }
body .roi-field label { font-weight: 500; font-size: 13.5px; color: var(--ink-900); letter-spacing: 0; }
body .roi-field .roi-hint { font-size: 12.5px; color: var(--ink-500); font-weight: 400; letter-spacing: 0; }
body .roi-field input, body .roi-field select, body .roi-email input { padding: 12px 14px; border: 1px solid var(--border-strong); border-radius: 8px; background: var(--white); color: var(--ink-900); font-family: var(--font-body); font-size: 15px; letter-spacing: 0; }
body .roi-field input:focus, body .roi-field select:focus, body .roi-email input:focus { outline: none; border-color: var(--brand-600); box-shadow: var(--focus-ring); }
body .roi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
body .roi-field { min-width: 0; }
body .roi-field > div { min-width: 0; }
body .roi-field input, body .roi-field select { width: 100%; min-width: 0; }
body .roi-field > div > input { flex: 1 1 0; }
@media (max-width: 620px) { body .roi-grid, body .roi-cards, body .roi-checklist ul { grid-template-columns: minmax(0, 1fr); } }
body .roi-note { font-size: 13px; color: var(--ink-500); letter-spacing: 0; }
body .roi-card { background: var(--brand-100); border: 1px solid var(--border-brand); border-radius: var(--radius-card); padding: 22px 18px; }
body .roi-card__num { font-family: var(--font-display); font-weight: 400; font-size: 36px; line-height: 1.05; letter-spacing: -0.015em; color: var(--brand-600); font-variation-settings: 'opsz' 64; }
body .roi-card__cap { font-size: 12.5px; color: var(--ink-600); font-weight: 400; margin-top: 8px; letter-spacing: 0; }
body .roi-resultcta p { font-size: 13.5px; color: var(--ink-600); }
body .roi-empty { background: #FBF3E6; border: 1px solid #EAD7B8; color: #7A4B0F; border-radius: 8px; font-size: 13.5px; }
body .roi-checklist li { font-size: 14.5px; color: var(--ink-700); letter-spacing: 0; }
body .roi-checklist li::before { border: 1.5px solid var(--brand-600); border-radius: 4px; }
body .roi-email { border: 1px dashed var(--border-strong); border-radius: 10px; background: var(--paper-card); }
body .roi-email label { font-weight: 500; font-size: 13.5px; color: var(--ink-900); }
body .roi-email__hint { font-size: 12.5px; color: var(--ink-500); }
body .roi-email__hint a { color: var(--brand-600); }
body .roi-print-title { font-family: var(--font-display); font-weight: 500; font-size: 24px; }
@media print { .ncl, .ft, .mnav, .mnav__backdrop { display: none !important; } }

/* ---------- Booking flow (book/): keeps css/booking-flow.css, takes the v2 tokens ---------- */
body.v2-book { padding-top: 0; background: var(--paper-page); color: var(--ink-900); font-family: var(--font-body); font-size: 16px; letter-spacing: -0.01em; }
body.v2-book .booking-shell { background: var(--paper-page); }
body.v2-book .booking-card { background: var(--white); border: 1px solid var(--border-subtle); border-radius: var(--radius-panel); box-shadow: var(--shadow-win); }
body.v2-book .booking-card h1 { font-family: var(--font-display); font-weight: 400; font-size: 30px; letter-spacing: -0.01em; line-height: 1.15; font-variation-settings: 'opsz' 64; color: var(--ink-900); }
body.v2-book .booking-intro, body.v2-book .booking-selection, body.v2-book .calendar-status, body.v2-book .booking-step-count, body.v2-book .booking-zone-label { color: var(--ink-600); }
body.v2-book a { color: var(--brand-600); }
body.v2-book .booking-form label, body.v2-book .booking-form legend { font-weight: 500; color: var(--ink-900); }
body.v2-book .booking-form input:not([type=radio]), body.v2-book .booking-form textarea, body.v2-book .booking-zone select { border-color: var(--border-strong); border-radius: 8px; color: var(--ink-900); font-family: var(--font-body); }
body.v2-book .booking-form input::placeholder, body.v2-book .booking-form textarea::placeholder { color: var(--ink-450); }
body.v2-book .booking-primary { background: var(--brand-600); border-radius: var(--radius-sm); font-weight: 500; font-family: var(--font-body); }
body.v2-book .booking-primary:hover { background: #1A4CCB; }
body.v2-book .booking-choice { border-color: var(--border-strong); border-radius: 8px; font-weight: 400 !important; color: var(--ink-900); }
body.v2-book .booking-choice:hover { background: var(--paper-card); }
body.v2-book .booking-choice:has(input:checked) { border-color: var(--brand-600); background: var(--brand-100); }
body.v2-book .booking-back, body.v2-book .booking-skip, body.v2-book .booking-footer a, body.v2-book .booking-footer button { color: var(--ink-600); font-family: var(--font-body); }
body.v2-book .booking-back:hover, body.v2-book .booking-skip:hover, body.v2-book .booking-footer a:hover { color: var(--brand-600); }
body.v2-book .booking-step-count, body.v2-book .booking-zone-label, body.v2-book .booking-day-label { font-family: var(--font-mono); font-size: 11px; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-500); }
body.v2-book .booking-day-label { font-size: 11.5px; }
body.v2-book .booking-progress { background: var(--brand-100); }
body.v2-book .booking-progress span { background: var(--brand-600); }
body.v2-book .booking-date, body.v2-book .booking-time { border-color: var(--border-strong); color: var(--ink-900); font-family: var(--font-body); }
body.v2-book .booking-date strong { font-family: var(--font-display); font-weight: 500; font-variation-settings: 'opsz' 48; }
body.v2-book .booking-time { font-weight: 500; }
body.v2-book .booking-date[aria-pressed=true], body.v2-book .booking-time[aria-pressed=true] { background: var(--brand-600); border-color: var(--brand-600); color: var(--white); }
body.v2-book .booking-time:hover:not([aria-pressed=true]), body.v2-book .booking-date:hover:not(:disabled):not([aria-pressed=true]) { background: var(--brand-100); }
body.v2-book .calendar-actions button { border-color: var(--border-strong); border-radius: var(--radius-sm); color: var(--ink-900); }
body.v2-book :focus-visible { outline: none; box-shadow: var(--focus-ring); }
body.v2-book .booking-choice:has(:focus-visible) { outline: none; box-shadow: var(--focus-ring); }

/* ---------- Scroll-reveal initial states (motion only; js/site-v2.js animates to rest and adds .is-in).
   Keep these selector lists in step with SUB_* in js/site-v2.js. Everything below that is scoped to
   body.subpage (the 45 marketing subpages) was added 2026-09-21; the four offer pages that also load
   this file keep the older whole-block reveals, which is why .s-list / .faq__list / .related / .article
   stay hidden as blocks only OUTSIDE body.subpage. ---------- */
.js-motion :is(.shero__copy > *, .shero__inner:not(.shero__inner--split) > *):not(.is-in) { opacity: 0; transform: translateY(16px); }
.js-motion .shero__media:not(.is-in) { opacity: 0; transform: scale(.965); }
.js-motion :is(.svc-card, .post-card, .feature, .step, .tools__chip, .roi-card):not(.is-in) { opacity: 0; transform: translateY(16px); }
.js-motion :is(.s-section .s-head, .s-prose, .s-problem, .s-case, .s-quote, .cta__panel, .author-card, .roi-tool, .roi-checklist, .roi-email, [data-otimiz-audit-cta], .s-section > .container > .s-sub):not(.is-in) { opacity: 0; transform: translateY(24px); }
.js-motion body:not(.subpage) :is(.s-list, .faq__list, .related, .article):not(.is-in) { opacity: 0; transform: translateY(24px); }
.js-motion .shero__media::before, .js-motion .s-case::before, .js-motion .cta__panel::before { animation: zpDrift 34s ease-in-out infinite alternate; }
.js-motion .s-case::before { animation-duration: 40s; animation-direction: alternate-reverse; }

/* ---------- Premium motion, marketing subpages (2026-09-21, docs/SITE-MOTION-2026-09-21.md) ----------
   Hidden states are transform/opacity only and rest at their final values the moment .is-in lands;
   without .js-motion (no JS, no GSAP, reduced motion) none of these apply and the page is static. */
/* Hero headline rises word by word: site-v2.js wraps each word in span.w on the existing text nodes. */
.subpage .shero__title .w { display: inline-block; }
.js-motion .subpage .shero__title .w:not(.is-in) { opacity: 0; transform: translateY(.5em); }
/* Per-item reveals: result rows, related links, FAQ questions, article blocks, footer columns. */
.js-motion .subpage :is(.s-list > li, .related > a, .faq__list > .faq__item, .article > *, .ft__grid > *, .ft__bot):not(.is-in) { opacity: 0; transform: translateY(14px); }
.js-motion .subpage .cmp-table tbody > tr:not(.is-in) { opacity: 0; }
/* Section-title rule: a short logo-blue line under every section heading, drawn left to right
   (or out from the centre) as the heading enters; a static line when motion is off. */
.subpage .s-head .s-title { position: relative; padding-bottom: 16px; }
.subpage .s-head .s-title::after {
  content: ""; position: absolute; left: 0; bottom: 0; width: 28px; height: 2px; border-radius: 1px;
  background: var(--brand-600); transform-origin: left center;
}
.subpage .s-head--center .s-title::after { left: 50%; margin-left: -14px; transform-origin: center; }
.js-motion .subpage .s-head:not(.is-in):not(.is-entering) .s-title::after { transform: scaleX(0); }
.js-motion .subpage .s-head .s-title::after { transition: transform .7s var(--ease) .3s; }
/* Metric count-up keeps the digits from jittering while they run. */
.subpage .s-case__num[data-count="running"] { font-variant-numeric: tabular-nums; }
/* Reading progress bar, built by site-v2.js on every page with an .article; sits under the sticky header. */
.rprog { position: fixed; top: var(--header-h); left: 0; right: 0; height: 2px; z-index: 59; pointer-events: none; }
.rprog__bar { width: 100%; height: 100%; background: var(--brand-600); transform: scaleX(0); transform-origin: left center; will-change: transform; }
/* Contour drift on the two remaining tinted panels: key takeaways and the injected audit capture block. */
.subpage .takeaways, body.subpage .acta { position: relative; overflow: hidden; }
.subpage .takeaways > *, body.subpage .acta > * { position: relative; z-index: 1; }
.subpage .takeaways::before, body.subpage .acta::before {
  content: ""; position: absolute; inset: -30%; width: 160%; height: 160%; pointer-events: none; z-index: 0;
  background: var(--zp-ink) center / 100% 100% no-repeat; transform: rotate(-18deg); transform-origin: 50% 50%;
}
.js-motion .subpage .takeaways::before, .js-motion body.subpage .acta::before { animation: zpDrift 38s ease-in-out infinite alternate-reverse; }
/* Hover micro-motion: icon tilt, step number fill, chip logo scale, button lift, link underline slide. */
.subpage .svc-card__ico svg, .subpage .feature__ico svg { transition: transform .35s var(--ease); }
.subpage .svc-card:hover .svc-card__ico svg, .subpage .feature:hover .feature__ico svg { transform: scale(1.12) rotate(-4deg); }
.subpage .step__num { transition: background-color .25s var(--ease), color .25s var(--ease); }
.subpage .step:hover .step__num { background: var(--brand-600); color: var(--white); }
.subpage .tools__chip img { transition: transform .3s var(--ease); }
.subpage .tools__chip:hover img { transform: scale(1.12); }
.subpage .btn:not(.btn--nav) { transition: background-color var(--fast) ease, color var(--fast) ease, border-color var(--fast) ease, transform .2s var(--ease), box-shadow .2s var(--ease); }
.subpage :is(.btn--primary, .btn--white):not(.btn--nav):hover { transform: translateY(-1px); box-shadow: 0 12px 24px -14px rgba(31,88,234,.65); }
.subpage .btn--ghost:hover { transform: translateY(-1px); }
.subpage .related a { transition: background-color var(--fast) ease, border-color var(--fast) ease, color var(--fast) ease, transform .2s var(--ease), box-shadow .2s var(--ease); }
.subpage .related a:hover { transform: translateY(-1px); box-shadow: var(--shadow-card); }
.subpage .author-card, .subpage .s-problem, .subpage .s-quote { transition: box-shadow .25s var(--ease), border-color .25s var(--ease); }
.subpage .author-card:hover, .subpage .s-problem:hover, .subpage .s-quote:hover { box-shadow: var(--shadow-hover); border-color: var(--border-brand); }
.subpage :is(.article, .s-prose, .s-sub, .step__desc, .feature__desc, .faq__a p, .takeaways, .s-case__cap, .trust-inline__text) a:not(.btn) {
  background-image: linear-gradient(currentColor, currentColor); background-repeat: no-repeat;
  background-position: 0 calc(100% - 1px); background-size: 0% 1px;
  transition: background-size .3s var(--ease), text-decoration-color var(--fast) ease;
}
.subpage :is(.article, .s-prose, .s-sub, .step__desc, .feature__desc, .faq__a p, .takeaways, .s-case__cap, .trust-inline__text) a:not(.btn):hover { background-size: 100% 1px; }

/* ---------- Breakpoints ---------- */
@media (max-width: 1080px) {
  .shero__inner--split { grid-template-columns: 440px 1fr; gap: 36px; }
  .shero__title { font-size: 44px; }
  .s-title { font-size: 36px; }
}
@media (max-width: 980px) {
  .svc-grid > .svc-card, .post-grid > .post-card { flex-basis: calc((100% - 14px) / 2); }
  .shero__inner--split { grid-template-columns: 1fr; gap: 30px; max-width: 640px; margin: 0 auto; }
  .shero__media { max-width: 560px; }
  .shero__media#audit-form { max-width: none; }
}
@media (max-width: 900px) {
  .s-split { grid-template-columns: 1fr; gap: 32px; }
  .steps { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .s-section { padding: 64px 0; }
  .shero { padding: 28px 0 36px; }
  .shero__title { font-size: 40px; line-height: 1.1; }
  .shero__lead { font-size: 16px; line-height: 1.5; margin-top: 14px; }
  .shero__cta { margin-top: 22px; }
  .shero__cta .btn { flex: 1 1 auto; justify-content: center; }
  .shero__media { padding: 18px; border-radius: 18px; }
  .s-title { font-size: 32px; }
  .s-head { margin-bottom: 28px; gap: 12px; }
  .feature-grid > .feature { flex-basis: 100%; }
  .s-case { grid-template-columns: 1fr; padding: 32px 24px; gap: 24px; border-radius: 18px; }
  .s-case__stat { border-left: 0; border-top: 1px solid var(--border-brand); padding-left: 0; padding-top: 22px; }
  .s-case__quote { font-size: 20px; }
  .s-case__num { font-size: 44px; }
  .s-problem { padding: 22px 20px; }
  .s-quote { padding: 26px 22px; }
  .s-quote__text { font-size: 19px; }
  .article__lead { font-size: 18px; }
  .article h2 { font-size: 28px; margin-top: 40px; }
  .article h3 { font-size: 21px; }
  .article p, .article ul, .article ol { font-size: 16px; }
  .article blockquote { font-size: 19px; }
  .takeaways { padding: 20px 20px; }
  .author-card { padding: 20px; gap: 14px; }
  .cta__panel { padding: 44px 22px 40px; }
  .cta__title { font-size: 34px; }
  .cta .btn--white, .cta .btn--primary, .cta__email { width: 100%; }
  body .aud-reveal__text { font-size: 28px; }
  body .aud-card { padding: 24px 20px 22px; }
  body .acta { padding: 26px 20px 24px; }
}
@media (max-width: 640px) {
  .svc-grid > .svc-card, .post-grid > .post-card { flex-basis: 100%; }
}
@media (max-width: 560px) {
  .author-card { flex-direction: column; align-items: flex-start; }
  .shero__cta .btn { width: 100%; }
}
@media (max-width: 400px) {
  .shero__title { font-size: 34px; }
  .s-title { font-size: 29px; }
  .cta__title { font-size: 30px; }
  .s-case__num { font-size: 40px; }
}