:root{
  --bg-main:#090a0d;
  --bg-surface:#121318;
  --bg-input:#1b1c22;
  --accent-cyan:#00b4ec;
  --text-primary:#f3f4f6;
  --text-secondary:#9ca3af;
  --line:rgba(255,255,255,.08);
  --radius:14px;
  --fb:#5b9eff; --ig:#ff7a89; --tt:#34d399; --yt:#ff7c7c;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; background:var(--bg-main); color:var(--text-primary);
  font-family:'Outfit',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  font-size:17px; line-height:1.68; -webkit-font-smoothing:antialiased;
}
.wrap{max-width:900px; margin:0 auto; padding:0 24px}

/* ---------- header / nav ---------- */
.site-header{border-bottom:1px solid var(--line); position:sticky; top:0; z-index:20;
  background:rgba(9,10,13,.88); backdrop-filter:blur(10px)}
.header-inner{display:flex; align-items:center; gap:26px; padding:15px 0; flex-wrap:wrap}
.brand{display:flex; align-items:center; gap:11px; text-decoration:none; color:var(--text-primary); flex-shrink:0}
.brand svg{width:25px; height:18.6px; color:#fff; filter:drop-shadow(0 0 6px rgba(255,255,255,.18))}
.brand span{font-weight:600; letter-spacing:-.01em; font-size:1rem}
.nav{display:flex; gap:3px; flex-wrap:wrap; margin-left:auto}
.nav a{
  text-decoration:none; color:var(--text-secondary); font-size:.87rem;
  padding:6px 11px; border-radius:8px; white-space:nowrap;
}
.nav a:hover{color:var(--text-primary); background:rgba(255,255,255,.05)}
.nav a.active{color:var(--accent-cyan); background:rgba(0,180,236,.09)}

/* ---------- typography ---------- */
h1{font-size:2.05rem; line-height:1.2; letter-spacing:-.022em; margin:50px 0 12px}
h2{font-size:1.32rem; letter-spacing:-.012em; margin:44px 0 12px}
h3{font-size:1.03rem; letter-spacing:-.005em; margin:26px 0 8px}
.lead{color:var(--text-secondary); font-size:1.1rem; margin:0 0 20px; max-width:70ch}
.eyebrow{color:var(--accent-cyan); font-size:.8rem; font-weight:600; letter-spacing:.08em;
  text-transform:uppercase; margin:52px 0 6px}
.meta{color:var(--text-secondary); font-size:.93rem; margin:0 0 26px}
p{margin:0 0 14px; max-width:74ch}
a{color:var(--accent-cyan)}
code{background:var(--bg-input); border:1px solid var(--line); border-radius:6px;
  padding:1px 7px; font-size:.85em; color:#dbe3ea; white-space:nowrap}
strong,b{font-weight:600}

/* ---------- blocks ---------- */
.card{background:var(--bg-surface); border:1px solid var(--line); border-radius:var(--radius);
  padding:20px 24px; margin:18px 0}
.card h3{margin-top:6px}
.card > :last-child{margin-bottom:6px}

.grid{display:grid; gap:16px; margin:18px 0}
.grid-2{grid-template-columns:repeat(2,1fr)}
.grid-3{grid-template-columns:repeat(3,1fr)}
@media (max-width:760px){ .grid-2,.grid-3{grid-template-columns:1fr} }

dl.kv{display:grid; grid-template-columns:210px 1fr; gap:10px 18px; margin:0}
dl.kv dt{color:var(--text-secondary); font-size:.92rem}
dl.kv dd{margin:0; font-size:.95rem}
@media (max-width:640px){ dl.kv{grid-template-columns:1fr; gap:2px 0}
  dl.kv dd{margin-bottom:12px} }

table{width:100%; border-collapse:collapse; font-size:.94rem; margin:8px 0 20px}
th,td{text-align:left; padding:11px 10px; border-bottom:1px solid rgba(255,255,255,.06);
  vertical-align:top}
th{color:var(--text-secondary); font-weight:500; font-size:.88rem;
  text-transform:uppercase; letter-spacing:.04em}
.table-scroll{overflow-x:auto}

ul.plain{margin:0 0 14px; padding-left:20px; color:var(--text-secondary)}
ul.plain li{margin-bottom:8px}
ul.plain b{color:var(--text-primary)}

ol.steps{list-style:none; counter-reset:s; padding:0; margin:0}
ol.steps li{counter-increment:s; position:relative; padding:14px 0 14px 48px;
  border-bottom:1px solid rgba(255,255,255,.05)}
ol.steps li:last-child{border-bottom:0}
ol.steps li::before{content:counter(s); position:absolute; left:0; top:13px;
  width:29px; height:29px; border-radius:9px; display:grid; place-items:center;
  background:var(--bg-input); border:1px solid rgba(255,255,255,.09);
  color:var(--text-secondary); font-size:.83rem; font-weight:600}
ol.steps b{display:block; font-weight:600; margin-bottom:2px}
ol.steps span{display:block; color:var(--text-secondary); font-size:.93rem}

.pill{display:inline-block; padding:3px 10px; border-radius:20px; font-size:.78rem;
  font-weight:600; letter-spacing:.02em; border:1px solid}
.pill-fb{color:var(--fb); border-color:rgba(91,158,255,.3); background:rgba(91,158,255,.1)}
.pill-ig{color:var(--ig); border-color:rgba(255,122,137,.3); background:rgba(255,122,137,.1)}
.pill-tt{color:var(--tt); border-color:rgba(52,211,153,.3); background:rgba(52,211,153,.1)}
.pill-yt{color:var(--yt); border-color:rgba(255,124,124,.3); background:rgba(255,124,124,.1)}

.shot{margin:22px 0 26px}
.shot img{width:100%; height:auto; display:block; border-radius:var(--radius);
  border:1px solid rgba(255,255,255,.09)}
.shot figcaption{margin-top:10px; color:var(--text-secondary); font-size:.89rem}

.note{border-left:2px solid var(--accent-cyan); padding:2px 0 2px 16px; margin:20px 0;
  color:var(--text-secondary)}

.faq-item{border-bottom:1px solid var(--line); padding:18px 0}
.faq-item:last-child{border-bottom:0}
.faq-item h3{margin:0 0 6px; font-size:1rem}
.faq-item p{color:var(--text-secondary); margin:0; font-size:.96rem}

.next{display:flex; gap:14px; flex-wrap:wrap; margin:40px 0 0}
.next a{display:block; flex:1; min-width:220px; text-decoration:none;
  background:var(--bg-surface); border:1px solid var(--line); border-radius:var(--radius);
  padding:16px 18px}
.next a:hover{border-color:rgba(0,180,236,.32)}
.next .next-label{display:block; color:var(--text-secondary); font-size:.78rem;
  text-transform:uppercase; letter-spacing:.06em; margin-bottom:3px}
.next .next-title{display:block; color:var(--text-primary); font-weight:600; font-size:.98rem}

/* ---------- footer ---------- */
.site-footer{border-top:1px solid var(--line); margin-top:70px; padding:30px 0 50px;
  color:var(--text-secondary); font-size:.9rem}
.footer-links{display:flex; gap:20px; flex-wrap:wrap; margin-bottom:16px}
.footer-links a{text-decoration:none}
.footer-links a:hover{text-decoration:underline}
.footer-legal{margin:0; line-height:1.75}