*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#0B0D10;color:#F1F0EB;font-family:'Bricolage Grotesque',system-ui,sans-serif;-webkit-font-smoothing:antialiased}
a{color:#F1F0EB;text-decoration:none}
a:hover{color:#FF5A4E}
.mark{display:block;overflow:visible;flex:none}

@keyframes rzin{from{transform:translateY(10px);opacity:0}to{transform:none;opacity:1}}
@keyframes rzbar{from{transform:scaleY(1)}to{transform:scaleY(.25)}}
@keyframes rzring{0%{transform:scale(1);opacity:.55}100%{transform:scale(2.2);opacity:0}}

/* Header */
.hdr{position:sticky;top:0;z-index:10;background:rgba(11,13,16,.82);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:1px solid rgba(241,240,235,.08)}
.hdr-in{max-width:1320px;margin:0 auto;padding:14px clamp(20px,4vw,48px);display:flex;align-items:center;gap:24px}
.brand{display:flex;align-items:center;gap:10px}
.wordmark{font-size:24px;letter-spacing:-.05em;font-weight:300}
.wordmark .b{font-weight:800}
.wordmark .z{font-weight:800;color:#FF5A4E}
.nav{margin-left:auto;display:flex;gap:clamp(14px,2.5vw,32px);flex-wrap:wrap;font-size:16px;color:#C9CAC5}
.btn-sm{padding:10px 18px;border-radius:99px;background:#FF5A4E;color:#0B0D10;font-weight:700;font-size:15px;white-space:nowrap}
.btn-sm:hover{background:#F1F0EB;color:#0B0D10}

/* Hero */
.hero{position:relative;overflow:hidden;background:radial-gradient(900px 500px at 80% 10%,rgba(255,90,78,.16),transparent 60%)}
.hero-in{max-width:1320px;margin:0 auto;padding:clamp(56px,8vw,112px) clamp(20px,4vw,48px);display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,460px),1fr));gap:clamp(32px,5vw,72px);align-items:center}
.hero-copy{display:flex;flex-direction:column;gap:28px}
.eyebrow{font-family:'Geist Mono',monospace;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:#FF5A4E}
.hero-title{margin:0;font-size:clamp(56px,8.5vw,124px);line-height:.88;letter-spacing:-.055em;font-weight:800}
.coral{color:#FF5A4E}
.lede{margin:0;max-width:540px;font-size:clamp(19px,2vw,23px);line-height:1.45;color:#C9CAC5;text-wrap:pretty}
.ctas{display:flex;gap:12px;flex-wrap:wrap}
.btn{padding:16px 26px;border-radius:99px;font-size:17px}
.btn-primary{background:#FF5A4E;color:#0B0D10;font-weight:700}
.btn-primary:hover{background:#F1F0EB;color:#0B0D10}
.btn-ghost{border:1px solid rgba(241,240,235,.25);font-weight:500}
.btn-ghost:hover{border-color:#F1F0EB}

/* Demo call */
.demo{border-radius:28px;background:#15181C;border:1px solid rgba(241,240,235,.08);box-shadow:0 40px 120px -40px rgba(255,90,78,.35);overflow:hidden}
.demo-head{display:flex;align-items:center;gap:16px;padding:20px 22px;border-bottom:1px solid rgba(241,240,235,.08)}
.avatar{position:relative;width:48px;height:48px;flex:none}
.ring{position:absolute;inset:0;border-radius:99px;background:#FF5A4E;animation:rzring 1.8s ease-out infinite}
.avatar-in{position:relative;width:48px;height:48px;border-radius:99px;background:#FF5A4E;display:flex;align-items:center;justify-content:center}
.caller-info{display:flex;flex-direction:column;gap:2px}
.caller-name{font-size:18px;font-weight:700}
.caller-sub{font-family:'Geist Mono',monospace;font-size:12px;color:#A7A9A4}
.demo-meta{margin-left:auto;display:flex;align-items:center;gap:12px}
.wave{display:flex;align-items:center;gap:3px;height:22px}
.wave span{width:3px;border-radius:9px;background:#FF5A4E;animation:rzbar .5s ease-in-out infinite alternate}
.timer{font-family:'Geist Mono',monospace;font-size:14px;color:#F1F0EB}
.demo-body{padding:22px;display:flex;flex-direction:column;gap:12px;min-height:380px}
.line{display:flex;flex-direction:column;gap:4px;max-width:86%;animation:rzin .5s cubic-bezier(.2,.7,.2,1) both}
.line.ai{align-self:flex-start}
.line.caller{align-self:flex-end}
.who{font-family:'Geist Mono',monospace;font-size:11px;letter-spacing:.06em;text-transform:uppercase}
.line.ai .who{color:#FF5A4E;align-self:flex-start}
.line.caller .who{color:#A7A9A4;align-self:flex-end}
.bubble{padding:12px 16px;border-radius:18px;font-size:16px;line-height:1.4}
.line.ai .bubble{background:#1E2227;color:#F1F0EB}
.line.caller .bubble{background:#FF5A4E;color:#0B0D10}
.outcomes{display:flex;gap:8px;flex-wrap:wrap;margin-top:auto;padding-top:14px;border-top:1px solid rgba(241,240,235,.08);animation:rzin .5s both}
.chip{font-family:'Geist Mono',monospace;font-size:12px;padding:7px 12px;border-radius:99px;background:rgba(255,90,78,.14);color:#FFB3AD}

/* Sections */
.sec{max-width:1320px;margin:0 auto;padding:clamp(72px,10vw,140px) clamp(20px,4vw,48px);display:flex;flex-direction:column;gap:40px;scroll-margin-top:60px}
.h2{margin:0;font-size:clamp(44px,6vw,88px);line-height:.92;letter-spacing:-.05em;font-weight:800}
.h2-narrow{max-width:900px}
.dim{font-weight:300;color:#A7A9A4}

.fgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:12px}
.fcard{border-radius:22px;background:#15181C;border:1px solid rgba(241,240,235,.06);padding:26px;display:flex;flex-direction:column;gap:14px;min-height:220px;transition:transform .3s,border-color .3s}
.fcard:hover{transform:translateY(-4px);border-color:rgba(255,90,78,.5)}
.fnum{font-family:'Geist Mono',monospace;font-size:12px;color:#FF5A4E}
.ftitle{font-size:26px;line-height:1.05;letter-spacing:-.03em;font-weight:800}
.fdesc{font-size:16px;line-height:1.5;color:#C9CAC5;text-wrap:pretty}

.how{background:#F1F0EB;color:#0B0D10;scroll-margin-top:60px}
.how-in{max-width:1320px;margin:0 auto;padding:clamp(72px,10vw,140px) clamp(20px,4vw,48px);display:flex;flex-direction:column;gap:48px}
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:32px}
.step{display:flex;flex-direction:column;gap:16px;padding-top:20px;border-top:2px solid #0B0D10}
.snum{font-size:clamp(64px,7vw,96px);line-height:.85;letter-spacing:-.06em;font-weight:300;color:#E0443A}
.stitle{font-size:30px;font-weight:800;letter-spacing:-.035em}
.sdesc{font-size:17px;line-height:1.5;color:#3B3E3A;text-wrap:pretty}

.uses{display:flex;flex-direction:column}
.use{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:12px 32px;padding:26px 0;border-top:1px solid rgba(241,240,235,.12)}
.use:hover{background:rgba(255,90,78,.05)}
.ut{font-size:clamp(28px,3vw,40px);font-weight:800;letter-spacing:-.04em}
.ud{font-size:18px;line-height:1.5;color:#C9CAC5;text-wrap:pretty}

/* CTA */
.cta{padding:0 clamp(20px,4vw,48px) clamp(48px,6vw,80px)}
.cta-box{max-width:1320px;margin:0 auto;border-radius:32px;background:#FF5A4E;color:#0B0D10;padding:clamp(40px,7vw,96px);display:flex;flex-direction:column;gap:28px;align-items:flex-start}
.cta-title{margin:0;font-size:clamp(48px,8vw,120px);line-height:.88;letter-spacing:-.055em;font-weight:800}
.btn-dark{padding:18px 30px;border-radius:99px;background:#0B0D10;color:#F1F0EB;font-weight:700;font-size:18px}
.btn-dark:hover{color:#FF5A4E}

/* Footer */
.ftr{max-width:1320px;margin:0 auto;padding:40px clamp(20px,4vw,48px) 56px;display:flex;flex-direction:column;gap:24px;border-top:1px solid rgba(241,240,235,.1)}
.ftr-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.ftr-label{font-family:'Geist Mono',monospace;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:#A7A9A4}
.family{display:flex;gap:10px 24px;flex-wrap:wrap}
.family a{display:flex;align-items:center;gap:8px;font-size:15px;color:#C9CAC5}
.family a:hover{color:#F1F0EB}
.dot{width:8px;height:8px;border-radius:9px}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
}

@media (max-width:720px){header nav{display:none!important}header nav+a{margin-left:auto!important}}
