:root { color-scheme: light; --ink:#172321; --muted:#61706a; --paper:#f6f5ef; --card:#fff; --accent:#d5643b; --line:#d9dfd8; --green:#bfd8bb; }
* { box-sizing:border-box; }
body { margin:0; background:var(--paper); color:var(--ink); font-family: Inter, ui-sans-serif, system-ui, sans-serif; line-height:1.5; }
a { color:inherit; }
.shell { max-width:1160px; margin:auto; padding:22px 24px 80px; }
nav { display:flex; justify-content:space-between; align-items:center; gap:20px; }
.wordmark { font-weight:800; letter-spacing:-.04em; font-size:1.25rem; text-decoration:none; }
nav .links { display:flex; gap:20px; align-items:center; font-size:.92rem; color:var(--muted); }
.button { display:inline-block; background:var(--ink); color:white; text-decoration:none; border-radius:999px; padding:12px 18px; font-weight:700; }
.button.alt { background:var(--accent); }
.hero { display:grid; grid-template-columns:1.15fr .85fr; gap:70px; align-items:center; padding:92px 0 76px; }
.eyebrow { color:var(--accent); text-transform:uppercase; letter-spacing:.13em; font-size:.76rem; font-weight:800; }
h1 { font-size:clamp(3.2rem, 7vw, 6.8rem); line-height:.92; letter-spacing:-.075em; max-width:760px; margin:14px 0 26px; }
h2 { font-size:clamp(2rem, 4vw, 3.3rem); letter-spacing:-.055em; line-height:1; margin:0 0 18px; }
.lede { max-width:620px; color:var(--muted); font-size:1.2rem; }
.actions { display:flex; gap:12px; flex-wrap:wrap; margin-top:28px; }
.note { font-size:.82rem; color:var(--muted); margin-top:14px; }
.mock { background:#17322b; border-radius:28px; padding:20px; box-shadow:18px 20px 0 var(--green); transform:rotate(2deg); }
.mock-top { display:flex; justify-content:space-between; color:#c8ddd0; font-size:.8rem; padding:4px 2px 18px; }
.mock-card { background:#f8faf5; border-radius:18px; padding:18px; }
.mock-card h3 { margin:0 0 12px; }
.item { display:flex; justify-content:space-between; border-top:1px solid #d8e2da; padding:13px 0; font-size:.92rem; }
.pill { border-radius:999px; padding:4px 8px; background:#dcebd8; font-size:.76rem; }
.section { padding:74px 0; border-top:1px solid var(--line); }
.grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.card { background:var(--card); border:1px solid var(--line); border-radius:20px; padding:24px; }
.card h3 { margin:0 0 8px; font-size:1.05rem; }
.card p { color:var(--muted); margin:0; }
.quote { background:#dbe9d5; border-radius:24px; padding:34px; max-width:850px; font-size:1.55rem; letter-spacing:-.025em; }
footer { border-top:1px solid var(--line); padding-top:22px; color:var(--muted); font-size:.86rem; display:flex; justify-content:space-between; gap:20px; }
@media (max-width:760px) { .hero { grid-template-columns:1fr; gap:42px; padding-top:64px; } .grid { grid-template-columns:1fr; } nav .links a:not(.button) { display:none; } h1 { font-size:clamp(3.1rem,16vw,5rem); } footer { flex-direction:column; } }