:root {
          --site-header-h: 5.75rem;
          --cream: #F2EAD9;
          --cream-deep: #EBE0C9;
          --ink: #1F1A14;
          --ink-soft: #463C2E;
          --terracotta: #B65232;
          --terracotta-deep: #8E3D22;
          --forest: #2F4032;
          --sage: #6B7A5C;
          --mustard: #C68F3E;
          --honey: #E8D494;
          --rule: rgba(31, 26, 20, 0.18);
        }

        * { box-sizing: border-box; margin: 0; padding: 0; }

        html {
          scroll-behavior: smooth;
          scroll-padding-top: var(--site-header-h);
        }

        body {
          font-family: 'Instrument Sans', system-ui, sans-serif;
          background: var(--cream);
          color: var(--ink);
          font-size: 17px;
          line-height: 1.55;
          -webkit-font-smoothing: antialiased;
          overflow-x: hidden;
          position: relative;
        }

        /* Paper grain overlay */
        body::before {
          content: '';
          position: fixed;
          inset: 0;
          pointer-events: none;
          z-index: 100;
          opacity: 0.35;
          mix-blend-mode: multiply;
          background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.12 0 0 0 0 0.10 0 0 0 0 0.08 0 0 0 0.18 0'/></filter><rect width='200' height='200' filter='url(%23n)'/></svg>");
        }

        /* ─── Typography ─── */
        .serif { font-family: 'Inter', system-ui, sans-serif; }
        .display {
          font-family: 'Inter', system-ui, sans-serif;
          font-optical-sizing: auto;
          font-variation-settings: "opsz" 32;
          letter-spacing: -0.035em;
          line-height: 1.05;
        }

        .eyebrow {
          font-family: 'Instrument Sans', sans-serif;
          font-size: 0.7rem;
          letter-spacing: 0.18em;
          text-transform: uppercase;
          font-weight: 600;
          color: #FFFFFF;
          background: var(--terracotta);
          padding: 0.5rem 1rem;
          border-radius: 999px;
          display: inline-block;
          line-height: 1.4;
        }

        .eyebrow::before {
          display: none;
        }

        /* ─── Layout ─── */
        .wrap {
          max-width: 1280px;
          margin: 0 auto;
          padding: 0 2.5rem;
        }

        section { position: relative; }

        /* ─── Site header (fixed) — bar is the <nav> so forest spans edge-to-edge ─── */
        .site-header {
          position: fixed;
          top: 0;
          left: 0;
          right: 0;
          z-index: 150;
          background: transparent;
          border-bottom: none;
        }

        /* ─── Nav ─── */
        nav {
          background: var(--forest);
          border-bottom: 1px solid rgba(242, 234, 217, 0.12);
          position: relative;
          z-index: 10;
        }

        .nav-inner {
          max-width: 1280px;
          margin: 0 auto;
          padding: 1.5rem 2.5rem;
          display: flex;
          align-items: center;
          justify-content: space-between;
        }

        .brand {
          font-family: 'Inter', system-ui, sans-serif;
          font-weight: 600;
          font-size: 1.5rem;
          letter-spacing: -0.02em;
          display: flex;
          align-items: center;
          gap: 0.7rem;
          color: var(--cream);
          text-decoration: none;
        }

        .brand em {
          font-style: italic;
          color: var(--mustard);
          font-weight: 500;
        }

        .brand-mark {
          width: 28px;
          height: 28px;
          position: relative;
          flex-shrink: 0;
        }

        .brand-mark svg { width: 100%; height: 100%; }

        .nav-links {
          display: flex;
          gap: 2.5rem;
          align-items: center;
          font-size: 0.92rem;
          color: rgba(242, 234, 217, 0.85);
        }

        .nav-links a {
          color: inherit;
          text-decoration: none;
          position: relative;
          transition: color .2s;
        }

        .nav-links a:not(.nav-cta) {
          font-weight: 600;
        }

        .nav-links a:hover { color: var(--honey); }

        .nav-links a:not(.nav-cta)::after {
          content: '';
          position: absolute;
          left: 0;
          right: 0;
          bottom: -0.45rem;
          height: 2px;
          background: var(--terracotta);
          transform: scaleX(0);
          transform-origin: left center;
          transition: transform .2s ease;
        }

        .nav-links a:not(.nav-cta):hover::after,
        .nav-links a:not(.nav-cta).is-active::after {
          transform: scaleX(1);
        }

        .nav-links a:not(.nav-cta).is-active::after {
          background: var(--mustard);
        }

        .nav-links a:not(.nav-cta).is-active {
          color: var(--mustard);
        }

        .nav-links a.nav-cta {
          background: var(--ink);
          color: #FFFFFF;
          padding: 0.7rem 1.3rem;
          border-radius: 999px;
          font-size: 0.88rem;
          font-weight: 500;
          transition: all .25s;
        }
        .nav-links a.nav-cta:hover {
          background: var(--terracotta);
          color: #FFFFFF;
        }

        /* ─── HERO ─── */
        .hero {
          padding: calc(5rem + var(--site-header-h)) 0 7rem;
          position: relative;
        }

        .hero-grid {
          display: grid;
          grid-template-columns: 1.2fr 1fr;
          gap: 5rem;
          align-items: center;
        }

        .hero-headline {
          font-size: clamp(3rem, 7.5vw, 6.5rem);
          font-weight: 300;
          color: var(--ink);
          margin: 1.75rem 0 1.75rem;
        }

        .hero-tagline {
          font-size: 1.18rem;
          line-height: 1.55;
          color: var(--ink-soft);
          margin-bottom: 1rem;
        }

        .hero-headline .em {
          font-style: italic;
          font-weight: 300;
          font-variation-settings: "opsz" 32;
        }

        .hero-sub {
          font-size: 1.18rem;
          line-height: 1.55;
          color: var(--ink-soft);
          max-width: 36rem;
          margin-bottom: 2.5rem;
        }

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

        .hero-ctas {
          display: flex;
          gap: 1rem;
          align-items: center;
          flex-wrap: wrap;
        }

        .btn {
          display: inline-flex;
          align-items: center;
          gap: 0.6rem;
          padding: 1rem 1.7rem;
          border-radius: 999px;
          font-family: 'Instrument Sans', sans-serif;
          font-size: 0.98rem;
          font-weight: 500;
          text-decoration: none;
          cursor: pointer;
          transition: all .25s ease;
          border: none;
        }

        .btn-primary {
          background: var(--ink);
          color: var(--cream);
        }
        .btn-primary:hover {
          background: var(--terracotta);
          transform: translateY(-2px);
        }

        .btn-ghost {
          background: transparent;
          color: var(--ink);
          border: 1px solid var(--ink);
        }
        .btn-ghost:hover {
          background: var(--ink);
          color: var(--cream);
        }

        .arrow { transition: transform .25s; }
        .btn:hover .arrow { transform: translateX(4px); }

        /* Hero composition — overlapping circles network illustration */
        .hero-visual {
          aspect-ratio: 4/5;
          position: relative;
          border-radius: 2px;
        }

        .hero-visual svg { width: 100%; height: 100%; display: block; }

        .visual-caption {
          position: absolute;
          bottom: -2.5rem;
          right: 0;
          font-family: 'Inter', system-ui, sans-serif;
          font-style: italic;
          font-size: 0.85rem;
          color: var(--ink-soft);
          max-width: 13rem;
          text-align: right;
          line-height: 1.4;
        }

        /* ─── Knockout (reverse) highlight — italic words inside a colored block, text matching the section bg so it reads as cut out ─── */
        .knockout {
          font-style: italic;
          background: var(--terracotta);
          color: var(--cream);
          padding: 0.02em 0.2em 0.06em;
          border-radius: 4px;
          font-weight: 500;
          box-decoration-break: clone;
          -webkit-box-decoration-break: clone;
        }

        /* Section-specific color overrides — each picks the original italic accent for its bg, section's body bg for text */
        .for-whom .knockout    { background: var(--mustard);  color: var(--cream-deep); }
        .proof .knockout       { background: var(--terracotta); color: var(--cream-deep); }
        .stats-band .knockout  { background: #F8DE96;        color: var(--terracotta); }
        .how .knockout         { background: var(--mustard);  color: var(--forest); }

        /* ─── Section: Who it's for ─── */
        .for-whom {
          --for-whom-title-offset-y: clamp(24px, 7vw, 70px);
          --for-whom-title-offset-x: clamp(6px, 1.8vw, 18px);
          --section-bridge-width: clamp(320px, 65vw, 640px);
          padding: 8rem 0 7rem;
          border-bottom: 1px solid var(--rule);
          background: var(--cream-deep);
          position: relative;
          overflow: visible;
          z-index: 2;
        }

        .section-bridge {
          position: absolute;
          left: 0;
          right: 0;
          bottom: 0;
          transform: translateY(50%);
          pointer-events: none;
          display: flex;
          justify-content: center;
          z-index: 5;
        }

        .section-bridge svg {
          width: var(--section-bridge-width);
          height: auto;
          display: block;
        }

        .for-whom-title {
          grid-area: head;
          margin: 0;
          max-width: none;
          align-self: start;
          padding-left: var(--for-whom-title-offset-x);
          padding-right: 0.5rem;
        }

        .section-title {
          font-size: clamp(2.2rem, 4vw, 3.5rem);
          font-weight: 400;
          line-height: 1.18;
          color: var(--ink);
          margin-top: 1.5rem;
        }

        .for-whom .for-whom-title.section-title {
          margin-top: var(--for-whom-title-offset-y);
        }

        .for-whom-layout {
          display: grid;
          grid-template-columns: repeat(3, minmax(0, 1fr));
          grid-template-rows: auto auto auto;
          grid-template-areas:
            "head c01 p1"
            "c02 p2 c03"
            "c04 ph ph";
          gap: 1.5rem;
          align-items: stretch;
        }

        .mosaic-area-01 { grid-area: c01; }
        .mosaic-area-photo-a { grid-area: p1; }
        .mosaic-area-02 { grid-area: c02; }
        .mosaic-area-photo-b { grid-area: p2; }
        .mosaic-area-03 { grid-area: c03; }
        .mosaic-area-04 { grid-area: c04; }
        .mosaic-area-photo-c { grid-area: ph; }

        /* Row 3: cap height so a real image (object-fit: cover) cannot grow the row */
        .for-whom-layout .mosaic-area-04.mosaic-card,
        .for-whom-layout .mosaic-area-photo-c.mosaic-card {
          min-height: 0;
          max-height: 320px;
          height: 100%;
        }

        .for-whom-layout .mosaic-area-04.mosaic-card {
          overflow-y: auto;
          -webkit-overflow-scrolling: touch;
        }

        .mosaic-card {
          border-radius: 14px;
          overflow: hidden;
          min-height: 320px;
          position: relative;
          transition: transform 0.35s ease;
        }

        .mosaic-card.text-card {
          background: var(--cream);
          border: 1px solid var(--rule);
          padding: 2.5rem 2rem;
          display: flex;
          flex-direction: column;
          gap: 1.5rem;
        }

        .mosaic-num {
          display: inline-flex;
          align-items: center;
          justify-content: center;
          width: 4rem;
          height: 4rem;
          border-radius: 50%;
          font-family: 'Inter', system-ui, sans-serif;
          font-style: italic;
          font-size: 1.3rem;
          font-weight: 500;
          letter-spacing: -0.02em;
          line-height: 1;
          flex-shrink: 0;
        }

        .mosaic-num.num-1 { background: var(--terracotta); color: var(--cream); }
        .mosaic-num.num-2 { background: var(--forest);     color: var(--cream); }
        .mosaic-num.num-3 { background: var(--mustard);    color: var(--ink); }
        .mosaic-num.num-4 { background: var(--sage);       color: var(--cream); }

      .mosaic-card.text-card p {
        font-size: 1.125rem;
        line-height: 1.55;
        color: var(--ink);
        margin: 0;
      }

        .mosaic-card.text-card .accent {
          font-family: 'Inter', system-ui, sans-serif;
          font-style: italic;
          color: var(--terracotta-deep);
          font-weight: 500;
        }

        .mosaic-card.photo-card {
          padding: 0;
          background: var(--ink-soft);
          border-radius: 4px;
        }

        .mosaic-card.photo-card img {
          width: 100%;
          height: 100%;
          object-fit: cover;
          display: block;
          transition: transform 0.6s ease;
        }

        .for-whom-layout .mosaic-area-photo-c.mosaic-card img {
          min-height: 0;
          object-position: center 42%;
        }

        .mosaic-card.photo-card:hover img {
          transform: scale(1.04);
        }

        @media (max-width: 980px) {
          .for-whom-layout .mosaic-area-photo-c.mosaic-card img {
            object-position: center 46%;
          }

          .for-whom-layout {
            grid-template-columns: repeat(2, minmax(0, 1fr));
            grid-template-areas:
              "head head"
              "c01 p1"
              "c02 p2"
              "c03 c03"
              "c04 ph";
          }
        }

        @media (max-width: 640px) {
          .for-whom-layout {
            grid-template-columns: 1fr;
            grid-template-areas:
              "head"
              "c01"
              "p1"
              "c02"
              "p2"
              "c03"
              "c04"
              "ph";
          }
          .mosaic-card { min-height: 240px; }
          .for-whom-layout .mosaic-area-04.mosaic-card,
          .for-whom-layout .mosaic-area-photo-c.mosaic-card {
            max-height: none;
            height: auto;
            min-height: 240px;
          }

          .for-whom-layout .mosaic-area-photo-c.mosaic-card {
            height: 240px;
            min-height: 0;
          }

          .for-whom-layout .mosaic-area-photo-c.mosaic-card img {
            object-position: center center;
          }
        }

        /* Scroll-in: list rows swipe from the right, staggered */
        .for-whom-list--swipe {
          overflow-x: clip;
        }

        .for-whom-list--swipe > li {
          opacity: 0;
          transform: translate3d(2.75rem, 0, 0);
          transition:
            opacity 0.55s cubic-bezier(0.22, 1, 0.36, 1),
            transform 0.65s cubic-bezier(0.22, 1, 0.36, 1);
        }

        .for-whom-list--swipe.is-inview > li {
          opacity: 1;
          transform: translate3d(0, 0, 0);
        }

        .for-whom-list--swipe.is-inview > li:nth-child(1) { transition-delay: 0.04s; }
        .for-whom-list--swipe.is-inview > li:nth-child(2) { transition-delay: 0.16s; }
        .for-whom-list--swipe.is-inview > li:nth-child(3) { transition-delay: 0.28s; }
        .for-whom-list--swipe.is-inview > li:nth-child(4) { transition-delay: 0.4s; }

        @media (prefers-reduced-motion: reduce) {
          .for-whom-list--swipe > li {
            opacity: 1;
            transform: none;
            transition: none;
          }
        }

        /* ─── Problems ─── */
        .problems {
          padding: 7rem 0 6rem;
        }

        .problems-header {
          max-width: 42rem;
          margin-bottom: 5rem;
        }

        .problems-header p {
          margin-top: 1.5rem;
          font-size: 1.15rem;
          color: var(--ink-soft);
        }

        .problems-grid {
          display: grid;
          grid-template-columns: repeat(3, 1fr);
          gap: 3rem 2.5rem;
        }

        .problem {
          position: relative;
          padding-top: 2rem;
          border-top: 2px solid var(--ink);
        }

        .problem-num {
          position: absolute;
          top: -0.85rem;
          left: 0;
          background: var(--cream);
          padding-right: 0.85rem;
          font-family: 'Inter', system-ui, sans-serif;
          font-style: italic;
          font-weight: 500;
          font-size: 0.95rem;
          color: var(--terracotta);
          letter-spacing: 0.05em;
        }

        .problem h3 {
          font-family: 'Inter', system-ui, sans-serif;
          font-weight: 500;
          font-size: 1.55rem;
          line-height: 1.2;
          margin-bottom: 1rem;
          color: var(--ink);
          letter-spacing: -0.01em;
        }

        .problem h3 .stat {
          color: var(--terracotta);
          font-weight: 600;
        }

        .problem p {
          color: var(--ink-soft);
          font-size: 1.02rem;
          line-height: 1.6;
        }

        /* ─── How it works ─── */
        .how {
          padding: 8rem 0;
          background: var(--forest);
          color: var(--cream);
          position: relative;
        }

        /* Default terracotta eyebrow pill works on forest bg */

        .how-header {
          margin-bottom: 5rem;
          max-width: 50rem;
        }

        .how-header h2 {
          font-family: 'Inter', system-ui, sans-serif;
          font-size: clamp(2.2rem, 4.5vw, 3.8rem);
          font-weight: 400;
          line-height: 1.18;
          margin-top: 1.5rem;
          letter-spacing: -0.02em;
        }

        .how-header h2 em {
          font-style: italic;
          font-weight: 300;
        }

        .how-steps {
          display: grid;
          grid-template-columns: repeat(3, 1fr);
          gap: 2.5rem;
          counter-reset: stepc;
        }

        .step {
          counter-increment: stepc;
          padding: 2rem 0 0;
          border-top: 1px solid rgba(242, 234, 217, 0.25);
          position: relative;
        }

        .step::before {
          content: counter(stepc, upper-roman) ".";
          font-family: 'Inter', system-ui, sans-serif;
          font-style: italic;
          font-size: 1rem;
          color: var(--mustard);
          display: block;
          margin-bottom: 1rem;
          letter-spacing: 0.05em;
        }

        .step h4 {
          font-family: 'Inter', system-ui, sans-serif;
          font-weight: 500;
          font-size: 1.45rem;
          line-height: 1.25;
          margin-bottom: 0.85rem;
          letter-spacing: -0.01em;
        }

        .step p {
          color: rgba(242, 234, 217, 0.78);
          font-size: 1rem;
          line-height: 1.6;
        }

        /* ─── CTA section: two options ─── */
        .cta-section {
          --section-bridge-width: clamp(320px, 65vw, 640px);
          padding: 8rem 0 7rem;
          position: relative;
          overflow: visible;
          z-index: 2;
        }

        .cta-header {
          text-align: center;
          max-width: 38rem;
          margin: 0 auto 5rem;
        }

        .cta-header h2 {
          font-family: 'Inter', system-ui, sans-serif;
          font-size: clamp(2.2rem, 4.5vw, 3.6rem);
          font-weight: 400;
          line-height: 1.18;
          margin-top: 1.5rem;
          letter-spacing: -0.02em;
        }

        .cta-header h2 em {
          font-style: italic;
          font-weight: 300;
        }

        .cta-header > .eyebrow { justify-content: center; }

        .cta-grid {
          display: grid;
          grid-template-columns: 1fr;
          gap: 2rem;
          max-width: 640px;
          margin: 0 auto;
        }

        .cta-card {
          padding: 3rem 2.75rem;
          border-radius: 6px;
          position: relative;
          transition: transform .35s ease;
        }

        .cta-card:hover { transform: translateY(-4px); }

        .cta-card.pilot {
          background: var(--terracotta);
          color: var(--cream);
        }

        .cta-badge {
          display: inline-block;
          font-family: 'Inter', system-ui, sans-serif;
          font-style: italic;
          font-size: 0.85rem;
          margin-bottom: 1.5rem;
          letter-spacing: 0.04em;
        }

        .cta-card.pilot .cta-badge { color: #F8DE96; }

        .cta-card h3 {
          font-family: 'Inter', system-ui, sans-serif;
          font-size: 2.1rem;
          font-weight: 500;
          line-height: 1.1;
          margin-bottom: 0.85rem;
          letter-spacing: -0.015em;
        }

        .cta-card .lede {
          font-size: 1.05rem;
          line-height: 1.55;
          margin-bottom: 1.75rem;
          opacity: 0.9;
        }

        .cta-card.pilot .lede { color: rgba(242, 234, 217, 0.9); }

        .perks {
          list-style: none;
          margin-bottom: 2rem;
        }

        .perks li {
          padding: 0.7rem 0;
          border-top: 1px solid;
          display: flex;
          align-items: flex-start;
          gap: 0.75rem;
          font-size: 0.98rem;
          line-height: 1.45;
        }

        .perks li:last-child { border-bottom: 1px solid; }

        .cta-card.pilot .perks li { border-color: rgba(242, 234, 217, 0.25); }

        .perks li::before {
          content: '→';
          font-family: 'Inter', system-ui, sans-serif;
          font-style: italic;
          flex-shrink: 0;
          margin-top: 1px;
        }

        .cta-card.pilot .perks li::before { color: var(--mustard); }

        .signup {
          display: flex;
          gap: 0.5rem;
          margin-top: 1rem;
          align-items: stretch;
          flex-wrap: wrap;
        }

        .signup-hint {
          margin-top: 1.35rem;
          margin-bottom: 0;
          font-size: 0.98rem;
          line-height: 1.5;
          color: rgba(242, 234, 217, 0.9);
        }

        .signup input[type="email"] {
          flex: 1;
          min-width: 0;
          padding: 0.95rem 1.1rem;
          border-radius: 999px;
          border: 1px solid;
          font-family: inherit;
          font-size: 0.95rem;
          background: transparent;
          color: inherit;
          outline: none;
          transition: border-color .2s;
        }

        .signup input::placeholder { opacity: 0.65; }

        .cta-card.pilot .signup input {
          border-color: rgba(242, 234, 217, 0.4);
          color: var(--cream);
        }
        .cta-card.pilot .signup input::placeholder {
          color: rgba(242, 234, 217, 0.85);
          opacity: 1;
        }
        .cta-card.pilot .signup input:focus { border-color: var(--cream); }

        .signup button {
          background: var(--ink);
          color: var(--cream);
          padding: 0.95rem 1.4rem;
          border: none;
          border-radius: 999px;
          font-family: inherit;
          font-size: 0.95rem;
          font-weight: 500;
          cursor: pointer;
          transition: all .25s;
          white-space: nowrap;
        }

        .cta-card.pilot .signup button {
          background: var(--cream);
          color: var(--terracotta-deep);
        }
        .cta-card.pilot .signup button:hover { background: var(--ink); color: var(--cream); }

        /* ─── Social proof ─── */
        .proof {
          padding: 10rem 0 8rem;
          background: var(--cream-deep);
          border-top: 1px solid var(--rule);
          border-bottom: 1px solid var(--rule);
        }

        .proof-header {
          text-align: center;
          margin-bottom: 5rem;
        }

        .proof-header h2 {
          font-family: 'Inter', system-ui, sans-serif;
          font-size: clamp(1.8rem, 3.5vw, 2.6rem);
          font-weight: 400;
          line-height: 1.25;
          margin-top: 1.5rem;
          max-width: 38rem;
          margin-left: auto;
          margin-right: auto;
          letter-spacing: -0.015em;
        }

        .proof-header h2 em {
          font-style: italic;
        }

        .quotes {
          display: grid;
          grid-template-columns: repeat(3, 1fr);
          gap: 2rem;
        }

        .quote {
          background: var(--cream);
          padding: 2.25rem 2rem;
          border-radius: 4px;
          position: relative;
          border: 1px solid var(--rule);
        }

        .quote::before {
          content: '“';
          position: absolute;
          top: 0.5rem;
          left: 1.25rem;
          font-family: 'Inter', system-ui, sans-serif;
          font-size: 4rem;
          color: var(--terracotta);
          line-height: 1;
          opacity: 0.35;
        }

        .quote p {
          font-family: 'Inter', system-ui, sans-serif;
          font-size: 1.12rem;
          line-height: 1.45;
          color: var(--ink);
          margin-bottom: 1.5rem;
          position: relative;
          z-index: 1;
          font-weight: 400;
          letter-spacing: -0.005em;
        }

        .quote-attr {
          font-size: 0.82rem;
          color: var(--ink-soft);
          letter-spacing: 0.04em;
          text-transform: uppercase;
          font-weight: 500;
        }

        .quote-meta {
          font-family: 'Inter', system-ui, sans-serif;
          font-style: italic;
          text-transform: none;
          letter-spacing: 0;
          color: var(--sage);
          font-weight: 400;
          font-size: 0.88rem;
          margin-top: 0.15rem;
        }

        .proof-stat {
          margin-top: 4rem;
          padding-top: 3rem;
          border-top: 1px solid var(--rule);
        }

        .proof-findings {
          display: grid;
          grid-template-columns: repeat(3, 1fr);
          gap: 2rem;
          text-align: center;
        }

        .proof-findings .finding {
          padding: 0 1rem;
          position: relative;
        }

        .proof-findings .finding:not(:last-child)::after {
          content: '';
          position: absolute;
          right: -1rem;
          top: 12%;
          bottom: 12%;
          width: 1px;
          background: var(--rule);
        }

        .proof-findings .big {
          font-family: 'Inter', system-ui, sans-serif;
          font-size: clamp(2.6rem, 5.5vw, 4.2rem);
          font-weight: 300;
          line-height: 1;
          color: var(--terracotta);
          letter-spacing: -0.03em;
        }

        .proof-findings .big .unit {
          font-size: 0.55em;
          font-style: italic;
          color: var(--ink-soft);
          font-weight: 300;
          margin-left: 0.02em;
        }

        .proof-findings .label {
          font-size: 0.95rem;
          color: var(--ink-soft);
          margin-top: 0.85rem;
          font-style: italic;
          font-family: 'Inter', system-ui, sans-serif;
          line-height: 1.4;
          max-width: 18rem;
          margin-left: auto;
          margin-right: auto;
        }

        .proof-source {
          text-align: center;
          margin-top: 2.75rem;
          font-family: 'Instrument Sans', sans-serif;
          font-size: 0.72rem;
          letter-spacing: 0.22em;
          text-transform: uppercase;
          color: var(--ink-soft);
          opacity: 0.7;
        }

        /* ─── Quotes carousel ─── */
        .quotes-carousel {
          padding: 7rem 0;
          background: var(--cream-deep);
          border-top: 1px solid var(--rule);
          border-bottom: 14px solid var(--terracotta-deep);
        }

        .carousel-stage {
          max-width: 760px;
          margin: 0 auto;
          position: relative;
          text-align: center;
          padding-top: 3rem;
        }

        .carousel-stage::before {
          content: '“';
          position: absolute;
          top: -1.25rem;
          left: 50%;
          transform: translateX(-50%);
          font-family: 'Inter', system-ui, sans-serif;
          font-style: normal;
          font-size: 6rem;
          color: var(--terracotta);
          line-height: 1;
          opacity: 0.4;
          pointer-events: none;
        }

        .carousel-track {
          position: relative;
          min-height: 280px;
        }

        .carousel-slide {
          position: absolute;
          inset: 0;
          display: flex;
          align-items: center;
          justify-content: center;
          opacity: 0;
          transition: opacity 0.6s ease;
          pointer-events: none;
        }

        .carousel-slide.is-active {
          opacity: 1;
          pointer-events: auto;
        }

        .carousel-slide blockquote {
          margin: 0;
          padding: 0 1.5rem;
          max-width: 680px;
        }

        .carousel-slide blockquote p {
          font-family: 'Inter', system-ui, sans-serif;
          font-style: italic;
          font-weight: 300;
          font-size: clamp(1.25rem, 2.4vw, 1.75rem);
          line-height: 1.4;
          color: var(--ink);
          letter-spacing: -0.01em;
          margin: 0;
        }

        .carousel-slide cite {
          display: block;
          margin-top: 1.75rem;
          font-family: 'Instrument Sans', sans-serif;
          font-style: normal;
          font-size: 0.78rem;
          letter-spacing: 0.2em;
          text-transform: uppercase;
          color: var(--ink-soft);
          font-weight: 500;
        }

        .carousel-slide cite::before {
          content: '— ';
          margin-right: 0.15rem;
        }

        .carousel-dots {
          display: flex;
          justify-content: center;
          gap: 0.55rem;
          margin-top: 3rem;
          flex-wrap: wrap;
          max-width: 480px;
          margin-left: auto;
          margin-right: auto;
        }

        .carousel-dot {
          width: 7px;
          height: 7px;
          border-radius: 50%;
          border: none;
          background: rgba(31, 26, 20, 0.22);
          padding: 0;
          cursor: pointer;
          transition: background 0.2s, transform 0.2s;
        }

        .carousel-dot:hover {
          background: rgba(31, 26, 20, 0.45);
        }

        .carousel-dot.is-active {
          background: var(--terracotta);
          transform: scale(1.35);
        }

        @media (prefers-reduced-motion: reduce) {
          .carousel-slide { transition: none; }
        }

        @media (max-width: 640px) {
          .quotes-carousel { padding: 5rem 0; }
          .carousel-track { min-height: 340px; }
          .carousel-stage::before { font-size: 4.5rem; top: -1rem; }
        }

        /* ─── Footer ─── */
        footer {
          background: var(--ink);
          color: var(--cream);
          padding: 5rem 0 2.5rem;
        }

        .footer-grid {
          display: grid;
          grid-template-columns: 2fr 1fr;
          gap: 4rem;
          margin-bottom: 4rem;
        }

        .footer-brand {
          font-family: 'Inter', system-ui, sans-serif;
          font-size: 2rem;
          font-weight: 500;
          line-height: 1.15;
          letter-spacing: -0.015em;
          margin-bottom: 1rem;
        }

        .footer-brand em {
          font-style: italic;
          color: var(--mustard);
          font-weight: 300;
        }

        .footer-tag {
          color: rgba(242, 234, 217, 0.6);
          font-size: 0.95rem;
          line-height: 1.5;
          max-width: 22rem;
        }

        .footer-col h5 {
          font-family: 'Instrument Sans', sans-serif;
          font-size: 0.72rem;
          letter-spacing: 0.22em;
          text-transform: uppercase;
          color: var(--mustard);
          margin-bottom: 1.25rem;
          font-weight: 500;
        }

        .footer-col ul { list-style: none; }
        .footer-col li { margin-bottom: 0.65rem; }

        .footer-col a {
          color: rgba(242, 234, 217, 0.75);
          text-decoration: none;
          font-size: 0.95rem;
          transition: color .2s;
        }

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

        .footer-illustration {
          margin: 1rem auto 3rem;
          display: flex;
          justify-content: center;
          align-items: center;
          width: 100%;
        }

        .footer-illustration svg {
          width: 100%;
          max-width: 720px;
          height: auto;
          opacity: 0.92;
          display: block;
        }

        .footer-bottom {
          border-top: 1px solid rgba(242, 234, 217, 0.18);
          padding-top: 2rem;
          display: flex;
          justify-content: space-between;
          align-items: center;
          font-size: 0.85rem;
          color: rgba(242, 234, 217, 0.5);
          flex-wrap: wrap;
          gap: 1rem;
        }

        /* ─── Contact modal ─── */
        .contact-modal {
          border: none;
          padding: 0;
          max-width: 28rem;
          width: calc(100vw - 2rem);
          border-radius: 1rem;
          background: var(--cream);
          color: var(--ink);
          box-shadow: 0 1.5rem 3rem rgba(31, 26, 20, 0.28);
        }

        .contact-modal::backdrop {
          background: rgba(31, 26, 20, 0.55);
          backdrop-filter: blur(5px);
        }

        .contact-modal-inner {
          position: relative;
          padding: 2.25rem 2rem 2rem;
        }

        .contact-modal-close {
          position: absolute;
          top: 0.85rem;
          right: 0.85rem;
          width: 2.25rem;
          height: 2.25rem;
          border: none;
          background: transparent;
          color: var(--ink-soft);
          font-size: 1.5rem;
          line-height: 1;
          cursor: pointer;
          border-radius: 50%;
          display: flex;
          align-items: center;
          justify-content: center;
          transition: background 0.2s, color 0.2s;
        }

        .contact-modal-close:hover {
          background: rgba(31, 26, 20, 0.08);
          color: var(--ink);
        }

        .contact-modal h2 {
          font-family: 'Inter', system-ui, sans-serif;
          font-size: 1.65rem;
          font-weight: 500;
          letter-spacing: -0.02em;
          margin: 0 2rem 0.5rem 0;
          line-height: 1.2;
        }

        .contact-modal .signup-hint {
          margin: 0 0 0.75rem;
          font-size: 0.98rem;
          line-height: 1.5;
          color: var(--ink-soft);
        }

        .contact-modal .signup {
          display: grid;
          grid-template-columns: 1fr;
          gap: 0.55rem;
          margin-top: 0;
        }

        .contact-modal .signup input[type="email"],
        .contact-modal .signup select {
          width: 100%;
          border-radius: 0.65rem;
          border: 1px solid var(--rule);
          background: var(--cream-deep);
          color: var(--ink);
          padding: 0.85rem 1rem;
          font-size: 0.95rem;
        }

        .contact-modal .signup input::placeholder {
          color: rgba(70, 60, 46, 0.55);
          opacity: 1;
        }

        .contact-modal .signup select {
          cursor: pointer;
        }

        .contact-modal .signup select option {
          color: var(--ink);
          background: var(--cream);
        }

        .contact-modal .signup button {
          width: 100%;
          margin-top: 0.25rem;
          border-radius: 0.65rem;
          background: var(--terracotta);
          color: #fff;
          padding: 0.9rem 1.2rem;
          font-weight: 500;
        }

        .contact-modal .signup button:hover {
          background: var(--terracotta-deep);
        }

        .contact-modal .signup button:disabled {
          opacity: 0.75;
          cursor: wait;
        }

        .contact-modal .contact-note {
          font-size: 0.85rem;
          line-height: 1.45;
          color: rgba(70, 60, 46, 0.72);
          margin: 0.85rem 0 0;
        }

        .contact-modal .signup-success {
          padding: 0.5rem 0 0;
          text-align: left;
        }

        .contact-modal .signup-success .success-check {
          color: var(--terracotta);
        }

        .contact-modal .signup-success .success-headline {
          color: var(--forest);
          font-size: 1.35rem;
        }

        .contact-modal .signup-success .success-sub {
          color: var(--ink-soft);
        }

        .contact-modal .signup-success .success-sub strong {
          color: var(--ink);
        }

        .contact-modal .signup-error {
          color: var(--terracotta-deep);
          font-size: 0.88rem;
          margin-top: 0.5rem;
        }

        @media (max-width: 480px) {
          .contact-modal-inner { padding: 2rem 1.35rem 1.65rem; }
        }

        /* ─── Citation markers ─── */
        sup.cite {
          font-size: 0.55em;
          font-weight: 600;
          color: var(--terracotta);
          margin-left: 0.15em;
          vertical-align: super;
          line-height: 0;
          letter-spacing: 0;
        }
        sup.cite a { color: inherit; text-decoration: none; transition: color .2s; }
        sup.cite a:hover { color: var(--mustard); }

        /* ─── Problem card stat treatment ─── */
        .problem .data-wrap {
          margin: 0.5rem 0 1.25rem;
          padding-bottom: 1.25rem;
          border-bottom: 1px dashed rgba(31, 26, 20, 0.22);
        }

        .problem .data {
          font-family: 'Inter', system-ui, sans-serif;
          font-size: 2.75rem;
          font-weight: 300;
          letter-spacing: -0.03em;
          color: var(--terracotta);
          line-height: 1;
          display: block;
        }

        .problem .data .unit {
          font-size: 0.55em;
          font-style: italic;
          font-weight: 300;
          color: var(--ink-soft);
          margin-left: 0.05em;
        }

        .problem .data-caption {
          font-family: 'Inter', system-ui, sans-serif;
          font-style: italic;
          font-size: 0.95rem;
          line-height: 1.45;
          color: var(--ink-soft);
          display: block;
          margin-top: 0.6rem;
        }

        /* ─── Stats band ─── */
        .stats-band {
          padding: 7rem 0;
          background: var(--terracotta);
          color: var(--cream);
          position: relative;
          overflow: hidden;
        }

        .stats-band::before {
          content: '';
          position: absolute;
          inset: 0;
          background-image:
            radial-gradient(ellipse at top left, rgba(254, 215, 170, 0.12), transparent 50%),
            radial-gradient(ellipse at bottom right, rgba(31, 26, 20, 0.18), transparent 55%);
          pointer-events: none;
        }

        .stats-band .wrap { position: relative; z-index: 1; }

        .stats-band-header {
          text-align: center;
          margin-bottom: 5rem;
          max-width: 38rem;
          margin-left: auto;
          margin-right: auto;
        }

        .stats-band-header .eyebrow {
          background: var(--forest);
        }

        .stats-band-header h2 {
          font-family: 'Inter', system-ui, sans-serif;
          font-size: clamp(2rem, 4vw, 3.2rem);
          font-weight: 400;
          margin-top: 1.5rem;
          letter-spacing: -0.02em;
          line-height: 1.2;
        }

        .stats-band-header h2 em {
          font-style: italic;
          font-weight: 300;
        }

        .stats-grid {
          display: grid;
          grid-template-columns: repeat(3, 1fr);
          gap: 3rem;
        }

        .stat-card {
          text-align: center;
          padding: 0 1rem;
          position: relative;
        }

        .stat-card:not(:last-child)::after {
          content: '';
          position: absolute;
          right: -1.5rem;
          top: 15%;
          bottom: 15%;
          width: 1px;
          background: rgba(242, 234, 217, 0.18);
        }

        .stat-card .number {
          font-family: 'Inter', system-ui, sans-serif;
          font-size: clamp(3.8rem, 7.5vw, 6rem);
          font-weight: 300;
          line-height: 1;
          letter-spacing: -0.04em;
          color: var(--cream);
          margin-bottom: 1.25rem;
        }

        .stat-card .number .unit {
          font-size: 0.45em;
          font-style: italic;
          color: var(--mustard);
          margin-left: 0.05em;
          font-weight: 400;
          letter-spacing: -0.01em;
        }

        .stat-card .stat-label {
          font-family: 'Inter', system-ui, sans-serif;
          font-style: italic;
          font-size: 1.08rem;
          line-height: 1.4;
          color: rgba(242, 234, 217, 0.95);
          max-width: 18rem;
          margin: 0 auto 1.25rem;
        }

        .stat-card .source {
          display: block;
          font-family: 'Instrument Sans', sans-serif;
          font-size: 0.7rem;
          letter-spacing: 0.18em;
          text-transform: uppercase;
          color: rgba(242, 234, 217, 0.6);
          line-height: 1.4;
        }

        .stats-band-illustration {
          margin-top: 4.5rem;
          display: flex;
          justify-content: center;
          align-items: center;
          padding-top: 0.5rem;
        }

        .stats-band-illustration svg {
          width: 100%;
          max-width: 720px;
          height: auto;
          display: block;
          opacity: 0.94;
        }

        /* Small credibility line in hero */
        .hero-credibility {
          margin-top: 2rem;
          font-size: 0.8rem;
          letter-spacing: 0.1em;
          text-transform: uppercase;
          color: var(--ink-soft);
          opacity: 0.7;
        }

        .hero-credibility strong {
          color: var(--terracotta);
          font-weight: 600;
        }

        /* ─── Sources / footnotes ─── */
        .sources {
          padding: 4.5rem 0 5rem;
          background: var(--cream);
          border-top: 1px solid var(--rule);
        }

        .sources-inner {
          max-width: 64rem;
          margin: 0 auto;
        }

        .sources h4 {
          font-family: 'Instrument Sans', sans-serif;
          font-weight: 500;
          font-size: 0.72rem;
          letter-spacing: 0.22em;
          text-transform: uppercase;
          color: var(--ink-soft);
          margin-bottom: 2rem;
          padding-bottom: 1.25rem;
          border-bottom: 1px solid var(--rule);
          display: flex;
          align-items: center;
          gap: 0.75rem;
        }

        .sources h4::before {
          content: '';
          width: 28px;
          height: 1px;
          background: var(--terracotta);
        }

        .sources ol {
          list-style: none;
          counter-reset: src;
          display: grid;
          grid-template-columns: 1fr 1fr;
          gap: 1.5rem 3rem;
        }

        .sources li {
          counter-increment: src;
          font-size: 0.86rem;
          color: var(--ink-soft);
          line-height: 1.55;
          padding-left: 1.75rem;
          position: relative;
        }

        .sources li::before {
          content: counter(src);
          position: absolute;
          left: 0;
          top: -0.05em;
          font-family: 'Inter', system-ui, sans-serif;
          font-style: italic;
          font-weight: 500;
          font-size: 1.05rem;
          color: var(--terracotta);
        }

        .sources em {
          font-family: 'Inter', system-ui, sans-serif;
          font-style: italic;
          color: var(--ink);
        }

        .sources a {
          color: var(--terracotta);
          text-decoration: none;
          border-bottom: 1px solid rgba(182, 82, 50, 0.35);
          transition: border-color .2s, color .2s;
        }

        .sources a:hover {
          border-color: var(--terracotta);
          color: var(--terracotta-deep);
        }

        /* ─── Animations ─── */
        @keyframes rise {
          from { opacity: 0; transform: translateY(20px); }
          to { opacity: 1; transform: translateY(0); }
        }

        .rise { animation: rise 0.9s ease-out both; }
        .delay-1 { animation-delay: 0.1s; }
        .delay-2 { animation-delay: 0.25s; }
        .delay-3 { animation-delay: 0.4s; }
        .delay-4 { animation-delay: 0.55s; }

        /* ─── Responsive ─── */
        @media (max-width: 880px) {
          .nav-inner { padding: 1.25rem 1.5rem; }
        }

        @media (max-width: 960px) {
          .wrap { padding: 0 1.5rem; }
          .hero-grid { grid-template-columns: 1fr; gap: 3rem; }
          .problems-grid { grid-template-columns: 1fr; gap: 2.5rem; }
          .how-steps { grid-template-columns: 1fr; gap: 2rem; }
          .cta-grid { grid-template-columns: 1fr; }
          .signup { flex-direction: column; }
          .quotes { grid-template-columns: 1fr; }
          .footer-grid { grid-template-columns: 1fr 1fr; }
          .nav-links { gap: 1.25rem; }
          .nav-links a:not(.nav-cta):not(.brand) { display: none; }
          .hero { padding: 3rem 0 5rem; }
          .for-whom, .problems, .how, .cta-section, .proof { padding: 5rem 0; }
          .cta-section { padding: 5rem 0 4.5rem; }
          .proof { padding: 6.5rem 0 5rem; }
          .stats-band { padding: 5rem 0; }
          .stats-band-illustration { margin-top: 3.5rem; }
          .stats-grid { grid-template-columns: 1fr; gap: 3.5rem; }
          .stat-card:not(:last-child)::after { display: none; }
          .proof-findings { grid-template-columns: 1fr; gap: 3rem; }
          .proof-findings .finding:not(:last-child)::after { display: none; }
          .sources { padding: 3.5rem 0; }
          .sources ol { grid-template-columns: 1fr; }
          .visual-caption { position: static; text-align: left; margin-top: 1.5rem; max-width: 100%; }
        }

        @media (max-width: 560px) {
          body { font-size: 16px; }
          .hero { padding-top: 4.75rem; }
          .hero-headline { font-size: 3rem; }
          .signup { flex-direction: column; }
          .signup input, .signup select, .signup button { width: 100%; }
          .footer-grid { grid-template-columns: 1fr; gap: 2rem; }
          .footer-bottom { flex-direction: column; text-align: center; }
          .cta-card { padding: 2.25rem 1.75rem; }
          .hero-ctas { flex-direction: column; align-items: stretch; }
          .btn { justify-content: center; }
        }
      /* Forced update to trigger Vercel deploy */