/* =========================================================
   LINCKO webfunnel — styles.css
   Brand Kit v2 · April 2026
   One font (Inter). One background (white).
   Sections delineated by typography, not color blocks.
   ========================================================= */

 /* ---------- 1. Tokens ---------- */
 :root {
   color-scheme: light;

   /* Base */
   --paper: #FFFFFF;
   --mist: #F5F5F5;
   --ink: #0A0A0A;
   --graphite: #18181B;

   /* Derived neutrals */
   --ink-80: rgba(10, 10, 10, 0.80);
   --ink-60: rgba(10, 10, 10, 0.62);
   --ink-40: rgba(10, 10, 10, 0.38);
   --ink-15: rgba(10, 10, 10, 0.12);
   --ink-08: rgba(10, 10, 10, 0.06);

   /* Accents */
   --emerald: #0B6E3D;
   --emerald-700: #0E7F46;
   --emerald-900: #074427;
   --gold: #C8922E;
   --rust: #9A2E1A;

   /* Always-white text for use on accent (emerald/gold/rust) backgrounds.
      Does not flip in dark mode. */
   --on-accent: #FFFFFF;

   /* Frosted glass surfaces (nav, modals) — flips in dark mode. */
   --glass-bg: rgba(255, 255, 255, 0.82);
   --glass-highlight: rgba(255, 255, 255, 0.6);

   /* Type */
   --sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

   /* Spacing (8pt baseline) */
   --space-1: 0.25rem;
   --space-2: 0.5rem;
   --space-3: 0.75rem;
   --space-4: 1rem;
   --space-5: 1.5rem;
   --space-6: 2rem;
   --space-7: 3rem;
   --space-8: 4rem;
   --space-9: 6rem;
   --space-10: 8rem;

   /* Radii */
   --r-sm: 6px;
   --r-md: 12px;
   --r-lg: 20px;
   --r-pill: 999px;

   /* Shadows */
   --shadow-soft: 0 2px 16px rgba(0, 0, 0, 0.04), 0 20px 60px rgba(0, 0, 0, 0.06);
   --shadow-lift: 0 4px 24px rgba(0, 0, 0, 0.06), 0 32px 80px rgba(0, 0, 0, 0.10);

   /* Motion */
   --ease-out: cubic-bezier(0.2, 0.8, 0.2, 1);
   --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);

   /* Layout */
   --max-w: 1400px;
   --max-w-prose: 800px;
   --max-w-narrow: 1040px;
 }

 /* ---------- 2. Reset ---------- */
 *,
 *::before,
 *::after {
   box-sizing: border-box;
   font-style: normal;
 }

 html,
 body {
   margin: 0;
   padding: 0;
 }

 html {
   -webkit-text-size-adjust: 100%;
   scroll-behavior: smooth;
   overflow-x: clip;
 }

 body {
   overflow-x: clip;
   position: relative;
 }

 /* Wrap wide tables in this so they scroll horizontally inside their container instead of pushing the page wider than the viewport */
 .table-scroll {
   width: 100%;
   max-width: 100%;
   overflow-x: auto;
   -webkit-overflow-scrolling: touch;
 }

 img,
 svg,
 video {
   max-width: 100%;
   display: block;
 }

 button {
   font: inherit;
   color: inherit;
   background: none;
   border: 0;
   cursor: pointer;
 }

 a {
   color: inherit;
   text-decoration: none;
 }

 input,
 select,
 textarea {
   font: inherit;
   color: inherit;
 }

 ul,
 ol {
   margin: 0;
   padding: 0;
   list-style: none;
 }

 p {
   margin: 0;
 }

 ::selection {
   background: var(--emerald);
   color: var(--on-accent);
 }

 /* ---------- 3. Base type ---------- */
 body {
   font-family: var(--sans);
   font-size: 19px;
   line-height: 1.65;
   letter-spacing: -0.005em;
   color: var(--ink);
   background: var(--paper);
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   text-rendering: optimizeLegibility;
 }

 h1,
 h2,
 h3,
 h4,
 h5 {
   font-family: var(--sans);
   color: var(--ink);
   margin: 0;
 }

 .h-display {
   font-size: clamp(2.25rem, 4.4vw, 3.5rem);
   font-weight: 700;
   line-height: 1.05;
   letter-spacing: -0.035em;
 }

 .br--desktop { display: none; }
 .br--mobile { display: inline; }
 @media (min-width: 860px) {
   .br--desktop { display: inline; }
   .br--mobile { display: none; }
 }

 .h-section {
   font-size: clamp(2.25rem, 4.4vw, 3.5rem);
   font-weight: 700;
   line-height: 1.05;
   letter-spacing: -0.035em;
 }

 /* Extra-large H2 — used where the section headline needs to dominate. */
 .h-section.h-section--xl {
   font-size: clamp(3.5rem, 7.5vw, 6.5rem);
   line-height: 1.02;
   letter-spacing: -0.045em;
 }

 .h-sub {
   font-size: clamp(1.75rem, 2.8vw, 2.5rem);
   font-weight: 600;
   line-height: 1.15;
   letter-spacing: -0.02em;
 }

 .eyebrow {
   display: inline-block;
   font-size: 18px;
   font-weight: 500;
   letter-spacing: 0.22em;
   text-transform: uppercase;
   color: var(--emerald);
 }

 .lead {
   font-size: clamp(1.375rem, 1.8vw, 1.625rem);
   line-height: 1.5;
   color: var(--ink-80);
   font-weight: 400;
   letter-spacing: -0.005em;
 }

 em,
 .emph {
   font-weight: 600;
   color: var(--emerald);
 }

 strong {
   font-weight: 600;
   color: var(--ink);
 }

 /* ---------- 4. Layout ---------- */
 .wrap {
   width: 100%;
   max-width: var(--max-w);
   margin: 0 auto;
   padding-left: clamp(1.25rem, 3vw, 2.5rem);
   padding-right: clamp(1.25rem, 3vw, 2.5rem);
 }

 .wrap-narrow {
   max-width: var(--max-w-narrow);
   margin: 0 auto;
   padding-left: clamp(1.25rem, 3vw, 2.5rem);
   padding-right: clamp(1.25rem, 3vw, 2.5rem);
 }

 section {
   padding-block: clamp(5rem, 11vw, 9rem);
   background: var(--paper);
 }

 .section-head {
   display: flex;
   flex-direction: column;
   gap: var(--space-4);
   margin-bottom: var(--space-8);
 }

 .section-head::before {
   content: "";
   display: block;
   width: 56px;
   height: 1px;
   background: var(--gold);
   margin-bottom: var(--space-2);
 }

 .section-head.is-centered,
 .section-head[style*="text-align: center"],
 .section-head[style*="text-align:center"] {
   align-items: center;
   text-align: center;
   margin-inline: auto;
 }

 .section-head.is-centered::before,
 .section-head[style*="text-align: center"]::before,
 .section-head[style*="text-align:center"]::before {
   margin-inline: auto;
 }

 /* ---------- 5. Nav ---------- */
 .nav {
   position: fixed;
   top: clamp(0.75rem, 2vw, 1.25rem);
   left: 0;
   right: 0;
   z-index: 60;
   display: flex;
   justify-content: center;
   pointer-events: none;
 }

 .nav-inner {
   pointer-events: auto;
   display: flex;
   align-items: center;
   gap: clamp(0.5rem, 1.5vw, 1.25rem);
   padding: 8px 10px 8px 18px;
   background: var(--glass-bg);
   backdrop-filter: saturate(180%) blur(16px);
   -webkit-backdrop-filter: saturate(180%) blur(16px);
   border: 1px solid var(--ink-08);
   border-radius: var(--r-pill);
   box-shadow: 0 1px 0 var(--glass-highlight) inset, 0 10px 30px rgba(0, 0, 0, 0.05);
 }

 .nav-brand {
   display: inline-flex;
   align-items: center;
   gap: 8px;
   padding-right: clamp(0.5rem, 1vw, 0.75rem);
   border-right: 1px solid var(--ink-08);
 }

 .nav-brand-img {
   display: block;
   width: 26px;
   height: 26px;
   object-fit: contain;
 }

 .nav-brand-word {
   font-size: 19px;
   font-weight: 600;
   letter-spacing: -0.02em;
   color: var(--ink);
 }

 .nav-links {
   display: none;
   align-items: center;
   gap: clamp(0.5rem, 1.2vw, 0.875rem);
   font-size: 18px;
   color: var(--ink-80);
 }

 .nav-links a {
   padding: 8px 12px;
   border-radius: var(--r-pill);
   transition: background 200ms var(--ease-out), color 200ms var(--ease-out);
 }

 .nav-links a:hover {
   background: var(--ink-08);
   color: var(--ink);
 }

 @media (min-width: 860px) {
   .nav-links {
     display: flex;
   }
 }

 /* Mobile nav menu — tapping the brand on small viewports opens this stacked menu */
 @media (max-width: 859px) {
   .nav.is-nav-open .nav-inner {
     flex-direction: column;
     align-items: stretch;
     border-radius: var(--r-lg);
     padding: 12px 14px 14px;
     gap: 0;
   }

   .nav.is-nav-open .nav-brand {
     border-right: 0;
     padding-right: 0;
     padding-bottom: 10px;
     border-bottom: 1px solid var(--ink-08);
     align-self: flex-start;
   }

   .nav.is-nav-open .nav-links {
     display: flex;
     flex-direction: column;
     align-items: stretch;
     gap: 2px;
     width: 100%;
     padding-top: 10px;
     font-size: 18px;
   }

   .nav.is-nav-open .nav-links a {
     display: block;
     padding: 12px 14px;
     border-radius: var(--r-md);
   }
 }

 /* ---------- 6. Buttons ---------- */
 .btn {
   display: inline-flex;
   align-items: center;
   justify-content: center;
   gap: 10px;
   height: 54px;
   padding: 0 clamp(1.25rem, 2.2vw, 1.75rem);
   border-radius: var(--r-pill);
   font-family: var(--sans);
   font-weight: 500;
   font-size: 18px;
   letter-spacing: -0.005em;
   white-space: nowrap;
   transition: transform 220ms var(--ease-out), background 220ms var(--ease-out), box-shadow 220ms var(--ease-out), color 220ms var(--ease-out), border 220ms var(--ease-out);
   cursor: pointer;
   user-select: none;
 }

 .btn-primary {
   background: var(--emerald);
   color: var(--on-accent);
   box-shadow: 0 1px 0 rgba(255, 255, 255, 0.12) inset, 0 6px 20px rgba(11, 110, 61, 0.22);
 }

 .btn-primary:hover {
   background: var(--emerald-700);
   transform: translateY(-1px);
   box-shadow: 0 1px 0 rgba(255, 255, 255, 0.15) inset, 0 10px 28px rgba(11, 110, 61, 0.30);
 }

 .btn-primary:active {
   transform: translateY(0);
 }

 .btn-ghost {
   background: var(--paper);
   color: var(--ink);
   border: 1px solid var(--ink-15);
 }

 .btn-ghost:hover {
   border-color: var(--ink);
   background: var(--ink-08);
 }

 .btn-quiet {
   background: transparent;
   color: var(--ink-60);
   padding: 0;
   height: auto;
   font-size: 18px;
   text-decoration: underline;
   text-underline-offset: 4px;
   text-decoration-color: var(--ink-15);
   border-radius: 0;
 }

 .btn-quiet:hover {
   color: var(--emerald);
   text-decoration-color: var(--emerald);
 }

 .btn-arrow::after {
   content: "→";
   font-family: var(--sans);
   font-weight: 500;
   transition: transform 220ms var(--ease-out);
   margin-left: 2px;
 }

 .btn-arrow:hover::after {
   transform: translateX(4px);
 }

 .section-cta {
   text-align: center;
   margin-top: clamp(2rem, 4vw, 3rem);
   padding-bottom: var(--space-2);
 }

 .btn-hero-lg {
   height: 60px;
   padding: 0 clamp(1.75rem, 3vw, 2.5rem);
   font-size: 18px;
   font-weight: 600;
 }

 /* ---------- 7. Hero ---------- */
 .hero {
   position: relative;
   padding-top: clamp(7rem, 9vw, 8rem);
   padding-bottom: clamp(1.25rem, 2.5vw, 2rem);
   isolation: isolate;
   background: var(--paper);
 }

 .hero-content {
   position: relative;
   display: grid;
   grid-template-columns: 1fr;
   gap: var(--space-8);
   align-items: center;
 }

 .hero-head {
   text-align: center;
   margin: 0 auto;
 }

 .hero-callout {
   display: inline-flex;
   align-items: center;
   gap: 8px;
   font-size: 14px;
   font-weight: 500;
   letter-spacing: 0.22em;
   text-transform: uppercase;
   color: var(--ink);
   background: var(--paper);
   border: 1px solid var(--ink-15);
   padding: 6px 12px;
   border-radius: var(--r-pill);
   margin-bottom: clamp(0.75rem, 1.5vw, 1.25rem);
 }

 .hero-callout-dot {
   width: 6px;
   height: 6px;
   border-radius: 50%;
   background: var(--gold);
   display: inline-block;
 }

 .hero h1 .alt {
   color: var(--emerald);
 }

 .hero-sub {
   margin: clamp(0.75rem, 1.5vw, 1.25rem) auto 0;
   max-width: 640px;
   font-size: clamp(1.25rem, 1.8vw, 1.625rem);
   line-height: 1.4;
   color: var(--ink-80);
 }

 .hero-cta-row {
   margin-top: clamp(1rem, 2vw, 1.5rem);
   display: flex;
   gap: 12px;
   justify-content: center;
   flex-wrap: wrap;
   align-items: center;
 }

 .vsl.vsl--hero {
   margin: clamp(0.75rem, 1.5vw, 1.25rem) auto 0;
   max-width: 700px;
 }

 /* ---------- 8. Video placeholder (.vsl, .testi-thumb, .bo-thumb) ---------- */
 .vsl {
   margin: clamp(2.5rem, 5vw, 4rem) auto 0;
   max-width: 980px;
   width: 100%;
   justify-self: center;
   aspect-ratio: 16 / 9;
   border-radius: var(--r-lg);
   overflow: hidden;
   position: relative;
   background: linear-gradient(135deg, var(--graphite) 0%, var(--ink) 100%);
   box-shadow: var(--shadow-lift);
   border: 1px solid var(--ink-08);
   cursor: pointer;
 }

 .vsl::before {
   content: "";
   position: absolute;
   inset: 0;
   background:
     radial-gradient(60% 80% at 75% 75%, rgba(200, 146, 46, 0.10), transparent 70%);
   pointer-events: none;
 }

 /* When .vsl wraps a real Wistia embed, drop the placeholder treatments */
 .vsl:has(wistia-player) {
   background: transparent;
   cursor: default;
   aspect-ratio: auto;
 }
 .vsl:has(wistia-player)::before { display: none; }
 .vsl wistia-player { display: block; width: 100%; }

 .vsl-play {
   position: absolute;
   inset: 0;
   display: flex;
   align-items: center;
   justify-content: center;
   color: var(--on-accent);
   flex-direction: column;
   gap: 14px;
 }

 .vsl-play-button {
   width: 88px;
   height: 88px;
   border-radius: 50%;
   background: var(--paper);
   color: var(--ink);
   display: grid;
   place-items: center;
   transition: transform 220ms var(--ease-out);
   box-shadow: 0 20px 60px rgba(0, 0, 0, 0.35);
 }

 .vsl-play-button svg {
   width: 28px;
   height: 28px;
   margin-left: 4px;
 }

 .vsl:hover .vsl-play-button {
   transform: scale(1.06);
 }

 .vsl-label {
   font-size: 18px;
   font-weight: 400;
   color: rgba(255, 255, 255, 0.9);
   letter-spacing: -0.005em;
 }

 .vsl-caption {
   position: absolute;
   left: 16px;
   bottom: 16px;
   color: var(--on-accent);
   font-size: 18px;
   font-weight: 500;
   letter-spacing: 0.22em;
   text-transform: uppercase;
   background: rgba(0, 0, 0, 0.4);
   padding: 6px 10px;
   border-radius: var(--r-pill);
   backdrop-filter: blur(8px);
 }

 /* ---------- 9. Form ---------- */
 .form-shell {
   margin: clamp(2rem, 4vw, 3rem) auto 0;
   max-width: 720px;
   background: var(--paper);
   border: 1px solid var(--ink-15);
   border-radius: var(--r-lg);
   padding: clamp(1.5rem, 3.2vw, 2.5rem);
   box-shadow: var(--shadow-soft);
 }

 .form-header {
   display: flex;
   flex-direction: column;
   align-items: center;
   text-align: center;
   gap: 10px;
   margin-bottom: var(--space-6);
 }

 .form-eyebrow {
   font-size: 18px;
   font-weight: 500;
   letter-spacing: 0.22em;
   text-transform: uppercase;
   color: var(--emerald);
 }

 .form-title {
   font-size: clamp(1.5rem, 2.6vw, 2rem);
   font-weight: 700;
   line-height: 1.1;
   letter-spacing: -0.03em;
   color: var(--ink);
 }

 .form-sub {
   color: var(--ink-60);
   font-size: 18px;
 }

 .form-progress {
   display: flex;
   align-items: center;
   gap: 10px;
   margin-bottom: var(--space-6);
   font-size: 18px;
   font-weight: 500;
   letter-spacing: 0.18em;
   text-transform: uppercase;
   color: var(--ink-60);
 }

 .form-progress-bar {
   flex: 1;
   height: 2px;
   background: var(--ink-15);
   border-radius: 2px;
   overflow: hidden;
 }

 .form-progress-fill {
   height: 100%;
   width: 20%;
   background: var(--emerald);
   border-radius: 2px;
   transition: width 360ms var(--ease-out);
 }

 .form-step {
   display: none;
   animation: step-in 360ms var(--ease-out);
 }

 .form-step.is-active {
   display: block;
 }

 @keyframes step-in {
   from {
     opacity: 0;
     transform: translateY(8px);
   }

   to {
     opacity: 1;
     transform: translateY(0);
   }
 }

 .form-question {
   font-size: clamp(1.25rem, 2vw, 1.5rem);
   font-weight: 600;
   line-height: 1.2;
   letter-spacing: -0.02em;
   color: var(--ink);
   margin-bottom: var(--space-5);
   text-align: center;
 }

 .form-options {
   display: grid;
   grid-template-columns: 1fr;
   gap: 10px;
 }

 @media (min-width: 560px) {
   .form-options--2col {
     grid-template-columns: 1fr 1fr;
   }
 }

 .form-option {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 12px;
   padding: 16px 20px;
   border: 1px solid var(--ink-15);
   background: var(--paper);
   border-radius: var(--r-md);
   cursor: pointer;
   transition: all 200ms var(--ease-out);
   font-size: 18px;
   color: var(--ink);
   text-align: left;
   min-height: 56px;
 }

 .form-option:hover {
   border-color: var(--emerald);
   background: var(--ink-08);
 }

 .form-option.is-selected {
   border-color: var(--emerald);
   background: rgba(11, 110, 61, 0.06);
 }

 .form-option::after {
   content: "→";
   opacity: 0.3;
   transition: opacity 200ms, transform 200ms;
 }

 .form-option:hover::after {
   opacity: 1;
   transform: translateX(3px);
   color: var(--emerald);
 }

 .input-group {
   display: flex;
   flex-direction: column;
   gap: 6px;
   margin-bottom: 14px;
 }

 .input-label {
   font-size: 18px;
   font-weight: 500;
   letter-spacing: 0.18em;
   text-transform: uppercase;
   color: var(--ink-60);
 }

 .input-field {
   height: 52px;
   padding: 0 16px;
   border: 1px solid var(--ink-15);
   border-radius: var(--r-md);
   background: var(--paper);
   font-size: 18px;
   transition: border 200ms var(--ease-out), box-shadow 200ms var(--ease-out);
   outline: none;
   color: var(--ink);
 }

 .input-field:focus {
   border-color: var(--emerald);
   box-shadow: 0 0 0 3px rgba(11, 110, 61, 0.12);
 }

 .input-row {
   display: grid;
   grid-template-columns: 1fr;
   gap: 14px;
 }

 @media (min-width: 560px) {
   .input-row--2 {
     grid-template-columns: 1fr 1fr;
   }
 }

 .form-foot {
   margin-top: var(--space-5);
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 10px;
 }

 .form-back {
   font-size: 18px;
   color: var(--ink-60);
   text-decoration: underline;
   text-underline-offset: 4px;
   text-decoration-color: var(--ink-15);
   transition: color 200ms;
 }

 .form-back:hover {
   color: var(--emerald);
 }

 .form-back.is-hidden {
   visibility: hidden;
 }

 /* ---------- 10. Lebanon — prospect credibility block ---------- */
 .prospect-cred {
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
   gap: var(--space-5);
   width: 100%;
   max-width: none;
   margin: clamp(1.5rem, 3vw, 2.5rem) auto 0;
   text-align: center;
 }

 .bio-photo {
   flex: 0 0 518px;
   width: 518px;
   height: auto;
   border-radius: var(--r-md);
   overflow: hidden;
 }

 /* Square variant — bio screenshot, show full image without cropping */
 img.bio-photo--square {
   border-radius: 0;
   object-fit: contain;
   border: none;
   height: auto;
 }

 .reactions .bio-photo {
   flex: 0 0 604px;
   width: 604px;
 }

 .bio-photos-stack {
   display: flex;
   flex-direction: row;
   justify-content: center;
   gap: var(--space-3);
   max-width: 1035px;
 }

 .bio-photos-stack img {
   width: 50%;
   height: auto;
   border-radius: 0;
 }

 .prospect-info {
   flex: 0 1 auto;
 }

 .prospect-name {
   font-size: clamp(1.75rem, 2.8vw, 2.375rem);
   font-weight: 700;
   letter-spacing: -0.02em;
   color: var(--ink);
   line-height: 1.15;
 }

 .prospect-role {
   display: flex;
   flex-wrap: wrap;
   align-items: center;
   justify-content: center;
   gap: 10px;
   margin-top: 10px;
   font-size: clamp(1.25rem, 2vw, 1.5rem);
   color: var(--ink-80);
   font-weight: 500;
 }

 .prospect-logo-sep {
   width: 1px;
   height: 28px;
   background: var(--ink-25);
   flex-shrink: 0;
 }

 .prospect-logos {
   display: flex;
   flex-direction: row;
   align-items: center;
   justify-content: center;
   gap: var(--space-5);
   margin-top: var(--space-4);
 }

 .prospect-logo-lg {
   display: block;
   height: 40px;
   width: auto;
   object-fit: contain;
 }

 .prospect-logo {
   display: inline-flex;
   align-items: center;
   gap: 8px;
 }

 .prospect-logo-img {
   display: block;
   width: 32px !important;
   height: 32px !important;
   max-width: 32px;
   max-height: 32px;
   object-fit: contain;
   flex: 0 0 32px;
 }

 .prospect-meta {
   margin-top: var(--space-3);
   font-size: 21px;
   line-height: 1.5;
   color: var(--ink-60);
 }

 .prospect-story {
   max-width: 800px;
   margin: var(--space-6) auto 0;
   text-align: left;
 }

 /* ---------- Logo marquee (companies we've booked meetings with) ---------- */
 .logo-marquee {
   padding-block: clamp(2.5rem, 5vw, 4rem);
   border-top: 1px solid var(--ink-08);
   border-bottom: 1px solid var(--ink-08);
   background: var(--paper);
 }

 .logo-marquee-title {
   font-size: 18px;
   font-weight: 400;
   line-height: 1.4;
   letter-spacing: 0.18em;
   text-transform: uppercase;
   color: var(--ink-60);
   text-align: center;
   margin: 0 0 clamp(1.5rem, 3vw, 2.25rem);
 }

 .logo-marquee-viewport {
   position: relative;
   overflow: hidden;
   width: 100%;
   /* Soft fade-in/out on the left and right edges so logos don't hard-clip */
   -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 8%, #000 92%, transparent 100%);
   mask-image: linear-gradient(90deg, transparent 0, #000 8%, #000 92%, transparent 100%);
 }

 .logo-marquee-track {
   display: flex;
   align-items: center;
   gap: clamp(2.5rem, 5vw, 4.5rem);
   width: max-content;
   animation: logo-marquee-scroll 60s linear infinite;
   will-change: transform;
 }

 .logo-marquee-item {
   display: block;
   height: 44px;
   width: auto;
   max-width: 180px;
   object-fit: contain;
   flex-shrink: 0;
   opacity: 0.85;
   transition: opacity 200ms var(--ease-out);
 }

 .logo-marquee-item:hover {
   opacity: 1;
 }

 @keyframes logo-marquee-scroll {
   from {
     transform: translateX(0);
   }
   to {
     /* The track contains two duplicated sets, so shifting by 50% loops seamlessly */
     transform: translateX(-50%);
   }
 }

 @media (prefers-reduced-motion: reduce) {
   .logo-marquee-track {
     animation: none;
   }
   .logo-marquee-viewport {
     overflow-x: auto;
   }
 }

 .prospect-story p {
   font-size: clamp(1.1875rem, 1.8vw, 1.375rem);
   line-height: 1.65;
   color: var(--ink-60);
 }

 .prospect-story p + p {
   margin-top: var(--space-4);
 }

 /* Placeholder asset visual (until real images arrive) */
 .placeholder-asset {
   display: inline-flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
   gap: 4px;
   background: repeating-linear-gradient(
     45deg,
     rgba(200, 146, 46, 0.08),
     rgba(200, 146, 46, 0.08) 8px,
     rgba(200, 146, 46, 0.16) 8px,
     rgba(200, 146, 46, 0.16) 16px
   );
   border: 1.5px dashed rgba(200, 146, 46, 0.55);
   color: rgba(200, 146, 46, 0.95);
   text-align: center;
 }

 .bio-photo.placeholder-asset {
   font-size: 18px;
   line-height: 1.3;
 }

 .prospect-logo.placeholder-asset {
   font-size: 18px;
   line-height: 1.2;
   font-weight: 600;
 }

 .placeholder-tag {
   font-size: 18px;
   font-weight: 700;
   letter-spacing: 0.18em;
   opacity: 0.85;
 }

 .placeholder-note {
   font-size: 18px;
   line-height: 1.3;
   opacity: 0.85;
 }

 .exhibit-headshot {
   width: 120px;
   height: 120px;
   border-radius: 50%;
   object-fit: cover;
   border: 2px solid var(--emerald);
   margin: var(--space-4) auto 0;
 }

 .exhibit-headshots {
   display: flex;
   justify-content: center;
   gap: var(--space-4);
   margin: var(--space-4) auto 0;
 }

 .exhibit-headshots .exhibit-headshot {
   margin: 0;
 }

 .prospect-divider {
   border: none;
   border-top: 1px solid var(--ink-15);
   max-width: 200px;
   margin: clamp(3.5rem, 7vw, 5rem) auto;
 }

 /* Andre Superloom video block */
 .andre-superloom {
   max-width: 880px;
   margin: clamp(2rem, 4vw, 3rem) auto 0;
   display: flex;
   flex-direction: column;
   align-items: center;
   gap: var(--space-3);
 }

 .superloom-tag {
   font-size: clamp(1.25rem, 2vw, 1.5rem);
   font-weight: 600;
   letter-spacing: 0.18em;
   text-transform: uppercase;
   color: var(--gold, #C8922E);
 }

 #reactions .andre-superloom {
   align-items: center;
 }
 #reactions .superloom-tag {
   text-align: center;
 }

 .superloom-frame {
   width: 100%;
   border-radius: var(--r-lg);
   overflow: hidden;
   border: 1px solid var(--ink-15);
   box-shadow: 0 16px 48px -16px rgba(0,0,0,0.35);
 }

 /* Stacked H2 (line-broken) variant — slightly tighter line-height */
 .h-section.h-section--stacked {
   line-height: 1.1;
 }

 /* ---------- 10. Lebanon flight diagram ---------- */
 .flight-diagram {
   display: grid;
   grid-template-columns: 1fr;
   gap: var(--space-5);
   max-width: 1040px;
   margin: clamp(2rem, 4vw, 3rem) auto 0;
   align-items: center;
 }

 @media (min-width: 860px) {
   .flight-diagram {
     grid-template-columns: 1fr 2fr 1fr;
     gap: var(--space-6);
   }
 }

 .flight-node {
   text-align: center;
   display: flex;
   flex-direction: column;
   gap: 8px;
   padding: clamp(1.25rem, 2.4vw, 1.75rem);
   background: var(--paper);
   border: 1px solid var(--ink-15);
   border-radius: var(--r-lg);
 }

 .flight-label {
   font-size: 18px;
   font-weight: 500;
   letter-spacing: 0.22em;
   text-transform: uppercase;
   color: var(--ink-40);
 }

 .flight-place {
   font-size: clamp(1.25rem, 1.8vw, 1.5rem);
   font-weight: 700;
   letter-spacing: -0.025em;
   color: var(--ink);
 }

 .flight-note {
   font-size: 18px;
   color: var(--ink-60);
   line-height: 1.45;
 }

 .flight-arc {
   min-height: 140px;
   position: relative;
 }

 .flight-arc svg {
   width: 100%;
   height: 100%;
   min-height: 140px;
   display: block;
 }

 /* Lebanon result */
 .lebanon-result {
   margin-top: clamp(2.5rem, 5vw, 3.5rem);
   max-width: 1040px;
   margin-inline: auto;
   display: grid;
   grid-template-columns: 1fr;
   gap: var(--space-5);
 }

 @media (min-width: 860px) {
   .lebanon-result {
     grid-template-columns: 1.3fr 1fr;
   }
 }

 .result-quote {
   position: relative;
   padding: clamp(1.75rem, 3vw, 2.25rem);
   background: var(--paper);
   color: var(--ink);
   border: 1px solid var(--ink-15);
   border-left: 3px solid var(--emerald);
   border-radius: var(--r-lg);
 }

 .quote-mark {
   font-size: 96px;
   font-weight: 700;
   line-height: 0.6;
   color: var(--gold);
   opacity: 0.65;
   display: block;
 }

 .result-quote p {
   margin-top: -12px;
   font-size: clamp(1.25rem, 2.2vw, 1.625rem);
   font-weight: 600;
   line-height: 1.25;
   letter-spacing: -0.02em;
   color: var(--ink);
 }

 .result-quote .attr {
   margin-top: var(--space-4);
   font-size: 18px;
   font-weight: 500;
   letter-spacing: 0.22em;
   text-transform: uppercase;
   color: var(--emerald);
 }

 .result-screenshot {
   max-width: 720px;
   margin: clamp(2rem, 4vw, 3rem) auto 0;
   padding: 0;
   border-radius: var(--r-lg);
   overflow: hidden;
   border: 1px solid var(--ink-15);
   background: var(--paper);
   box-shadow: 0 8px 32px -12px rgba(0,0,0,0.25);
 }

 .result-screenshot img {
   display: block;
   width: 100%;
   height: auto;
 }

 .result-screenshot figcaption {
   padding: 14px clamp(1rem, 2vw, 1.5rem);
   font-size: 18px;
   font-weight: 500;
   letter-spacing: 0.18em;
   text-transform: uppercase;
   color: var(--emerald);
   border-top: 1px solid var(--ink-15);
   text-align: center;
 }

 .result-stats {
   display: flex;
   flex-direction: column;
   gap: 12px;
 }

 .result-stat {
   display: flex;
   align-items: baseline;
   gap: 16px;
   padding: clamp(1rem, 2vw, 1.5rem);
   background: var(--paper);
   border: 1px solid var(--ink-15);
   border-radius: var(--r-md);
 }

 .result-stat .num {
   font-size: clamp(2.5rem, 3.6vw, 3.25rem);
   font-weight: 700;
   line-height: 1;
   letter-spacing: -0.035em;
   color: var(--emerald);
   min-width: 120px;
 }

 .result-stat .label {
   font-size: 18px;
   color: var(--ink-60);
   line-height: 1.4;
 }

 /* ---------- 11. Pitch (vs.) ---------- */
 .pitch-diagram {
   display: grid;
   grid-template-columns: 1fr;
   gap: var(--space-4);
   max-width: 1040px;
   margin: clamp(1.5rem, 3vw, 2.5rem) auto 0;
   align-items: stretch;
 }

 @media (min-width: 860px) {
   .pitch-diagram {
     grid-template-columns: 1fr 60px 1fr;
     gap: var(--space-5);
   }
 }

 .pitch-half {
   padding: clamp(1.5rem, 3vw, 2.25rem);
   border-radius: var(--r-lg);
   border: 1px solid var(--ink-15);
   background: var(--paper);
 }

 .pitch-half--yes {
   border-color: rgba(11, 110, 61, 0.35);
 }

 .pitch-tag {
   display: inline-block;
   font-size: 18px;
   font-weight: 500;
   letter-spacing: 0.22em;
   text-transform: uppercase;
   color: var(--ink-40);
   margin-bottom: var(--space-4);
 }

 .pitch-half--yes .pitch-tag {
   color: var(--emerald);
 }

 .pitch-half ul {
   display: flex;
   flex-direction: column;
   gap: 10px;
 }

 .pitch-half li {
   position: relative;
   padding-left: 34px;
   min-height: 22px;
   font-size: 18px;
   line-height: 1.5;
   color: var(--ink);
 }

 .pitch-half .x,
 .pitch-half .check {
   position: absolute;
   left: 0;
   top: calc((1.5em - 22px) / 2);
   width: 22px;
   height: 22px;
   border-radius: 50%;
   display: inline-grid;
   place-items: center;
   font-weight: 700;
   line-height: 1;
 }

 .pitch-half .x {
   background: rgba(154, 46, 26, 0.12);
   color: var(--rust);
   font-size: 18px;
   font-weight: 600;
 }

 .pitch-half .check {
   background: var(--emerald);
   color: var(--on-accent);
   font-size: 13px;
 }

 .pitch-divider {
   display: flex;
   align-items: center;
   justify-content: center;
   font-size: clamp(1.125rem, 1.4vw, 1.25rem);
   font-weight: 600;
   color: var(--gold);
 }

 /* Terms strip (investment / window / production) */
 .terms-strip {
   margin-top: clamp(2.5rem, 5vw, 3.5rem);
   display: grid;
   grid-template-columns: 1fr;
   gap: var(--space-5);
   max-width: 1040px;
   margin-inline: auto;
   padding: clamp(1.5rem, 3vw, 2rem);
   background: var(--paper);
   border: 1px solid var(--ink-15);
   border-radius: var(--r-lg);
 }

 @media (min-width: 860px) {
   .terms-strip {
     grid-template-columns: 1fr 1px 1fr;
     grid-template-rows: auto auto 1fr;
     gap: var(--space-4);
     align-items: start;
   }
   .terms-strip .term {
     display: grid;
     grid-template-rows: subgrid;
     grid-row: 1 / -1;
     gap: 6px;
   }
   .terms-strip .term-divider {
     grid-row: 1 / -1;
     height: 100%;
   }
 }

 .term {
   text-align: center;
   display: flex;
   flex-direction: column;
   gap: 6px;
 }

 .term-label {
   font-size: 18px;
   font-weight: 500;
   letter-spacing: 0.22em;
   text-transform: uppercase;
   color: var(--emerald);
 }

 .term-num {
   font-size: clamp(2rem, 3.4vw, 2.75rem);
   font-weight: 700;
   line-height: 1.05;
   letter-spacing: -0.03em;
   color: var(--ink);
   white-space: nowrap;
 }

 .term-note {
   font-size: 18px;
   color: var(--ink-60);
   line-height: 1.4;
 }

 .term-divider {
   width: 1px;
   height: 80%;
   background: var(--ink-15);
   justify-self: center;
   display: none;
 }

 @media (min-width: 860px) {
   .term-divider {
     display: block;
   }
 }

 /* ---------- 12. Playbook cards (Super Loom / Physical goods / Strategy doc) ---------- */
 .playbook-grid {
   margin-top: clamp(2rem, 4vw, 3rem);
   display: grid;
   grid-template-columns: 1fr;
   gap: clamp(1.25rem, 2.5vw, 2rem);
   max-width: 1100px;
   margin-inline: auto;
 }

 .pb-card {
   padding: clamp(2.25rem, 3.5vw, 3rem);
   background: var(--paper);
   border: 1px solid var(--ink-15);
   border-radius: var(--r-lg);
   display: flex;
   flex-direction: column;
   gap: var(--space-4);
   transition: border 300ms var(--ease-out), transform 300ms var(--ease-out), box-shadow 300ms var(--ease-out);
 }

 .pb-text {
   display: flex;
   flex-direction: column;
   gap: var(--space-4);
   min-width: 0;
 }

 @media (min-width: 860px) {
   .pb-card {
     display: grid;
     grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr);
     column-gap: clamp(2rem, 3.5vw, 3rem);
     align-items: center;
   }

   .pb-card > .pb-example {
     margin-top: 0;
     padding-top: 0;
     border-top: none;
   }
 }

 .pb-card:hover {
   border-color: var(--emerald);
   transform: translateY(-4px);
   box-shadow: var(--shadow-soft);
 }

 .pb-icon {
   width: 64px;
   height: 64px;
   color: var(--emerald);
 }

 .pb-num {
   font-size: 18px;
   font-weight: 500;
   letter-spacing: 0.22em;
   text-transform: uppercase;
   color: var(--emerald);
 }

 .pb-card h3 {
   font-size: clamp(1.625rem, 2.2vw, 2rem);
   font-weight: 700;
   color: var(--ink);
   letter-spacing: -0.025em;
 }

 .pb-card p {
   font-size: 18px;
   line-height: 1.65;
   color: var(--ink-60);
 }

 .pb-card em {
   color: var(--emerald);
 }

 .pb-example {
   margin-top: var(--space-5);
   padding-top: var(--space-5);
   border-top: 1px solid var(--ink-15);
   display: flex;
   flex-direction: column;
   gap: var(--space-4);
 }

 .pb-example-video {
   border-radius: var(--r-md);
   overflow: hidden;
 }

 .pb-example-result {
   display: flex;
   flex-direction: column;
   gap: 6px;
 }

 .pb-example-name {
   font-size: 18px;
   font-weight: 600;
   color: var(--ink);
 }

 .pb-example-stat {
   font-size: 18px;
   color: var(--emerald);
   font-weight: 600;
 }

 .pb-example-quote {
   font-size: 18px;
   font-style: italic;
   color: var(--ink-60);
 }

 .pb-mini {
   margin-top: auto;
   padding-top: var(--space-4);
   border-top: 1px solid var(--ink-15);
   display: flex;
   flex-direction: column;
   gap: 6px;
 }

 .pb-mini .mini-label {
   font-size: 18px;
   font-weight: 500;
   letter-spacing: 0.22em;
   text-transform: uppercase;
   color: var(--emerald);
 }

 .pb-mini .mini-quote {
   font-size: 18px;
   font-weight: 500;
   line-height: 1.4;
   color: var(--ink);
   letter-spacing: -0.005em;
 }

 /* ---------- 13. Funnel comparison (cold email vs Lincko) ---------- */
 .funnel-compare {
   margin: clamp(2rem, 4vw, 3rem) auto;
   max-width: 1040px;
   display: grid;
   grid-template-columns: 1fr;
   gap: var(--space-6);
   align-items: stretch;
 }

 @media (min-width: 860px) {
   .funnel-compare {
     grid-template-columns: 1fr 1fr;
     gap: var(--space-7);
   }
 }

 .funnel-col {
   display: flex;
   flex-direction: column;
   padding: clamp(1.5rem, 2.4vw, 2rem);
   background: var(--paper);
   border: 1px solid var(--ink-15);
   border-radius: var(--r-lg);
 }

 .funnel-col--us {
   border-color: rgba(11, 110, 61, 0.35);
   background: linear-gradient(180deg, rgba(11, 110, 61, 0.025), rgba(11, 110, 61, 0) 60%);
 }

 .funnel-tag {
   font-size: 18px;
   font-weight: 500;
   letter-spacing: 0.22em;
   text-transform: uppercase;
   color: var(--ink-40);
   margin-bottom: var(--space-5);
 }

 .funnel-tag--us {
   color: var(--emerald);
 }

 .funnel-flow {
   display: flex;
   flex-direction: column;
   align-items: center;
   flex-grow: 1;
 }

 .funnel-stage {
   padding: 14px 18px;
   background: var(--paper);
   border: 1px solid var(--ink-15);
   border-radius: var(--r-md);
   display: flex;
   align-items: baseline;
   justify-content: space-between;
   gap: 12px;
   width: 100%;
   box-sizing: border-box;
 }

 .funnel-stage--wide {
   width: 100%;
 }

 .funnel-stage--mid {
   width: 78%;
 }

 .funnel-stage--narrow {
   width: 54%;
 }

 .funnel-stage--full {
   width: 100%;
 }

 .funnel-col--us .funnel-stage {
   border-color: rgba(11, 110, 61, 0.22);
   background: var(--paper);
 }

 .f-num {
   font-size: clamp(1.625rem, 2.4vw, 2.125rem);
   font-weight: 700;
   line-height: 1;
   letter-spacing: -0.03em;
   color: var(--ink);
   white-space: nowrap;
 }

 .funnel-col--us .f-num {
   color: var(--emerald);
 }

 .f-label {
   font-size: 18px;
   color: var(--ink-60);
   line-height: 1.3;
   text-align: right;
 }

 .funnel-connector {
   width: 2px;
   height: 22px;
   position: relative;
   margin: 2px 0;
 }

 .funnel-connector::after {
   content: "";
   position: absolute;
   left: 50%;
   bottom: -1px;
   transform: translateX(-50%);
   width: 0;
   height: 0;
   border-left: 5px solid transparent;
   border-right: 5px solid transparent;
 }

 .funnel-connector--drop {
   background: linear-gradient(to bottom, rgba(154, 46, 26, 0.45), rgba(154, 46, 26, 0.15));
 }

 .funnel-connector--drop::after {
   border-top: 7px solid rgba(154, 46, 26, 0.55);
 }

 .funnel-connector--direct {
   background: var(--emerald);
 }

 .funnel-connector--direct::after {
   border-top: 7px solid var(--emerald);
 }

 .funnel-outcome {
   margin-top: var(--space-5);
   padding: 14px 16px;
   border-radius: var(--r-md);
   font-size: 18px;
   font-weight: 600;
   line-height: 1.4;
   text-align: center;
   color: var(--on-accent);
 }

 .funnel-outcome--bad {
   background: var(--rust);
 }

 .funnel-outcome--good {
   background: var(--emerald);
 }

 .broken-kicker {
   margin-top: clamp(2.5rem, 5vw, 3.5rem);
 }

 /* ---------- 14. Reciprocity loop ---------- */
 .loop {
   margin: clamp(2rem, 4vw, 3rem) auto 0;
   max-width: 1240px;
   display: grid;
   grid-template-columns: 1fr;
   gap: var(--space-4);
   align-items: stretch;
 }

 @media (min-width: 900px) {
   .loop {
     grid-template-columns: 1fr 28px 1fr 28px 1fr 28px 1fr;
     gap: var(--space-3);
   }
 }

 .loop-node {
   padding: clamp(1.25rem, 2.2vw, 1.75rem);
   background: var(--paper);
   border: 1px solid var(--ink-15);
   border-radius: var(--r-lg);
   display: flex;
   flex-direction: column;
   gap: 10px;
   min-height: 220px;
 }

 .loop-node--end {
   border: 2px solid var(--gold);
 }

 .loop-num {
   font-size: clamp(1.875rem, 2.6vw, 2.375rem);
   font-weight: 700;
   line-height: 1;
   letter-spacing: -0.03em;
   color: var(--gold);
 }

 .loop-node h4 {
   font-size: clamp(1.125rem, 1.6vw, 1.375rem);
   font-weight: 700;
   line-height: 1.15;
   letter-spacing: -0.02em;
   color: var(--ink);
 }

 .loop-node p {
   font-size: 18px;
   line-height: 1.55;
   color: var(--ink-60);
 }

 .loop-arrow {
   display: flex;
   align-items: center;
   justify-content: center;
   font-size: 22px;
   font-weight: 500;
   color: var(--gold);
   opacity: 0.7;
 }

 /* ---------- 15. Video testimonial cards (6-up proof wall) ---------- */
 .testi-grid {
   margin-top: clamp(2rem, 4vw, 3rem);
   display: grid;
   grid-template-columns: 1fr;
   gap: clamp(1rem, 2vw, 1.5rem);
 }

 @media (min-width: 720px) {
   .testi-grid {
     grid-template-columns: 1fr 1fr;
   }
 }

 @media (min-width: 1100px) {
   .testi-grid {
     grid-template-columns: repeat(3, 1fr);
   }
 }

 /* 2-up variant — used for superloom examples. Fluid up to a 960px cap, then centered. */
 .testi-grid--two-up {
   width: 100%;
   max-width: 960px;
   margin-left: auto;
   margin-right: auto;
 }

 @media (min-width: 720px) {
   .testi-grid--two-up {
     grid-template-columns: 1fr 1fr;
   }
 }

 @media (min-width: 1100px) {
   .testi-grid--two-up {
     grid-template-columns: 1fr 1fr;
   }
 }

 /* Stacked variant — single column always. */
 .testi-grid--stacked {
   margin-inline: auto;
 }

 @media (min-width: 720px) {
   .testi-grid--stacked {
     grid-template-columns: 1fr;
   }
 }

 @media (min-width: 1100px) {
   .testi-grid--stacked {
     grid-template-columns: 1fr;
   }
 }

 .testi-card {
   background: var(--paper);
   border: 1px solid var(--ink-15);
   border-radius: var(--r-lg);
   overflow: hidden;
   display: flex;
   flex-direction: column;
   transition: transform 300ms var(--ease-out), box-shadow 300ms var(--ease-out), border 300ms var(--ease-out);
 }

 .testi-card:hover {
   transform: translateY(-3px);
   border-color: var(--emerald);
   box-shadow: var(--shadow-soft);
 }

 .testi-thumb {
   position: relative;
   aspect-ratio: 16 / 9;
   background: linear-gradient(135deg, var(--graphite) 0%, var(--ink) 100%);
   cursor: pointer;
   display: flex;
   align-items: center;
   justify-content: center;
   overflow: hidden;
 }

 .testi-thumb::before {
   content: "";
   position: absolute;
   inset: 0;
   background: radial-gradient(60% 80% at 75% 75%, rgba(200, 146, 46, 0.12), transparent 70%);
 }

 .testi-play {
   width: 64px;
   height: 64px;
   border-radius: 50%;
   background: var(--paper);
   color: var(--ink);
   display: grid;
   place-items: center;
   position: relative;
   z-index: 1;
   box-shadow: 0 14px 36px rgba(0, 0, 0, 0.28);
   transition: transform 220ms var(--ease-out);
 }

 .testi-play svg {
   width: 22px;
   height: 22px;
   margin-left: 3px;
 }

 .testi-card:hover .testi-play {
   transform: scale(1.08);
 }

 .testi-duration {
   position: absolute;
   right: 10px;
   bottom: 10px;
   font-size: 18px;
   font-weight: 500;
   letter-spacing: 0.22em;
   text-transform: uppercase;
   color: var(--on-accent);
   background: rgba(0, 0, 0, 0.42);
   padding: 4px 10px;
   border-radius: var(--r-pill);
   backdrop-filter: blur(6px);
   z-index: 1;
 }

 /* Wistia-embedded testimonial thumb */
 .testi-thumb--video {
   display: block;
   background: var(--graphite);
   cursor: auto;
 }

 .testi-thumb--video::before {
   display: none;
 }

 .testi-thumb--video > wistia-player {
   display: block;
   width: 100%;
 }

 /* No-video testimonial (quote-only card) */
 .testi-body--no-video {
   padding-top: clamp(2rem, 3vw, 2.5rem);
 }

 .testi-body--no-video::before {
   content: "\201C";
   display: block;
   font-family: Georgia, "Times New Roman", serif;
   font-size: 72px;
   line-height: 0.6;
   color: var(--gold);
   margin-bottom: var(--space-3);
 }

 .testi-body {
   padding: clamp(1.25rem, 2.2vw, 1.625rem);
   display: flex;
   flex-direction: column;
   gap: 10px;
   flex: 1;
 }

 .testi-tag {
   align-self: flex-start;
   padding: 4px 10px;
   background: rgba(11, 110, 61, 0.1);
   color: var(--emerald);
   border-radius: var(--r-pill);
   font-size: 18px;
   font-weight: 500;
   letter-spacing: 0.22em;
   text-transform: uppercase;
 }

 .testi-card h3 {
   font-size: clamp(1.25rem, 1.7vw, 1.5rem);
   font-weight: 700;
   color: var(--ink);
   letter-spacing: -0.025em;
   line-height: 1.1;
 }

 .testi-meta {
   font-size: 18px;
   color: var(--ink-60);
   letter-spacing: 0.005em;
   line-height: 1.4;
 }

 .testi-logos {
   display: flex;
   flex-wrap: nowrap;
   align-items: center;
   justify-content: center;
   gap: var(--space-4);
   margin-top: var(--space-2);
   width: 100%;
 }

 .testi-logos img {
   height: 20px;
   width: auto;
   max-width: 30%;
   object-fit: contain;
   opacity: 0.7;
   flex-shrink: 1;
 }

 .testi-card blockquote {
   margin: 0;
   font-size: clamp(1.125rem, 1.2vw, 1.25rem);
   font-weight: 500;
   line-height: 1.4;
   letter-spacing: -0.005em;
   color: var(--ink);
   padding-left: var(--space-4);
   border-left: 2px solid var(--gold);
 }

 .testi-numbers {
   display: flex;
   flex-wrap: wrap;
   gap: 8px 16px;
   margin-top: auto;
   padding-top: var(--space-3);
   border-top: 1px solid var(--ink-15);
   font-size: 18px;
   color: var(--ink-60);
 }

 .testi-numbers strong {
   font-weight: 700;
   color: var(--emerald);
   font-size: 18px;
   margin-right: 2px;
 }

 /* ---------- 15b. Case study cards — video on top, big headline below ---------- */
 .case-study-list {
   display: flex;
   flex-direction: column;
   gap: clamp(1.25rem, 2.5vw, 2rem);
   margin-top: clamp(2rem, 4vw, 3rem);
   max-width: 880px;
   margin-inline: auto;
 }

 .case-study-card {
   display: flex;
   flex-direction: column-reverse;  /* HTML is body→media; reverse so media renders on top */
   background: var(--paper);
   border: 1px solid var(--ink-15);
   border-radius: var(--r-lg);
   overflow: hidden;
   transition: transform 300ms var(--ease-out), border 300ms var(--ease-out), box-shadow 300ms var(--ease-out);
 }

 .case-study-card:hover {
   transform: translateY(-2px);
   border-color: var(--emerald);
   box-shadow: var(--shadow-soft);
 }

 .case-study-body {
   padding: clamp(1.75rem, 3vw, 2.75rem);
   display: flex;
   flex-direction: column;
   gap: var(--space-3);
 }

 .case-study-media {
   background: var(--graphite);
   aspect-ratio: 16 / 9;
   position: relative;
   overflow: hidden;
 }

 .case-study-media:has(wistia-player) {
   aspect-ratio: auto;
 }

 .case-study-media > wistia-player {
   display: block;
   width: 100%;
 }

 /* Text-only case study — decorative quote instead of video */
 .case-study-card--no-video .case-study-media {
   background: linear-gradient(135deg, rgba(11, 110, 61, 0.04) 0%, rgba(200, 146, 46, 0.08) 100%);
   display: flex;
   align-items: center;
   justify-content: center;
 }

 .case-study-card--no-video .case-study-media::after {
   content: "\201C";
   font-family: Georgia, "Times New Roman", serif;
   font-size: clamp(100px, 14vw, 180px);
   line-height: 0.75;
   color: var(--gold);
   opacity: 0.6;
 }

 .case-study-chip {
   display: inline-flex;
   align-items: center;
   gap: 8px;
   font-size: 18px;
   font-weight: 600;
   color: var(--ink);
   align-self: flex-start;
 }

 .case-study-chip .mono {
   width: 26px;
   height: 26px;
   border-radius: 6px;
   background: var(--emerald);
   color: var(--on-accent);
   display: grid;
   place-items: center;
   font-size: 18px;
   font-weight: 700;
 }

 .case-study-headshot {
   width: 36px;
   height: 36px;
   border-radius: 50%;
   object-fit: cover;
   flex-shrink: 0;
   border: 1px solid var(--ink-15);
 }

 .case-study-context {
   font-size: 18px;
   font-weight: 500;
   letter-spacing: 0.18em;
   text-transform: uppercase;
   color: var(--ink-40);
 }

 .case-study-heading {
   font-size: clamp(2rem, 3.6vw, 3.25rem);
   font-weight: 700;
   color: var(--ink);
   letter-spacing: -0.03em;
   line-height: 1.1;
   margin: 0;
 }

 .case-study-quote {
   margin: 0;
   font-size: clamp(1.125rem, 1.5vw, 1.375rem);
   font-weight: 500;
   line-height: 1.45;
   color: var(--ink);
   padding-left: var(--space-3);
   border-left: 2px solid var(--gold);
 }

 .case-study-description {
   font-size: clamp(1.125rem, 1.4vw, 1.25rem);
   color: var(--ink-60);
   line-height: 1.5;
   margin: 0;
 }

 .case-study-subhead {
   margin: 0;
   font-size: 0.8125rem;
   font-weight: 700;
   letter-spacing: 0.16em;
   text-transform: uppercase;
   color: var(--gold);
 }

 .case-study-bullets {
   margin: 0;
   padding-left: 1.25rem;
   font-size: clamp(1.125rem, 1.4vw, 1.25rem);
   color: var(--ink-60);
   line-height: 1.5;
   list-style: disc outside;
 }

 .case-study-bullets li {
   margin-block: 0.25em;
 }

 .case-study-bullets li::marker {
   color: var(--gold);
 }

 /* Insane-proof transferable-proof: stack video on top (mirrors .testi-card pattern) */
 #client-receipts .case-study-list {
   max-width: 1180px;
 }

 @media (min-width: 860px) {
   #client-receipts .case-study-list {
     display: grid;
     grid-template-columns: 1fr 1fr;
   }

   #client-receipts .case-study-card {
     flex-direction: column-reverse;
     align-items: stretch;
   }

   #client-receipts .case-study-body {
     flex: none;
   }

   #client-receipts .case-study-media {
     flex: none;
     width: 100%;
     aspect-ratio: 16 / 9;
     align-self: stretch;
     border-left: none;
     border-top: 1px solid var(--ink-08);
   }
 }

 /* ---------- 16. Screenshot gallery (masonry) ---------- */
 .shot-header {
   margin-top: clamp(3rem, 6vw, 4.5rem);
   margin-bottom: clamp(1.5rem, 3vw, 2rem);
   text-align: center;
 }

 .shot-header .eyebrow {
   display: block;
   margin-bottom: var(--space-3);
 }

 .shot-title {
   font-size: clamp(1.5rem, 2.4vw, 2rem);
   font-weight: 700;
   color: var(--ink);
   letter-spacing: -0.03em;
   line-height: 1.15;
 }

 .shot-title em {
   color: var(--emerald);
 }

 .reaction-hero {
   display: block;
   width: 100%;
   max-width: 1100px;
   height: auto;
   margin: 0 auto clamp(14px, 1.6vw, 22px);
   border-radius: var(--r-md);
 }

 .shot-gallery {
   column-count: 1;
   column-gap: clamp(14px, 1.6vw, 22px);
   max-width: 1100px;
   margin-inline: auto;
 }

 @media (min-width: 720px) {
   .shot-gallery {
     column-count: 2;
   }
   .shot-gallery:has(img:only-child) {
     column-count: 1;
   }
 }

 .shot-gallery img {
   display: block;
   width: 100%;
   height: auto;
   margin: 0 0 clamp(14px, 1.6vw, 22px);
   break-inside: avoid;
   border-radius: var(--r-md);
 }

 /* Larger screenshots on the confirmation page */
 #proof-wall .shot-gallery {
   column-count: 1;
   column-gap: clamp(16px, 1.8vw, 28px);
   max-width: 1480px;
 }

 @media (min-width: 900px) {
   #proof-wall .shot-gallery {
     column-count: 2;
   }
 }

 /* Standalone prospect bio photo — used above each "Why [prospect]?" section on the insane-proof exhibits */
 .prospect-bio-photo {
   margin: var(--space-6) auto 0;
   max-width: 518px;
   text-align: center;
 }

 .prospect-bio-photo img {
   width: 100%;
   height: auto;
   display: block;
   border-radius: var(--r-md);
 }

 /* Two-up variant — for exhibits with two prospects side-by-side (Penn & Felix) */
 .prospect-bio-photo--two-up {
   max-width: 1035px;
   display: grid;
   grid-template-columns: 1fr;
   gap: var(--space-3);
 }

 @media (min-width: 720px) {
   .prospect-bio-photo--two-up {
     grid-template-columns: 1fr 1fr;
   }
 }

 /* Result cards — 3-up row of bordered cards summarizing exhibit results */
 .result-cards {
   display: grid;
   grid-template-columns: 1fr;
   gap: clamp(1rem, 2vw, 1.5rem);
   max-width: 1180px;
   margin: var(--space-6) auto 0;
 }

 @media (min-width: 720px) {
   .result-cards {
     grid-template-columns: repeat(3, 1fr);
   }

   .result-cards--two-up {
     grid-template-columns: repeat(2, 1fr);
     max-width: 800px;
   }
 }

 .result-card {
   background: var(--paper);
   border: 1px solid var(--ink-15);
   border-radius: var(--r-lg);
   padding: clamp(1.5rem, 3vw, 2rem);
   text-align: center;
   display: flex;
   align-items: center;
   justify-content: center;
   min-height: 140px;
 }

 .result-card-text {
   margin: 0;
   font-size: clamp(1.25rem, 1.9vw, 1.625rem);
   font-weight: 500;
   color: var(--ink);
   line-height: 1.4;
 }

 .result-card-text strong {
   color: var(--emerald);
   font-weight: 700;
 }

 /* Lebanon BTS + breakdown YouTube videos — two-up grid under Andre's exhibit */
 .lebanon-videos {
   display: grid;
   grid-template-columns: 1fr;
   gap: clamp(1.5rem, 3vw, 2.5rem);
   max-width: 1180px;
   margin-inline: auto;
 }

 @media (min-width: 720px) {
   .lebanon-videos {
     grid-template-columns: 1fr 1fr;
   }
 }

 .lebanon-video-block {
   display: flex;
   flex-direction: column;
   gap: var(--space-3);
   text-align: center;
 }

 .lebanon-video-frame {
   position: relative;
   aspect-ratio: 16 / 9;
   width: 100%;
   border-radius: var(--r-lg);
   overflow: hidden;
   background: var(--ink);
 }

 .lebanon-video-frame iframe {
   position: absolute;
   inset: 0;
   width: 100%;
   height: 100%;
   border: 0;
 }

 #proof-wall .shot-gallery img {
   margin: 0 0 clamp(16px, 1.8vw, 28px);
 }

 /* ---------- 17. Close-rate strip (21 / 19 / 15) ---------- */
 .closerate {
   margin-top: clamp(2.5rem, 5vw, 4rem);
   padding: clamp(1.75rem, 3vw, 2.5rem);
   background: var(--paper);
   border: 1px solid var(--ink-15);
   border-radius: var(--r-lg);
   text-align: center;
 }

 .cr-label {
   font-size: 18px;
   font-weight: 500;
   letter-spacing: 0.22em;
   text-transform: uppercase;
   color: var(--ink-40);
   margin-bottom: var(--space-4);
 }

 .cr-row {
   display: grid;
   grid-template-columns: 1fr auto 1fr auto 1fr;
   gap: var(--space-3);
   align-items: baseline;
   max-width: 820px;
   margin: 0 auto;
 }

 .cr-stat {
   display: flex;
   flex-direction: column;
   gap: 4px;
 }

 .cr-num {
   font-size: clamp(3.5rem, 6.4vw, 5rem);
   font-weight: 700;
   line-height: 1;
   letter-spacing: -0.04em;
   color: var(--ink);
 }

 .cr-stat--gold .cr-num {
   color: var(--gold);
 }

 .cr-desc {
   font-size: 18px;
   color: var(--ink-60);
   letter-spacing: 0.005em;
 }

 .cr-arrow {
   font-size: 22px;
   font-weight: 500;
   color: var(--gold);
   opacity: 0.65;
 }

 .cr-foot {
   margin-top: var(--space-5);
   font-size: clamp(1.125rem, 1.5vw, 1.25rem);
   font-weight: 600;
   color: var(--emerald);
   letter-spacing: -0.015em;
 }

 /* ---------- 18. Fit check (for / not for) ---------- */
 .fit-split {
   margin-top: clamp(2rem, 4vw, 3rem);
   display: grid;
   grid-template-columns: 1fr;
   gap: var(--space-5);
   max-width: 1040px;
   margin-inline: auto;
 }

 @media (min-width: 860px) {
   .fit-split {
     grid-template-columns: 1fr 1fr;
   }
 }

 .fit-col {
   padding: clamp(1.75rem, 3vw, 2.25rem);
   border-radius: var(--r-lg);
   background: var(--paper);
   border: 1px solid var(--ink-15);
 }

 .fit-col--yes {
   border-color: rgba(11, 110, 61, 0.35);
 }

 .fit-col--no {
   border-color: rgba(154, 46, 26, 0.28);
 }

 .fit-tag {
   display: inline-block;
   font-size: 18px;
   font-weight: 500;
   letter-spacing: 0.22em;
   text-transform: uppercase;
   color: var(--ink-40);
   margin-bottom: var(--space-4);
 }

 .fit-col--yes .fit-tag {
   color: var(--emerald);
 }

 .fit-col--no .fit-tag {
   color: var(--rust);
 }

 .fit-col ul {
   display: flex;
   flex-direction: column;
   gap: 12px;
 }

 .fit-col li {
   position: relative;
   padding-left: 28px;
   font-size: 18px;
   line-height: 1.55;
   color: var(--ink-80);
 }

 .fit-col li::before {
   position: absolute;
   left: 0;
   top: 6px;
   width: 22px;
   height: 22px;
   border-radius: 50%;
   display: inline-grid;
   place-items: center;
   font-size: 13px;
   line-height: 1;
   font-weight: 700;
   text-align: center;
 }

 .fit-col--yes li::before {
   content: "✓";
   background: var(--emerald);
   color: var(--on-accent);
 }

 .fit-col--no li::before {
   content: "✕";
   background: rgba(154, 46, 26, 0.15);
   color: var(--rust);
   font-size: 11px;
 }

 .fit-col strong {
   color: var(--ink);
   font-weight: 600;
 }

 .fit-col em {
   color: var(--emerald);
 }

 .fit-foot {
   margin-top: clamp(2rem, 4vw, 3rem);
   text-align: center;
   font-size: clamp(1.125rem, 1.5vw, 1.25rem);
   color: var(--ink-60);
   max-width: 640px;
   margin-inline: auto;
 }

 /* ---------- 19. Process steps (5-step timeline) ---------- */
 .steps {
   margin-top: clamp(2rem, 4vw, 3rem);
   display: flex;
   flex-direction: column;
   gap: clamp(1.25rem, 2.5vw, 2rem);
   max-width: 1080px;
   margin-inline: auto;
 }

 /* Stacked variant — single column always. Used for 4-part TOC where boxes feel cluttered. */
 .steps--stacked {
   max-width: 880px;
   margin-inline: auto;
   gap: clamp(1rem, 2vw, 1.5rem);
 }

 @media (min-width: 720px) {
   .steps--stacked {
     grid-template-columns: 1fr;
   }
 }

 @media (min-width: 1100px) {
   .steps--stacked {
     grid-template-columns: 1fr;
   }
 }

 .steps--stacked .step {
   min-height: 0;
   padding: clamp(1.5rem, 2.5vw, 2rem);
 }

 .steps--stacked .step h4 {
   font-size: clamp(1.5rem, 2.4vw, 2rem);
   line-height: 1.15;
 }

 .step {
   padding: clamp(2rem, 3.5vw, 3rem);
   background: var(--paper);
   border: 1px solid var(--ink-15);
   border-radius: var(--r-lg);
   display: flex;
   flex-direction: column;
   gap: clamp(1rem, 2vw, 1.5rem);
 }

 /* Alternating row layout at desktop — big number/day on one side, content on the other.
    Scoped to plain .steps so the .steps--stacked variant (our-process TOC) keeps its column layout. */
 @media (min-width: 720px) {
   .steps:not(.steps--stacked) .step {
     flex-direction: row;
     align-items: center;
     gap: clamp(2rem, 4vw, 3.5rem);
   }
   .steps:not(.steps--stacked) .step:nth-child(even) {
     flex-direction: row-reverse;
   }
 }

 /* The number/day stack — fixed-width column */
 .step-marker {
   display: flex;
   flex-direction: column;
   gap: var(--space-2);
   flex: 0 0 auto;
 }

 @media (min-width: 720px) {
   .step-marker {
     min-width: 200px;
   }
 }

 .step-content {
   display: flex;
   flex-direction: column;
   gap: var(--space-3);
   flex: 1 1 auto;
 }

 .step--end {
   border: 2px solid var(--gold);
 }

 .step-day {
   font-size: clamp(1.125rem, 1.3vw, 1.1875rem);
   font-weight: 600;
   letter-spacing: 0.22em;
   text-transform: uppercase;
   color: var(--ink-40);
 }

 .step--end .step-day {
   color: var(--emerald);
 }

 .step-num {
   font-size: clamp(4rem, 8vw, 6.5rem);
   font-weight: 700;
   line-height: 0.9;
   letter-spacing: -0.045em;
   color: var(--gold);
   font-feature-settings: "tnum" 1;
 }

 .step h4 {
   font-size: clamp(1.625rem, 2.8vw, 2.5rem);
   font-weight: 700;
   letter-spacing: -0.03em;
   color: var(--ink);
   line-height: 1.1;
   margin: 0;
 }

 .step p {
   font-size: clamp(1.125rem, 1.4vw, 1.25rem);
   line-height: 1.5;
   color: var(--ink-60);
   margin: 0;
 }

 /* ---------- 20. Investment / LTV math + Guarantee seal ---------- */
 .ltv-math {
   margin-top: clamp(2rem, 4vw, 3rem);
   background: var(--paper);
   border: 1px solid var(--ink-15);
   border-radius: var(--r-lg);
   padding: clamp(1.75rem, 3vw, 2.5rem);
 }

 .ltv-header {
   text-align: center;
   margin-bottom: var(--space-6);
 }

 .ltv-label {
   display: block;
   margin-bottom: var(--space-3);
   font-size: 18px;
   font-weight: 500;
   letter-spacing: 0.22em;
   text-transform: uppercase;
   color: var(--emerald);
 }

 .ltv-rule {
   font-size: clamp(1.125rem, 1.8vw, 1.375rem);
   font-weight: 500;
   color: var(--ink);
   letter-spacing: -0.015em;
   line-height: 1.3;
 }

 .ltv-rule strong {
   color: var(--emerald);
   font-weight: 700;
 }

 .ltv-grid {
   display: grid;
   grid-template-columns: 1fr;
   gap: var(--space-3);
 }

 @media (min-width: 720px) {
   .ltv-grid {
     grid-template-columns: repeat(3, 1fr);
   }
 }

 .ltv-cell {
   padding: clamp(1.25rem, 2vw, 1.5rem);
   background: var(--paper);
   border: 1px solid var(--ink-15);
   border-radius: var(--r-md);
   text-align: center;
   display: flex;
   flex-direction: column;
   gap: 8px;
 }

 .ltv-cell--mid {
   border-color: rgba(11, 110, 61, 0.35);
 }

 .ltv-cell--big {
   border: 2px solid var(--gold);
 }

 .ltv-head {
   font-size: 18px;
   font-weight: 500;
   letter-spacing: 0.18em;
   text-transform: uppercase;
   color: var(--ink-40);
 }

 .ltv-cell--big .ltv-head {
   color: var(--emerald);
 }

 .ltv-big {
   font-size: clamp(2.75rem, 4.4vw, 3.75rem);
   font-weight: 700;
   color: var(--ink);
   letter-spacing: -0.04em;
   line-height: 1;
 }

 .ltv-result {
   font-size: 18px;
   line-height: 1.4;
   color: var(--ink-60);
 }

 .ltv-result strong {
   color: var(--emerald);
   font-weight: 700;
 }

 .ltv-result em {
   color: var(--gold);
   font-weight: 700;
 }

 .ltv-foot {
   margin-top: var(--space-5);
   text-align: center;
   font-size: 18px;
   line-height: 1.55;
   color: var(--ink-60);
   max-width: 620px;
   margin-inline: auto;
 }

 .guarantee-block {
   margin-top: clamp(3rem, 6vw, 4.5rem);
   text-align: center;
   padding: clamp(2rem, 4vw, 3rem);
   background: var(--paper);
   border: 1px solid var(--ink-15);
   border-radius: var(--r-lg);
 }

 .wax-seal {
   width: clamp(140px, 18vw, 200px);
   margin: 0 auto var(--space-5);
 }

 .guarantee-lead {
   font-size: clamp(1.5rem, 2.6vw, 2rem);
   font-weight: 700;
   line-height: 1.15;
   letter-spacing: -0.03em;
   color: var(--ink);
   max-width: 720px;
   margin-inline: auto;
 }

 .guarantee-sub {
   margin-top: var(--space-4);
   font-size: 18px;
   line-height: 1.6;
   color: var(--ink-60);
   max-width: 560px;
   margin-inline: auto;
 }

 .guarantee-sub em {
   color: var(--emerald);
 }

 .guarantee-promise {
   font-size: clamp(1.5rem, 2.6vw, 2rem);
   font-weight: 700;
   line-height: 1.2;
   letter-spacing: -0.03em;
   color: var(--ink);
   max-width: 820px;
   margin: 0 auto var(--space-5);
 }

 .guarantee-promise .accent {
   color: var(--emerald);
 }

 /* ---------- 21. Objection cards (3-col Q&A) ---------- */
 .obj-grid {
   margin-top: clamp(2rem, 4vw, 3rem);
   display: grid;
   grid-template-columns: 1fr;
   gap: var(--space-5);
   max-width: 1040px;
   margin-inline: auto;
 }

 @media (min-width: 960px) {
   .obj-grid {
     grid-template-columns: repeat(3, 1fr);
   }
 }

 .obj-card {
   padding: clamp(1.5rem, 2.4vw, 2rem);
   background: var(--paper);
   border: 1px solid var(--ink-15);
   border-radius: var(--r-lg);
   display: flex;
   flex-direction: column;
   gap: var(--space-4);
 }

 .obj-q {
   font-size: clamp(1.125rem, 1.6vw, 1.375rem);
   font-weight: 600;
   color: var(--ink);
   letter-spacing: -0.02em;
   line-height: 1.2;
 }

 .obj-a {
   display: flex;
   flex-direction: column;
   gap: var(--space-3);
 }

 .obj-a p {
   font-size: 18px;
   line-height: 1.6;
   color: var(--ink-60);
 }

 .obj-a strong {
   color: var(--ink);
   font-weight: 600;
 }

 .obj-a em {
   color: var(--emerald);
 }

 /* ---------- 22. First-mover contrast (them vs you) ---------- */
 .contrast {
   margin: clamp(2.5rem, 5vw, 4rem) auto 0;
   display: grid;
   grid-template-columns: 1fr;
   gap: var(--space-5);
   align-items: stretch;
 }

 @media (min-width: 860px) {
   .contrast {
     grid-template-columns: 1fr 60px 1fr;
   }
 }

 .contrast-side {
   padding: clamp(1.5rem, 3vw, 2.25rem);
   border-radius: var(--r-lg);
   border: 1px solid var(--ink-15);
   background: var(--paper);
   display: flex;
   flex-direction: column;
   gap: var(--space-3);
 }

 .contrast-side--you {
   border: 2px solid var(--gold);
 }

 .contrast-icon {
   width: 48px;
   height: 48px;
   color: var(--ink-40);
 }

 .contrast-side--you .contrast-icon {
   color: var(--gold);
 }

 .contrast-label {
   font-size: 18px;
   font-weight: 500;
   letter-spacing: 0.22em;
   text-transform: uppercase;
   color: var(--ink-40);
 }

 .contrast-side--you .contrast-label {
   color: var(--gold);
 }

 .contrast-side ul {
   display: flex;
   flex-direction: column;
   gap: 8px;
   color: var(--ink-80);
   font-size: 18px;
   line-height: 1.5;
 }

 .contrast-side li {
   padding-left: 18px;
   position: relative;
 }

 .contrast-side li::before {
   content: "·";
   position: absolute;
   left: 4px;
   top: -4px;
   font-size: 22px;
   color: var(--ink-40);
 }

 .contrast-side--you li::before {
   color: var(--gold);
 }

 .contrast-side--you li em {
   color: var(--gold);
 }

 .contrast-vs {
   display: flex;
   align-items: center;
   justify-content: center;
   font-size: clamp(1.125rem, 1.4vw, 1.25rem);
   font-weight: 600;
   color: var(--gold);
 }

 .firstmover-foot {
   margin: clamp(2.5rem, 5vw, 3.5rem) auto 0;
   max-width: 52ch;
   text-align: center;
   font-size: clamp(1.125rem, 1.7vw, 1.375rem);
   font-weight: 500;
   line-height: 1.35;
   letter-spacing: -0.015em;
   color: var(--ink);
 }

 .firstmover-foot em {
   color: var(--emerald);
 }

 /* ---------- 23. Final CTA ---------- */
 .final-cta {
   background: var(--paper);
   color: var(--ink);
   padding-block: clamp(5rem, 11vw, 9rem);
 }

 .final-cta .wrap {
   display: grid;
   grid-template-columns: 1fr;
   gap: clamp(2.5rem, 5vw, 4rem);
   align-items: center;
 }

 @media (min-width: 960px) {
   .final-cta .wrap {
     grid-template-columns: 1fr 1fr;
   }
 }

 .final-cta h2 .alt {
   color: var(--emerald);
 }

 .final-cta .sub {
   margin-top: var(--space-4);
   font-size: 18px;
   line-height: 1.55;
   color: var(--ink-60);
   max-width: 52ch;
 }

 /* ---------- 24. Footer ---------- */
 .footer {
   padding-block: var(--space-7);
   background: var(--paper);
   color: var(--ink-60);
   border-top: 1px solid var(--ink-15);
   font-size: 18px;
 }

 .footer-row {
   display: flex;
   flex-direction: column;
   align-items: center;
   text-align: center;
   gap: var(--space-4);
 }

 .footer-brand {
   display: inline-flex;
   align-items: center;
   color: var(--ink);
 }

 .footer-brand-img {
   display: block;
   width: auto;
   height: 36px;
   object-fit: contain;
 }

 .footer-links {
   display: flex;
   gap: clamp(1rem, 2.2vw, 1.75rem);
   justify-content: center;
   flex-wrap: wrap;
 }

 .footer a:hover {
   color: var(--emerald);
 }

 /* ---------- 25. CONFIRMATION PAGE ---------- */

 /* Confirmation hero */
 .conf-confirm {
   display: inline-flex;
   align-items: center;
   gap: 12px;
   margin-bottom: var(--space-4);
 }

 .conf-checkmark {
   display: inline-grid;
   place-items: center;
   width: 32px;
   height: 32px;
   background: var(--emerald);
   color: var(--on-accent);
   border-radius: 50%;
 }

 .conf-checkmark svg {
   width: 18px;
   height: 18px;
 }

 /* Confirmation hero stats — single row, four columns at every breakpoint. */
 .conf-stats {
   margin: clamp(1.25rem, 3vw, 4rem) auto 0;
   max-width: 1180px;
   display: grid;
   grid-template-columns: repeat(4, 1fr);
   gap: clamp(0.5rem, 1.5vw, 1.5rem);
   text-align: center;
   align-items: start;
 }

 .conf-stat {
   display: flex;
   flex-direction: column;
   gap: 6px;
   align-items: center;
 }

 .conf-stat-num {
   font-size: clamp(1.75rem, 5vw, 5rem);
   font-weight: 700;
   line-height: 0.92;
   letter-spacing: -0.05em;
   color: var(--ink);
   font-feature-settings: "tnum" 1;
 }

 .conf-stat--gold .conf-stat-num {
   color: var(--gold, #C8922E);
 }

 .conf-stat-desc {
   font-size: clamp(1.125rem, 1.6vw, 1.5rem);
   line-height: 1.25;
   color: var(--ink-60);
   font-weight: 500;
   letter-spacing: -0.005em;
 }

 .conf-stat-desc em {
   color: var(--emerald);
   font-style: normal;
 }

 /* 12 breakout videos — one per row, big headline */
 .breakouts {
   display: flex;
   flex-direction: column;
   gap: clamp(1.25rem, 2.5vw, 2rem);
   margin-top: clamp(2rem, 4vw, 3rem);
   max-width: 1080px;
   margin-inline: auto;
 }

 .breakout {
   background: var(--paper);
   border: 1px solid var(--ink-15);
   border-radius: var(--r-lg);
   overflow: hidden;
   display: flex;
   flex-direction: column;  /* video on top, text below */
   transition: transform 300ms var(--ease-out), box-shadow 300ms var(--ease-out), border 300ms var(--ease-out);
 }

 @media (min-width: 860px) {
   .breakout {
     width: 75%;
     align-self: center;
   }
 }

 .breakout:hover {
   transform: translateY(-3px);
   border-color: var(--emerald);
   box-shadow: var(--shadow-soft);
 }

 .bo-thumb {
   position: relative;
   aspect-ratio: 16 / 9;
   background: linear-gradient(135deg, var(--graphite) 0%, var(--ink) 100%);
   cursor: pointer;
   display: flex;
   align-items: center;
   justify-content: center;
   overflow: hidden;
 }


 .bo-thumb::before {
   content: "";
   position: absolute;
   inset: 0;
   background: radial-gradient(60% 80% at 75% 75%, rgba(200, 146, 46, 0.10), transparent 70%);
   pointer-events: none;
 }

 /* When .bo-thumb wraps a real Wistia embed, drop the placeholder treatments
    BUT keep the 16:9 aspect-ratio — once the wistia-player script defines the custom element,
    the placeholder padding-top trick goes away and the player has no intrinsic height,
    so the parent's aspect-ratio is what gives it visible size. */
 .bo-thumb:has(wistia-player) {
   background: transparent;
   cursor: default;
 }
 .bo-thumb:has(wistia-player)::before { display: none; }
 .bo-thumb wistia-player {
   display: block;
   width: 100%;
   height: 100%;
 }

 .bo-play {
   width: 52px;
   height: 52px;
   border-radius: 50%;
   background: var(--paper);
   color: var(--ink);
   display: grid;
   place-items: center;
   position: relative;
   z-index: 1;
   box-shadow: 0 10px 30px rgba(0, 0, 0, 0.25);
   transition: transform 220ms var(--ease-out);
 }

 .bo-play svg {
   width: 18px;
   height: 18px;
   margin-left: 2px;
 }

 .breakout:hover .bo-play {
   transform: scale(1.08);
 }

 .bo-duration {
   position: absolute;
   right: 10px;
   bottom: 10px;
   font-size: 18px;
   font-weight: 500;
   letter-spacing: 0.22em;
   text-transform: uppercase;
   color: var(--on-accent);
   background: rgba(0, 0, 0, 0.42);
   padding: 4px 8px;
   border-radius: var(--r-pill);
   backdrop-filter: blur(6px);
   z-index: 1;
 }

 .bo-body {
   padding: clamp(1.75rem, 3vw, 2.75rem);
   display: flex;
   flex-direction: column;
   gap: var(--space-3);
 }

 .bo-num {
   font-size: 18px;
   font-weight: 500;
   letter-spacing: 0.22em;
   text-transform: uppercase;
   color: var(--emerald);
 }

 .breakout h3 {
   font-size: clamp(2rem, 3.6vw, 3.25rem);
   font-weight: 700;
   color: var(--ink);
   letter-spacing: -0.03em;
   line-height: 1.1;
 }

 .breakout p {
   font-size: clamp(1.125rem, 1.4vw, 1.25rem);
   line-height: 1.5;
   color: var(--ink-60);
 }

 .breakout em {
   color: var(--emerald);
 }

 /* 2-column grid variant — used on backend sales asset pages
    (insane-proof, our-process, faqs, value-of-a-whale, first-movers-advantage, working-with-us)
    where the 12 breakouts sit just above the next-asset CTA. */
 .breakouts--grid {
   display: grid;
   grid-template-columns: 1fr;
   gap: clamp(1.25rem, 2.5vw, 1.75rem);
   margin-top: clamp(2rem, 4vw, 3rem);
   max-width: 1080px;
   margin-inline: auto;
 }

 @media (min-width: 720px) {
   .breakouts--grid {
     grid-template-columns: 1fr 1fr;
   }
 }

 .breakouts--grid .breakout {
   width: 100%;
   align-self: stretch;
 }

 .breakouts--grid .bo-body {
   padding: clamp(1.25rem, 2.4vw, 1.75rem);
   gap: var(--space-2);
 }

 .breakouts--grid .breakout h3 {
   font-size: clamp(1.25rem, 2vw, 1.6rem);
   line-height: 1.2;
 }

 .breakouts--grid .breakout p {
   font-size: 18px;
   line-height: 1.5;
 }

 /* Sales-asset card grid (confirmation page · "Want to go deeper?") */
 .asset-grid {
   display: grid;
   grid-template-columns: 1fr;
   gap: clamp(1.5rem, 2.5vw, 2rem);
   margin-top: clamp(2.5rem, 5vw, 3.5rem);
   max-width: 1080px;
   margin-inline: auto;
 }

 @media (min-width: 720px) {
   .asset-grid {
     grid-template-columns: repeat(2, minmax(0, 1fr));
   }
 }

 .asset-card {
   display: flex;
   flex-direction: column;
   background: var(--paper);
   border: 1px solid var(--ink-15);
   border-radius: var(--r-lg);
   overflow: hidden;
   transition: transform 280ms var(--ease-out), box-shadow 280ms var(--ease-out), border-color 280ms var(--ease-out);
 }

 .asset-card:hover,
 .asset-card:focus-within {
   transform: translateY(-4px);
   border-color: var(--emerald);
   box-shadow: 0 18px 40px rgba(15, 23, 36, 0.10);
 }

 .asset-thumb-link {
   display: block;
   aspect-ratio: 16 / 10;
   overflow: hidden;
   background: linear-gradient(135deg, var(--graphite, #0f1724) 0%, var(--ink, #0a0f1a) 100%);
   position: relative;
   border-bottom: 1px solid var(--ink-15);
 }

 .asset-thumb {
   width: 100%;
   height: 100%;
   object-fit: cover;
   object-position: top center;
   display: block;
   transition: transform 600ms var(--ease-out);
 }

 .asset-card:hover .asset-thumb,
 .asset-card:focus-within .asset-thumb {
   transform: scale(1.03);
 }

 .asset-body {
   display: flex;
   flex-direction: column;
   gap: var(--space-3);
   padding: clamp(1.5rem, 2.4vw, 2rem);
   flex: 1;
 }

 .asset-tag {
   font-size: 18px;
   font-weight: 500;
   letter-spacing: 0.22em;
   text-transform: uppercase;
   color: var(--emerald);
 }

 .asset-card h3 {
   font-size: clamp(1.5rem, 2.2vw, 1.875rem);
   font-weight: 700;
   color: var(--ink);
   letter-spacing: -0.02em;
   line-height: 1.15;
   margin: 0;
 }

 .asset-card h3 a {
   color: inherit;
   text-decoration: none;
 }

 .asset-card h3 a:hover {
   color: var(--emerald);
 }

 .asset-card p {
   font-size: 18px;
   line-height: 1.5;
   color: var(--ink-60);
   margin: 0;
 }

 .asset-btn {
   margin-top: auto;
   align-self: flex-start;
   display: inline-flex;
   align-items: center;
   gap: 8px;
   padding: 12px 22px;
   border-radius: var(--r-pill);
   background: var(--ink);
   color: var(--on-accent, #fff);
   font-size: 18px;
   font-weight: 600;
   text-decoration: none;
   transition: background-color 200ms var(--ease-out), gap 200ms var(--ease-out), transform 200ms var(--ease-out);
 }

 .asset-btn:hover,
 .asset-btn:focus-visible {
   background: var(--emerald);
   gap: 12px;
   transform: translateY(-1px);
 }

 /* Confirmation timeline (vertical) */
 .timeline-vertical {
   display: grid;
   grid-template-columns: auto auto 1fr;
   gap: var(--space-4) clamp(1rem, 2vw, 1.5rem);
   max-width: var(--max-w-narrow);
   margin-inline: auto;
   align-items: start;
 }

 .tv-item {
   display: contents;
 }

 .tv-node {
   grid-column: 1;
   width: 36px;
   height: 36px;
   border-radius: 50%;
   background: var(--paper);
   border: 1px solid var(--ink-15);
   color: var(--emerald);
   display: grid;
   place-items: center;
   font-size: 18px;
   font-weight: 600;
   letter-spacing: 0.05em;
 }

 .tv-when {
   grid-column: 2;
   display: flex;
   flex-direction: column;
   gap: 2px;
   min-width: 140px;
   color: var(--ink);
   font-size: 18px;
 }

 .tv-step {
   font-size: 18px;
   font-weight: 500;
   letter-spacing: 0.22em;
   text-transform: uppercase;
   color: var(--emerald);
 }

 .tv-what {
   grid-column: 3;
   font-size: 18px;
   line-height: 1.55;
   color: var(--ink-80);
 }

 /* Fit-check two-col cards (confirmation uses .fit-grid) */
 .fit-grid {
   display: grid;
   grid-template-columns: 1fr;
   gap: var(--space-5);
   max-width: 1040px;
   margin: clamp(2rem, 4vw, 3rem) auto 0;
 }

 @media (min-width: 860px) {
   .fit-grid {
     grid-template-columns: 1fr 1fr;
   }
 }

 .fit-card {
   padding: clamp(1.75rem, 3vw, 2.25rem);
   background: var(--paper);
   border: 1px solid var(--ink-15);
   border-radius: var(--r-lg);
 }

 .fit-card--not {
   border-color: rgba(154, 46, 26, 0.28);
 }

 .fit-card h3 {
   font-size: clamp(1.25rem, 1.9vw, 1.625rem);
   font-weight: 700;
   color: var(--ink);
   letter-spacing: -0.025em;
   margin-bottom: var(--space-4);
 }

 .fit-card h3 .accent {
   color: var(--emerald);
 }

 .fit-card h3 .accent-no {
   color: var(--rust);
 }

 .fit-list {
   display: flex;
   flex-direction: column;
   gap: 12px;
 }

 .fit-list li {
   position: relative;
   padding-left: 28px;
   font-size: 18px;
   line-height: 1.55;
   color: var(--ink-80);
 }

 .fit-list li::before {
   position: absolute;
   left: 0;
   top: 2px;
   width: 20px;
   height: 20px;
   border-radius: 50%;
   display: inline-grid;
   place-items: center;
   font-size: 18px;
   font-weight: 600;
 }

 .fit-card:not(.fit-card--not) .fit-list li::before {
   content: "✓";
   background: var(--emerald);
   color: var(--on-accent);
 }

 .fit-card--not .fit-list li::before {
   content: "×";
   background: rgba(154, 46, 26, 0.15);
   color: var(--rust);
   font-size: 18px;
 }

 .fit-list strong {
   color: var(--ink);
   font-weight: 600;
 }

 /* Confirmation 3-step mechanism cards */
 .process-grid {
   display: grid;
   grid-template-columns: 1fr;
   gap: clamp(1rem, 2vw, 1.5rem);
   margin-top: clamp(2rem, 4vw, 3rem);
 }

 @media (min-width: 720px) {
   .process-grid {
     grid-template-columns: 1fr 1fr;
   }
 }

 @media (min-width: 1100px) {
   .process-grid {
     grid-template-columns: repeat(3, 1fr);
   }
 }

 .process-card {
   padding: clamp(1.5rem, 2.5vw, 2rem);
   border: 1px solid var(--ink-15);
   border-radius: var(--r-lg);
   background: var(--paper);
   transition: transform 300ms var(--ease-out), border 300ms var(--ease-out), box-shadow 300ms var(--ease-out);
   display: flex;
   flex-direction: column;
   gap: var(--space-3);
   min-height: 220px;
 }

 .process-card:hover {
   transform: translateY(-4px);
   border-color: var(--emerald);
   box-shadow: var(--shadow-soft);
 }

 .process-card h3 {
   font-size: clamp(1.25rem, 1.8vw, 1.5rem);
   font-weight: 700;
   color: var(--ink);
   letter-spacing: -0.025em;
 }

 .process-card p {
   color: var(--ink-60);
   font-size: 18px;
   line-height: 1.6;
 }

 .process-card .roman {
   font-size: 18px;
   font-weight: 500;
   letter-spacing: 0.22em;
   text-transform: uppercase;
   color: var(--emerald);
 }

 /* Confirmation Q&A quick cards */
 .qa-quick {
   display: grid;
   grid-template-columns: 1fr;
   gap: clamp(1rem, 2vw, 1.5rem);
   margin-top: clamp(2rem, 4vw, 3rem);
 }

 @media (min-width: 720px) {
   .qa-quick {
     grid-template-columns: 1fr 1fr;
   }
 }

 @media (min-width: 1100px) {
   .qa-quick {
     grid-template-columns: repeat(3, 1fr);
   }
 }

 .qa-quick-card {
   padding: clamp(1.25rem, 2.2vw, 1.625rem);
   border: 1px solid var(--ink-15);
   border-radius: var(--r-lg);
   background: var(--paper);
   display: flex;
   flex-direction: column;
   gap: 10px;
 }

 .qa-quick-card .q {
   font-size: 18px;
   font-weight: 600;
   color: var(--ink);
   line-height: 1.3;
 }

 .qa-quick-card .stat {
   font-size: clamp(1.75rem, 2.6vw, 2.25rem);
   font-weight: 700;
   line-height: 1;
   letter-spacing: -0.035em;
   color: var(--emerald);
   display: flex;
   align-items: baseline;
   gap: 8px;
 }

 .qa-quick-card .unit {
   font-size: 18px;
   font-weight: 500;
   letter-spacing: 0.18em;
   text-transform: uppercase;
   color: var(--ink-40);
 }

 .qa-quick-card .a {
   font-size: 18px;
   line-height: 1.55;
   color: var(--ink-60);
 }

 .qa-quick-card .a em {
   color: var(--emerald);
 }

 /* Confirmation checklist */
 .checklist {
   display: grid;
   grid-template-columns: 1fr;
   gap: 10px;
   margin-top: clamp(2rem, 4vw, 3rem);
 }

 @media (min-width: 720px) {
   .checklist {
     grid-template-columns: 1fr 1fr;
     gap: 14px 24px;
   }
 }

 .checklist li {
   display: flex;
   align-items: flex-start;
   gap: 12px;
   padding: 14px 16px;
   background: var(--paper);
   border: 1px solid var(--ink-15);
   border-radius: var(--r-md);
   font-size: 18px;
   color: var(--ink-80);
   line-height: 1.5;
 }

 .checklist li::before {
   content: "✓";
   flex: 0 0 22px;
   width: 22px;
   height: 22px;
   border-radius: 50%;
   background: var(--emerald);
   color: var(--on-accent);
   display: inline-grid;
   place-items: center;
   font-size: 18px;
   font-weight: 700;
 }

 .checklist li strong {
   display: block;
   font-weight: 700;
   font-size: 18px;
   color: var(--ink);
   letter-spacing: -0.01em;
   margin-bottom: 2px;
 }

 /* Phone banner */
 .phone-banner {
   text-align: center;
   padding: clamp(1.5rem, 3vw, 2.5rem);
   background: var(--paper);
   border: 1px solid var(--ink-15);
   border-radius: var(--r-lg);
 }

 .phone-banner .label {
   display: block;
   font-size: 18px;
   font-weight: 500;
   letter-spacing: 0.22em;
   text-transform: uppercase;
   color: var(--emerald);
   margin-bottom: var(--space-3);
 }

 .phone-banner .number {
   display: block;
   font-size: clamp(1.75rem, 3vw, 2.5rem);
   font-weight: 700;
   letter-spacing: -0.03em;
   color: var(--ink);
 }

 .phone-banner p {
   margin-top: var(--space-3);
   font-size: 18px;
   color: var(--ink-60);
   max-width: 48ch;
   margin-inline: auto;
   line-height: 1.55;
 }

 /* Confirmation proof grid (testimonial cards) */
 .proof-grid {
   display: grid;
   grid-template-columns: 1fr;
   gap: clamp(1rem, 2vw, 1.5rem);
   margin-top: clamp(2rem, 4vw, 3rem);
 }

 @media (min-width: 720px) {
   .proof-grid {
     grid-template-columns: 1fr 1fr;
   }
 }

 @media (min-width: 1100px) {
   .proof-grid {
     grid-template-columns: repeat(3, 1fr);
   }
 }

 /* 2-up variant — used for superloom examples where larger thumbnails are preferred */
 .proof-grid--two-up {
   max-width: 1080px;
   margin-inline: auto;
 }

 @media (min-width: 720px) {
   .proof-grid--two-up {
     grid-template-columns: 1fr 1fr;
   }
 }

 @media (min-width: 1100px) {
   .proof-grid--two-up {
     grid-template-columns: 1fr 1fr;
   }
 }

 .proof-card {
   padding: clamp(1.5rem, 2.4vw, 1.875rem);
   background: var(--paper);
   border: 1px solid var(--ink-15);
   border-radius: var(--r-lg);
   display: flex;
   flex-direction: column;
   gap: var(--space-3);
   overflow: hidden;
   transition: transform 300ms var(--ease-out), border 300ms var(--ease-out), box-shadow 300ms var(--ease-out);
 }

 .proof-card:hover {
   transform: translateY(-3px);
   border-color: var(--emerald);
   box-shadow: var(--shadow-soft);
 }

 .proof-card--video {
   padding: 0;
   gap: 0;
 }

 .proof-card--video .proof-body {
   padding: clamp(1.5rem, 2.4vw, 1.875rem);
   display: flex;
   flex-direction: column;
   gap: var(--space-3);
   flex: 1;
 }

 .proof-video {
   display: block;
   background: var(--graphite);
   border-bottom: 1px solid var(--ink-08);
 }

 .proof-video > wistia-player {
   display: block;
   width: 100%;
 }

 .proof-logo-chip {
   display: inline-flex;
   align-items: center;
   gap: 8px;
   font-size: 18px;
   color: var(--ink);
   align-self: flex-start;
 }

 .proof-logo-chip .mono {
   width: 24px;
   height: 24px;
   border-radius: 6px;
   background: var(--emerald);
   color: var(--on-accent);
   display: grid;
   place-items: center;
   font-size: 18px;
   font-weight: 700;
 }

 .proof-meta {
   display: inline-flex;
   align-items: center;
   gap: 6px;
   font-size: 18px;
   font-weight: 500;
   letter-spacing: 0.18em;
   text-transform: uppercase;
   color: var(--ink-40);
 }

 .proof-meta .dot {
   width: 4px;
   height: 4px;
   border-radius: 50%;
   background: var(--gold);
 }

 .proof-card h4 {
   font-size: clamp(1.125rem, 1.5vw, 1.3125rem);
   font-weight: 700;
   color: var(--ink);
   letter-spacing: -0.02em;
   line-height: 1.2;
 }

 .proof-card blockquote {
   margin: 0;
   font-size: 18px;
   font-weight: 500;
   line-height: 1.4;
   color: var(--ink);
   padding-left: var(--space-3);
   border-left: 2px solid var(--gold);
 }

 .proof-card .case {
   font-size: 18px;
   color: var(--ink-60);
   line-height: 1.55;
 }

 /* ---------- 26. Reveal on scroll ---------- */
 .reveal {
   opacity: 0;
   transform: translateY(18px);
   transition: opacity 700ms var(--ease-out), transform 700ms var(--ease-out);
 }

 .reveal.is-in {
   opacity: 1;
   transform: translateY(0);
 }

 .reveal[data-delay="1"] {
   transition-delay: 80ms;
 }

 .reveal[data-delay="2"] {
   transition-delay: 160ms;
 }

 .reveal[data-delay="3"] {
   transition-delay: 240ms;
 }

 .reveal[data-delay="4"] {
   transition-delay: 320ms;
 }

 .reveal[data-delay="5"] {
   transition-delay: 400ms;
 }

 @media (prefers-reduced-motion: reduce) {
   * {
     transition: none !important;
     animation: none !important;
   }

   .reveal {
     opacity: 1;
     transform: none;
   }
 }

 /* ---------- 27. FAQ accordion ---------- */
 .faq-list {
   display: flex;
   flex-direction: column;
   gap: 0;
   border-top: 1px solid var(--ink-15);
 }

 .faq-item {
   border-bottom: 1px solid var(--ink-15);
 }

 .faq-q {
   width: 100%;
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 16px;
   padding: 20px 0;
   font-size: 18px;
   font-weight: 600;
   color: var(--ink);
   text-align: left;
   letter-spacing: -0.01em;
 }

 .faq-q-icon {
   width: 28px;
   height: 28px;
   border-radius: 50%;
   border: 1px solid var(--ink-15);
   display: inline-grid;
   place-items: center;
   font-size: 18px;
   color: var(--ink-60);
   transition: transform 220ms var(--ease-out);
   flex: 0 0 28px;
 }

 .faq-item.is-open .faq-q-icon {
   transform: rotate(45deg);
   color: var(--emerald);
   border-color: var(--emerald);
 }

 .faq-a {
   max-height: 0;
   overflow: hidden;
   transition: max-height 400ms var(--ease-out);
 }

 .faq-item.is-open .faq-a {
   max-height: 400px;
 }

 .faq-a-inner {
   padding: 0 0 20px;
   font-size: 18px;
   line-height: 1.65;
   color: var(--ink-60);
   max-width: 68ch;
 }

 /* ---------- 30. Social proof page - receipt images ---------- */
 .receipt {
   margin-top: clamp(2rem, 4vw, 3rem);
   position: relative;
   max-width: 860px;
   margin-left: auto;
   margin-right: auto;
 }

 .receipt--wide {
   max-width: 1100px;
 }

 .receipt-frame {
   position: relative;
   border-radius: var(--r-lg);
   overflow: hidden;
   border: 1px solid var(--ink-15);
   background: var(--paper);
   box-shadow: var(--shadow-soft);
   transition: transform 300ms var(--ease-out), box-shadow 300ms var(--ease-out);
 }

 .receipt-frame:hover {
   transform: translateY(-2px);
   box-shadow: var(--shadow-lift);
 }

 .receipt-frame img {
   width: 100%;
   height: auto;
   display: block;
 }

 .receipt-cap {
   display: flex;
   align-items: center;
   justify-content: space-between;
   flex-wrap: wrap;
   gap: var(--space-3);
   margin-top: var(--space-4);
   font-size: 18px;
   color: var(--ink-60);
   letter-spacing: 0.005em;
 }

 .receipt-cap .mono {
   font-size: 18px;
   font-weight: 500;
   letter-spacing: 0.22em;
   text-transform: uppercase;
   color: var(--ink-40);
 }

 .receipt-cap a {
   color: var(--emerald);
   font-weight: 600;
   border-bottom: 1px solid var(--emerald);
   padding-bottom: 1px;
   transition: opacity 200ms var(--ease-out);
 }

 .receipt-cap a:hover {
   opacity: 0.7;
 }

 /* TOC card grid for social proof page */
 .toc-grid {
   margin-top: clamp(2rem, 4vw, 3rem);
   display: grid;
   grid-template-columns: 1fr;
   gap: clamp(0.75rem, 1.4vw, 1rem);
 }

 @media (min-width: 720px) {
   .toc-grid {
     grid-template-columns: repeat(2, 1fr);
   }
 }

 @media (min-width: 1100px) {
   .toc-grid {
     grid-template-columns: repeat(5, 1fr);
   }
 }

 .toc-card {
   display: flex;
   flex-direction: column;
   gap: var(--space-2);
   padding: clamp(1.25rem, 2vw, 1.5rem);
   background: var(--paper);
   border: 1px solid var(--ink-15);
   border-radius: var(--r-md);
   transition: transform 220ms var(--ease-out), border 220ms var(--ease-out), box-shadow 220ms var(--ease-out);
   height: 100%;
 }

 .toc-card:hover {
   transform: translateY(-3px);
   border-color: var(--emerald);
   box-shadow: var(--shadow-soft);
 }

 .toc-num {
   font-size: 18px;
   font-weight: 500;
   letter-spacing: 0.22em;
   text-transform: uppercase;
   color: var(--gold);
 }

 .toc-title {
   font-size: clamp(1.125rem, 1.3vw, 1.125rem);
   font-weight: 700;
   color: var(--ink);
   line-height: 1.2;
   letter-spacing: -0.02em;
 }

 .toc-sub {
   font-size: 18px;
   line-height: 1.45;
   color: var(--ink-60);
   margin-top: auto;
 }

 /* Big result headline — leads each insane-proof exhibit */
 .exhibit-result {
   display: flex;
   flex-direction: column;
   align-items: center;
   gap: 6px;
   margin: var(--space-3) auto var(--space-4);
 }

 .exhibit-result-num {
   font-size: clamp(4rem, 9vw, 7.5rem);
   font-weight: 700;
   line-height: 0.92;
   letter-spacing: -0.05em;
   color: var(--emerald);
   font-feature-settings: "tnum" 1;
 }

 .exhibit-result-tag {
   font-size: clamp(1.125rem, 1.4vw, 1.25rem);
   font-weight: 600;
   letter-spacing: 0.18em;
   text-transform: uppercase;
   color: var(--ink-60);
 }

 /* Big stat row used under each send */
 .send-stats {
   margin-top: clamp(1.5rem, 3vw, 2.25rem);
   display: grid;
   grid-template-columns: repeat(3, 1fr);
   gap: clamp(0.5rem, 1vw, 1rem);
   padding: clamp(1.25rem, 2vw, 1.5rem);
   background: var(--mist);
   border-radius: var(--r-lg);
   max-width: 860px;
   margin-left: auto;
   margin-right: auto;
 }

 @media (max-width: 560px) {
   .send-stats {
     grid-template-columns: 1fr;
   }
 }

 .send-stat {
   display: flex;
   flex-direction: column;
   gap: 4px;
   padding: 0 clamp(0.5rem, 1vw, 1rem);
   border-right: 1px solid var(--ink-15);
 }

 .send-stat:last-child {
   border-right: 0;
 }

 @media (max-width: 560px) {
   .send-stat {
     border-right: 0;
     border-bottom: 1px solid var(--ink-15);
     padding: var(--space-3) 0;
   }
   .send-stat:last-child { border-bottom: 0; }
 }

 .send-stat .num {
   font-size: clamp(2rem, 3.5vw, 3rem);
   font-weight: 700;
   line-height: 1;
   letter-spacing: -0.03em;
   color: var(--emerald);
 }

 .send-stat .label {
   font-size: 18px;
   color: var(--ink-60);
   line-height: 1.4;
 }

 /* ---------- Proof Wall (LinkedIn / DM reactions) ---------- */
 .proof-wall { background: var(--paper); }

 .proof-grid {
   display: flex;
   gap: var(--space-5);
   align-items: flex-start;
   max-width: 1120px;
   margin: 0 auto;
 }

 .proof-col {
   flex: 1 1 0;
   display: flex;
   flex-direction: column;
   gap: var(--space-5);
   min-width: 0;
 }

 .proof-cell {
   margin: 0 0 var(--space-5) 0;
   break-inside: avoid;
   -webkit-column-break-inside: avoid;
   page-break-inside: avoid;
   border-radius: var(--r-lg);
   overflow: hidden;
   background: transparent;
   box-shadow: var(--shadow-soft);
   border: 1px solid var(--ink-08);
   transition: transform 0.35s var(--ease-out), box-shadow 0.35s var(--ease-out);
   line-height: 0;
 }

 .proof-cell:hover {
   transform: translateY(-2px);
   box-shadow: var(--shadow-lift);
 }

 .proof-cell img {
   width: 100%;
   height: auto;
   display: block;
 }

 @media (max-width: 980px) {
   .proof-grid { flex-wrap: wrap; }
   .proof-col { flex: 1 1 calc(50% - var(--space-5)); }
 }

 @media (max-width: 620px) {
   .proof-col { flex: 1 1 100%; }
 }

 /* =========================================================
    Working-With-Us page — components
    ========================================================= */

 /* Recurring Lincko guarantee anchor card */
 .guarantee-anchor {
   max-width: var(--max-w-narrow);
   width: calc(100% - clamp(2rem, 8vw, 3rem));
   margin: clamp(3rem, 6vw, 5rem) auto;
   padding: clamp(2rem, 4vw, 3rem) clamp(1.5rem, 3vw, 2.5rem);
   border: 2px solid var(--emerald);
   border-radius: var(--r-lg);
   text-align: center;
   background: var(--paper);
 }

 .guarantee-anchor .guarantee-brand {
   display: inline-flex;
   align-items: center;
   gap: var(--space-3);
   margin-bottom: var(--space-5);
 }

 .guarantee-anchor .guarantee-brand img {
   width: 32px;
   height: 32px;
   object-fit: contain;
 }

 .guarantee-anchor .guarantee-brand span {
   font-size: 22px;
   font-weight: 700;
   letter-spacing: -0.025em;
   color: var(--ink);
 }

 .guarantee-anchor .guarantee-copy {
   font-size: clamp(1.375rem, 2.4vw, 1.75rem);
   line-height: 1.4;
   font-weight: 500;
   color: var(--ink);
   margin: 0 auto;
   max-width: 40ch;
 }

 .guarantee-anchor .guarantee-copy em {
   color: var(--emerald);
   font-weight: 700;
 }

 .guarantee-anchor .guarantee-terms {
   margin-top: var(--space-5);
   font-size: 18px;
   letter-spacing: 0.22em;
   text-transform: uppercase;
   color: var(--ink-60);
   font-weight: 500;
 }

 /* Rust alert block — "Don't skip the video" and "WOW'ed doesn't just mean impressive" */
 .alert-rust {
   max-width: var(--max-w-narrow);
   margin: clamp(1.5rem, 3vw, 2.5rem) auto;
   padding: clamp(1.25rem, 2.4vw, 1.75rem) clamp(1.5rem, 3vw, 2.25rem);
   background: var(--rust);
   color: var(--on-accent);
   border-radius: var(--r-md);
   text-align: center;
 }

 .alert-rust .alert-title {
   font-size: clamp(1.125rem, 2vw, 1.375rem);
   font-weight: 700;
   letter-spacing: -0.015em;
   margin: 0 0 var(--space-2);
 }

 .alert-rust p {
   font-size: 18px;
   line-height: 1.5;
   margin: 0;
   color: rgba(255, 255, 255, 0.92);
 }

 /* Three-up question nav (TOC) */
 .q-nav {
   display: grid;
   grid-template-columns: 1fr;
   gap: var(--space-5);
   max-width: var(--max-w-narrow);
   margin: var(--space-7) auto 0;
 }

 @media (min-width: 820px) {
   .q-nav { grid-template-columns: repeat(3, 1fr); }
 }

 .q-card {
   display: flex;
   flex-direction: column;
   justify-content: space-between;
   gap: var(--space-5);
   padding: clamp(1.5rem, 2.6vw, 2rem);
   border: 1px solid var(--ink-15);
   border-radius: var(--r-lg);
   background: var(--paper);
   color: var(--ink);
   transition: border-color 200ms var(--ease-out), transform 200ms var(--ease-out), box-shadow 200ms var(--ease-out);
 }

 .q-card:hover {
   border-color: var(--emerald);
   transform: translateY(-2px);
   box-shadow: var(--shadow-soft);
 }

 .q-card .q-num {
   font-size: 18px;
   font-weight: 500;
   letter-spacing: 0.22em;
   text-transform: uppercase;
   color: var(--emerald);
 }

 .q-card .q-body {
   font-size: 18px;
   font-weight: 600;
   line-height: 1.3;
   letter-spacing: -0.015em;
   color: var(--ink);
 }

 .q-card .q-arrow {
   font-size: 20px;
   color: var(--emerald);
   font-weight: 600;
 }

 /* Pull-quote (gold hairline + centered ink display quote) */
 .pull-quote {
   max-width: var(--max-w-prose);
   margin: clamp(3rem, 6vw, 5rem) auto;
   text-align: center;
   padding: 0 var(--space-5);
 }

 .pull-quote::before {
   content: "";
   display: block;
   width: 56px;
   height: 2px;
   background: var(--gold);
   margin: 0 auto var(--space-5);
 }

 .pull-quote p {
   font-size: clamp(1.625rem, 3.4vw, 2.5rem);
   font-weight: 700;
   letter-spacing: -0.03em;
   line-height: 1.15;
   color: var(--ink);
   margin: 0;
 }

 /* Numbered step card stack (Step 1 - Step 6) */
 .step-stack {
   max-width: var(--max-w-narrow);
   margin: clamp(2rem, 4vw, 3rem) auto 0;
   display: flex;
   flex-direction: column;
   gap: var(--space-5);
 }

 .step-card {
   padding: clamp(1.75rem, 3vw, 2.25rem);
   border: 1px solid var(--ink-15);
   border-radius: var(--r-lg);
   background: var(--paper);
 }

 .step-card .step-eyebrow {
   font-size: 18px;
   font-weight: 500;
   letter-spacing: 0.22em;
   text-transform: uppercase;
   color: var(--emerald);
   margin: 0 0 var(--space-3);
 }

 .step-card .step-title {
   font-size: clamp(1.5rem, 2.6vw, 1.875rem);
   font-weight: 700;
   letter-spacing: -0.025em;
   line-height: 1.15;
   color: var(--ink);
   margin: 0 0 var(--space-4);
 }

 .step-card .step-body p {
   font-size: 18px;
   line-height: 1.6;
   color: var(--ink-80);
   margin: 0 0 var(--space-3);
 }

 .step-card .step-body p:last-child {
   margin-bottom: 0;
 }

 .step-card .step-body ol {
   list-style: none;
   padding: 0;
   margin: var(--space-4) 0 0;
   display: flex;
   flex-direction: column;
   gap: var(--space-3);
   counter-reset: substep;
 }

 .step-card .step-body ol li {
   display: flex;
   align-items: flex-start;
   gap: var(--space-3);
   font-size: 18px;
   line-height: 1.5;
   color: var(--ink);
   counter-increment: substep;
 }

 .step-card .step-body ol li::before {
   content: counter(substep);
   flex: 0 0 26px;
   height: 26px;
   width: 26px;
   border-radius: 50%;
   border: 1.5px solid var(--emerald);
   display: inline-grid;
   place-items: center;
   font-size: 18px;
   font-weight: 600;
   color: var(--emerald);
   margin-top: 1px;
 }

 /* 4-quadrant workshop diagram for Step 2 */
 .quad-diagram {
   display: grid;
   grid-template-columns: 1fr auto 1fr;
   grid-template-rows: auto auto;
   gap: clamp(1rem, 2vw, 1.5rem) clamp(0.75rem, 1.8vw, 1.25rem);
   align-items: center;
   max-width: 620px;
   margin: var(--space-6) auto;
 }

 .quad-diagram .quad-label {
   font-weight: 600;
   font-size: 18px;
   line-height: 1.3;
   color: var(--ink);
 }

 .quad-diagram .quad-label--l { text-align: right; }
 .quad-diagram .quad-label--r { text-align: left; }

 .quad-diagram .quad-circles {
   grid-column: 2;
   grid-row: 1 / span 2;
   display: grid;
   grid-template-columns: 1fr 1fr;
   grid-template-rows: 1fr 1fr;
   gap: 3px;
 }

 .quad-diagram .quad-circle {
   width: clamp(44px, 9vw, 64px);
   height: clamp(44px, 9vw, 64px);
   border-radius: 50%;
   border: 2px solid var(--emerald);
   display: grid;
   place-items: center;
   font-weight: 700;
   font-size: clamp(15px, 2.2vw, 18px);
   color: var(--ink);
   background: var(--paper);
 }

 @media (max-width: 560px) {
   .quad-diagram .quad-label {
     font-size: 18px;
   }
 }

 /* Emerald-bordered CTA pill strip */
 .cta-strip {
   max-width: var(--max-w-narrow);
   margin: clamp(2rem, 4vw, 3rem) auto;
   padding: clamp(1.25rem, 2.4vw, 1.75rem) clamp(1.5rem, 3vw, 2.25rem);
   border: 2px solid var(--emerald);
   border-radius: var(--r-pill);
   text-align: center;
   font-size: clamp(1.125rem, 1.9vw, 1.375rem);
   font-weight: 600;
   letter-spacing: -0.015em;
   color: var(--ink);
   line-height: 1.3;
 }

 /* 2-up case study grid (Kirill / Abdulazeez) */
 .case-grid {
   display: flex;
   flex-direction: column;
   gap: clamp(1.5rem, 3vw, 2.5rem);
   max-width: 880px;
   margin: clamp(2rem, 4vw, 3rem) auto 0;
 }

 .case-card {
   padding: clamp(1.75rem, 3vw, 2.5rem);
   border: 1px solid var(--ink-15);
   border-radius: var(--r-lg);
   background: var(--paper);
   display: flex;
   flex-direction: column;
   gap: var(--space-4);
 }

 .case-card-head {
   display: flex;
   align-items: center;
   gap: var(--space-4);
 }

 .case-card-photo {
   width: 72px;
   height: 72px;
   border-radius: 50%;
   object-fit: cover;
   flex: 0 0 72px;
 }

 .case-card .case-name {
   font-size: clamp(1.625rem, 2.6vw, 2rem);
   font-weight: 700;
   letter-spacing: -0.03em;
   color: var(--ink);
   margin: 0;
 }

 .case-card .case-role {
   font-size: 18px;
   color: var(--ink-60);
   letter-spacing: 0.02em;
   margin: 0;
 }

 .case-card .case-video {
   border-radius: var(--r-md);
   overflow: hidden;
   background: var(--graphite);
 }

 .case-card .case-bullets {
   display: flex;
   flex-direction: column;
   gap: var(--space-3);
 }

 .case-card .case-bullets-label {
   font-size: 18px;
   font-weight: 500;
   letter-spacing: 0.22em;
   text-transform: uppercase;
   color: var(--emerald);
 }

 .case-card .case-bullets ul {
   display: flex;
   flex-direction: column;
   gap: var(--space-3);
 }

 .case-card .case-bullets li {
   position: relative;
   padding-left: var(--space-5);
   font-size: 18px;
   line-height: 1.55;
   color: var(--ink-80);
 }

 .case-card .case-bullets li::before {
   content: "→";
   position: absolute;
   left: 0;
   color: var(--emerald);
   font-weight: 700;
 }

 /* Noah case study video + results + testimonial layout */
 .noah-block {
   max-width: var(--max-w-narrow);
   margin: clamp(2rem, 4vw, 3rem) auto 0;
   display: flex;
   flex-direction: column;
   gap: var(--space-6);
 }

 .noah-video {
   border-radius: var(--r-lg);
   overflow: hidden;
   box-shadow: var(--shadow-lift);
   background: var(--graphite);
 }

 .noah-results {
   padding: clamp(1.5rem, 2.8vw, 2rem);
   border: 1px solid var(--ink-15);
   border-left: 3px solid var(--emerald);
   border-radius: var(--r-md);
   background: var(--paper);
 }

 .noah-results h3 {
   font-size: 18px;
   font-weight: 700;
   letter-spacing: -0.01em;
   margin: 0 0 var(--space-4);
   color: var(--ink);
 }

 .noah-results ul {
   display: flex;
   flex-direction: column;
   gap: var(--space-3);
 }

 .noah-results li {
   position: relative;
   padding-left: var(--space-5);
   font-size: 18px;
   line-height: 1.55;
   color: var(--ink-80);
 }

 .noah-results li::before {
   content: "→";
   position: absolute;
   left: 0;
   color: var(--emerald);
   font-weight: 700;
 }

 .noah-quote {
   padding: clamp(1.75rem, 3vw, 2.25rem);
   border: 1px solid var(--ink-15);
   border-radius: var(--r-lg);
   background: var(--paper);
   position: relative;
 }

 .noah-quote .quote-mark {
   font-size: 72px;
   line-height: 0.6;
   color: var(--gold);
   opacity: 0.65;
   display: block;
   margin-bottom: var(--space-2);
 }

 .noah-quote p {
   font-size: clamp(1.125rem, 1.9vw, 1.375rem);
   font-weight: 500;
   line-height: 1.4;
   letter-spacing: -0.015em;
   color: var(--ink);
   margin: 0;
 }

 .noah-quote .attr {
   margin-top: var(--space-4);
   font-size: 18px;
   font-weight: 500;
   letter-spacing: 0.22em;
   text-transform: uppercase;
   color: var(--emerald);
 }

 /* Consume-this-next final card */
 .consume-card {
   max-width: var(--max-w-prose);
   margin: clamp(2rem, 4vw, 3rem) auto 0;
   padding: clamp(2rem, 4vw, 3rem);
   border: 1px solid var(--ink-15);
   border-radius: var(--r-lg);
   background: var(--paper);
   text-align: center;
 }

 .consume-card h3 {
   font-size: clamp(1.625rem, 3vw, 2.125rem);
   font-weight: 700;
   letter-spacing: -0.03em;
   line-height: 1.15;
   margin: 0 0 var(--space-5);
   color: var(--ink);
 }

 .consume-card .consume-body p {
   font-size: 18px;
   line-height: 1.55;
   color: var(--ink-80);
   margin: 0 0 var(--space-3);
 }

 .consume-card .consume-arrow {
   margin: var(--space-6) 0 var(--space-5);
   font-size: 18px;
   font-weight: 500;
   letter-spacing: 0.22em;
   text-transform: uppercase;
   color: var(--emerald);
 }

 /* Stacked body copy wrapper — one sentence per line with generous spacing */
 .stacked-body {
   max-width: var(--max-w-prose);
   margin: clamp(1.5rem, 3vw, 2.5rem) auto;
   padding: 0 var(--space-5);
 }

 .stacked-body p {
   font-size: 18px;
   line-height: 1.7;
   color: var(--ink-80);
   margin: 0 0 var(--space-4);
 }

 .stacked-body p:last-child { margin-bottom: 0; }

 .stacked-body ul {
   margin: var(--space-4) 0;
   display: flex;
   flex-direction: column;
   gap: var(--space-2);
 }

 .stacked-body ul li {
   position: relative;
   padding-left: var(--space-5);
   font-size: 18px;
   line-height: 1.6;
   color: var(--ink-80);
 }

 .stacked-body ul li::before {
   content: "—";
   position: absolute;
   left: 0;
   color: var(--gold);
   font-weight: 600;
 }

 /* ==========================================================
    RESPONSIVE — Mobile-first overrides
    ========================================================== */

 /* --- Small phones (≤ 560px) --- */
 @media (max-width: 560px) {
   body {
     font-size: 18px;
   }

   .eyebrow {
     font-size: 18px;
     letter-spacing: 0.12em;
   }

   .h-display {
     font-size: clamp(1.75rem, 7vw, 2.5rem);
   }

   .h-section {
     font-size: clamp(1.75rem, 7vw, 2.5rem);
   }

   .h-section.h-section--xl {
     font-size: clamp(2.25rem, 9vw, 3.5rem);
   }

   .h-sub {
     font-size: clamp(1.375rem, 5.5vw, 1.75rem);
   }

   .lead {
     font-size: clamp(1.125rem, 4.5vw, 1.375rem);
   }

   .hero-sub {
     font-size: clamp(1.125rem, 4.2vw, 1.25rem);
   }

   .hero {
     padding-top: clamp(7rem, 19vw, 8.5rem);
   }

   .hero-callout {
     font-size: 13px;
     letter-spacing: 0.16em;
     padding: 5px 10px;
   }

   .btn-hero-lg {
     height: 54px;
     padding: 0 clamp(1.25rem, 4vw, 1.75rem);
     font-size: 18px;
   }

   /* Allow long-text buttons to wrap on narrow screens so they don't push the page wider than the viewport */
   .btn {
     white-space: normal;
     text-align: center;
     line-height: 1.2;
     height: auto;
     min-height: 54px;
     padding-top: 12px;
     padding-bottom: 12px;
     max-width: 100%;
   }

   /* Close-rate strip: stack the 3 stats vertically so they fit narrow viewports */
   .cr-row {
     grid-template-columns: 1fr;
     gap: var(--space-3);
   }

   .cr-arrow {
     transform: rotate(90deg);
   }

   /* Workshop quadrant labels: let the 1fr grid tracks shrink so labels wrap */
   .quad-diagram .quad-label {
     min-width: 0;
   }

   /* Confirmation hero stats: drop from 4-col to 2-col so descriptions like "super outreaches sent" don't push the hero wider than the viewport */
   .conf-stats {
     grid-template-columns: repeat(2, 1fr);
   }

   .conf-stat {
     min-width: 0;
   }

   .bio-photo {
     flex: 0 0 auto;
     width: 100%;
   }

   .reactions .bio-photo {
     flex: 0 0 auto;
     width: 100%;
   }

   .bio-photos-stack {
     flex-direction: column;
     max-width: 100%;
   }

   .bio-photos-stack img {
     width: 100%;
   }

   .prospect-logos {
     gap: var(--space-3);
     flex-wrap: wrap;
     max-width: 100%;
   }

   .prospect-logo-lg {
     height: 24px;
     max-width: 30vw;
     object-fit: contain;
   }

   .prospect-logo-sep {
     height: 20px;
   }

   .logo-marquee-item {
     height: 32px;
     max-width: 140px;
   }

   .logo-marquee-track {
     gap: 2rem;
   }

   .logo-marquee-title {
     letter-spacing: 0.14em;
   }

   .exhibit-headshot {
     width: 88px;
     height: 88px;
   }

   .exhibit-headshots {
     gap: var(--space-3);
   }

   .result-stat .num {
     min-width: 80px;
     font-size: clamp(1.75rem, 7vw, 2.5rem);
   }

   .loop-node {
     min-height: auto;
   }

   .pb-card {
     min-height: auto;
     padding: clamp(1.5rem, 5vw, 2.25rem);
   }

   .testi-tag {
     font-size: 18px;
     letter-spacing: 0.15em;
   }

   .form-shell {
     padding: clamp(1rem, 4vw, 1.5rem);
   }
 }

 /* --- Tablets and below (≤ 720px) --- */
 @media (max-width: 720px) {
   .nav-inner {
     padding: 6px 8px 6px 14px;
   }

   .nav-brand-word {
     display: none;
   }

   .prospect-cred {
     gap: var(--space-4);
   }

   .prospect-meta {
     font-size: 18px;
   }

   .prospect-story p {
     font-size: clamp(1.125rem, 4vw, 1.1875rem);
   }

   .breakout {
     flex-direction: column;
   }

   .loop-arrow {
     transform: rotate(90deg);
   }

   .proof-grid {
     flex-direction: column;
   }

   .case-study-card {
     flex-direction: column-reverse;
   }

   .case-study-media {
     width: 100%;
     border-left: none;
     border-bottom: 1px solid var(--ink-08);
   }

   /* ----------------------------------------------------------------
      Mobile button centering (defensive)
      Every .btn across the site must center on mobile unless it lives
      inside a layout that has its own placement (nav, qualification
      form). .hero-cta-row already centers via flex; this block also
      catches standalone buttons orphaned inside .hero-head / .section-head
      / .wrap-narrow / .final-cta containers.
      ---------------------------------------------------------------- */

   .hero-cta-row {
     justify-content: center;
     flex-wrap: wrap;
   }

   .hero-head > a.btn,
   .hero-head > button.btn,
   .section-head > a.btn,
   .section-head > button.btn,
   .wrap-narrow > a.btn,
   .wrap-narrow > button.btn,
   .final-cta a.btn,
   .final-cta button.btn,
   section > .wrap > a.btn,
   section > .wrap > button.btn,
   section > .wrap > .reveal > a.btn,
   section > .wrap > .reveal > button.btn {
     display: flex;
     margin-inline: auto;
     width: fit-content;
     max-width: 100%;
   }

   /* Form submit must stay full-width — restore explicit override */
   form a.btn,
   form button.btn,
   form a.btn[data-form-submit],
   form button.btn[data-form-submit] {
     display: inline-flex;
     margin-inline: 0;
     width: 100%;
   }

   /* When the mobile nav is opened, center the standalone Apply pill that
      lives at the end of .nav-inner so it doesn't pin to one edge. */
   .nav.is-nav-open .nav-inner > a.btn {
     align-self: stretch;
     justify-content: center;
     width: 100%;
     margin-top: 6px;
   }
 }