/* Design handoff r02 for the homepage: palette, display type and surfaces.
   Loaded after the page's own styles; content and DOM are unchanged. */
:root{--bg:#fffaf0;--ink:#151615;--ink-2:#62635e;--hair:#dedbd2;--soft:#f4f0e7;--marker:#ffdc3e;--blue:#1f4ff5;--red:#fa5638}
body{background:var(--bg)}
.nav{background:#fffaf0ed}
.hero{padding-top:76px}
.hero h1,.features-title,.pricing h2,.privacy h2,.faq h2{font-family:Georgia,serif;font-weight:700;letter-spacing:-.04em}
.hero h1{font-size:clamp(48px,6vw,88px)}
.hero .sel{color:var(--blue)}
.btn-black{background:var(--blue);color:white}
.btn-black:hover{background:#173cbe}
.btn{border-radius:12px;font-weight:600}
.demo-frame{border-radius:24px!important}
.demo{background:var(--marker);border-radius:24px;padding:18px}
.statement{padding-block:70px}
.stats{gap:18px}
.stat{background:#fff;border:1px solid var(--hair);border-radius:16px;padding:22px}
.moves{gap:18px}
.move{background:var(--marker);padding:28px;border:0;border-radius:18px}
.move:nth-child(2){background:#e6ecff}
.move:nth-child(3){background:#ffe4dc}
.features-title{font-size:clamp(38px,4vw,60px)}
.frow{border:1px solid var(--hair);border-radius:22px;background:white;padding:32px;margin:20px 0;gap:44px}
.frow .media{border-radius:16px}
.frow h3{font-size:26px;letter-spacing:-.03em}
.grain{background-image:none!important}
.g-mint,.g-lime{background:#ffdc3e!important}
.g-pink,.g-peach{background:#ffe4dc!important}
.g-sky,.g-lilac{background:#e3eaff!important}
.g-sun{background:#ffdc3e!important}
.ui{border-radius:14px!important}
.privacy{padding-block:64px}
.plist{border:1px solid var(--hair);background:white;border-radius:18px;padding:24px}
.plan{border-radius:18px;background:white}
.plan.feature{background:var(--marker);border-color:#151615}
.plan .btn-black{background:#151615}
.faq details{background:white;border:1px solid var(--hair);border-radius:12px;padding:8px 20px;margin-bottom:10px}
footer{background:#151615}
footer .logo{color:white}
@media(max-width:700px){.hero{padding-top:45px}
.frow{padding:20px;gap:22px}
.demo{padding:8px}
.move{padding:20px}
.stat{padding:16px}
}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}
