
:root { color-scheme: light; --ink:#202124; --muted:#5f6368; --line:#dadce0; --paper:#fff; --soft:#f6f8fa; --accent:#0b6b61; --warn:#8a4b00; }
* { box-sizing: border-box; }
body { margin:0; font-family: Arial, Helvetica, sans-serif; color:var(--ink); background:#fff; line-height:1.55; }
a { color:#075eb5; }
header { border-bottom:1px solid var(--line); background:#fff; }
.wrap { max-width:1080px; margin:0 auto; padding:0 20px; }
.topbar { min-height:64px; display:flex; align-items:center; justify-content:space-between; gap:20px; }
.brand { font-weight:700; font-size:22px; color:var(--accent); text-decoration:none; }
nav a { margin-left:16px; color:var(--muted); text-decoration:none; font-size:14px; }
main { padding:28px 0 56px; }
.crumbs { color:var(--muted); font-size:14px; margin-bottom:18px; }
h1 { font-size:38px; line-height:1.08; margin:0 0 14px; letter-spacing:0; }
h2 { font-size:24px; margin:32px 0 12px; }
h3 { font-size:18px; margin:0 0 8px; }
.answer { border:2px solid var(--accent); border-radius:8px; padding:18px; margin:22px 0; background:#f3fbf9; }
.grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:14px; margin:18px 0; }
.card { border:1px solid var(--line); border-radius:8px; padding:16px; background:var(--paper); }
.steps { counter-reset:step; padding:0; list-style:none; }
.steps li { border-top:1px solid var(--line); padding:14px 0 14px 42px; position:relative; }
.steps li:before { counter-increment:step; content:counter(step); position:absolute; left:0; top:13px; width:28px; height:28px; border-radius:50%; background:var(--accent); color:#fff; display:grid; place-items:center; font-weight:700; }
.pro { border-left:5px solid var(--warn); background:#fff8ed; padding:14px 16px; margin:20px 0; }
.safety { border:1px solid #b3261e; background:#fff5f4; padding:14px 16px; border-radius:8px; margin:24px 0; }
.meta { color:var(--muted); font-size:14px; }
.ad-slot { border:1px dashed #9aa0a6; min-height:92px; display:grid; place-items:center; color:var(--muted); background:var(--soft); margin:24px 0; text-align:center; padding:12px; }
.cta { display:inline-block; background:var(--accent); color:white; padding:11px 14px; border-radius:6px; text-decoration:none; font-weight:700; }
footer { border-top:1px solid var(--line); padding:24px 0; color:var(--muted); font-size:14px; background:var(--soft); }
@media (max-width:640px) { h1 { font-size:30px; } .topbar { align-items:flex-start; flex-direction:column; padding:14px 0; } nav a { margin:0 12px 0 0; } }
