:root {
    /* Brand palette extracted from logo (chartreuse #abf429) + secondary/tertiary */
    --brand-green:       oklch(0.91 0.22 130);  /* logo lime/chartreuse #abf429 */
    --brand-green-deep:  oklch(0.48 0.16 145);  /* AA-safe (~4.6:1 on white) for text, CTA-hover, focus */
    --brand-green-soft:  oklch(0.96 0.10 130);  /* pale wash backdrop */
    --brand-purple:      oklch(0.50 0.18 290);
    --brand-purple-soft: oklch(0.94 0.05 290);
    --brand-orange:      oklch(0.72 0.16 55);
    --brand-orange-soft: oklch(0.95 0.05 70);

    /* Neutrals — Apple-clean */
    --ink:          oklch(0.16 0.012 250);
    --ink-2:        oklch(0.42 0.010 250);
    --ink-3:        oklch(0.56 0.010 250);
    --ink-on-deep:  oklch(0.99 0.003 95);

    --bg:           oklch(0.99 0.003 95);
    --bg-1:         oklch(0.965 0.005 95);
    --bg-elev:      oklch(1 0 0);
    --bg-deep:      oklch(0.16 0.012 250);

    --line:         oklch(0.16 0.012 250 / 0.10);
    --line-strong:  oklch(0.16 0.012 250 / 0.18);

    --shadow-soft:  0 1px 2px oklch(0.16 0.012 250 / 0.04),
                    0 8px 24px -8px oklch(0.16 0.012 250 / 0.08);

    --ease-out-quint: cubic-bezier(0.22, 1, 0.36, 1);
    --ease-out-expo:  cubic-bezier(0.16, 1, 0.3, 1);
    --ease-spring:    cubic-bezier(0.34, 1.2, 0.64, 1);

    --container: 1280px;
    --container-narrow: 980px;
    --radius: 12px;
    --radius-lg: 22px;
    --radius-xl: 36px;
    --space-1: 0.25rem; --space-2: 0.5rem; --space-3: 0.75rem; --space-4: 1rem;
    --space-5: 1.25rem; --space-6: 1.5rem;  --space-8: 2rem;   --space-10: 2.5rem;
    --space-12: 3rem;   --space-16: 4rem;
    --space-24: 6rem;   --space-32: 8rem;
    --space-section: clamp(var(--space-12), 8vw, var(--space-24));
    --space-stack-1: var(--space-2);
    --space-stack-2: var(--space-4);
    --space-stack-3: var(--space-8);
    --gap-grid:   var(--space-6);
    --gap-inline: var(--space-3);
    --space-inset-sm: var(--space-3);
    --space-inset-md: var(--space-4);
    --space-inset-lg: var(--space-6);
    /* Reading measure for BG/Cyrillic body + lead text: 75-85ch. Cyrillic words run
       longer than Latin, so the comfortable line is WIDER than the Latin 45-75ch —
       a BG paragraph capped at the Latin measure reads narrow and leaves a dead gutter.
       Governed here (a token), not chosen ad-hoc per element. */
    --measure-lead: 80ch;
  }

  /* OKLCH fallback for the :root tokens — legacy browsers keep these hex values so the CTA + body text (which use the vars) never render invisible. A few accent shadows/gradients written as literal oklch() degrade gracefully. */
  @supports not (color: oklch(0.5 0.1 250)) {
    :root {
      --brand-green: #abf429; --brand-green-deep: #2a7d2f; --brand-green-soft: #eefbd4;
      --brand-purple: #6850c4; --brand-purple-soft: #edeaf8;
      --brand-orange: #f0932e; --brand-orange-soft: #fbeede;
      --ink: #1e2024; --ink-2: #5f6166; --ink-3: #7e8085; --ink-on-deep: #fefdf9;
      --bg: #fefdf9; --bg-1: #f6f4ef; --bg-elev: #ffffff; --bg-deep: #1e2024;
      --line: rgba(31,33,36,0.10); --line-strong: rgba(31,33,36,0.18);
    }
  }

  * { box-sizing: border-box; }
  html, body { margin: 0; padding: 0; }
  html { scroll-behavior: smooth; }
  body {
    background: var(--bg);
    color: var(--ink);
    font-family: 'Manrope', system-ui, sans-serif;
    font-size: 16.5px;
    line-height: 1.65;
    -webkit-font-smoothing: antialiased;
    overflow-x: hidden;
  }
  a { color: inherit; }
  ::selection { background: var(--brand-green); color: var(--ink); }

  h1, h2, h3, h4 {
    font-family: 'Onest', system-ui, sans-serif;
    font-weight: 700;
    letter-spacing: -0.025em;
    line-height: 1.05;
    margin: 0;
    color: var(--ink);
  }
  h1 {
    font-size: clamp(2.6rem, 8.5vw + 0.5rem, 10rem);
    font-weight: 800;
    letter-spacing: -0.05em;
    line-height: 0.96;
  }
  h2 { font-size: clamp(2.1rem, 3.6vw + 1rem, 5rem); letter-spacing: -0.035em; }
  h3 { font-size: clamp(1.25rem, 0.8vw + 1rem, 1.85rem); letter-spacing: -0.018em; }
  h4 { font-size: clamp(1rem, 0.3vw + 0.95rem, 1.18rem); letter-spacing: -0.008em; }
  p  { margin: 0; }
  h1, h2, h3, h4 { text-wrap: balance; }
  p, li { text-wrap: pretty; }
  p.lead {
    font-size: clamp(1.1rem, 0.5vw + 1rem, 1.42rem);
    color: var(--ink-2); max-width: 56ch; line-height: 1.55;
    font-weight: 400;
  }

  .kicker {
    display: inline-flex; align-items: center; gap: var(--space-2);
    font-family: 'Onest', sans-serif;
    font-size: 0.78rem; letter-spacing: 0.18em; text-transform: uppercase;
    color: var(--ink-3); font-weight: 600;
  }
  .kicker__dot {
    width: 6px; height: 6px; border-radius: 50%;
    background: var(--brand-green);
  }

  .container { width: 100%; max-width: var(--container); margin: 0 auto; padding: 0 22px; }
  @media (min-width: 720px) { .container { padding: 0 40px; } }
  @media (min-width: 1100px) { .container { padding: 0 56px; } }

  .container--narrow { max-width: var(--container-narrow); }

  /* ── Buttons (Apple-style: clean, single accent) ───────────────── */
  .btn {
    display: inline-flex; align-items: center; gap: var(--space-2);
    padding: var(--space-4) var(--space-8); border-radius: 999px;
    font-family: 'Onest', sans-serif;
    font-weight: 600; font-size: 1rem; letter-spacing: -0.005em;
    text-decoration: none; border: 0; cursor: pointer;
    transition: transform 220ms var(--ease-spring), box-shadow 240ms var(--ease-out-quint), background 200ms var(--ease-out-quint);
    white-space: nowrap;
  }
  .btn--primary {
    background: var(--brand-green);
    color: var(--ink);
    box-shadow: 0 1px 1px oklch(0.16 0.012 250 / 0.06),
                0 8px 22px -6px oklch(0.91 0.22 130 / 0.45);
  }
  .btn--primary:hover {
    background: var(--brand-green-deep); color: var(--ink-on-deep);
    transform: translateY(-1px);
    box-shadow: 0 1px 2px oklch(0.16 0.012 250 / 0.08),
                0 14px 32px -8px oklch(0.55 0.22 140 / 0.55);
  }
  .btn--primary:focus-visible {
    background: var(--brand-green-deep); color: var(--ink-on-deep);
    transform: translateY(-1px);
    outline: none;
    box-shadow: 0 0 0 3px oklch(0.91 0.22 130 / 0.45),
                0 14px 32px -8px oklch(0.55 0.22 140 / 0.55);
  }
  .btn--primary:active { transform: translateY(0); }

  .btn--ghost {
    background: transparent; color: var(--ink);
    border: 1px solid var(--line-strong);
  }
  .btn--ghost:hover { background: var(--bg-1); border-color: var(--ink-3); transform: translateY(-1px); }
  .btn--ghost:focus-visible {
    background: var(--bg-1); transform: translateY(-1px);
    outline: none; box-shadow: 0 0 0 3px var(--brand-green);
  }

  /* The readiness-test CTA is a ghost button, so on a busy hero it reads as low
     priority. A slow breathing ring (not a colour change) makes it noticeable
     without turning it into a second primary button. Stops on hover/focus so it
     never animates while being used, and honours reduced-motion. */
  .btn--pulse { position: relative; border-color: var(--brand-green-deep); }
  .btn--pulse::after {
    content: ''; position: absolute; inset: -2px; border-radius: 999px;
    border: 2px solid var(--brand-green-deep); opacity: 0; pointer-events: none;
    animation: ctaPulse 2600ms var(--ease-out-quint) infinite;
  }
  .btn--pulse:hover::after, .btn--pulse:focus-visible::after { animation-play-state: paused; opacity: 0; }
  @keyframes ctaPulse {
    0%   { opacity: 0.55; transform: scale(1); }
    70%  { opacity: 0;    transform: scale(1.075); }
    100% { opacity: 0;    transform: scale(1.075); }
  }
  @media (prefers-reduced-motion: reduce) {
    .btn--pulse::after { animation: none; opacity: 0.4; transform: none; }
  }

  .btn .arrow { display: inline-block; transition: transform 220ms var(--ease-spring); }
  .btn:hover .arrow { transform: translateX(4px); }

  .link-quiet {
    display: inline-flex; align-items: center; gap: var(--space-2);
    min-height: 44px;
    text-decoration: underline; text-decoration-color: var(--line-strong);
    text-underline-offset: 5px; text-decoration-thickness: 1px;
    color: var(--ink); font-weight: 600;
    transition: color 220ms var(--ease-out-quint), text-decoration-color 220ms var(--ease-out-quint);
  }
  .link-quiet:hover { color: var(--brand-green-deep); text-decoration-color: var(--brand-green-deep); }
  .link-quiet:focus-visible {
    color: var(--brand-green-deep); text-decoration-color: var(--brand-green-deep);
    outline: 2px solid var(--brand-green); outline-offset: 4px; border-radius: 4px;
  }

  /* ── Nav ───────────────── */
  .nav {
    position: fixed; top: 0; left: 0; right: 0; z-index: 30;
    transition: background 320ms var(--ease-out-quint), backdrop-filter 320ms var(--ease-out-quint), border-color 320ms var(--ease-out-quint);
    border-bottom: 1px solid transparent;
  }
  .nav.is-stuck {
    background: oklch(0.99 0.003 95 / 0.86);
    backdrop-filter: blur(20px) saturate(1.4);
    -webkit-backdrop-filter: blur(20px) saturate(1.4);
    border-bottom-color: var(--line);
  }
  /* un-stuck nav rides over the dark hero: its own top-fade backdrop guarantees the light text stays legible over any of the 6 photos */
  .nav::before {
    content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
    background: linear-gradient(to bottom, oklch(0.16 0.012 250 / 0.55), transparent);
    transition: opacity 320ms var(--ease-out-quint);
  }
  .nav.is-stuck::before { opacity: 0; }
  .nav__row { display: flex; align-items: center; justify-content: space-between; padding: var(--space-4) 0; gap: var(--space-4); }
  .brand {
    display: inline-flex; align-items: center; gap: var(--space-2);
    font-family: 'Onest', sans-serif;
    font-weight: 700; font-size: 1.18rem; letter-spacing: -0.025em;
    color: var(--ink); text-decoration: none;
  }
  .brand__logo { height: 34px; width: auto; display: block; }
  .footer .brand__logo { height: 40px; }
  .brand__num {
    display: inline-flex; align-items: center; justify-content: center;
    width: 28px; height: 28px; border-radius: 50%;
    background: var(--brand-green); color: var(--ink);
    font-size: 0.92rem; font-weight: 800;
    transform: translateY(2px);
  }
  .nav__links {
    display: none; gap: var(--space-8);
    font-family: 'Onest', sans-serif;
    font-size: 0.92rem; color: var(--ink-2);
  }
  @media (min-width: 1020px) { .nav__links { display: flex; } }
  .nav__links a { text-decoration: none; transition: color 200ms var(--ease-out-quint); }
  .nav__links a:hover { color: var(--ink); }
  .nav__links a:focus-visible {
    color: var(--ink); outline: 2px solid var(--brand-green);
    outline-offset: 4px; border-radius: 2px;
  }
  /* Услуги dropdown */
  .nav__dd { position: relative; display: flex; align-items: center; }
  .nav__dd-btn {
    font: inherit; color: inherit; cursor: pointer;
    background: none; border: 0; padding: 0;
    display: inline-flex; align-items: center; gap: var(--space-1);
    transition: color 200ms var(--ease-out-quint);
  }
  .nav__dd-btn:hover { color: var(--ink); }
  .nav:not(.is-stuck) .nav__dd-btn:hover { color: var(--ink-on-deep); }
  .nav__dd-btn:focus-visible { color: var(--ink); outline: 2px solid var(--brand-green); outline-offset: 4px; border-radius: 2px; }
  .nav:not(.is-stuck) .nav__dd-btn:focus-visible { color: var(--ink-on-deep); }
  .nav__dd-caret { transition: transform 200ms var(--ease-out-quint); }
  .nav__dd:hover .nav__dd-caret,
  .nav__dd:focus-within .nav__dd-caret,
  .nav__dd[data-open] .nav__dd-caret { transform: rotate(180deg); }
  .nav__dd::after { content: ''; position: absolute; top: 100%; left: -8px; right: -8px; height: 14px; }
  .nav__dd-menu {
    position: absolute; top: calc(100% + 12px); left: 50%;
    transform: translateX(-50%) translateY(6px);
    min-width: 232px; margin: 0; padding: var(--space-2);
    list-style: none; display: flex; flex-direction: column; gap: 2px;
    background: var(--bg-elev); border: 1px solid var(--line);
    border-radius: var(--radius-lg); box-shadow: var(--shadow-soft);
    opacity: 0; visibility: hidden; pointer-events: none;
    transition: opacity 180ms var(--ease-out-quint), transform 180ms var(--ease-out-quint);
    z-index: 40;
  }
  .nav__dd:hover .nav__dd-menu,
  .nav__dd:focus-within .nav__dd-menu,
  .nav__dd[data-open] .nav__dd-menu {
    opacity: 1; visibility: visible; pointer-events: auto;
    transform: translateX(-50%) translateY(0);
  }
  .nav__dd-menu a {
    display: block; padding: var(--space-3); border-radius: var(--radius);
    color: var(--ink); font-family: 'Onest', sans-serif; font-weight: 600;
    font-size: 0.95rem; white-space: nowrap; text-decoration: none;
    transition: background 140ms var(--ease-out-quint), color 140ms var(--ease-out-quint);
  }
  .nav__dd-menu a:hover { background: var(--brand-green-soft); color: var(--ink); }
  .nav__dd-menu a:focus-visible { background: var(--brand-green-soft); color: var(--ink); outline: 2px solid var(--brand-green); outline-offset: -2px; }

  .nav__right { display: flex; align-items: center; gap: var(--gap-inline); }
  .nav__phone { display: none; color: var(--ink-2); font-size: 0.92rem; text-decoration: none; }
  .nav__phone:hover { color: var(--brand-green-deep); }
  @media (min-width: 720px) { .nav__phone { display: inline-flex; align-items: center; gap: var(--space-2); } }

  /* ── Hero (full-bleed rotating problem-hero) ───────── */
  .hero {
    position: relative; isolation: isolate; overflow: hidden;
    min-height: 92vh; min-height: 92svh;
    display: flex; align-items: flex-end;
    padding: clamp(calc(var(--space-32) - var(--space-3)), 15vh, 172px) 0 clamp(calc(var(--space-1) + var(--space-12)), 8vh, calc(var(--space-24) - var(--space-1)));
  }
  .hero__bg { position: absolute; inset: 0; z-index: -2; background: var(--bg-deep); }
  .hero__slide { position: absolute; inset: 0; opacity: 0; transition: opacity 1200ms var(--ease-out-quint); }
  .hero__slide.is-on { opacity: 1; }
  .hero__slide img {
    width: 100%; height: 100%; object-fit: cover; object-position: center 28%;
    display: block; filter: saturate(1.05) contrast(1.02);
  }
  .hero__scrim {
    position: absolute; inset: 0; z-index: -1;
    background:
      linear-gradient(to bottom, oklch(0.16 0.012 250 / 0.5), transparent 14%),
      linear-gradient(104deg, oklch(0.16 0.012 250 / 0.85) 0%, oklch(0.16 0.012 250 / 0.6) 44%, oklch(0.16 0.012 250 / 0.22) 82%),
      linear-gradient(to top, oklch(0.16 0.012 250 / 0.7), transparent 50%);
  }
  .hero__scrim::after {
    content: ""; position: absolute; inset: 0;
    background: var(--brand-green-deep); mix-blend-mode: soft-light; opacity: 0.1;
  }
  .hero__inner { position: relative; z-index: 1; display: block; }
  .hero .kicker { color: var(--ink-on-deep); }
  .hero__hook {
    color: var(--ink-on-deep);
    font-size: clamp(1.85rem, 3vw + 1rem, 3.1rem); line-height: 1.12;
    font-weight: 800; letter-spacing: -0.02em;
    max-width: 30ch; margin-top: var(--space-4); min-height: 2.3em; text-wrap: balance;
  }
  .hero__hook.is-swap { animation: heroHookIn 640ms var(--ease-out-quint); }
  @keyframes heroHookIn { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
  .hero__sub {
    margin-top: var(--space-6); max-width: 46ch;
    color: oklch(0.99 0.003 95 / 1);
    font-size: clamp(1.06rem, 0.5vw + 1rem, 1.3rem); line-height: 1.55;
  }
  .hero__cta { margin-top: var(--space-8); display: flex; flex-wrap: wrap; gap: var(--space-4); align-items: center; }
  .hero .btn--ghost {
    color: var(--ink-on-deep);
    border-color: oklch(0.99 0.003 95 / 0.42);
    background: oklch(0.99 0.003 95 / 0.07);
  }
  .hero .btn--ghost:hover { border-color: var(--ink-on-deep); background: oklch(0.99 0.003 95 / 0.16); }
  @media (max-width: 560px) {
    .hero__cta { flex-direction: column; align-items: stretch; }
    .hero__cta .btn { white-space: normal; text-align: center; justify-content: center; }
  }
  .hero__dots { margin-top: var(--space-8); display: flex; gap: var(--space-2); }
  .hero__dots button {
    width: 10px; height: 10px; border-radius: 50%; border: 0; padding: 0; cursor: pointer;
    background: oklch(0.99 0.003 95 / 0.34);
    transition: transform 220ms var(--ease-out-quint), background-color 220ms var(--ease-out-quint);
  }
  .hero__dots button.is-on { background: var(--brand-green); transform: scale(1.3); }
  .hero__dots button:focus-visible { outline: 2px solid var(--ink-on-deep); outline-offset: 3px; }
  /* Service-page cinematic hero: rotating PROBLEM eyebrow above a STABLE (SEO) H1 */
  /* Service-page hero (these two classes are used ONLY by the 6 service pages;
     the homepage hero uses .hero__hook / .hero__sub). The rotating PROBLEM question
     is the eye-catcher, so it carries the display size; the H1 (service + city)
     STAYS an <h1> for SEO and only steps down visually. Type-scale swap only —
     no heading level changed (Rusi, 2026-08-10). */
  .hero__eyebrow { color: var(--brand-green); font-family: 'Onest', sans-serif; font-weight: 800; font-size: clamp(1.7rem, 2.9vw + 0.85rem, 3.2rem); line-height: 1.1; letter-spacing: -0.03em; margin: 0 0 var(--space-4); max-width: 29ch; min-height: 2.2em; text-wrap: balance; }
  .hero__eyebrow.is-swap { animation: heroHookIn 640ms var(--ease-out-quint); }
  .hero__h1 { color: var(--ink-on-deep); font-family: 'Onest', sans-serif; font-weight: 700; font-size: clamp(1.35rem, 1.2vw + 1rem, 2rem); line-height: 1.2; letter-spacing: -0.02em; margin: 0 0 var(--space-4); max-width: 34ch; text-wrap: balance; }
  .hero__h1 .accent { color: var(--brand-green); }

  /* nav rides over the dark hero until it sticks → light text there */
  .nav:not(.is-stuck) .brand { color: var(--ink-on-deep); }
  .nav:not(.is-stuck) .nav__links { color: oklch(0.99 0.003 95 / 0.94); }
  .nav:not(.is-stuck) .nav__links a:hover { color: var(--ink-on-deep); }
  .nav:not(.is-stuck) .nav__phone { color: oklch(0.99 0.003 95 / 0.94); }
  .nav:not(.is-stuck) .nav__phone:hover { color: var(--ink-on-deep); }
  .nav:not(.is-stuck) .nav__burger { color: var(--ink-on-deep); }

  /* ── Stat strip (no chrome, just numbers) ───────── */
  .stats {
    padding: clamp(calc(var(--space-2) + var(--space-12)), 8vh, var(--space-24)) 0;
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
  }
  .stats__row {
    display: grid; gap: var(--space-8);
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  }
  @media (max-width: 720px) {
    .stats__row { grid-template-columns: repeat(2, 1fr); gap: var(--space-6); }
  }
  .stat strong {
    display: block; font-family: 'Onest', sans-serif;
    font-size: clamp(2.6rem, 3.2vw + 1rem, 4.4rem);
    font-weight: 800; color: var(--ink);
    letter-spacing: -0.04em; line-height: 0.95;
  }
  .stat span {
    display: block; margin-top: var(--space-stack-1);
    font-size: 0.96rem; color: var(--ink-2); max-width: 22ch;
  }

  /* ── Promise strip ───────── */
  .promise {
    padding-block: clamp(calc(var(--space-1) + var(--space-24)), 14vh, calc(var(--space-8) + var(--space-32)));
    text-align: left;
  }
  .promise__line {
    font-family: 'Onest', sans-serif;
    font-weight: 800;
    font-size: clamp(1.9rem, 6vw + 1rem, 6.8rem);
    letter-spacing: -0.045em; line-height: 0.98;
    color: var(--ink);
    max-width: 18ch;
  }
  .promise__line .accent { color: var(--brand-green-deep); font-style: italic; font-weight: 700; }
  .promise__sub {
    margin-top: var(--space-8); max-width: var(--measure-lead);
    color: var(--ink-2);
    font-size: clamp(1.05rem, 0.4vw + 0.95rem, 1.2rem);
  }
  /* Each sentence-beat is its own paragraph so a new sentence never starts orphaned
     as a lone word at a line end (§3, without a <br> in prose). Tight rhythm between
     the beats; the first keeps its larger gap from the heading. */
  .promise__sub + .promise__sub { margin-top: var(--space-stack-2); }
  /* Обещание AND Кого приемаме are SINGLE-column: the statement/head fills the width,
     the paragraph sits below at the BG reading measure (--measure-lead), left-aligned. */
  .svc--split .svc__head .lead { max-width: var(--measure-lead); margin-top: var(--space-6); }

  /* ── 3-step slabs (each step is one big slab with brand-color numeral) ───── */
  .step {
    padding: clamp(calc(var(--space-4) + var(--space-16)), 12vh, calc(var(--space-8) + var(--space-32))) 0;
    border-top: 1px solid var(--line);
  }
  .step--alt { background: var(--bg-1); }
  .step__inner {
    display: grid; gap: clamp(calc(var(--space-1) + var(--space-8)), 5vw, calc(var(--space-2) + var(--space-16)));
    grid-template-columns: 1fr;
    align-items: center;
  }
  @media (min-width: 880px) {
    .step__inner { grid-template-columns: 0.95fr 1.05fr; }
    .step--reverse .step__inner { grid-template-columns: 1.05fr 0.95fr; }
    .step--reverse .step__copy { order: 2; }
    .step--reverse .step__media { order: 1; }
  }
  .step__numeral {
    font-family: 'Onest', sans-serif;
    font-weight: 800;
    font-size: clamp(7rem, 18vw, 18rem);
    line-height: 0.85; letter-spacing: -0.07em;
    margin-bottom: var(--space-3);
    display: block;
    transform: translateY(28px); opacity: 0;
    transition: transform 1000ms var(--ease-out-quint), opacity 1000ms var(--ease-out-quint);
  }
  .step.is-in .step__numeral { transform: translateY(0); opacity: 1; }
  .step--green .step__numeral { color: var(--brand-green); }
  .step--purple .step__numeral { color: var(--brand-purple); }
  .step--orange .step__numeral { color: var(--brand-orange); }
  @supports (-webkit-text-stroke: 2px black) {
    .step--purple .step__numeral {
      color: transparent;
      -webkit-text-stroke: clamp(2px, 0.3vw, 4px) var(--brand-purple);
      paint-order: stroke fill;
    }
    .step--orange .step__numeral {
      color: transparent;
      -webkit-text-stroke: clamp(2px, 0.3vw, 4px) var(--brand-orange);
      paint-order: stroke fill;
    }
  }
  .step__title {
    font-size: clamp(2.2rem, 3.6vw + 1rem, 4.6rem);
    line-height: 0.98; letter-spacing: -0.035em;
    margin-bottom: var(--space-4);
    transform: translateY(20px); opacity: 0;
    transition: transform 1000ms var(--ease-out-quint) 100ms, opacity 1000ms var(--ease-out-quint) 100ms;
  }
  .step.is-in .step__title { transform: translateY(0); opacity: 1; }
  .step__body {
    max-width: 44ch;
    color: var(--ink-2);
    font-size: clamp(1.08rem, 0.4vw + 0.95rem, 1.25rem);
    line-height: 1.6;
    transform: translateY(16px); opacity: 0;
    transition: transform 1000ms var(--ease-out-quint) 200ms, opacity 1000ms var(--ease-out-quint) 200ms;
  }
  .step__body + .step__body { margin-top: var(--space-stack-2); }
  .step.is-in .step__body { transform: translateY(0); opacity: 1; }
  .step__media {
    position: relative;
    aspect-ratio: 4 / 5;
    border-radius: var(--radius-xl);
    overflow: hidden;
    background: var(--bg-elev);
    box-shadow: var(--shadow-soft);
    transform: translateY(28px) scale(0.98); opacity: 0;
    transition: transform 1000ms var(--ease-out-quint) 150ms, opacity 1000ms var(--ease-out-quint) 150ms;
  }
  .step.is-in .step__media { transform: translateY(0) scale(1); opacity: 1; }
  .step__media img {
    width: 100%; height: 100%; object-fit: cover;
    display: block;
    transform: scale(1.02);
    transition: transform 9s var(--ease-out-quint);
  }
  .step.is-in .step__media img { transform: scale(1.08); }

  /* ── Why-it-works (3-column hairline list, no card chrome) ───────── */
  .why {
    padding: clamp(calc(var(--space-1) + var(--space-24)), 14vh, calc(var(--space-8) + var(--space-32))) 0;
    border-top: 1px solid var(--line);
  }
  .why__head { max-width: 720px; margin-bottom: clamp(var(--space-12), 6vh, calc(var(--space-4) + var(--space-16))); }

  /* section-head rhythm shared by every kicker+h2(+p.lead) head block, plus the finalcta head
     (STEP 3: replaces the duplicated inline `style="margin-top: 18px"` on each page) */
  .why__head h2, .why__head p.lead,
  .quiz__head h2, .quiz__head p.lead,
  .programs__head h2, .programs__head p.lead,
  .locations__head h2, .locations__head p.lead,
  .team__head h2, .team__head p.lead,
  .reviews__head h2, .reviews__head p.lead,
  .faq__head h2,
  .finalcta__copy h2 { margin-top: var(--space-4); }
  .why__grid {
    display: grid; gap: 0;
    grid-template-columns: 1fr;
  }
  @media (min-width: 880px) {
    .why__grid { grid-template-columns: repeat(3, 1fr); }
  }
  .why__col {
    padding: clamp(var(--space-8), 3.5vw, var(--space-12)) clamp(var(--space-6), 2vw, var(--space-8));
    border-top: 1px solid var(--line-strong);
  }
  @media (min-width: 880px) {
    .why__col { border-top: 0; padding-top: 0; padding-left: clamp(var(--space-6), 2vw, var(--space-8)); padding-right: clamp(var(--space-6), 2vw, var(--space-8)); }
    .why__col:not(:first-child) { border-left: 1px solid var(--line); }
    .why__col:first-child { padding-left: 0; }
    .why__col:last-child { padding-right: 0; }
  }
  .why__icon {
    width: 36px; height: 36px;
    display: inline-flex; align-items: center; justify-content: center;
    margin-bottom: var(--space-4);
  }
  .why__col:nth-child(1) .why__icon { color: var(--brand-green); }
  .why__col:nth-child(2) .why__icon { color: var(--brand-purple); }
  .why__col:nth-child(3) .why__icon { color: var(--brand-orange); }
  .why__col h3 { margin-bottom: var(--space-3); }
  .why__col p { color: var(--ink-2); max-width: 38ch; }

  /* ── Founder slab (Руси speaks directly) ───────── */
  .founder {
    padding: clamp(calc(var(--space-1) + var(--space-24)), 14vh, 180px) 0;
    background: var(--bg-1);
    border-top: 1px solid var(--line);
  }
  .founder__inner {
    display: grid; gap: clamp(calc(var(--space-1) + var(--space-8)), 5vw, calc(var(--space-2) + var(--space-16)));
    grid-template-columns: 1fr;
    align-items: center;
  }
  @media (min-width: 880px) {
    .founder__inner { grid-template-columns: 0.4fr 0.6fr; }
  }
  .founder__portrait {
    position: relative;
    aspect-ratio: 3 / 4;
    border-radius: var(--radius-xl);
    overflow: hidden;
    background:
      radial-gradient(ellipse 80% 70% at 50% 30%, var(--brand-green-soft) 0%, transparent 70%),
      var(--bg-elev);
    box-shadow: var(--shadow-soft);
    display: flex; align-items: center; justify-content: center;
    flex-direction: column; gap: var(--space-3);
    color: var(--ink-3);
  }
  .founder__portrait::after {
    content: 'СНИМКА · ОЧАКВА';
    font-family: 'Onest', sans-serif;
    font-size: 0.74rem; letter-spacing: 0.18em;
    color: var(--ink-3);
    position: absolute; bottom: 18px;
  }
  .founder__portrait--photo::after { content: none; }
  .founder__portrait svg { width: 68px; height: 68px; color: var(--brand-green); }
  .founder__portrait img {
    width: 100%; height: 100%;
    object-fit: cover; object-position: center top;
    display: block;
  }
  .founder__quote {
    font-family: 'Onest', sans-serif;
    font-weight: 600; font-style: italic;
    font-size: clamp(1.15rem, 0.9vw + 0.8rem, 1.65rem);
    line-height: 1.4; letter-spacing: -0.015em;
    color: var(--ink);
    max-width: 46ch;
    margin-top: var(--space-6);
  }
  .founder__quote::before {
    content: '„';
    color: var(--brand-orange);
    margin-right: 0.04em;
  }
  .founder__quote::after { content: '"'; color: var(--brand-orange); }
  .founder__attrib {
    margin-top: var(--space-6);
    font-family: 'Onest', sans-serif; font-weight: 600;
    font-size: 1rem; color: var(--ink);
    letter-spacing: -0.005em;
  }
  .founder__role {
    color: var(--ink-2); font-weight: 400;
    margin-top: var(--space-1); font-size: 0.95rem;
  }

  /* ── History mosaic ───────── */
  .history {
    padding: clamp(calc(var(--space-1) + var(--space-24)), 14vh, calc(var(--space-8) + var(--space-32))) 0;
    background: var(--bg-1);
    border-top: 1px solid var(--line);
  }
  .history__head { margin-bottom: clamp(var(--space-10), 5vh, var(--space-16)); }
  .history__lead {
    color: var(--ink-2); margin-top: var(--space-5);
    font-size: 1.05rem; line-height: 1.6; max-width: 54ch;
  }
  /* Moving history wall: 3 marquee rows, alternating directions, pause + zoom-to-200% on hover */
  .hcar {
    position: relative;
    overflow-x: clip; overflow-y: visible;
    padding-block: var(--space-8);
    display: flex; flex-direction: column; gap: var(--space-2);
  }
  .hcar__row { position: relative; display: flex; gap: var(--space-2); width: max-content; will-change: transform; }
  .hcar__row[data-row="0"] { animation: hcarL 110s linear infinite; }
  .hcar__row[data-row="1"] { animation: hcarR 130s linear infinite; }
  .hcar__row[data-row="2"] { animation: hcarL 150s linear infinite; }
  .hcar:hover .hcar__row, .hcar:focus-within .hcar__row { animation-play-state: paused; }
  /* lift the whole hovered row above the other rows AND the content below,
     so a zoomed tile floats on top instead of hiding under the carousel */
  .hcar__row:hover, .hcar__row:focus-within { z-index: 40; }
  @keyframes hcarL { from { transform: translateX(0); } to { transform: translateX(-50%); } }
  @keyframes hcarR { from { transform: translateX(-50%); } to { transform: translateX(0); } }
  .hcar__tile { flex: 0 0 auto; width: clamp(110px, 10vw, 140px); }
  .hcar__tile img {
    width: 100%; aspect-ratio: 4 / 3; object-fit: cover;
    border-radius: 8px; display: block; box-shadow: var(--shadow-soft);
    transform-origin: center;
    transition: transform 300ms var(--ease-out-quint), box-shadow 300ms var(--ease-out-quint);
  }
  .hcar__tile:hover img, .hcar__tile img:focus-visible {
    transform: scale(2); position: relative; z-index: 30;
    box-shadow: 0 18px 48px -10px oklch(0.16 0.012 250 / 0.5);
  }
  @media (prefers-reduced-motion: reduce) {
    .hcar { overflow-x: auto; }
    .hcar__row { animation: none; }
  }

  /* ── Programs Bento ───────── */
  .programs {
    padding: clamp(calc(var(--space-1) + var(--space-24)), 14vh, calc(var(--space-8) + var(--space-32))) 0;
    border-top: 1px solid var(--line);
  }
  .programs__head { max-width: 720px; margin-bottom: clamp(var(--space-12), 6vh, calc(var(--space-4) + var(--space-16))); }
  .programs__grid {
    display: grid; gap: var(--space-4);
    grid-template-columns: 1fr;
  }
  @media (min-width: 720px) {
    .programs__grid { grid-template-columns: repeat(6, 1fr); grid-auto-rows: 240px; }
    .programs__card:nth-child(1) { grid-column: span 4; grid-row: span 2; }
    .programs__card:nth-child(2) { grid-column: span 2; }
    .programs__card:nth-child(3) { grid-column: span 2; }
    .programs__card:nth-child(4) { grid-column: span 3; }
    .programs__card:nth-child(5) { grid-column: span 3; grid-row: span 2; }
    .programs__card:nth-child(6) { grid-column: span 3; }
  }
  @media (min-width: 1020px) {
    .programs__grid { grid-auto-rows: 280px; }
  }
  .programs__card {
    position: relative;
    border-radius: var(--radius-lg);
    overflow: hidden;
    background: var(--bg-deep);
    color: var(--ink-on-deep);
    text-decoration: none;
    transition: transform 380ms var(--ease-out-quint), box-shadow 380ms var(--ease-out-quint);
    isolation: isolate;
    box-shadow: var(--shadow-soft);
  }
  .programs__card:hover { transform: translateY(-3px); }
  .programs__card:focus-visible {
    outline: 3px solid var(--brand-green); outline-offset: 4px;
  }
  .programs__card__img {
    position: absolute; inset: 0; z-index: -1;
    background-size: cover; background-position: center;
    transform: scale(1.02);
    transition: transform 1100ms var(--ease-out-quint);
  }
  .programs__card:hover .programs__card__img { transform: scale(1.07); }
  .programs__card::before {
    content: ''; position: absolute; inset: 0; z-index: -1;
    /* Scrim strength is set by the WORST case (a bright, busy photo: the pool,
       the orange table). A soft gradient that reads fine on a dark image leaves
       the description barely legible on those, so it ramps earlier, ends opaque,
       and the blur is heavy enough to kill high-frequency detail behind the text. */
    background: linear-gradient(180deg,
      oklch(0.16 0.012 250 / 0.10) 0%,
      oklch(0.16 0.012 250 / 0.58) 34%,
      oklch(0.16 0.012 250 / 0.90) 60%,
      oklch(0.16 0.012 250 / 0.99) 100%);
    backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);
    -webkit-mask-image: linear-gradient(180deg, transparent 26%, #000 56%);
            mask-image: linear-gradient(180deg, transparent 26%, #000 56%);
    transition: background 320ms var(--ease-out-quint);
  }
  .programs__card:hover::before {
    background: linear-gradient(180deg,
      oklch(0.16 0.012 250 / 0.12) 0%,
      oklch(0.16 0.012 250 / 0.46) 34%,
      oklch(0.16 0.012 250 / 0.86) 62%,
      oklch(0.16 0.012 250 / 0.98) 100%);
  }
  .programs__card__body {
    height: 100%; display: flex; flex-direction: column; justify-content: flex-end;
    padding: clamp(var(--space-6), 2vw, var(--space-8)); gap: var(--space-2);
    text-shadow: 0 1px 10px oklch(0.16 0.012 250 / 0.55);
    /* Guaranteed contrast floor. The ::before scrim is percentage-based, so on a
       very bright, busy photo (the pool) it still lost the description. This
       gradient sits on the text's own layer, so legibility no longer depends on
       what the photo happens to look like at that height. */
    background: linear-gradient(180deg,
      transparent 0%,
      oklch(0.16 0.012 250 / 0.30) 46%,
      oklch(0.16 0.012 250 / 0.72) 68%,
      oklch(0.16 0.012 250 / 0.92) 100%);
  }
  .programs__card--light .programs__card__body {
    background: linear-gradient(180deg,
      transparent 0%,
      oklch(0.99 0.003 95 / 0.35) 46%,
      oklch(0.99 0.003 95 / 0.78) 68%,
      oklch(0.99 0.003 95 / 0.94) 100%);
  }
  .programs__card__tag {
    align-self: flex-start;
    font-family: 'Onest', sans-serif;
    font-size: 0.72rem; letter-spacing: 0.18em; text-transform: uppercase;
    color: oklch(0.99 0.003 95 / 0.78);
    padding: var(--space-1) var(--space-2); border: 1px solid oklch(0.99 0.003 95 / 0.30);
    border-radius: 999px;
    margin-bottom: var(--space-2);
  }
  .programs__card h3 {
    color: var(--ink-on-deep);
    font-size: clamp(1.15rem, 0.8vw + 1rem, 1.7rem);
  }
  .programs__card:not(.programs__card--light) h3 {
    text-shadow: 0 1px 1px oklch(0.16 0.012 250 / 0.55), 0 3px 16px oklch(0.16 0.012 250 / 0.5);
  }
  .programs__card:not(.programs__card--light) p { text-shadow: 0 1px 2px oklch(0.16 0.012 250 / 0.8), 0 2px 10px oklch(0.16 0.012 250 / 0.6); }
  .programs__card__tag { color: oklch(0.99 0.003 95 / 0.92); border-color: oklch(0.99 0.003 95 / 0.42); background: oklch(0.16 0.012 250 / 0.35); }
  .programs__card p {
    color: oklch(0.99 0.003 95 / 0.94);
    font-size: 0.88rem; max-width: 46ch;
  }
  /* Light-illustration cards (cream ground) use dark text + a light scrim */
  .programs__card--light::before {
    background: linear-gradient(180deg,
      oklch(0.99 0.003 95 / 0) 40%,
      oklch(0.99 0.003 95 / 0.60) 66%,
      oklch(0.99 0.003 95 / 0.93) 100%);
  }
  .programs__card--light:hover::before {
    background: linear-gradient(180deg,
      oklch(0.99 0.003 95 / 0) 36%,
      oklch(0.99 0.003 95 / 0.66) 62%,
      oklch(0.99 0.003 95 / 0.96) 100%);
  }
  .programs__card--light .programs__card__body { text-shadow: 0 1px 6px oklch(0.99 0.003 95 / 0.65); }
  .programs__card--light h3 { color: var(--ink); }
  .programs__card--light p { color: var(--ink-2); }
  .programs__card--light .programs__card__tag {
    color: var(--ink-2); border-color: oklch(0.16 0.012 250 / 0.22);
  }

  /* ── Locations slab ───────── */
  .locations {
    padding: clamp(calc(var(--space-1) + var(--space-24)), 14vh, calc(var(--space-8) + var(--space-32))) 0;
    border-top: 1px solid var(--line);
  }
  .locations__head { max-width: 720px; margin-bottom: clamp(calc(var(--space-2) + var(--space-8)), 5vh, calc(var(--space-3) + var(--space-12))); }
  .locations__grid {
    display: grid; gap: var(--space-6);
    grid-template-columns: 1fr;
  }
  @media (min-width: 720px) {
    .locations__grid { grid-template-columns: 1fr 1fr; }
  }
  .location {
    padding: clamp(var(--space-8), 3vw, calc(var(--space-3) + var(--space-8)));
    border: 1px solid var(--line-strong);
    border-radius: var(--radius-lg);
    background: var(--bg-elev);
    transition: transform 320ms var(--ease-out-quint), border-color 320ms var(--ease-out-quint);
  }
  .location:hover { transform: translateY(-2px); border-color: var(--brand-green); }
  .location--map {
    padding: 0;
    overflow: hidden;
    min-height: 320px;
    display: flex;
  }
  .location--map iframe {
    flex: 1;
    width: 100%;
    height: 100%;
    min-height: 320px;
    border: 0;
    display: block;
  }
  .location--map:hover { transform: none; border-color: var(--line-strong); }
  .location__pin {
    width: 32px; height: 32px; color: var(--brand-green);
    margin-bottom: var(--space-4);
  }
  .location__city {
    font-family: 'Onest', sans-serif; font-weight: 700;
    font-size: clamp(1.4rem, 1vw + 1rem, 1.9rem); letter-spacing: -0.022em;
  }
  .location__addr {
    margin-top: var(--space-2); color: var(--ink-2);
    font-size: 0.98rem;
  }
  .location__contact {
    margin-top: var(--space-6); padding-top: var(--space-4);
    border-top: 1px solid var(--line);
    display: flex; flex-direction: column; gap: var(--space-2);
    font-size: 0.95rem;
  }
  .location__contact a { text-decoration: none; color: var(--ink); transition: color 220ms var(--ease-out-quint); }
  .location__contact a:hover { color: var(--brand-green-deep); }

  /* ── Team ───────── */
  .team {
    padding: clamp(calc(var(--space-1) + var(--space-24)), 14vh, calc(var(--space-8) + var(--space-32))) 0;
    border-top: 1px solid var(--line);
    background: var(--bg-1);
  }
  .team__head { max-width: 720px; margin-bottom: clamp(var(--space-12), 6vh, calc(var(--space-4) + var(--space-16))); }
  .team__grid {
    display: grid; gap: var(--space-6);
    grid-template-columns: 1fr;
  }
  @media (min-width: 720px) { .team__grid { grid-template-columns: repeat(3, 1fr); } }
  .person {
    background: var(--bg-elev);
    border-radius: var(--radius-lg);
    overflow: hidden;
    transition: transform 320ms var(--ease-out-quint), box-shadow 320ms var(--ease-out-quint);
    box-shadow: var(--shadow-soft);
  }
  .person:hover { transform: translateY(-2px); box-shadow: 0 1px 2px oklch(0.16 0.012 250 / 0.05), 0 18px 36px -10px oklch(0.16 0.012 250 / 0.16); }
  .person__photo {
    position: relative;
    aspect-ratio: 4 / 5;
    background:
      radial-gradient(ellipse 80% 70% at 50% 30%, var(--brand-green-soft) 0%, transparent 70%),
      var(--bg-1);
    display: flex; align-items: center; justify-content: center;
    color: var(--ink-3);
  }
  .person__photo svg { width: 56px; height: 56px; color: var(--brand-green); opacity: 0.6; }
  .person__photo::after {
    content: 'СНИМКА · ОЧАКВА';
    position: absolute; bottom: 14px;
    font-family: 'Onest', sans-serif;
    font-size: 0.7rem; letter-spacing: 0.16em;
    color: var(--ink-3);
  }
  .person__photo--has-img::after { content: none; }
  .person__photo img {
    position: absolute; inset: 0;
    width: 100%; height: 100%;
    object-fit: cover; object-position: center top;
    display: block;
  }
  .person__photo--right img { object-position: 100% center; }
  .person__photo--left img { object-position: 0% center; }
  .person--purple .person__photo { background: radial-gradient(ellipse 80% 70% at 50% 30%, var(--brand-purple-soft) 0%, transparent 70%), var(--bg-1); }
  .person--purple .person__photo svg { color: var(--brand-purple); }
  .person--orange .person__photo { background: radial-gradient(ellipse 80% 70% at 50% 30%, var(--brand-orange-soft) 0%, transparent 70%), var(--bg-1); }
  .person--orange .person__photo svg { color: var(--brand-orange); }
  .person__body { padding: clamp(var(--space-6), 2.5vw, var(--space-8)); }
  .person__name {
    font-family: 'Onest', sans-serif; font-weight: 700;
    font-size: clamp(1.15rem, 0.6vw + 1rem, 1.4rem); letter-spacing: -0.018em;
  }
  .person__role {
    margin-top: var(--space-2); color: var(--ink-2);
    font-size: 0.95rem; line-height: 1.5;
  }

  /* ── Reviews carousel ───────── */
  .reviews {
    padding: clamp(calc(var(--space-1) + var(--space-24)), 14vh, 180px) 0;
    border-top: 1px solid var(--line);
    background: var(--bg-1);
  }
  .reviews__head { max-width: 720px; margin-bottom: clamp(var(--space-12), 6vh, calc(var(--space-2) + var(--space-16))); }
  .reviews__viewport {
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    margin: 0 -22px;
    padding: 4px 22px;
  }
  .reviews__viewport::-webkit-scrollbar { display: none; }
  @media (min-width: 720px) {
    .reviews__viewport { margin: 0 -40px; padding: 4px 40px; }
  }
  @media (min-width: 1100px) {
    .reviews__viewport { margin: 0 -56px; padding: 4px 56px; }
  }
  .reviews__viewport:focus-visible {
    outline: 2px solid var(--brand-green-deep);
    outline-offset: 6px; border-radius: 12px;
  }
  .reviews__track {
    display: flex; gap: var(--space-4);
    list-style: none; margin: 0; padding: 0;
  }
  .review-card {
    flex: 0 0 min(86vw, 380px);
    scroll-snap-align: start;
    background: var(--bg-elev);
    border: 1px solid var(--line);
    border-radius: var(--radius-lg);
    padding: clamp(var(--space-6), 2.6vw, calc(var(--space-1) + var(--space-8)));
    display: flex; flex-direction: column; gap: var(--space-4);
    box-shadow: var(--shadow-soft);
    transition: transform 320ms var(--ease-out-quint), box-shadow 320ms var(--ease-out-quint);
  }
  .review-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 1px 2px oklch(0.16 0.012 250 / 0.06),
                0 18px 36px -10px oklch(0.16 0.012 250 / 0.16);
  }
  @media (min-width: 720px) { .review-card { flex: 0 0 min(50vw, 420px); } }
  @media (min-width: 1100px) { .review-card { flex: 0 0 min(33vw, 380px); } }
  .review-card__stars {
    color: var(--brand-orange);
    font-size: 1.1rem; letter-spacing: 0.08em; line-height: 1;
  }
  .review-card__body {
    color: var(--ink); font-size: 1.02rem; line-height: 1.55;
    flex: 1;
  }
  .review-card__foot {
    display: flex; justify-content: space-between; align-items: center;
    gap: var(--gap-inline); padding-top: var(--space-3);
    border-top: 1px solid var(--line);
    font-size: 0.86rem;
  }
  .review-card__author {
    font-family: 'Onest', sans-serif; font-weight: 600;
    color: var(--ink); letter-spacing: -0.005em;
  }
  .review-card__src {
    color: var(--ink-3);
    display: inline-flex; align-items: center; gap: var(--space-2);
    font-size: 0.82rem;
  }
  .review-card__src svg { color: var(--ink-3); flex-shrink: 0; }

  .reviews__controls {
    margin-top: clamp(var(--space-8), 3vh, calc(var(--space-2) + var(--space-8)));
    display: flex; gap: var(--space-4); align-items: center;
  }
  .reviews__btn {
    width: 44px; height: 44px; border-radius: 50%;
    background: var(--bg-elev); border: 1px solid var(--line-strong);
    color: var(--ink); cursor: pointer;
    display: inline-flex; align-items: center; justify-content: center;
    transition: background 220ms var(--ease-out-quint), border-color 220ms var(--ease-out-quint),
                color 220ms var(--ease-out-quint), transform 220ms var(--ease-spring);
  }
  .reviews__btn:hover {
    background: var(--brand-green); border-color: var(--brand-green); color: var(--ink);
    transform: translateY(-1px);
  }
  .reviews__btn:focus-visible {
    background: var(--brand-green); border-color: var(--brand-green-deep);
    outline: 2px solid var(--brand-green-deep); outline-offset: 3px;
  }
  .reviews__btn:disabled { opacity: 0.35; cursor: not-allowed; }
  .reviews__btn:disabled:hover {
    transform: none; background: var(--bg-elev);
    border-color: var(--line-strong); color: var(--ink);
  }
  .reviews__count {
    font-family: 'Onest', sans-serif; font-weight: 600;
    color: var(--ink-2); font-size: 0.94rem;
    margin-left: auto;
    font-variant-numeric: tabular-nums;
  }

  /* (legacy .quote testimonial styles removed 2026-07-30 — superseded by the .reviews carousel) */

  /* ── FAQ (hairline accordion) ───────── */
  .faq {
    padding: clamp(calc(var(--space-1) + var(--space-24)), 14vh, calc(var(--space-8) + var(--space-32))) 0;
    border-top: 1px solid var(--line);
  }
  .faq__head { max-width: 720px; margin-bottom: clamp(calc(var(--space-1) + var(--space-8)), 5vh, calc(var(--space-2) + var(--space-12))); }
  .faq__list {
    border-top: 1px solid var(--line-strong);
  }
  .faq__item { border-bottom: 1px solid var(--line-strong); }
  .faq__btn {
    width: 100%; text-align: left;
    background: none; border: 0; cursor: pointer;
    padding: clamp(var(--space-6), 2.4vw, var(--space-8)) 0;
    display: flex; align-items: flex-start; gap: var(--space-4); justify-content: space-between;
    color: var(--ink);
    font-family: 'Onest', sans-serif; font-weight: 600;
    font-size: clamp(1.05rem, 0.5vw + 1rem, 1.3rem); letter-spacing: -0.012em;
    line-height: 1.3;
    transition: color 220ms var(--ease-out-quint);
  }
  .faq__btn:hover { color: var(--brand-green-deep); }
  .faq__btn:focus-visible {
    color: var(--brand-green-deep);
    outline: 2px solid var(--brand-green); outline-offset: 6px; border-radius: 4px;
  }
  .faq__chev {
    flex-shrink: 0; width: 28px; height: 28px;
    position: relative;
    color: var(--ink);
    transition: transform 380ms var(--ease-spring), color 320ms var(--ease-out-quint);
  }
  .faq__chev::before, .faq__chev::after {
    content: ''; position: absolute; left: 50%; top: 50%;
    background: currentColor;
    transition: transform 320ms var(--ease-out-quint), opacity 320ms var(--ease-out-quint);
  }
  .faq__chev::before { width: 14px; height: 1.5px; transform: translate(-50%, -50%); }
  .faq__chev::after { width: 1.5px; height: 14px; transform: translate(-50%, -50%); }
  .faq__btn[aria-expanded="true"] .faq__chev::after { transform: translate(-50%, -50%) scaleY(0); opacity: 0; }
  .faq__btn[aria-expanded="true"] .faq__chev { color: var(--brand-green-deep); }
  .faq__panel {
    max-height: 0; overflow: hidden;
    transition: max-height 480ms var(--ease-out-quint);
  }
  .faq__panel-inner {
    padding-bottom: var(--space-8); padding-right: var(--space-12);
    color: var(--ink-2);
    font-size: clamp(0.98rem, 0.2vw + 0.92rem, 1.08rem); line-height: 1.65;
    max-width: 70ch;
    text-wrap: pretty;
  }

  /* ── Final CTA (dark slab for contrast) ───────── */
  .finalcta {
    background: var(--bg-deep);
    color: var(--ink-on-deep);
    padding: clamp(calc(var(--space-6) + var(--space-24)), 18vh, 220px) 0;
    border-top: 1px solid var(--ink);
    position: relative; overflow: hidden;
  }
  .finalcta::before {
    content: ''; position: absolute; inset: 0; pointer-events: none;
    background:
      radial-gradient(ellipse 60% 50% at 80% 30%, oklch(0.74 0.20 145 / 0.18) 0%, transparent 60%),
      radial-gradient(ellipse 50% 50% at 20% 80%, oklch(0.50 0.18 290 / 0.14) 0%, transparent 60%);
  }
  .finalcta__inner {
    position: relative;
    max-width: 720px;
    margin-inline: auto;
  }
  .finalcta h2 {
    color: var(--ink-on-deep);
    font-size: clamp(2.2rem, 4.5vw + 0.5rem, 5.2rem);
    letter-spacing: -0.04em; line-height: 1;
  }
  .finalcta p.lead { color: #e9e7e0; color: oklch(0.99 0.003 95 / 0.82); margin-top: var(--space-6); }
  /* service-page contact CTA cluster (STEP 3: replaces the duplicated inline flex+gap style) */
  .finalcta__cta { display: flex; flex-direction: column; gap: var(--space-3); align-items: flex-start; }
  .finalcta__row {
    margin-top: calc(var(--space-1) + var(--space-8));
    display: flex; gap: var(--space-4); flex-wrap: wrap; align-items: center;
  }
  .finalcta__row .link-quiet {
    color: oklch(0.99 0.003 95 / 0.92);
    text-decoration-color: oklch(0.99 0.003 95 / 0.30);
  }
  .finalcta__row .link-quiet:hover { color: var(--brand-green); text-decoration-color: var(--brand-green); }

  /* ── Footer ───────── */
  .footer {
    padding: clamp(var(--space-12), 7vh, calc(var(--space-4) + var(--space-16))) 0 var(--space-8);
    background: var(--bg);
    border-top: 1px solid var(--line);
  }
  .footer__row {
    display: grid; gap: var(--space-8);
    grid-template-columns: 1fr;
  }
  @media (min-width: 720px) {
    .footer__row { grid-template-columns: 1.4fr 1fr 1fr 1fr; }
  }
  .footer__brand p { color: var(--ink-2); margin-top: var(--space-3); max-width: 36ch; font-size: 0.94rem; }
  .footer__col h4 { font-size: 0.78rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink-3); margin-bottom: var(--space-3); font-weight: 600; }
  .footer__col ul { list-style: none; padding: 0; margin: 0; display: grid; gap: var(--space-2); }
  .footer__col a { text-decoration: none; color: var(--ink-2); font-size: 0.96rem; transition: color 220ms var(--ease-out-quint); }
  .footer__col a:hover { color: var(--ink); }
  .footer__col a:focus-visible {
    color: var(--ink); outline: 2px solid var(--brand-green);
    outline-offset: 4px; border-radius: 2px;
  }
  .footer__bottom {
    margin-top: calc(var(--space-2) + var(--space-8)); padding-top: var(--space-6);
    border-top: 1px solid var(--line);
    display: flex; flex-wrap: wrap; gap: var(--space-4); justify-content: space-between;
    color: var(--ink-3); font-size: 0.86rem;
  }

  /* ── Reveal ───────── */
  .reveal { opacity: 0; transform: translateY(20px); transition: opacity 800ms var(--ease-out-quint), transform 800ms var(--ease-out-quint); }
  .reveal.is-in { opacity: 1; transform: translateY(0); }
  .reveal--late { transition-delay: 120ms; }
  .reveal--later { transition-delay: 240ms; }

  /* ── Reduced motion ───────── */
  @media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after {
      animation-duration: 0.001ms !important;
      animation-iteration-count: 1 !important;
      transition-duration: 0.001ms !important;
    }
    .step__media img { transform: scale(1); }
    .reveal,
    .hero__sub, .hero__cta,
    .step__numeral, .step__title, .step__body, .step__media {
      opacity: 1 !important; transform: none !important;
    }
    .mobicta { transition: none; }
  }

  /* ═══════ Phase 1 additions (mobile nav, sticky CTA, overflow guards, a11y) ═══════ */

  .skip-link {
    position: absolute; left: 12px; top: -60px; z-index: 60;
    background: var(--ink); color: var(--ink-on-deep);
    padding: var(--space-3) var(--space-4); border-radius: 10px;
    font-family: 'Onest', sans-serif; font-weight: 600; text-decoration: none;
    transition: top 200ms var(--ease-out-quint);
  }
  .skip-link:focus { top: 12px; outline: 2px solid var(--brand-green); outline-offset: 2px; }

  /* fixed-nav anchor offset so section headings aren't hidden under the bar */
  section[id] { scroll-margin-top: calc(var(--space-6) + var(--space-16)); }

  /* section-head wrappers fill their column (no left-crammed gutter — qa_layout_measure gate);
     the lead paragraph inside keeps its own readable 56ch cap from p.lead */
  .why__head, .programs__head, .locations__head, .team__head, .reviews__head, .faq__head, .quiz__head { max-width: none; }

  /* overflow guards: let nowrap children shrink instead of blowing out their track (was masked by overflow-x:hidden) */
  .container { min-width: 0; }
  .nav__row, .nav__row > *, .hero__inner, .hero__cta,
  .step__inner > *, .footer__row > * { min-width: 0; }

  /* hamburger (mobile/tablet only) */
  .nav__burger {
    display: inline-flex; align-items: center; justify-content: center;
    width: 44px; height: 44px; border: 0; background: transparent;
    color: var(--ink); cursor: pointer; border-radius: 10px;
    transition: background 200ms var(--ease-out-quint);
  }
  .nav__burger:hover { background: var(--bg-1); }
  .nav__burger:focus-visible { outline: 2px solid var(--brand-green); outline-offset: 2px; }
  .nav__burger svg { width: 24px; height: 24px; }
  @media (min-width: 1020px) { .nav__burger { display: none; } }
  /* on small phones the persistent nav pill clipped off-edge; the sheet + sticky bar carry the CTA there */
  @media (max-width: 719px) { .nav__right .btn--primary { display: none; } }

  /* full-screen mobile nav sheet */
  .nav-sheet {
    position: fixed; inset: 0; z-index: 50;
    background: var(--bg);
    display: flex; flex-direction: column;
    overflow-y: auto; -webkit-overflow-scrolling: touch;
    padding: calc(var(--space-6) + var(--space-16)) var(--space-6) calc(calc(var(--space-2) + var(--space-8)) + env(safe-area-inset-bottom, 0px));
    opacity: 0; visibility: hidden; transform: translateY(-8px);
    transition: opacity 280ms var(--ease-out-quint), transform 280ms var(--ease-out-quint), visibility 0s linear 280ms;
  }
  .nav-sheet.is-open { opacity: 1; visibility: visible; transform: translateY(0); transition-delay: 0s; }
  @media (min-width: 1020px) { .nav-sheet { display: none; } }
  .nav-sheet__close {
    position: absolute; top: 16px; right: 14px;
    width: 44px; height: 44px; border: 0; background: transparent;
    color: var(--ink); cursor: pointer; border-radius: 10px;
    display: inline-flex; align-items: center; justify-content: center;
    transition: background 200ms var(--ease-out-quint);
  }
  .nav-sheet__close:hover { background: var(--bg-1); }
  .nav-sheet__close:focus-visible { outline: 2px solid var(--brand-green); outline-offset: 2px; }
  .nav-sheet__close svg { width: 24px; height: 24px; }
  .nav-sheet__links { display: flex; flex-direction: column; gap: 2px; }
  .nav-sheet__links a {
    font-family: 'Onest', sans-serif; font-weight: 600;
    font-size: 1.4rem; letter-spacing: -0.02em; color: var(--ink);
    text-decoration: none; padding: var(--space-3) var(--space-2); border-radius: 12px;
    display: flex; align-items: center; min-height: 44px;
    transition: background 200ms var(--ease-out-quint), color 200ms var(--ease-out-quint);
  }
  .nav-sheet__links a:hover { background: var(--bg-1); color: var(--brand-green-deep); }
  .nav-sheet__links a:focus-visible { outline: 2px solid var(--brand-green); outline-offset: 2px; }
  .nav-sheet__sub { display: flex; flex-direction: column; gap: 0; margin: var(--space-1) 0 var(--space-2); padding-left: var(--space-4); border-left: 2px solid var(--line); }
  .nav-sheet__sub a {
    font-family: 'Onest', sans-serif; font-weight: 500;
    font-size: 1.02rem; color: var(--ink-2); text-decoration: none;
    padding: var(--space-2); border-radius: 10px;
    display: flex; align-items: center; min-height: 40px;
    transition: background 200ms var(--ease-out-quint), color 200ms var(--ease-out-quint);
  }
  .nav-sheet__sub a:hover { background: var(--bg-1); color: var(--brand-green-deep); }
  .nav-sheet__sub a:focus-visible { outline: 2px solid var(--brand-green); outline-offset: 2px; }
  .nav-sheet__foot {
    margin-top: auto; padding-top: var(--space-6);
    display: flex; flex-direction: column; gap: var(--space-3);
    border-top: 1px solid var(--line);
  }
  .nav-sheet__phone {
    display: inline-flex; align-items: center; gap: var(--space-2); min-height: 44px;
    color: var(--ink-2); text-decoration: none; font-size: 1.05rem;
  }
  .nav-sheet__phone:hover { color: var(--brand-green-deep); }
  .nav-sheet .btn--primary { justify-content: center; }
  body.nav-open { position: fixed; width: 100%; overflow: hidden; }

  /* bottom sticky CTA (mobile only, appears once the hero scrolls away) */
  .mobicta {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 25;
    display: flex; gap: var(--space-2); align-items: stretch;
    padding: var(--space-2) var(--space-3) calc(var(--space-2) + env(safe-area-inset-bottom, 0px));
    background: #fefdf9;
    background: oklch(0.99 0.003 95 / 0.92);
    -webkit-backdrop-filter: blur(16px) saturate(1.3);
    backdrop-filter: blur(16px) saturate(1.3);
    border-top: 1px solid var(--line);
    transform: translateY(115%);
    transition: transform 320ms var(--ease-out-quint);
  }
  .mobicta.is-shown { transform: translateY(0); }
  @media (min-width: 1020px) { .mobicta { display: none; } }
  .mobicta__book {
    flex: 1; display: inline-flex; align-items: center; justify-content: center;
    min-height: 50px; padding: 0 var(--space-4); border-radius: 999px;
    background: var(--brand-green); color: var(--ink);
    font-family: 'Onest', sans-serif; font-weight: 600; font-size: 1rem;
    text-decoration: none; box-shadow: 0 6px 18px -6px oklch(0.55 0.22 140 / 0.5);
  }
  .mobicta__book:active { transform: translateY(1px); }
  .mobicta__call {
    display: inline-flex; align-items: center; justify-content: center;
    width: 50px; min-height: 50px; border-radius: 999px; flex-shrink: 0;
    background: var(--bg-elev); border: 1px solid var(--line-strong);
    color: var(--ink); text-decoration: none;
  }
  .mobicta__call svg { width: 20px; height: 20px; }
  .mobicta__book:focus-visible, .mobicta__call:focus-visible { outline: 3px solid var(--brand-green-deep); outline-offset: 2px; }

  /* ═══════ Phase 1 conversion — lead form (light card on the dark final slab) ═══════ */
  @media (min-width: 900px) {
    .finalcta__inner {
      max-width: var(--container);
      display: grid; grid-template-columns: 1fr 1fr;
      gap: clamp(calc(var(--space-2) + var(--space-8)), 5vw, calc(var(--space-4) + var(--space-16))); align-items: center;
    }
  }
  .finalcta__phone { margin-top: var(--space-6); color: oklch(0.99 0.003 95 / 0.92); text-decoration-color: oklch(0.99 0.003 95 / 0.30); }
  .finalcta__phone:hover { color: var(--brand-green); text-decoration-color: var(--brand-green); }
  .leadform {
    position: relative;
    background: var(--bg-elev); color: var(--ink);
    border-radius: var(--radius-lg); padding: clamp(var(--space-6), 3vw, var(--space-8));
    box-shadow: 0 30px 80px -22px oklch(0 0 0 / 0.55);
    display: flex; flex-direction: column; gap: var(--space-3);
  }
  .leadform__title { font-family: 'Onest', sans-serif; font-weight: 700; font-size: 1.15rem; letter-spacing: -0.01em; margin-bottom: 2px; }
  .leadform__row { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-3); }
  @media (max-width: 479px) { .leadform__row { grid-template-columns: 1fr; } }
  .leadform__field { display: flex; flex-direction: column; gap: var(--space-2); }
  .leadform__field label { font-size: 0.9rem; font-weight: 600; color: var(--ink-2); }
  .leadform__opt { font-weight: 400; color: var(--ink-3); }
  .leadform input, .leadform textarea {
    width: 100%; font-family: 'Manrope', sans-serif; font-size: 1rem;
    padding: var(--space-3) var(--space-3); border: 1px solid var(--line-strong); border-radius: 10px;
    background: var(--bg); color: var(--ink); min-height: 46px;
    transition: border-color 200ms var(--ease-out-quint), box-shadow 200ms var(--ease-out-quint);
  }
  .leadform textarea { min-height: 62px; resize: vertical; }
  .leadform input:focus-visible, .leadform textarea:focus-visible {
    outline: none; border-color: var(--brand-green-deep);
    box-shadow: 0 0 0 3px oklch(0.55 0.22 140 / 0.18);
  }
  .leadform input[aria-invalid="true"], .leadform textarea[aria-invalid="true"] { border-color: #c0392b; }
  .leadform__consent { display: flex; align-items: flex-start; gap: var(--space-2); font-size: 0.86rem; color: var(--ink-2); line-height: 1.45; cursor: pointer; }
  .leadform__consent input { width: 20px; height: 20px; min-height: 0; flex-shrink: 0; margin-top: 1px; accent-color: var(--brand-green-deep); }
  .leadform__hp { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
  .leadform__submit { justify-content: center; margin-top: var(--space-1); }
  .leadform__status { font-size: 0.92rem; min-height: 1.2em; margin: 0; }
  .leadform__status.is-error { color: #c0392b; }
  .leadform__status.is-ok { color: var(--brand-green-deep); font-weight: 600; }
  .leadform.is-sent .leadform__field,
  .leadform.is-sent .leadform__row,
  .leadform.is-sent .leadform__consent,
  .leadform.is-sent .leadform__submit,
  .leadform.is-sent .leadform__title { display: none; }

  /* ═══════ Readiness quiz (MicroMagnet) ═══════ */
  .quiz { padding: clamp(calc(var(--space-1) + var(--space-24)), 14vh, calc(var(--space-8) + var(--space-32))) 0; border-top: 1px solid var(--line); background: var(--bg-1); }
  .quiz__head { max-width: none; margin-bottom: clamp(calc(var(--space-2) + var(--space-8)), 5vh, var(--space-16)); }
  .quiz__picker { display: grid; grid-template-columns: 1fr; gap: var(--gap-grid); }
  @media (min-width: 720px) { .quiz__picker { grid-template-columns: repeat(2, 1fr); } }
  .quiz__picker[hidden] { display: none; }
  .quiz__launch { align-self: flex-start; }
  .quiz__pick {
    display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-2);
    text-align: left; cursor: pointer; font-family: inherit; color: var(--ink);
    background: var(--bg-elev); border: 1px solid var(--line-strong); border-radius: var(--radius-lg);
    padding: clamp(var(--space-6), 2.6vw, var(--space-8)); box-shadow: var(--shadow-soft);
    transition: transform 300ms var(--ease-out-quint), border-color 300ms var(--ease-out-quint), box-shadow 300ms var(--ease-out-quint);
  }
  .quiz__pick:hover { transform: translateY(-3px); border-color: var(--brand-green); box-shadow: 0 1px 2px oklch(0.16 0.012 250 / 0.05), 0 18px 36px -12px oklch(0.16 0.012 250 / 0.16); }
  .quiz__pick:focus-visible { outline: 3px solid var(--brand-green); outline-offset: 3px; }
  .quiz__pick-num { font-family: 'Onest', sans-serif; font-weight: 800; font-size: 1.05rem; color: var(--brand-green-deep); }
  .quiz__pick-title { font-family: 'Onest', sans-serif; font-weight: 700; font-size: clamp(1.1rem, 0.5vw + 1rem, 1.32rem); letter-spacing: -0.02em; line-height: 1.2; }
  .quiz__pick-desc { color: var(--ink-2); font-size: 0.95rem; line-height: 1.5; flex: 1; }
  .quiz__pick-go { margin-top: var(--space-2); font-family: 'Onest', sans-serif; font-weight: 600; color: var(--brand-green-deep); font-size: 0.95rem; }
  .quiz__back { background: none; border: 0; cursor: pointer; color: var(--ink-2); font-family: 'Onest', sans-serif; font-weight: 600; font-size: 0.92rem; padding: var(--space-2) var(--space-1); min-height: 40px; margin-left: calc(-1 * var(--space-1)); }
  .quiz__back:hover { color: var(--brand-green-deep); }
  .quiz__back:focus-visible { outline: 2px solid var(--brand-green); outline-offset: 3px; border-radius: 6px; }
  .quiz__title { font-size: clamp(1.5rem, 1.4vw + 1rem, 2.2rem); letter-spacing: -0.025em; line-height: 1.1; }
  .quiz__intro { color: var(--ink-2); margin: var(--space-2) 0 clamp(var(--space-6), 3vw, var(--space-8)); max-width: 60ch; font-size: clamp(1rem, 0.3vw + 0.95rem, 1.12rem); }
  .quiz__info { flex-shrink: 0; width: 22px; height: 22px; border-radius: 50%; border: 1px solid var(--line-strong); background: var(--bg); color: var(--ink-2); font-family: 'Onest', sans-serif; font-weight: 700; font-size: 0.8rem; line-height: 1; cursor: pointer; margin-left: var(--space-2); display: inline-flex; align-items: center; justify-content: center; }
  .quiz__info:hover { border-color: var(--brand-green); color: var(--brand-green-deep); }
  .quiz__info:focus-visible { outline: 2px solid var(--brand-green); outline-offset: 2px; }
  .quiz__hint { margin: var(--space-1) 0 0 calc(var(--space-1) + var(--space-8)); padding: var(--space-3) var(--space-3); border-radius: 10px; background: var(--brand-green-soft); color: var(--ink); font-size: 0.9rem; line-height: 1.5; max-width: 62ch; }
  .quiz__strong { font-weight: 600; color: var(--ink); margin: var(--space-1) 0 var(--space-6); }
  .quiz__gaps-h { font-family: 'Onest', sans-serif; font-weight: 700; font-size: 1.05rem; margin: var(--space-2) 0 var(--space-3); }
  .quiz__gaps-list { list-style: none; margin: 0 0 var(--space-6); padding: 0; display: flex; flex-direction: column; gap: var(--space-3); }
  .quiz__gaps-list li { padding: var(--space-3) var(--space-4); border: 1px solid var(--line); border-radius: 12px; background: var(--bg); }
  .quiz__gaps-list strong { display: block; font-family: 'Onest', sans-serif; font-weight: 700; margin-bottom: var(--space-1); }
  .quiz__gaps-list span { color: var(--ink-2); font-size: 0.94rem; line-height: 1.5; }
  .quiz__field { display: flex; flex-direction: column; gap: var(--space-1); margin-bottom: var(--space-2); }
  .quiz__field label { font-size: 0.9rem; font-weight: 600; color: var(--ink-2); }
  .quiz__field input { width: 100%; font-family: 'Manrope', sans-serif; font-size: 1rem; padding: var(--space-3) var(--space-3); border: 1px solid var(--line-strong); border-radius: 10px; background: var(--bg); color: var(--ink); min-height: 46px; }
  .quiz__field input:focus-visible { outline: none; border-color: var(--brand-green-deep); box-shadow: 0 0 0 3px oklch(0.55 0.22 140 / 0.18); }
  .quiz__fhelp { font-size: 0.82rem; color: var(--ink-3); line-height: 1.4; }
  .quiz__opt-lbl { font-weight: 400; color: var(--ink-3); }
  .quiz__cat { list-style: none; font-family: 'Onest', sans-serif; font-weight: 700; font-size: 1.02rem; color: var(--brand-green-deep); letter-spacing: -0.01em; margin: var(--space-6) 0 var(--space-1); padding-top: var(--space-3); border-top: 1px solid var(--line-strong); }
  .quiz__cat:first-child { border-top: 0; padding-top: 0; margin-top: 0; }
  .quiz__legend { font-size: 0.86rem; color: var(--ink-3); line-height: 1.5; margin: 0 0 clamp(var(--space-6), 3vw, var(--space-8)); padding: var(--space-3) var(--space-3); background: var(--bg-1); border: 1px solid var(--line); border-radius: 10px; max-width: 70ch; }
  .quiz__flag { padding: var(--space-3) var(--space-4); border-radius: 12px; background: var(--brand-orange-soft); border: 1px solid var(--brand-orange); color: var(--ink); font-size: 0.94rem; line-height: 1.5; margin: 0 0 var(--space-6); }
  .quiz__card, .quiz__result { max-width: 780px; background: var(--bg-elev); border: 1px solid var(--line); border-radius: var(--radius-lg); padding: clamp(var(--space-6), 3.5vw, calc(var(--space-3) + var(--space-8))); box-shadow: var(--shadow-soft); }
  .quiz__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: clamp(var(--space-6), 3vw, var(--space-8)); }
  .quiz__q { display: flex; flex-direction: column; gap: var(--space-3); }
  .quiz__qtext { font-family: 'Onest', sans-serif; font-weight: 600; font-size: clamp(1.02rem, 0.5vw + 0.95rem, 1.2rem); line-height: 1.35; color: var(--ink); display: flex; gap: var(--gap-inline); align-items: flex-start; }
  .quiz__qnum { flex-shrink: 0; width: 26px; height: 26px; border-radius: 50%; background: var(--brand-green); color: var(--ink); font-size: 0.85rem; font-weight: 800; display: inline-flex; align-items: center; justify-content: center; }
  .quiz__opts { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-2); }
  .quiz__page { display: flex; flex-direction: column; gap: clamp(var(--space-6), 3vw, var(--space-8)); }
  .quiz__page[hidden] { display: none; }
  .quiz__bar { height: 6px; border-radius: 99px; background: var(--line); overflow: hidden; margin: 2px 0 clamp(var(--space-6), 3vw, var(--space-8)); }
  .quiz__bar span { display: block; height: 100%; background: var(--brand-green); border-radius: 99px; transition: width 320ms var(--ease-out-quint); }
  .quiz__wiznav { margin-top: clamp(var(--space-6), 3.5vw, calc(var(--space-1) + var(--space-8))); display: flex; align-items: center; gap: var(--space-3); flex-wrap: wrap; }
  .quiz__navbtn { order: 1; background: none; border: 1px solid var(--line-strong); border-radius: 99px; padding: var(--space-2) var(--space-4); min-height: 46px; cursor: pointer; font-family: 'Onest', sans-serif; font-weight: 600; font-size: 0.95rem; color: var(--ink-2); }
  .quiz__navbtn:hover { border-color: var(--brand-green); color: var(--brand-green-deep); }
  .quiz__navbtn:focus-visible { outline: 2px solid var(--brand-green); outline-offset: 2px; }
  .quiz__progress { order: 2; margin-left: auto; font-family: 'Onest', sans-serif; font-weight: 600; font-size: 0.9rem; color: var(--ink-3); }
  .quiz__navnext { order: 3; }
  .btn[hidden] { display: none; }
  .quiz__opt { position: relative; }
  .quiz__opt input { position: absolute; opacity: 0; inset: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
  .quiz__opt span { display: flex; align-items: center; justify-content: center; min-height: 54px; padding: var(--space-2) var(--space-1); border: 1px solid var(--line-strong); border-radius: 12px; font-weight: 600; font-size: 0.9rem; line-height: 1.15; color: var(--ink-2); text-align: center; transition: border-color 180ms var(--ease-out-quint), background 180ms var(--ease-out-quint), color 180ms var(--ease-out-quint); }
  .quiz__opt input:hover + span { border-color: var(--ink-3); }
  .quiz__opt input:checked + span { border-color: var(--brand-green-deep); background: var(--brand-green-soft); color: var(--ink); }
  .quiz__opt input:focus-visible + span { outline: 2px solid var(--brand-green-deep); outline-offset: 2px; }
  .quiz__foot { margin-top: clamp(var(--space-8), 4vw, calc(var(--space-2) + var(--space-8))); display: flex; flex-wrap: wrap; gap: var(--space-4); align-items: center; }
  .quiz__err { font-size: 0.92rem; color: #c0392b; margin: 0; }
  .quiz__score { font-family: 'Onest', sans-serif; font-weight: 600; font-size: 0.9rem; letter-spacing: 0.06em; text-transform: uppercase; color: var(--ink-3); margin: 0 0 var(--space-stack-1); }
  .quiz__score span { font-size: 1.4rem; font-weight: 800; color: var(--brand-green-deep); }
  .quiz__verdict { font-size: clamp(1.6rem, 2vw + 1rem, 2.6rem); letter-spacing: -0.025em; line-height: 1.05; margin: 0 0 var(--space-stack-1); }
  .quiz__verdict-sub { color: var(--ink-2); font-size: clamp(1.02rem, 0.4vw + 0.95rem, 1.18rem); max-width: 54ch; margin: 0 0 var(--space-stack-3); }
  .quiz__capture { border-top: 1px solid var(--line); padding-top: var(--space-stack-3); display: flex; flex-direction: column; gap: var(--space-3); }
  .quiz__capture[hidden] { display: none; }
  /* Чат-помощник (правило-базиран, без бекенд) */
  .chatbot { position: fixed; right: var(--space-6); bottom: var(--space-6); z-index: 40; display: flex; flex-direction: column; align-items: flex-end; gap: var(--space-3); }
  .chatbot__launcher { width: 56px; height: 56px; border-radius: 999px; border: none; background: var(--brand-green); color: var(--ink); box-shadow: var(--shadow-soft); cursor: pointer; display: inline-flex; align-items: center; justify-content: center; transition: transform 200ms var(--ease-out-quint); }
  .chatbot__launcher:hover { transform: translateY(-2px); }
  .chatbot__launcher:focus-visible { outline: 2px solid var(--brand-green-deep); outline-offset: 3px; }
  .chatbot__panel { width: min(320px, calc(100vw - 2 * var(--space-4))); background: var(--bg-elev); border: 1px solid var(--line); border-radius: var(--radius-lg); box-shadow: var(--shadow-soft); padding: var(--space-inset-lg); position: relative; }
  .chatbot__panel[hidden] { display: none; }
  .chatbot__close { position: absolute; top: var(--space-3); right: var(--space-3); width: 32px; height: 32px; border: none; background: transparent; color: var(--ink-3); border-radius: 999px; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; }
  .chatbot__close:hover { background: var(--bg-1); color: var(--ink); }
  .chatbot__title { font-family: 'Onest', sans-serif; font-weight: 700; font-size: 1.05rem; line-height: 1.3; margin: 0 var(--space-8) var(--space-4) 0; }
  .chatbot__opts { display: flex; flex-direction: column; gap: var(--space-2); }
  .chatbot__opt { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); padding: var(--space-3) var(--space-4); border: 1px solid var(--line); border-radius: var(--radius); background: var(--bg); color: var(--ink); text-decoration: none; font-weight: 600; font-size: 0.95rem; transition: border-color 120ms var(--ease-out-quint), background 120ms var(--ease-out-quint); }
  .chatbot__opt:hover { border-color: var(--brand-green-deep); background: var(--brand-green-soft, #eef8ee); }
  .chatbot__opt-arrow { color: var(--brand-green-deep); }
  @media (max-width: 860px) { .chatbot { bottom: calc(64px + var(--space-3)); right: var(--space-4); } }
  .quiz__capture-title { font-family: 'Onest', sans-serif; font-weight: 700; font-size: 1.08rem; margin: 0; }
  .quiz__capture-row { display: flex; gap: var(--space-3); flex-wrap: wrap; }
  .quiz__capture-row input { flex: 1; min-width: 200px; font-family: 'Manrope', sans-serif; font-size: 1rem; padding: var(--space-3) var(--space-3); border: 1px solid var(--line-strong); border-radius: 10px; background: var(--bg); color: var(--ink); min-height: 48px; }
  .quiz__capture-row input:focus-visible { outline: none; border-color: var(--brand-green-deep); box-shadow: 0 0 0 3px oklch(0.55 0.22 140 / 0.18); }
  .quiz__capture-row .btn { flex-shrink: 0; }
  .quiz__consent { display: flex; align-items: flex-start; gap: var(--space-2); font-size: 0.86rem; color: var(--ink-2); line-height: 1.45; cursor: pointer; }
  .quiz__consent input { width: 20px; height: 20px; flex-shrink: 0; margin-top: 1px; accent-color: var(--brand-green-deep); }
  .quiz__capture-status { font-size: 0.92rem; margin: 0; min-height: 1.1em; }
  .quiz__capture-status.is-error { color: #c0392b; }
  .quiz__capture-status.is-ok { color: var(--brand-green-deep); font-weight: 600; }
  .quiz__capture.is-sent .quiz__field,
  .quiz__capture.is-sent .quiz__consent,
  .quiz__capture.is-sent .quiz__capture-title,
  .quiz__capture.is-sent button { display: none; }
  .quiz__rec { margin: 0 0 var(--space-stack-3); padding: var(--space-4) var(--space-4); border-radius: 12px; background: var(--bg); border: 1px solid var(--line); color: var(--ink-2); font-size: 0.98rem; line-height: 1.55; }
  .quiz__rec[hidden] { display: none; }
  .quiz__band-cta { margin: var(--space-stack-3) 0 0; }
  .quiz__code { margin: var(--space-stack-3) 0 0; padding: var(--space-6) var(--space-6); border-radius: 14px; background: var(--brand-green-soft, #eef8ee); border: 1px solid var(--brand-green-deep, #2a7d2f); text-align: center; }
  .quiz__code[hidden] { display: none; }
  .quiz__code-label { font-family: 'Onest', sans-serif; font-weight: 700; font-size: 0.8rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ink-3); margin: 0 0 var(--space-stack-1); }
  .quiz__code-val { font-family: 'Onest', sans-serif; font-weight: 800; font-size: clamp(1.6rem, 1vw + 1.3rem, 2.2rem); letter-spacing: 0.12em; color: var(--brand-green-deep, #2a7d2f); margin: 0 0 var(--space-stack-1); }
  .quiz__code-help { color: var(--ink-2); font-size: 0.9rem; line-height: 1.5; margin: 0; }
  .quiz__offer { margin: var(--space-stack-3) 0 0; padding: var(--space-6) var(--space-6); border-radius: 14px; background: var(--bg-deep, #1e2024); color: #fff; display: flex; flex-direction: column; gap: var(--space-stack-1); align-items: flex-start; }
  .quiz__offer[hidden] { display: none; }
  .quiz__offer-h { font-family: 'Onest', sans-serif; font-weight: 800; font-size: 1.16rem; margin: 0; color: #fff; }
  .quiz__offer-b { margin: 0; font-size: 0.96rem; line-height: 1.55; color: rgba(255, 255, 255, 0.9); }

  /* ═══════ Core-30 service pages ═══════ */
  .svc-hero { padding: clamp(calc(var(--space-6) + var(--space-24)), 17vh, calc(var(--space-16) + var(--space-32))) 0 clamp(calc(var(--space-3) + var(--space-8)), 6vh, calc(var(--space-4) + var(--space-16))); }
  .svc-eyebrow { font-family: 'Onest', sans-serif; font-weight: 700; font-size: clamp(1.12rem, 1vw + 1rem, 1.5rem); color: var(--ink-2); max-width: 56ch; margin: var(--space-3) 0 0; line-height: 1.28; }
  .svc-hero h1 { max-width: 17ch; margin-top: var(--space-3); }
  .svc-hero h1 .accent { color: var(--brand-green-deep); }
  .svc-lead { margin-top: var(--space-6); max-width: 75ch; color: var(--ink-2); font-size: clamp(1.06rem, 0.5vw + 1rem, 1.26rem); line-height: 1.55; }
  .svc-cta { margin-top: var(--space-8); display: flex; flex-wrap: wrap; gap: var(--space-4); align-items: center; }
  .svc { padding: clamp(var(--space-16), 9vh, calc(var(--space-32) - var(--space-3))) 0; }
  .svc--alt { background: var(--bg-1); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
  .svc__head { max-width: none; }
  .svc__head h2 { font-size: clamp(1.5rem, 1.6vw + 1rem, 2.4rem); letter-spacing: -0.025em; line-height: 1.12; }
  .svc__head .lead { margin-top: var(--space-3); max-width: 62ch; }
  .svc-grid { display: grid; grid-template-columns: 1fr; gap: var(--space-4); margin-top: clamp(var(--space-8), 4vw, calc(var(--space-3) + var(--space-8))); }
  @media (min-width: 720px) { .svc-grid { grid-template-columns: repeat(2, 1fr); } }
  .svc-card { background: var(--bg-elev); border: 1px solid var(--line); border-radius: var(--radius-lg); padding: clamp(var(--space-6), 2.6vw, var(--space-8)); box-shadow: var(--shadow-soft); }
  .svc-card h3 { font-family: 'Onest', sans-serif; font-weight: 700; font-size: 1.14rem; letter-spacing: -0.01em; margin: 0 0 var(--space-2); }
  .svc-card p { color: var(--ink-2); line-height: 1.55; font-size: 0.98rem; }
  .svc-card summary + p { margin-top: var(--space-2); }
  .svc-list { list-style: none; margin: var(--space-6) 0 0; padding: 0; display: grid; gap: var(--space-3); max-width: 60ch; }
  .svc-list li { padding-left: var(--space-8); position: relative; color: var(--ink-2); line-height: 1.5; }
  .svc-list li::before { content: "✓"; position: absolute; left: 0; top: -1px; width: 20px; height: 20px; color: var(--brand-green-deep); font-weight: 800; }
  .svc-price { display: flex; flex-wrap: wrap; gap: var(--space-4); margin-top: clamp(var(--space-6), 3vw, calc(var(--space-1) + var(--space-8))); }
  .svc-price__card { flex: 1 1 220px; background: var(--bg-elev); border: 1px solid var(--line); border-radius: var(--radius-lg); padding: var(--space-inset-lg); box-shadow: var(--shadow-soft); }
  .svc-price__card strong { display: block; font-family: 'Onest', sans-serif; font-size: 1.5rem; font-weight: 800; letter-spacing: -0.02em; }
  .svc-price__card span { color: var(--ink-3); font-size: 0.9rem; }
  .svc-note { color: var(--ink-3); font-size: 0.88rem; margin-top: var(--space-3); }
  .svc-links { margin-top: clamp(var(--space-6), 3vw, calc(var(--space-1) + var(--space-8))); font-size: 1.02rem; line-height: 1.7; color: var(--ink-2); max-width: 62ch; }
  .svc-links a { color: var(--brand-green-deep); text-decoration: underline; text-underline-offset: 3px; }