
:root{
  --bg:#ffffff; --surface:#f8fafc; --muted:#475569; --text:#0f172a; --brand:#df782d; --brand-2:#ae581a;
  --card:#ffffff; --line:#e5e7eb;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font:16px/1.6 system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif}
a{color:var(--brand);text-decoration:none}
a:hover{text-decoration:underline}
.container{max-width:1100px;margin:0 auto;padding:2rem}
.narrow{max-width:820px}
.flex{display:flex;gap:1rem}
.center{align-items:center}
.between{justify-content:space-between}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem}
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:1.25rem}
.split{display:grid;grid-template-columns:1.1fr .9fr;gap:2rem}
.split.two{grid-template-columns:1fr 1fr}
@media (max-width: 900px){
  .grid-3,.split,.grid-2{grid-template-columns:1fr}
}
.site-header{position:sticky;top:0;background:rgba(255,255,255,.85);backdrop-filter:blur(8px);border-bottom:1px solid var(--line);z-index:20}
.brand{display:inline-flex;align-items:center;font-weight:700;letter-spacing:.2px;color:var(--text)}
.brand .logo{width:28px;height:28px;margin-right:.5rem}
.nav{display:flex;gap:1rem}
.nav a{padding:.6rem .9rem;border-radius:10px;color:var(--text)}
.nav .cta{background:var(--brand);color:#fff;font-weight:600}
.menu-btn{display:none;background:transparent;color:var(--text);border:1px solid var(--line);padding:.5rem .75rem;border-radius:10px}
@media (max-width: 840px){
  .menu-btn{display:inline-block}
  .nav{display:none;position:absolute;right:1rem;top:58px;background:var(--surface);padding:1rem;border:1px solid var(--line);border-radius:14px;flex-direction:column}
  .nav.open{display:flex}
}
.hero{padding:4rem 2rem 2rem}
.hero h1{font-size:clamp(2rem,5vw,3rem);margin:0 0 .5rem}
.lead{color:var(--muted);font-size:1.1rem}
.actions{margin-top:1rem;display:flex;gap:.75rem}
.btn{display:inline-block;background:var(--brand);color:#fff;font-weight:700;padding:.8rem 1.1rem;border-radius:12px;border:1px solid transparent}
.btn.ghost{background:transparent;color:var(--brand);border-color:var(--brand)}
.btn.small{padding:.5rem .8rem;font-weight:600}
.eyebrow{color:var(--brand-2);text-transform:uppercase;letter-spacing:.12em;font-size:.8rem}
.cards .card{background:var(--card);border:1px solid var(--line);padding:1rem;border-radius:16px}
.box{background:var(--card);border:1px solid var(--line);padding:1rem;border-radius:16px}
.panel{background:var(--surface);border:1px solid var(--line);padding:1rem;border-radius:16px}
.bullets{padding-left:1.1rem}
.ticks{list-style:none;padding-left:0}
.ticks li{position:relative;padding-left:1.5rem;margin:.4rem 0}
.ticks li:before{content:"✓";position:absolute;left:0;color:var(--brand)}
.steps{counter-reset:step;padding-left:0}
.steps li{list-style:none;background:var(--card);border:1px solid var(--line);padding:1rem;border-radius:14px;margin:.8rem 0}
.steps li h3{margin:.2rem 0}
.brandline{display:flex;align-items:center;gap:.5rem;margin-bottom:.5rem}
.site-footer{border-top:1px solid var(--line);margin-top:2rem}
.plain{list-style:none;padding-left:0;margin:0}
.plain li{margin:.2rem 0}
.muted{color:var(--muted)}
.form label{display:block;margin-top:.6rem}
.form input,.form textarea{width:100%;padding:.65rem;border-radius:10px;border:1px solid var(--line);background:#fff;color:var(--text)}
.post{padding:1rem 0;border-bottom:1px solid var(--line)}

.site-footer .brandline .logo{width:28px;height:28px}
