:root{
  --ink:#16202A; --ink-soft:#3A4651; --muted:#55616B;
  --accent:#0B6E69; --accent-dark:#08524E;
  --mist:#F2F5F4; --line:#D5DCDA; --white:#FFFFFF;
  --display:'Manrope', 'Helvetica Neue', Arial, sans-serif;
  --body:'Source Sans 3', 'Helvetica Neue', Arial, sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--white);color:var(--ink);font-family:var(--body);font-size:18px;line-height:1.55}
img{max-width:100%;height:auto}
a{color:var(--ink)}
a:hover{color:var(--accent)}
:focus-visible{outline:3px solid var(--accent);outline-offset:3px;border-radius:4px}
h1,h2,h3{font-family:var(--display);letter-spacing:-0.02em;margin:0}
p{margin:0}
.wrap{max-width:1120px;margin:0 auto;padding:0 32px}
.skip{position:absolute;left:-999px;top:0;background:var(--ink);color:#fff;padding:12px 16px;z-index:10}
.skip:focus{left:16px;top:16px;color:#fff}

/* Header */
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px 24px;flex-wrap:wrap;padding-top:28px;padding-bottom:28px}
.logo{font-family:var(--display);font-weight:800;font-size:24px;letter-spacing:-0.02em;text-decoration:none;color:var(--ink)}
.nav{display:flex;gap:12px 28px;align-items:center;flex-wrap:wrap;font-size:17px}
.nav a{text-decoration:none}
.nav a[aria-current="page"]{text-decoration:underline;text-underline-offset:6px;font-weight:600}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:12px 24px;border-radius:999px;font-weight:600;font-family:var(--body);font-size:17px;text-decoration:none;border:2px solid transparent;cursor:pointer;line-height:1.2}
.btn-primary{background:var(--accent);color:#fff}
.btn-primary:hover{background:var(--accent-dark);color:#fff}
.btn-outline{border-color:var(--ink);color:var(--ink);background:transparent}
.btn-outline:hover{background:var(--ink);color:#fff}
.nav .btn{min-height:44px;padding:10px 20px}

/* Type helpers */
.eyebrow{font-weight:600;color:var(--accent);font-size:17px;margin-bottom:20px}
.h1{font-weight:800;font-size:clamp(38px,5.5vw,56px);line-height:1.08;letter-spacing:-0.03em;margin-bottom:24px}
.h2{font-weight:800;font-size:clamp(30px,4vw,40px);margin-bottom:32px}
.lead{font-size:21px;color:var(--ink-soft);max-width:46ch}
.soft{color:var(--ink-soft)}

/* Sections */
.section{padding:96px 0}
.section-tint{background:var(--mist)}
.section-dark{background:var(--ink);color:#fff}
.page-intro{padding:72px 0 64px}

/* Hero */
.hero{display:flex;gap:64px;align-items:center;flex-wrap:wrap;padding:72px 0 96px}
.hero-text{flex:1 1 520px}
.hero .lead{max-width:34ch;margin-bottom:36px}
.actions{display:flex;gap:16px;flex-wrap:wrap}
.hero-phone{flex:0 1 320px;display:flex;justify-content:center;margin:0 auto}
.phone{width:300px;height:600px;border:10px solid var(--ink);border-radius:44px;padding:14px 20px 24px;display:flex;flex-direction:column;gap:16px;background:#F4F7F6}
.phone-status{display:flex;justify-content:space-between;align-items:center;font-size:13px;font-weight:600;padding:0 6px}
.phone-battery{width:22px;height:11px;border:1.5px solid var(--ink);border-radius:3px;position:relative}
.phone-battery::after{content:"";position:absolute;inset:1.5px 5px 1.5px 1.5px;background:var(--ink);border-radius:1px}
.phone-app{font-family:var(--display);font-weight:800;font-size:18px;letter-spacing:-0.02em;margin-top:4px}
.phone-card{background:#fff;border-radius:18px;padding:16px 18px}
.phone-card small{display:block;font-size:13px;font-weight:600;color:var(--accent);margin-bottom:6px}
.phone-q{font-family:var(--display);font-weight:700;font-size:19px;line-height:1.25}
.phone-rec{display:flex;flex-direction:column;align-items:center;gap:10px;margin:6px 0}
.rec-btn{width:84px;height:84px;border-radius:50%;border:4px solid var(--ink);display:flex;align-items:center;justify-content:center;background:#fff}
.rec-dot{width:58px;height:58px;border-radius:50%;background:#C8372D}
.rec-label{font-weight:600;font-size:15px}
.phone-list{margin-top:auto}
.phone-list-title{font-size:13px;font-weight:600;color:var(--muted);margin-bottom:8px}
.phone-item{display:flex;justify-content:space-between;align-items:center;background:#fff;border-radius:12px;padding:9px 14px;font-size:13px;line-height:1.35;color:var(--ink-soft);margin-bottom:6px}
.phone-item strong{color:var(--ink);font-size:14px}
.chev{font-size:20px;color:var(--muted)}

/* Grids */
.grid{display:grid;gap:40px 48px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.stat-num{font-family:var(--display);font-weight:800;font-size:52px;letter-spacing:-0.03em;color:var(--accent);line-height:1.1;margin-bottom:8px}
.cite{color:var(--muted)}
.step{border-top:2px solid var(--ink);padding-top:20px}
.step h3{font-weight:700;font-size:24px;margin-bottom:8px}
.feature h3{font-weight:700;font-size:20px;margin-bottom:8px;font-family:var(--body);letter-spacing:0}
.feature-lg h2{font-weight:700;font-size:26px;margin-bottom:12px}

/* Rows (how it works) */
.rows{border-bottom:2px solid var(--ink)}
.row{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px 32px;border-top:2px solid var(--ink);padding:36px 0}
.row h2{font-weight:700;font-size:28px}

/* Statement */
.statement{font-family:var(--display);font-weight:700;font-size:clamp(30px,4.2vw,44px);line-height:1.2;letter-spacing:-0.02em;max-width:22ch}

/* Panels */
.doors{display:grid;gap:32px;grid-template-columns:repeat(auto-fit,minmax(320px,1fr))}
.panel{border-radius:20px;padding:40px}
.panel-tint{background:var(--mist)}
.panel-line{border:2px solid var(--ink)}
.panel h2{font-weight:800;font-size:30px;margin-bottom:12px}
.panel p{margin-bottom:24px}

/* Split */
.split{display:flex;gap:48px 64px;flex-wrap:wrap;align-items:flex-start}
.split > *{flex:1 1 400px}
.split .side{flex:0 1 360px}

/* Forms */
.form{display:flex;flex-direction:column;gap:18px}
.field{display:flex;flex-direction:column;gap:6px}
label{font-weight:600;font-size:16px}
input,select,textarea{font:inherit;font-size:17px;color:var(--ink);background:#fff;border:2px solid var(--ink);border-radius:12px;padding:12px 16px;min-height:52px;width:100%}
textarea{min-height:140px;resize:vertical}
.inline-field{display:flex;gap:12px;flex-wrap:wrap}
.inline-field input{flex:1 1 220px;width:auto}
.inline-field .btn{border-radius:12px;min-height:52px}
.hidden{position:absolute;left:-9999px}
.form-note{font-size:15px;color:var(--muted)}

/* Faq */
.faq{display:flex;flex-direction:column;gap:28px;max-width:760px}
.faq h3{font-family:var(--body);letter-spacing:0;font-weight:600;font-size:20px;margin-bottom:6px}

/* Founder card */
.founder{background:var(--mist);border-radius:20px;padding:36px}
.founder h2{font-weight:700;font-size:22px;margin-bottom:4px}
.founder-photo{width:120px;height:120px;border-radius:999px;background:var(--line);display:flex;align-items:center;justify-content:center;font-size:13px;color:var(--ink-soft);margin-bottom:20px;object-fit:cover}

/* Footer */
.site-footer{border-top:1px solid var(--line)}
.site-footer .wrap{display:flex;justify-content:space-between;gap:16px 24px;flex-wrap:wrap;padding-top:40px;padding-bottom:40px;font-size:15px;color:var(--ink-soft)}
.footer-tag{font-family:var(--display);font-weight:700;color:var(--ink);font-size:18px}
.footer-links{display:flex;gap:8px 20px;flex-wrap:wrap}

/* Simple pages */
.prose{max-width:720px}
.prose h2{font-size:26px;margin:40px 0 12px}
.prose p{margin-bottom:16px;color:var(--ink-soft)}

@media (max-width:640px){
  .wrap{padding:0 20px}
  .section{padding:64px 0}
  .hero{padding:40px 0 64px;gap:48px}
  .panel{padding:28px}
  .phone{width:270px;height:560px}
  .phone-q{font-size:17px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
#waitlist{scroll-margin-top:24px}

/* Phone demo: one orchestrated moment */
.phone{overflow:hidden}
.stage{position:relative;flex:1}
.scene{position:absolute;inset:0;display:flex;flex-direction:column;gap:16px;opacity:0;transform:translateY(8px);transition:opacity .6s ease,transform .6s ease;pointer-events:none}
.scene.is-on{opacity:1;transform:none}
.rec-btn{transition:transform .25s ease}
.press .scene-ask .rec-btn{transform:scale(.9)}
.press .scene-ask .rec-dot{box-shadow:0 0 0 14px rgba(200,55,45,.15)}
.rec-dot{transition:box-shadow .3s ease}
.rec-status{font-size:14px;font-weight:600;display:flex;align-items:center;gap:8px}
.rec-live{width:10px;height:10px;border-radius:50%;background:#C8372D;animation:blink 1.2s ease-in-out infinite}
.rec-time{font-variant-numeric:tabular-nums;color:var(--muted);font-weight:400}
.wave{display:flex;align-items:center;justify-content:center;gap:4px;height:56px}
.wave span{width:4px;height:12px;border-radius:2px;background:var(--accent);opacity:.85}
.scene-rec.is-on .wave span{animation:wave 1s ease-in-out infinite}
.wave span:nth-child(3n){animation-delay:-.3s}.wave span:nth-child(3n+1){animation-delay:-.6s}.wave span:nth-child(4n){animation-delay:-.15s}.wave span:nth-child(5n){animation-delay:-.45s}
.words{display:flex;flex-direction:column;gap:8px;font-size:14px;line-height:1.35;color:var(--ink-soft);flex:1}
.words span{opacity:0;transform:translateY(6px);filter:blur(4px);transition:opacity .7s ease,transform .7s ease,filter .7s ease}
.words span.in{opacity:1;transform:none;filter:none}
.words.gather span{opacity:0;transform:scale(.6) translateY(40px);filter:blur(8px);transition:all .8s cubic-bezier(.6,0,.4,1)}
.stop-sq{width:30px;height:30px;border-radius:7px;background:#C8372D}
.scene-rec .phone-rec{margin-bottom:4px}
.sum-kicker{font-size:13px;font-weight:600;color:var(--accent)}
.sum-title{font-family:var(--display);font-weight:800;font-size:20px;letter-spacing:-0.02em;margin-top:-10px}
.sum-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.sum-list li{background:#fff;border-radius:14px;padding:12px 14px;font-size:14px;line-height:1.35;opacity:0;transform:translateY(10px);transition:opacity .6s ease,transform .6s ease;position:relative;overflow:hidden}
.sum-list li.in{opacity:1;transform:none}
.sum-list li::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 30%,rgba(11,110,105,.18) 50%,transparent 70%);transform:translateX(-100%)}
.sum-list li.in::after{animation:sweep 1.1s ease .1s 1}
.sum-actions{display:flex;gap:10px;margin-top:auto;opacity:0;transition:opacity .6s ease}
.sum-actions.in{opacity:1}
.listen,.share{display:inline-flex;align-items:center;gap:8px;border-radius:999px;padding:10px 16px;font-weight:600;font-size:14px}
.listen{background:var(--accent);color:#fff}
.share{border:2px solid var(--ink)}
.play{width:0;height:0;border-left:9px solid #fff;border-top:6px solid transparent;border-bottom:6px solid transparent}
@keyframes wave{0%,100%{height:10px}50%{height:46px}}
@keyframes blink{50%{opacity:.3}}
@keyframes sweep{to{transform:translateX(100%)}}
@media (prefers-reduced-motion:reduce){.scene,.words span,.sum-list li{transition:none}.wave span{animation:none!important}}

/* Single stat (home) */
.stat-row{display:flex;align-items:baseline;gap:12px 40px;flex-wrap:wrap}
.stat-big{font-size:clamp(64px,9vw,112px);margin-bottom:0}
.stat-text{font-size:22px;max-width:30ch;color:var(--ink-soft)}
/* Faithful Summary hint */
.sum-hint{font-size:12.5px;color:var(--muted);margin-top:-6px;opacity:0;transition:opacity .6s ease}
.sum-actions.in ~ .sum-hint,.scene-sum .sum-hint.in{opacity:1}
@media (prefers-reduced-motion:reduce){.sum-hint{opacity:1}}
.grid-2{grid-template-columns:repeat(2,minmax(0,1fr));max-width:880px}
.wrap.grid-2{max-width:944px;margin-left:0;margin-right:auto}
.wrap.grid-2{margin-left:max(0px,calc((100% - 1120px)/2))}
@media (max-width:720px){.grid-2{grid-template-columns:1fr}}
