:root{color-scheme:light;--ink:#17233c;--accent:#555bea;--muted:#536077}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#f7f8fc;color:var(--ink);font-family:system-ui,sans-serif;line-height:1.65}
header,main,footer{width:min(960px,calc(100% - 40px));margin:auto}
header{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:28px 0;border-bottom:1px solid #dde2ee}
a{color:var(--accent);text-underline-offset:4px;overflow-wrap:anywhere}
.brand{font-size:1.4rem;font-weight:800;text-decoration:none;color:var(--ink)}
.brand span{display:block;font-size:.75rem;color:var(--muted);letter-spacing:.06em}
section{padding:52px 0}
.intro{padding-top:72px}
.eyebrow{color:var(--accent);font-size:.8rem;letter-spacing:.13em;font-weight:700;text-transform:uppercase}
h1{font-size:clamp(2.2rem,6vw,4.2rem);line-height:1.12;letter-spacing:-.05em;margin:18px 0 28px}
h2{font-size:2rem;line-height:1.2;margin:8px 0 22px}
.lead{font-size:1.2rem;max-width:760px;color:var(--muted)}
.product{display:grid;grid-template-columns:1fr 150px;gap:40px;padding:36px;border:1px solid #dfe1fc;border-radius:24px;background:#eeefff}
.product p{max-width:640px}
.product-mark{align-self:center;display:grid;place-items:center;height:150px;background:var(--accent);border-radius:32px;color:white;font-size:4.5rem;font-weight:800;position:relative}
.product-mark span{position:absolute;right:12px;bottom:6px;font-size:1.8rem;color:#ffc8d2}
.button{display:inline-block;background:var(--accent);color:white;padding:12px 20px;border-radius:12px;text-decoration:none;font-weight:650}
dl{display:grid;grid-template-columns:190px 1fr;gap:12px 24px;margin:28px 0}
dt{font-weight:700}dd{margin:0;overflow-wrap:anywhere}
.note{font-size:.9rem;color:var(--muted);max-width:800px}
footer{border-top:1px solid #dde2ee;padding:24px 0;color:var(--muted);font-size:.85rem}
a:focus-visible{outline:3px solid var(--accent);outline-offset:5px}
@media(max-width:600px){.product{grid-template-columns:1fr;padding:24px}.product-mark{display:none}dl{grid-template-columns:1fr;gap:4px}dd{margin-bottom:14px}section{padding:36px 0}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
