:root{
    --paper:#F2EEE7;
    --paper-2:#ECE7DE;
    --ink:#111111;
    --ink-soft:#2A2724;
    --muted:#6B6660;
    --muted-2:#8E8881;
    --line:#D6D3CD;
    --line-soft:#E3DFD6;
    --card:#FBF8F2;
    --card-2:#E9E4DA;

    --shadow-xs: 0 1px 0 rgba(17,17,17,.04);
    --shadow-sm: 0 1px 2px rgba(17,17,17,.04), 0 1px 1px rgba(17,17,17,.03);
    --shadow-md: 0 10px 30px -18px rgba(17,17,17,.18), 0 2px 6px rgba(17,17,17,.04);

    --serif: "Instrument Serif", "Iowan Old Style", "Apple Garamond", Georgia, "Times New Roman", serif;
    --sans:  "Geist", "Helvetica Neue", Helvetica, "Söhne", Arial, sans-serif;

    --radius-sm: 10px;
    --radius:    18px;
    --radius-lg: 26px;

    --page-pad: clamp(20px, 4vw, 56px);
    --section-pad: clamp(80px, 12vw, 180px);
    --max: 1240px;
  }

  *{box-sizing:border-box}
  html,body{margin:0;padding:0}
  html{scroll-behavior:smooth}
  body{
    background:var(--paper);
    color:var(--ink);
    font-family:var(--sans);
    font-weight:400;
    font-size:17px;
    line-height:1.55;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    text-rendering:optimizeLegibility;
    letter-spacing:-0.005em;
  }

  a{color:inherit;text-decoration:none}
  button{font-family:inherit}

  .wrap{
    max-width:var(--max);
    margin:0 auto;
    padding-left:var(--page-pad);
    padding-right:var(--page-pad);
  }

  /* ───────── Header ───────── */
  header.site{
    position:sticky; top:0; z-index:50;
    background:color-mix(in oklab, var(--paper) 88%, transparent);
    backdrop-filter: blur(12px) saturate(1.05);
    -webkit-backdrop-filter: blur(12px) saturate(1.05);
    border-bottom:1px solid transparent;
    transition:border-color .25s ease, background .25s ease;
  }
  header.site .row{
    display:flex; align-items:center; justify-content:space-between;
    height:72px;
  }
  .logo{
    font-family:var(--serif);
    font-size:28px;
    letter-spacing:-0.01em;
    line-height:1;
    display:inline-flex; align-items:center; gap:10px;
  }
  .logo .dot{
    width:7px; height:7px; border-radius:999px; background:var(--ink);
    display:inline-block; transform:translateY(-7px);
  }
  .nav{
    display:flex; gap:36px; align-items:center;
    font-size:14px; color:var(--muted);
  }
  .nav .links{ display:flex; gap:28px; align-items:center; }
  .nav a:hover{color:var(--ink)}
  @media (max-width: 760px){ .nav .links{display:none} }

  /* Buttons */
  .btn{
    display:inline-flex; align-items:center; justify-content:center; gap:10px;
    font-family:var(--sans); font-weight:500; font-size:14px;
    letter-spacing:0.01em;
    padding:12px 18px;
    border-radius:999px;
    border:1px solid transparent;
    cursor:pointer;
    transition:transform .25s ease, background .25s ease, color .25s ease, border-color .25s ease, box-shadow .25s ease;
    white-space:nowrap;
  }
  .btn-primary{
    background:var(--ink); color:#fff;
  }
  .btn-primary:hover{ transform:translateY(-1px); box-shadow:0 14px 30px -16px rgba(17,17,17,.5); }
  .btn-ghost{
    background:transparent; color:var(--ink); border-color:var(--line);
  }
  .btn-ghost:hover{ border-color:var(--ink) }

  .btn-lg{
    font-size:15px; padding:18px 26px;
  }
  .btn-lg .arrow{transition:transform .3s ease}
  .btn-lg:hover .arrow{ transform:translateX(4px) }

  /* ───────── Hero ───────── */
  .hero{
    padding-top: clamp(60px, 9vw, 120px);
    padding-bottom: var(--section-pad);
    position:relative;
  }
  .eyebrow{
    display:inline-flex; align-items:center; gap:10px;
    font-size:12px; font-weight:500; letter-spacing:0.18em; text-transform:uppercase;
    color:var(--muted);
    margin-bottom:36px;
  }

  h1.display{
    font-family:var(--serif);
    font-weight:400;
    font-size: clamp(56px, 10vw, 148px);
    line-height: 0.94;
    letter-spacing:-0.02em;
    margin:0 0 36px;
    color:var(--ink);
    text-wrap:balance;
  }
  h1.display em{
    font-style: italic;
    color:var(--muted);
    font-weight:400;
  }

  .hero p.lede{
    font-size: clamp(17px, 1.4vw, 21px);
    line-height:1.5;
    color:var(--ink-soft);
    max-width: 560px;
    margin:0 0 52px;
    letter-spacing:-0.005em;
  }
  .hero .cta-row{
    display:flex; gap:14px; flex-wrap:wrap; align-items:center;
    margin-bottom:14px;
  }
  .hero .cta-row .meta{
    font-size:13px; color:var(--muted); margin-left:6px;
  }
  .hero .cta-row .meta .live{
    display:inline-block; width:7px; height:7px; border-radius:999px;
    background:#1B6E3F; margin-right:8px; vertical-align:1px;
    box-shadow: 0 0 0 4px rgba(27,110,63,.12);
    animation: pulse 2.2s infinite ease-in-out;
  }
  @keyframes pulse{
    0%,100%{ box-shadow:0 0 0 4px rgba(27,110,63,.08) }
    50%{ box-shadow:0 0 0 7px rgba(27,110,63,.18) }
  }

  /* Hero visual */
  .hero-stage{
    margin-top: clamp(72px, 10vw, 120px);
    position:relative;
    border-radius:var(--radius-lg);
    background:
      radial-gradient(120% 80% at 50% 10%, #F8F4EC 0%, #E8E2D5 65%, #DDD6C5 100%);
    aspect-ratio: 16 / 9;
    overflow:hidden;
    border:1px solid var(--line);
    box-shadow: var(--shadow-md);
  }
  .hero-stage iframe.hero-spline{
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
    display: block;
    background: transparent;
  }
  .hero-stage .caption,
  .hero-stage .caption-r{
    position:absolute;
    top: 22px;
    font-family:var(--sans);
    font-size:11px; letter-spacing:0.18em; text-transform:uppercase;
    color:var(--muted);
    pointer-events: none;
    z-index: 2;
    mix-blend-mode: multiply;
  }
  .hero-stage .caption{ left: 24px; }
  .hero-stage .caption-r{ right: 24px; }
  /* Hide Spline badge gracefully on smaller screens — it remains visible enough at desktop */
  @media (max-width: 640px){
    .hero-stage .caption-r{ display: none; }
  }

  /* ───────── Section title ─────────  */
  .section{
    padding-top: var(--section-pad);
    padding-bottom: var(--section-pad);
  }
  .section + .section{ padding-top: 0; }

  .section-head{
    display:flex; align-items:end; justify-content:space-between; gap:40px;
    margin-bottom: clamp(60px, 8vw, 96px);
    flex-wrap:wrap;
  }
  .section-head h2{
    font-family:var(--serif); font-weight:400;
    font-size: clamp(38px, 5.4vw, 68px);
    line-height:1;
    letter-spacing:-0.02em;
    margin:0;
    max-width: 14ch;
    text-wrap:balance;
  }
  .section-head h2 em{ font-style:italic; color:var(--muted); }
  .section-head .kicker{
    font-size:12px; letter-spacing:.18em; text-transform:uppercase;
    color:var(--muted); display:flex; align-items:center; gap:10px;
  }
  .section-head .kicker::before{
    content:""; width:24px; height:1px; background:var(--muted);
  }
  /* simple section header */
  .section-head.simple{
    display:block;
    margin-bottom: clamp(52px, 7vw, 80px);
  }
  .section-head.simple h2{
    font-family:var(--serif); font-weight:400;
    font-size: clamp(34px, 4.6vw, 56px);
    line-height:1.05;
    letter-spacing:-0.018em;
    margin:0;
    max-width: 22ch;
  }

  /* ───────── How it works ───────── */
  .steps{
    display:grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1px;
    background: var(--line-soft);
    border-top:1px solid var(--line-soft);
    border-bottom:1px solid var(--line-soft);
  }
  .step{
    background: var(--paper);
    padding: 44px 32px 48px;
    position:relative;
    display:flex; flex-direction:column;
    min-height: 260px;
  }
  .step .num{
    font-family:var(--serif);
    font-size: 56px;
    line-height:1;
    color: var(--ink);
    font-style:italic;
    margin-bottom: 56px;
    letter-spacing:-0.02em;
  }
  .step .num small{
    font-style:normal;
    font-family:var(--sans);
    font-size: 12px;
    letter-spacing:.2em;
    text-transform:uppercase;
    color:var(--muted);
    margin-left:14px;
    vertical-align: middle;
  }
  .step .icon{
    width:36px; height:36px;
    margin-bottom: 18px;
    color: var(--ink);
  }
  .step h3{
    font-family:var(--serif); font-weight:400;
    font-size: 30px; line-height:1.1;
    letter-spacing:-0.01em;
    margin:0 0 10px;
  }
  .step p{
    color:var(--muted); font-size:15px; margin:0;
    max-width: 28ch;
  }
  @media (max-width: 860px){
    .steps{ grid-template-columns: 1fr; }
  }

  /* ───────── Bento ───────── */
  .bento{
    display:grid;
    grid-template-columns: repeat(6, 1fr);
    grid-auto-rows: minmax(220px, auto);
    gap: 18px;
  }
  .card{
    background: var(--card);
    border:1px solid var(--line-soft);
    border-radius: var(--radius);
    padding: 36px;
    box-shadow: var(--shadow-sm);
    position:relative;
    overflow:hidden;
    display:flex; flex-direction:column;
    transition: transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s ease;
  }
  .card:hover{ transform: translateY(-2px); box-shadow: var(--shadow-md); }

  .card .label{
    font-size:11px; letter-spacing:.2em; text-transform:uppercase;
    color:var(--muted);
    margin-bottom: 14px;
    display:flex; align-items:center; gap:10px;
  }
  .card .label::before{
    content:""; width:6px; height:6px; border-radius:999px; background:var(--ink);
  }
  .card h3{
    font-family:var(--serif); font-weight:400;
    font-size: clamp(28px, 2.6vw, 38px);
    line-height:1.05;
    letter-spacing:-0.015em;
    margin: 0 0 12px;
    text-wrap:balance;
  }
  .card h3 em{ font-style:italic; color:var(--muted); }
  .card p.copy{
    color:var(--muted);
    font-size:15px; line-height:1.55;
    margin:0;
    max-width: 38ch;
  }

  /* Bento spans */
  .card.large    { grid-column: span 4; grid-row: span 2; min-height: 460px; }
  .card.tall     { grid-column: span 2; grid-row: span 2; min-height: 460px; }
  .card.wide     { grid-column: span 4; }
  .card.small    { grid-column: span 2; }

  @media (max-width: 980px){
    .bento{ grid-template-columns: repeat(2, 1fr); }
    .card.large, .card.tall, .card.wide, .card.small{
      grid-column: span 2;
    }
    .card.large{ min-height: 380px; }
    .card.tall{ min-height: 380px; }
  }
  @media (max-width: 560px){
    .bento{ grid-template-columns: 1fr; }
    .card.large, .card.tall, .card.wide, .card.small{ grid-column: span 1; }
  }

  /* Card visuals */
  .card .visual{
    flex:1; min-height: 140px;
    margin-top: 28px;
    position:relative;
    border-radius: 14px;
    overflow:hidden;
  }
  .v-object{
    background:
      radial-gradient(80% 60% at 50% 30%, #F4EFE5 0%, #E2DCCE 70%, #CFC8B7 100%);
    border:1px solid var(--line);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px 20px;
    flex: 0 0 auto;
    height: 240px;
    min-height: 0;
  }
  .v-object img{
    display: block;
    width: auto;
    height: 100%;
    max-height: 100%;
    max-width: 55%;
    object-fit: contain;
    filter: drop-shadow(0 18px 24px rgba(17, 17, 17, 0.25))
            drop-shadow(0 4px 8px rgba(17, 17, 17, 0.18));
    transform: rotate(-6deg);
    transition: transform .6s cubic-bezier(.2,.8,.2,1);
  }
  .card.tall:hover .v-object img{
    transform: rotate(-2deg) translateY(-3px);
  }
  .v-summary{
    background: #fff;
    border:1px solid var(--line-soft);
    padding: 20px 22px;
    display:flex; flex-direction:column; gap:8px;
    justify-content:flex-start;
  }
  .v-summary .h{
    font-family:var(--serif); font-size:18px; letter-spacing:-0.01em;
    margin-bottom:6px;
  }
  .v-summary .bar{
    height:6px; border-radius:999px; background: var(--paper-2);
    position:relative; overflow:hidden;
  }
  .v-summary .bar i{
    position:absolute; left:0; top:0; bottom:0; background:var(--ink);
    border-radius:999px;
  }
  .v-summary ul{
    margin: 6px 0 0; padding:0; list-style:none; font-size:12px; color:var(--muted);
    display:flex; flex-direction:column; gap:6px;
  }
  .v-summary ul li{ display:flex; align-items:center; gap:8px; }
  .v-summary ul li::before{
    content:""; width:4px; height:4px; border-radius:999px; background:var(--muted-2);
  }

  .v-fr{
    background:
      linear-gradient(135deg, #F2EDE3 0%, #E6DFCF 100%);
    border:1px solid var(--line);
    display:flex; align-items:center; justify-content:center;
  }
  .v-fr .flag{
    display:flex; gap:0;
    border-radius:6px; overflow:hidden;
    box-shadow: 0 6px 20px -10px rgba(0,0,0,.25);
    border:1px solid rgba(17,17,17,.08);
  }
  .v-fr .flag span{ width:26px; height:36px; display:block; }
  .v-fr .flag .b{ background:#19224A; }
  .v-fr .flag .w{ background:#F5F1E8; }
  .v-fr .flag .r{ background:#7A2B2B; }
  .v-fr .seal{
    margin-left: 18px;
    font-family:var(--serif); font-style:italic;
    font-size: 22px; line-height:1; color:var(--ink);
  }
  .v-fr .seal small{
    display:block; font-style:normal; font-family:var(--sans);
    font-size:10px; letter-spacing:.2em; text-transform:uppercase; color:var(--muted);
    margin-top:6px;
  }

  .v-zero{
    background: var(--ink);
    color: var(--paper);
    display:flex; align-items:center; justify-content:center;
    text-align:center;
  }
  .v-zero .ring{
    width: 120px; height:120px;
    border-radius:999px;
    border:1px solid rgba(255,255,255,.14);
    display:flex; align-items:center; justify-content:center;
    position:relative;
  }
  .v-zero .ring::before,
  .v-zero .ring::after{
    content:""; position:absolute; inset:-14px;
    border:1px solid rgba(255,255,255,.07);
    border-radius:999px;
  }
  .v-zero .ring::after{ inset:-28px; border-color: rgba(255,255,255,.04); }
  .v-zero .ring .core{
    width:14px; height:14px; border-radius:999px; background:#fff;
    box-shadow: 0 0 18px 2px rgba(255,255,255,.6);
  }

  /* Voix → Action visual */
  .v-flow{
    background:#fff;
    border:1px solid var(--line-soft);
    padding: 20px 22px 22px;
    display:flex; flex-direction:column; gap:14px;
    min-height: 220px;
    justify-content: space-between;
  }
  .v-flow .dests{
    display:flex; flex-direction:column; gap:10px;
  }
  .v-flow .dest{
    padding: 12px 14px;
  }
  .v-flow .flow-source{
    display:flex; align-items:center; justify-content:space-between;
    gap:18px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--line-soft);
  }
  .v-flow .wave{
    display:flex; align-items:center; gap:3px; height:28px; flex-shrink:0;
  }
  .v-flow .wave i{
    width:2px; background: var(--ink); border-radius:2px; opacity:.85;
    display:block;
  }
  .v-flow .src-label{
    font-family:var(--serif); font-style:italic;
    font-size: 15px; color: var(--ink); text-align:right;
    letter-spacing:-0.01em;
  }
  .v-flow .flow-arrow{
    text-align:center;
    font-size: 14px; color: var(--muted-2);
    line-height: 1; margin: -2px 0;
  }
  .v-flow .dests{
    display:flex; flex-direction:column; gap:10px;
  }
  .v-flow .dest{
    display:flex; align-items:center; gap:12px;
    padding: 12px 14px;
    background: var(--paper);
    border: 1px solid var(--line-soft);
    border-radius: 10px;
    font-size: 13px;
    color: var(--ink);
    line-height: 1.3;
  }
  .v-flow .dest .badge{
    flex-shrink:0;
    display: inline-flex; align-items: center; gap: 7px;
    font-family: var(--sans);
    font-size: 11px; font-weight: 500;
    letter-spacing: 0.04em;
    background: var(--ink); color: #fff;
    padding: 5px 11px 5px 8px; border-radius: 999px;
    text-align: center;
    line-height: 1;
  }
  .v-flow .dest .badge svg{
    display: block; flex-shrink: 0;
  }
  .v-flow .dest .text small{
    display:block; color: var(--muted); font-size: 11px; margin-top: 2px;
    letter-spacing: 0.01em;
  }

  /* ───────── Plans ───────── */
  .plans{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
  }
  .plan{
    background: var(--card);
    border: 1px solid var(--line-soft);
    border-radius: var(--radius);
    padding: 32px;
    display: flex; flex-direction: column;
    position: relative;
    box-shadow: var(--shadow-sm);
    transition: transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s ease;
  }
  .plan:hover{ transform: translateY(-2px); box-shadow: var(--shadow-md); }
  .plan-feature{
    background: var(--ink);
    color: #fff;
    border-color: transparent;
  }
  .plan-flag{
    align-self: flex-start;
    font-size: 10px; letter-spacing: 0.16em; text-transform: uppercase;
    color: var(--paper);
    border: 1px solid rgba(255,255,255,.22);
    padding: 6px 10px;
    border-radius: 999px;
    background: rgba(255,255,255,.06);
    margin-bottom: 18px;
    white-space: nowrap;
  }
  .plan-flag-spacer{
    height: 26px; margin-bottom: 18px;
  }
  .plan-name{
    font-family: var(--serif); font-size: 32px; line-height: 1;
    letter-spacing: -0.015em;
    margin-bottom: 22px;
  }
  .plan-feature .plan-name{ color: #fff; }
  .plan-price{
    display: flex; align-items: baseline; gap: 4px;
    font-family: var(--serif);
    margin-bottom: 6px;
    flex-wrap: wrap;
  }
  .plan-price .amt{
    font-size: 56px; line-height: 1; letter-spacing: -0.02em;
    color: var(--ink);
  }
  .plan-feature .plan-price .amt{ color: #fff; }
  .plan-price .cur{ font-size: 22px; color: var(--muted); margin-left: 2px; }
  .plan-feature .plan-price .cur{ color: rgba(255,255,255,.55); }
  .plan-price .per{
    font-family: var(--sans); font-size: 13px; color: var(--muted);
    margin-left: 10px; align-self: center;
    letter-spacing: 0;
  }
  .plan-feature .plan-price .per{ color: rgba(255,255,255,.55); }
  .plan-perk{
    font-family: var(--serif); font-style: italic;
    font-size: 16px; color: var(--ink);
    margin: 6px 0 0;
    min-height: 1.4em;
    line-height: 1.4;
  }
  .plan-feature .plan-perk{ color: #F2EEE7; }
  .plan-tag{
    margin: 26px 0 24px;
    font-size: 14px; color: var(--muted);
    padding-bottom: 24px;
    border-bottom: 1px solid var(--line-soft);
  }
  .plan-feature .plan-tag{ color: rgba(255,255,255,.55); border-color: rgba(255,255,255,.1); }
  .plan-feats{
    list-style: none; padding: 0; margin: 0;
    display: flex; flex-direction: column; gap: 12px;
    font-size: 14px;
    color: var(--ink);
  }
  .plan-feature .plan-feats{ color: rgba(255,255,255,.85); }
  .plan-feats li{
    display: flex; align-items: flex-start; gap: 10px;
    line-height: 1.4;
  }
  .plan-feats li::before{
    content: "";
    width: 4px; height: 4px; border-radius: 999px;
    background: var(--ink);
    margin-top: 8px;
    flex-shrink: 0;
  }
  .plan-feature .plan-feats li::before{ background: #fff; }
  .plans-fineprint{
    text-align: center;
    margin-top: 36px;
    font-size: 13px; color: var(--muted);
  }
  @media (max-width: 860px){
    .plans{ grid-template-columns: 1fr; }
  }

  /* ───────── Device price card (object) ───────── */
  .device-card{
    display: grid;
    grid-template-columns: 1.4fr 1fr;
    gap: 0;
    background: var(--card);
    border: 1px solid var(--line-soft);
    border-radius: var(--radius);
    overflow: hidden;
    margin-bottom: 36px;
    box-shadow: var(--shadow-sm);
  }
  .device-card .dc-left{
    padding: 40px 44px 44px;
    display: flex; flex-direction: column; gap: 14px;
    border-right: 1px solid var(--line-soft);
  }
  .device-card .dc-tag{
    font-size: 11px; letter-spacing: .2em; text-transform: uppercase;
    color: var(--muted);
    display: inline-flex; align-items: center; gap: 10px;
    margin-bottom: 4px;
  }
  .device-card .dc-tag::before{
    content: ""; width: 6px; height: 6px; border-radius: 999px; background: var(--ink);
  }
  .device-card .dc-name{
    font-family: var(--serif);
    font-size: clamp(40px, 4.4vw, 56px);
    line-height: 1;
    letter-spacing: -0.02em;
  }
  .device-card .dc-name .dc-dot{
    color: var(--muted);
  }
  .device-card .dc-desc{
    color: var(--ink-soft);
    font-size: 15.5px; line-height: 1.55;
    margin: 0;
    max-width: 44ch;
  }
  .device-card .dc-feats{
    list-style: none; padding: 0; margin: 8px 0 0;
    display: flex; flex-direction: column; gap: 8px;
    font-size: 13.5px; color: var(--muted);
  }
  .device-card .dc-feats li{
    display: flex; align-items: center; gap: 10px;
  }
  .device-card .dc-feats li::before{
    content: "";
    width: 14px; height: 1px; background: var(--muted-2);
    flex-shrink: 0;
  }
  .device-card .dc-right{
    padding: 40px 44px 44px;
    display: flex; flex-direction: column; justify-content: center;
    gap: 18px;
    background:
      radial-gradient(80% 60% at 80% 0%, #F6F2EA 0%, var(--card) 70%);
  }
  .device-card .dc-price{
    display: flex; align-items: baseline; gap: 4px;
    font-family: var(--serif);
  }
  .device-card .dc-price .amt{
    font-size: clamp(72px, 8.4vw, 112px);
    line-height: 0.9;
    letter-spacing: -0.025em;
    color: var(--ink);
  }
  .device-card .dc-price .cur{
    font-size: clamp(28px, 3vw, 36px);
    color: var(--muted);
    margin-left: 4px;
  }
  .device-card .dc-meta{
    font-size: 13px; color: var(--muted);
    letter-spacing: 0.01em;
  }
  .device-card .btn{
    align-self: flex-start;
    margin-top: 6px;
  }
  .plans-divider{
    display: flex; align-items: center; gap: 16px;
    margin: 0 0 28px;
    color: var(--muted);
    font-size: 12px; letter-spacing: 0.18em; text-transform: uppercase;
  }
  .plans-divider::before,
  .plans-divider::after{
    content: ""; flex: 1; height: 1px; background: var(--line-soft);
  }
  @media (max-width: 760px){
    .device-card{ grid-template-columns: 1fr; }
    .device-card .dc-left{ border-right: none; border-bottom: 1px solid var(--line-soft); }
  }

  /* ───────── Guarantees ───────── */
  .guarantees{
    list-style: none;
    padding: 0;
    margin: 0 auto 56px;
    max-width: 560px;
    display: flex; flex-direction: column; gap: 10px;
    text-align: left;
    font-size: 14px;
    color: var(--ink-soft);
  }
  .guarantees li{
    display: flex; align-items: flex-start; gap: 14px;
    line-height: 1.5;
  }
  .guarantees .g-mark{
    flex-shrink: 0;
    width: 22px; height: 22px;
    border-radius: 999px;
    background: var(--ink); color: var(--paper);
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 11px; line-height: 1;
    margin-top: 1px;
  }
  .guarantees strong{ color: var(--ink); font-weight: 500; }

  /* Card variants for dark zero-friction */
  .card.dark{
    background: var(--ink);
    color:#fff;
    border-color: transparent;
  }
  .card.dark .label{ color: rgba(255,255,255,.55) }
  .card.dark .label::before{ background:#fff }
  .card.dark h3{ color:#fff }
  .card.dark h3 em{ color: rgba(255,255,255,.5) }
  .card.dark p.copy{ color: rgba(255,255,255,.6) }

  /* ───────── Pull quote / philosophy ───────── */
  .philosophy{
    padding-top: 0;
    padding-bottom: var(--section-pad);
  }
  .philosophy blockquote{
    margin:0; padding:0;
    font-family:var(--serif);
    font-weight:400;
    font-size: clamp(32px, 4.8vw, 60px);
    line-height:1.08;
    letter-spacing:-0.018em;
    max-width: 22ch;
    text-wrap:balance;
  }
  .philosophy blockquote em{ font-style:italic; color:var(--muted); }
  .philosophy .by{
    margin-top: 36px;
    font-size:13px; letter-spacing:.18em; text-transform:uppercase; color:var(--muted);
    display:flex; align-items:center; gap:10px;
  }
  .philosophy .by::before{
    content:""; width:24px; height:1px; background:var(--muted);
  }

  /* ───────── Specs strip (very minimal) ───────── */
  .specs{
    display:grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    border-top:1px solid var(--line);
    border-bottom:1px solid var(--line);
  }
  .specs .col{
    padding: 36px 8px 36px 0;
    border-right:1px solid var(--line-soft);
  }
  .specs .col:last-child{ border-right:none }
  .specs .col .v{
    font-family:var(--serif); font-style:italic; font-size: 28px; line-height:1;
    letter-spacing:-0.01em; color: var(--muted);
    margin-bottom: 24px;
  }
  .specs .col .k{
    font-family:var(--serif); font-size: 26px; line-height:1.1; letter-spacing:-0.015em;
    color: var(--ink); margin-bottom: 10px;
  }
  .specs .col .pp{
    font-size: 14px; color: var(--muted); margin: 0; max-width: 24ch;
    line-height: 1.5;
  }
  @media (max-width: 760px){
    .specs{ grid-template-columns: repeat(2, 1fr); }
    .specs .col:nth-child(2n){ border-right:none }
    .specs .col:nth-child(-n+2){ border-bottom:1px solid var(--line-soft); }
  }

  /* ───────── Final CTA ───────── */
  .final{
    padding-top: var(--section-pad);
    padding-bottom: clamp(100px, 12vw, 160px);
    text-align:center;
  }
  .final h2{
    font-family:var(--serif); font-weight:400;
    font-size: clamp(48px, 7vw, 96px);
    line-height: 1.02;
    letter-spacing:-0.022em;
    margin:0 auto 36px;
    max-width: 16ch;
  }
  .final h2 em{ font-style:italic; color:var(--muted); }
  .final p.sub{
    color:var(--muted);
    max-width: 540px; margin: 0 auto 56px;
    font-size: 17px;
  }
  .waitlist{
    max-width: 520px; margin: 0 auto;
    display:grid; grid-template-columns: 1fr auto; align-items:end;
    gap:18px;
    border-bottom: 1px solid var(--ink);
    padding-bottom: 14px;
    transition: border-color .25s ease;
  }
  .waitlist:focus-within{ border-color: var(--ink); }
  .waitlist label{
    display:block; font-size:11px; letter-spacing:.2em; text-transform:uppercase;
    color:var(--muted); margin-bottom: 10px; text-align:left;
  }
  .waitlist input{
    width:100%;
    border:none; outline:none; background:transparent;
    font-family: var(--sans); font-size: 18px; color:var(--ink);
    padding: 6px 0;
    letter-spacing:-0.005em;
  }
  .waitlist input::placeholder{ color: var(--muted-2); }
  .waitlist button{
    appearance:none; border:none; background:transparent; color:var(--ink);
    font-family:var(--sans); font-weight:500; font-size:14px;
    letter-spacing:.01em;
    cursor:pointer; padding: 8px 0 8px 6px;
    display:inline-flex; align-items:center; gap:8px;
  }
  .waitlist button .arrow{ transition: transform .3s ease }
  .waitlist button:hover .arrow{ transform: translateX(4px) }

  .final .fineprint{
    margin-top: 28px;
    font-size: 12px; color: var(--muted-2);
    letter-spacing: 0.02em;
  }

  /* ───────── Footer ───────── */
  footer.site{
    border-top:1px solid var(--line);
    padding: 56px 0 40px;
  }
  footer.site .top{
    display:grid;
    grid-template-columns: 1.4fr 1fr 1fr 1fr;
    gap: 40px;
    padding-bottom: 40px;
    border-bottom: 1px solid var(--line-soft);
    margin-bottom: 28px;
  }
  footer.site .top h4{
    font-family: var(--sans);
    font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase;
    color: var(--muted);
    margin: 0 0 16px;
    font-weight: 500;
  }
  footer.site .top ul{
    list-style: none; padding: 0; margin: 0;
    display: flex; flex-direction: column; gap: 10px;
    font-size: 14px;
    color: var(--ink-soft);
  }
  footer.site .top a:hover{ color: var(--ink); }
  footer.site .brand-col .f-brand{
    font-family: var(--serif);
    font-size: 32px;
    letter-spacing: -0.015em;
    margin-bottom: 14px;
    display: inline-flex; align-items: center; gap: 8px;
  }
  footer.site .brand-col .f-brand .dot{
    width: 7px; height: 7px; border-radius: 999px; background: var(--ink);
    display: inline-block; transform: translateY(-7px);
  }
  footer.site .brand-col p{
    color: var(--muted); font-size: 13.5px;
    line-height: 1.55;
    max-width: 36ch;
    margin: 0 0 18px;
  }
  footer.site .brand-col .made{
    font-size: 12px; color: var(--muted-2);
    letter-spacing: 0.02em;
    display: inline-flex; align-items: center; gap: 8px;
  }
  footer.site .brand-col .made .fr{
    display: inline-flex; gap: 0; border-radius: 2px; overflow: hidden;
    border: 1px solid rgba(17,17,17,.1);
  }
  footer.site .brand-col .made .fr span{ width: 5px; height: 10px; display: block; }
  footer.site .brand-col .made .fr .b{ background:#19224A; }
  footer.site .brand-col .made .fr .w{ background:#F5F1E8; }
  footer.site .brand-col .made .fr .r{ background:#7A2B2B; }

  footer.site .row{
    display:flex; align-items:center; justify-content:space-between;
    gap: 24px; flex-wrap:wrap;
    color: var(--muted); font-size: 12.5px;
  }
  footer.site .row .legal-links{
    display:flex; gap: 22px; flex-wrap: wrap;
  }
  footer.site a:hover{ color: var(--ink); }
  @media (max-width: 860px){
    footer.site .top{ grid-template-columns: 1fr 1fr; }
    footer.site .brand-col{ grid-column: span 2; }
  }
  @media (max-width: 540px){
    footer.site .top{ grid-template-columns: 1fr; }
    footer.site .brand-col{ grid-column: span 1; }
  }

  /* ───────── Cookie banner ───────── */
  .cookie-banner{
    position: fixed; left: 16px; right: 16px; bottom: 16px;
    max-width: 520px;
    margin: 0 auto;
    background: var(--ink); color: #fff;
    border-radius: var(--radius);
    padding: 22px 24px 20px;
    box-shadow: 0 24px 50px -20px rgba(17,17,17,.45), 0 4px 12px rgba(17,17,17,.18);
    font-size: 13.5px; line-height: 1.55;
    z-index: 100;
    transform: translateY(140%);
    transition: transform .55s cubic-bezier(.2,.7,.2,1);
  }
  .cookie-banner.in{ transform: none; }
  .cookie-banner h4{
    font-family: var(--serif); font-size: 20px;
    font-weight: 400; margin: 0 0 6px;
    letter-spacing: -0.01em;
  }
  .cookie-banner p{
    margin: 0 0 14px;
    color: rgba(255,255,255,.72);
  }
  .cookie-banner p a{
    color: #fff; text-decoration: underline; text-underline-offset: 3px;
    text-decoration-color: rgba(255,255,255,.4);
  }
  .cookie-banner p a:hover{ text-decoration-color: #fff; }
  .cookie-banner .ck-actions{
    display: flex; gap: 10px; flex-wrap: wrap;
  }
  .cookie-banner .ck-btn{
    appearance: none; cursor: pointer;
    font-family: var(--sans); font-size: 13px; font-weight: 500;
    letter-spacing: 0.01em;
    padding: 10px 16px;
    border-radius: 999px;
    border: 1px solid transparent;
    transition: background .2s ease, border-color .2s ease;
  }
  .cookie-banner .ck-accept{ background: #fff; color: var(--ink); }
  .cookie-banner .ck-accept:hover{ background: var(--paper); }
  .cookie-banner .ck-reject{ background: transparent; color: #fff; border-color: rgba(255,255,255,.25); }
  .cookie-banner .ck-reject:hover{ border-color: #fff; }
  .cookie-banner .ck-prefs{
    background: transparent; color: rgba(255,255,255,.7); border: none;
    padding: 10px 6px;
    text-decoration: underline; text-underline-offset: 3px;
    display: inline-flex; align-items: center;
  }
  .cookie-banner .ck-prefs:hover{ color: #fff; }

  /* Reveal animation */
  .reveal{
    opacity:0; transform: translateY(14px);
    transition: opacity .9s ease, transform .9s cubic-bezier(.2,.7,.2,1);
  }
  .reveal.in{ opacity:1; transform: none; }

  ::selection{ background: var(--ink); color: var(--paper); }
/* ───────── Language switch ───────── */
.lang-switch{
  display:flex; gap:8px; align-items:center;
  font-size:13px; color:var(--muted); letter-spacing:.02em;
}
.lang-switch [aria-current="true"]{ color:var(--ink); font-weight:500; }
.lang-switch a:hover{ color:var(--ink); }
@media (max-width: 760px){ .lang-switch{ margin-left:auto; } }