:root { --font-sans: Arial, sans-serif; --font-serif: Georgia, serif; }

:root { --ink:#18342b; --muted:#63776f; --green:#2f765f; --mint:#e5f1e8; --paper:#fffdf8; --line:#cbd9d0; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:#f7f8f3; color:var(--ink); font-family:var(--font-sans),sans-serif; }
a { color:inherit; text-decoration:none; }
nav { height:92px; display:flex; align-items:center; justify-content:space-between; padding:0 max(5vw,28px); background:#fafbf7; border-bottom:1px solid #e6ebe5; }
.brand { display:flex; align-items:center; gap:13px; font-weight:750; letter-spacing:-.035em; }
.brand span { display:grid; place-items:center; width:38px; height:38px; color:white; background:var(--ink); border-radius:12px; }
select { appearance:auto; border:1px solid var(--line); border-radius:13px; padding:13px 38px 13px 16px; color:var(--ink); background:#fff; font:600 14px var(--font-sans); }
.hero { min-height:690px; position:relative; overflow:hidden; display:grid; grid-template-columns:minmax(0,1.5fr) minmax(330px,.65fr); gap:7vw; align-items:center; padding:86px max(7vw,38px); background:linear-gradient(120deg,#eef6ee 0%,#e1efe5 55%,#d3e8db 100%); }
.halo { position:absolute; width:660px; height:660px; right:5%; top:-240px; border-radius:50%; background:rgba(255,255,255,.38); filter:blur(4px); }
.hero-copy,.reader-card { position:relative; z-index:1; }
.eyebrow { color:#43806b; font-size:12px; line-height:1.3; font-weight:800; letter-spacing:.18em; text-transform:uppercase; }
h1,h2 { font-family:var(--font-serif),serif; }
h1 { max-width:950px; margin:26px 0; font-size:clamp(62px,7.3vw,126px); line-height:.82; letter-spacing:-.065em; font-weight:600; }
.deck { max-width:760px; color:var(--muted); font-size:clamp(18px,1.7vw,27px); line-height:1.55; }
.actions { display:flex; align-items:center; gap:25px; margin-top:38px; flex-wrap:wrap; }
.actions p { font-size:14px; color:var(--muted); }
.primary { display:inline-flex; gap:24px; align-items:center; justify-content:center; border-radius:999px; padding:16px 23px; background:var(--green); color:white; font-weight:750; box-shadow:0 12px 30px rgba(28,75,59,.17); transition:.2s ease; }
.primary:hover { transform:translateY(-2px); box-shadow:0 16px 34px rgba(28,75,59,.24); }
.reader-card { padding:21px; transform:rotate(2deg); border:1px solid rgba(60,100,78,.18); background:var(--paper); border-radius:28px; box-shadow:0 35px 80px rgba(35,70,55,.18); }
.paper { min-height:315px; display:flex; flex-direction:column; gap:18px; padding:35px 26px; border-radius:18px; background:#fff; }
.line { height:9px; width:100%; border-radius:8px; background:#dbe3dc; }.line.short{width:48%}.line.medium{width:76%}
mark { align-self:flex-start; padding:6px 9px; color:var(--ink); background:#d8eadc; font:600 19px var(--font-serif); }
.player { display:flex; align-items:center; gap:14px; padding-top:18px; }.player button{border:0;width:44px;height:44px;border-radius:50%;background:var(--green);color:white}.player>span{height:4px;flex:1;border-radius:5px;background:linear-gradient(90deg,var(--green) 38%,#d6dfd8 38%)}.player small{font-weight:700}
.voices { padding:105px max(7vw,38px); background:#fbfaf6; }
.voice-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-top:35px; }
.voice-grid article,.features article { border:1px solid #dce4dc; border-radius:24px; background:var(--paper); padding:29px; box-shadow:0 8px 28px rgba(29,56,46,.04); }
.voice-label { display:inline-block; border-radius:999px; padding:6px 10px; background:#e0efe5; color:#34735d; font-size:12px; font-weight:800; }
.voice-grid h2 { margin:18px 0 26px; font-size:31px; }
audio { width:100%; height:42px; }
.features { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; padding:30px max(7vw,38px) 115px; background:#fbfaf6; }
.features article>span { display:grid; place-items:center; width:37px; height:37px; border-radius:50%; background:#e9f3eb; color:#44806a; font-size:11px; font-weight:800; }
.features h2 { margin:28px 0 12px; font-size:34px; line-height:1; }.features p { color:var(--muted); line-height:1.65; }
.closing { padding:120px 25px; text-align:center; background:var(--ink); color:white; }.closing .eyebrow{color:#8bc3ac}.closing h2{max-width:900px;margin:25px auto;font-size:clamp(48px,6vw,90px);line-height:.95}.closing>p:not(.eyebrow){max-width:580px;margin:0 auto 38px;color:#bfd0c8;line-height:1.7}.closing .primary{background:#f1f5ed;color:var(--ink)}
footer { display:grid; grid-template-columns:1fr 1fr auto; align-items:center; gap:20px; padding:45px max(5vw,28px); font-size:13px; color:var(--muted); }footer p:last-child{text-align:right}
@media(max-width:850px){nav{height:72px;padding:0 16px}.brand{font-size:12px;gap:8px}.brand span{width:30px;height:30px;border-radius:9px}select{max-width:126px;padding:10px 28px 10px 11px}.hero{min-height:auto;grid-template-columns:1fr;padding:70px 20px 75px}.reader-card{display:none}h1{font-size:clamp(58px,17vw,82px);line-height:.87}.deck{font-size:18px}.actions{align-items:flex-start;flex-direction:column}.voice-grid,.features{grid-template-columns:1fr}.voices{padding:78px 18px}.features{padding:0 18px 80px}.closing{padding:90px 20px}footer{grid-template-columns:1fr;justify-items:start}footer p:last-child{text-align:left}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.primary{transition:none}}

.section-title{font-size:clamp(34px,5vw,54px);margin:18px 0}.sample-script{max-width:760px;color:var(--muted);line-height:1.7}nav>span{font-size:13px;color:var(--muted)}