
:root{--accent:#8E2C48;--accent-soft:rgba(142,44,72,.10);--bg:#FAF6EF;--surface:#FFFFFF;--text:#1C1416;--muted:rgba(28,20,22,.62);--rule:rgba(28,20,22,.12);--cream:#F5EFE3;
--serif:'New York',ui-serif,'Iowan Old Style','Charter',Georgia,serif;--sans:-apple-system,BlinkMacSystemFont,'SF Pro Text','Helvetica Neue',system-ui,sans-serif}
@media (prefers-color-scheme:dark){:root{--accent:#D9738F;--accent-soft:rgba(217,115,143,.16);--bg:#120D0C;--surface:#1E1716;--text:#F5EFE3;--muted:rgba(245,239,227,.62);--rule:rgba(245,239,227,.12)}}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--text);font:17px/1.55 var(--sans);-webkit-font-smoothing:antialiased}
a{color:var(--accent)}a:hover{text-decoration-thickness:2px}
.wrap{max-width:1040px;margin:0 auto;padding:0 20px}
header.top{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 0}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--text);font:700 22px var(--serif)}
.brand img{width:36px;height:36px;border-radius:9px}
nav.links{display:flex;align-items:center;gap:18px;font-size:15px}
nav.links a{color:var(--text);text-decoration:none;opacity:.8}nav.links a:hover{opacity:1}
.lang{display:flex;gap:4px;padding:3px;border-radius:999px;background:var(--accent-soft)}
.lang a{padding:4px 10px;border-radius:999px;font-size:13px;font-weight:600;color:var(--accent);text-decoration:none;opacity:1}
.lang a[aria-current]{background:var(--accent);color:#fff}
.hero{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center;padding:48px 0 72px}
.eyebrow{font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--accent)}
h1{font:700 clamp(40px,6vw,64px)/1.04 var(--serif);margin:14px 0 18px;letter-spacing:-.01em}
.lead{font-size:19px;color:var(--muted);max-width:34em;margin:0 0 28px}
.badge{display:inline-flex;align-items:center;gap:10px;padding:13px 20px;border-radius:14px;background:var(--text);color:var(--bg);font-weight:600;font-size:15px}
.badge svg{width:20px;height:20px}
/* phone mock */
.phone{width:300px;height:620px;margin:0 auto;border-radius:48px;padding:12px;background:#0d0b0b;box-shadow:0 30px 60px rgba(0,0,0,.25),inset 0 0 0 2px #2a2525}
.screen{width:100%;height:100%;border-radius:38px;background:#F2F2F7;color:#000;overflow:hidden;display:flex;flex-direction:column;align-items:center;padding:44px 16px 18px;font-family:var(--sans)}
.m-top{display:flex;align-items:center;gap:10px;width:100%}.m-x{width:30px;height:30px;border-radius:50%;background:#fff;display:grid;place-items:center;font-size:12px}
.m-bar{flex:1;height:5px;border-radius:3px;background:rgba(120,120,128,.16);overflow:hidden}.m-bar i{display:block;width:35%;height:100%;background:#8E2C48}
.m-count{font-size:11px;font-weight:600;color:rgba(60,60,67,.6)}
.m-eyebrow{margin-top:22px;font-size:9.5px;font-weight:600;letter-spacing:.06em;color:#8E2C48}
.m-q{font:700 21px/1.15 var(--serif);text-align:center;margin:8px 0}
.m-dir{font-size:11px;font-weight:600;padding:4px 10px;border-radius:999px;background:rgba(118,118,128,.12)}
.m-ring{margin-top:22px;width:136px;height:136px;border-radius:50%;background:rgba(142,44,72,.11);display:grid;place-items:center}
.m-play{width:106px;height:106px;border-radius:50%;background:#8E2C48;display:grid;place-items:center;box-shadow:0 10px 24px rgba(142,44,72,.35)}
.m-cap{font-size:11px;color:rgba(60,60,67,.6);margin:10px 0 auto}
.m-ans{width:100%;display:flex;flex-direction:column;gap:8px}
.m-ans div{display:flex;justify-content:space-between;align-items:center;height:48px;padding:0 14px;border-radius:15px;background:#fff}
.m-ans b{font:600 16px var(--serif)}.m-ans span{font-size:11px;font-weight:600;color:rgba(60,60,67,.6);background:rgba(118,118,128,.12);padding:3px 7px;border-radius:6px}
section.block{padding:64px 0;border-top:1px solid var(--rule)}
h2{font:700 clamp(28px,4vw,40px)/1.15 var(--serif);margin:0 0 28px}
.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
.card{background:var(--surface);border-radius:24px;padding:26px}
.card h3{font:700 22px/1.25 var(--serif);margin:12px 0 8px}.card p{margin:0;color:var(--muted)}
.dot{display:flex;gap:6px;align-items:center}.dot i{width:12px;height:12px;border-radius:50%;background:var(--accent)}.dot i+i{opacity:.45}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;counter-reset:s}
.step{padding-top:16px;border-top:2px solid var(--accent)}
.step h3{font:700 22px var(--serif);margin:6px 0}.step p{margin:0;color:var(--muted)}
.step .n{font:600 13px var(--sans);letter-spacing:.08em;color:var(--accent)}
.langs{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}.langs span{padding:8px 14px;border-radius:999px;background:var(--surface);font-weight:600;font-size:15px}
footer{padding:40px 0 56px;border-top:1px solid var(--rule);color:var(--muted);font-size:14px}
footer .row{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}
footer a{color:var(--muted)}
.doc{max-width:720px;padding:32px 0 72px}
.doc h1{font-size:clamp(34px,5vw,48px)}
.doc h2{font-size:22px;margin:32px 0 8px}
.doc p{margin:0 0 12px}
.updated{color:var(--muted);font-size:15px}
details{background:var(--surface);border-radius:18px;padding:18px 22px;margin:0 0 12px}
summary{cursor:pointer;font-weight:600}details p{margin:10px 0 0;color:var(--muted)}
.btn{display:inline-block;padding:13px 22px;border-radius:999px;background:var(--accent);color:#fff;text-decoration:none;font-weight:600}
@media (max-width:820px){.hero{grid-template-columns:1fr;padding-top:24px}.grid,.steps{grid-template-columns:1fr}nav.links .hide-s{display:none}}
