:root{--ink:#0E0E10;--ink-soft:#28282E;--ink-mute:#6B6B72;--paper:#FAFAF7;--paper-pure:#FFFFFF;--rule:#DCDCD7;--accent:#F25C1B;--accent-ink:#C24412;--good:#2E7D5B;--bad:#B12A2A;--paddle-blue:#0E0E10}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--paper);color:var(--ink);font-family:'Inter',-apple-system,BlinkMacSystemFont,system-ui,sans-serif;-webkit-font-smoothing:antialiased;font-size:16px;line-height:1.55}
a{color:var(--accent-ink)}
a:hover{color:var(--accent)}

.wrap{max-width:760px;margin:0 auto;padding:0 20px}
@media(min-width:640px){.wrap{padding:0 32px}}

.topnav{border-bottom:1px solid var(--rule);padding:14px 0;font:600 13px/1 'JetBrains Mono',ui-monospace,monospace;letter-spacing:.05em;color:var(--ink-mute)}
.topnav a{color:var(--ink-mute);text-decoration:none}
.topnav a:hover{color:var(--accent-ink)}
.topnav__sep{margin:0 10px;color:var(--rule)}

.hero{padding:72px 0 32px}
@media(min-width:640px){.hero{padding:96px 0 48px}}
.tag{display:inline-block;font:600 11px/1 'JetBrains Mono',monospace;text-transform:uppercase;letter-spacing:.12em;color:var(--accent-ink);background:rgba(242,92,27,.06);border:1px solid rgba(242,92,27,.25);padding:6px 10px;border-radius:2px;margin-bottom:20px}
h1{font:800 44px/1.04 'Inter Tight',-apple-system,sans-serif;letter-spacing:-0.03em;margin:0 0 18px;color:var(--ink)}
@media(min-width:640px){h1{font-size:58px}}
.lede{font-size:19px;line-height:1.5;color:var(--ink-soft);margin:0 0 24px;max-width:58ch}
.sub{font-size:15px;color:var(--ink-mute);margin:0 0 32px;max-width:58ch}

.hero-anchor{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;padding:24px 28px;background:var(--paper-pure);border:1px solid var(--rule);border-radius:8px;margin:8px 0 16px}
.hero-anchor__amount{font:800 44px/1 'Inter Tight',sans-serif;letter-spacing:-.025em;color:var(--accent);flex:0 0 auto}
.hero-anchor__terms{font:500 13px/1.55 'Inter',sans-serif;color:var(--ink-mute);flex:1 1 160px;min-width:0}
@media(max-width:480px){.hero-anchor{flex-direction:column;align-items:flex-start;gap:14px}}

.btn{display:inline-block;background:var(--accent);color:var(--paper-pure);padding:15px 26px;border-radius:4px;font:700 15px/1 'Inter',sans-serif;text-decoration:none;border:0;cursor:pointer;text-align:center;transition:background .15s}
.btn:hover{background:var(--accent-ink);color:var(--paper-pure)}
.btn--ghost{background:transparent;color:var(--ink-soft);border:1.5px solid var(--rule);padding:13.5px 22px}
.btn--ghost:hover{border-color:var(--ink-soft);color:var(--ink);background:transparent}

.section{padding:48px 0;border-top:1px solid var(--rule)}
.section h2{font:800 28px/1.15 'Inter Tight',sans-serif;letter-spacing:-.02em;margin:0 0 18px}
.section p{font-size:16px;line-height:1.6;color:var(--ink-soft);max-width:62ch}
@media(min-width:640px){.section h2{font-size:32px}}

/* before/after panel */
.beforeafter{display:grid;grid-template-columns:1fr;gap:18px;margin:24px 0 0}
@media(min-width:720px){.beforeafter{grid-template-columns:1fr 1fr}}
.ba-card{padding:22px 24px;border:1px solid var(--rule);border-radius:6px;background:var(--paper-pure)}
.ba-card--before{background:#FCFAF7;border-color:#E5DDD0}
.ba-card--after{background:#F4FBF6;border-color:#CFE6D5}
.ba-card .ba-title{font:700 13px/1 'JetBrains Mono',monospace;text-transform:uppercase;letter-spacing:.08em;margin-bottom:14px}
.ba-card--before .ba-title{color:#7D6A4D}
.ba-card--after .ba-title{color:var(--good)}
.ba-card ul{list-style:none;padding:0;margin:0;font-size:14px;line-height:1.55}
.ba-card li{padding:8px 0 8px 22px;position:relative;color:var(--ink-soft);border-bottom:1px solid rgba(0,0,0,.04)}
.ba-card li:last-child{border-bottom:0}
.ba-card--before li:before{content:'–';position:absolute;left:0;color:#9C8866;font-weight:700}
.ba-card--after li:before{content:'✓';position:absolute;left:0;color:var(--good);font-weight:700}

/* deliverables */
.deliv{display:grid;grid-template-columns:1fr;gap:14px;margin:24px 0 0}
@media(min-width:720px){.deliv{grid-template-columns:1fr 1fr}}
.deliv-card{padding:20px 22px;border:1px solid var(--rule);border-radius:6px;background:var(--paper-pure);transition:border-color .15s}
.deliv-card:hover{border-color:var(--ink-mute)}
.deliv-num{font:700 11px/1 'JetBrains Mono',monospace;letter-spacing:.08em;color:var(--accent-ink);margin-bottom:8px}
.deliv-title{font:700 16px/1.25 'Inter Tight',sans-serif;letter-spacing:-.01em;margin:0 0 8px;color:var(--ink)}
.deliv-body{font-size:14px;line-height:1.55;color:var(--ink-soft);margin:0}

/* process timeline */
.timeline{margin:24px 0 0;padding:0;list-style:none;counter-reset:step}
.timeline li{counter-increment:step;position:relative;padding:14px 0 14px 56px;border-bottom:1px solid var(--rule)}
.timeline li:last-child{border-bottom:0}
.timeline li:before{content:counter(step);position:absolute;left:0;top:14px;width:38px;height:38px;border-radius:50%;background:var(--paper-pure);border:1.5px solid var(--accent);color:var(--accent-ink);font:800 16px/38px 'Inter Tight',sans-serif;text-align:center}
.timeline .ts-title{font:700 15px/1.3 'Inter',sans-serif;color:var(--ink);margin-bottom:4px}
.timeline .ts-body{font-size:14px;line-height:1.55;color:var(--ink-soft);margin:0}

/* faq */
.faq details{border-bottom:1px solid var(--rule);padding:16px 0}
.faq details:last-of-type{border-bottom:0}
.faq summary{font:700 16px/1.3 'Inter Tight',sans-serif;color:var(--ink);cursor:pointer;list-style:none;padding-right:30px;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary:after{content:'+';position:absolute;right:0;top:0;font-size:22px;color:var(--ink-mute);transition:transform .15s}
.faq details[open] summary:after{content:'–'}
.faq details p{font-size:15px;line-height:1.6;color:var(--ink-soft);margin:10px 0 0;max-width:60ch}

/* cta band */
.cta{padding:56px 0;border-top:1px solid var(--rule);background:linear-gradient(180deg,var(--paper) 0%,var(--paper-pure) 100%)}
.cta__inner{text-align:center;max-width:560px;margin:0 auto}
.cta h2{font:800 30px/1.1 'Inter Tight',sans-serif;letter-spacing:-.02em;margin:0 0 14px}
.cta p{font-size:16px;color:var(--ink-soft);margin:0 0 24px}
.cta .btn{padding:18px 38px;font-size:16px}

.foot{padding:32px 0 48px;font-size:13px;line-height:1.7;color:var(--ink-mute);border-top:1px solid var(--rule);text-align:center}
.foot a{color:var(--ink-mute);text-decoration:underline;text-underline-offset:3px}
.foot strong{color:var(--ink-soft);font-weight:600}

.brand{font-weight:800;letter-spacing:-.01em}
.studio-note{font:500 13px/1.5 'Inter',sans-serif;color:var(--ink-mute);margin:18px 0 0;font-style:italic}