:root {
  --bg: #0f1419;
  --bg2: #161d24;
  --card: #1c252e;
  --text: #e8edf2;
  --muted: #9fb0bd;
  --accent: #ffcc33;
  --accent2: #3ddc84;
  --danger: #ff6b6b;
  --border: #2a3540;
  --maxw: 1080px;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  font-family: "Segoe UI", system-ui, -apple-system, sans-serif;
  background: var(--bg);
  color: var(--text);
  line-height: 1.65;
  font-size: 17px;
}
a { color: var(--accent); text-decoration: none; }
a:hover { text-decoration: underline; }
img { max-width: 100%; }

.container { max-width: var(--maxw); margin: 0 auto; padding: 0 20px; }

/* Header */
header.site-header {
  background: var(--bg2);
  border-bottom: 1px solid var(--border);
  position: sticky; top: 0; z-index: 50;
}
.nav { display: flex; align-items: center; justify-content: space-between; padding: 14px 0; flex-wrap: wrap; gap: 10px; }
.brand { font-size: 1.3rem; font-weight: 800; color: var(--text); }
.brand span { color: var(--accent); }
nav.main-nav ul { list-style: none; display: flex; gap: 22px; flex-wrap: wrap; }
nav.main-nav a { color: var(--muted); font-weight: 600; font-size: .95rem; }
nav.main-nav a:hover { color: var(--text); text-decoration: none; }

/* Hero */
.hero { padding: 72px 0 56px; background: linear-gradient(160deg, var(--bg2) 0%, var(--bg) 70%); }
.hero .slogan {
  display: inline-block; font-size: .85rem; font-weight: 700; letter-spacing: .12em;
  text-transform: uppercase; color: var(--accent); border: 1px solid var(--accent);
  padding: 6px 14px; border-radius: 999px; margin-bottom: 22px;
}
.hero h1 { font-size: clamp(1.8rem, 4.5vw, 3rem); line-height: 1.2; max-width: 21ch; }
.hero p.lead { color: var(--muted); font-size: 1.15rem; max-width: 60ch; margin: 18px 0 30px; }
.btn-row { display: flex; gap: 14px; flex-wrap: wrap; }
.btn {
  display: inline-block; padding: 13px 26px; border-radius: 10px; font-weight: 700;
  font-size: 1rem; transition: transform .12s ease;
}
.btn:hover { text-decoration: none; transform: translateY(-1px); }
.btn-primary { background: var(--accent); color: #1a1a1a; }
.btn-secondary { background: transparent; color: var(--text); border: 1px solid var(--border); }
.btn-secondary:hover { border-color: var(--accent); }

/* Sections */
section { padding: 56px 0; }
section.alt { background: var(--bg2); }
h2.section-title { font-size: 1.7rem; margin-bottom: 10px; }
p.section-sub { color: var(--muted); margin-bottom: 34px; max-width: 70ch; }

.grid { display: grid; gap: 22px; }
.grid.cols-2 { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); }
.grid.cols-3 { grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }

.card {
  background: var(--card); border: 1px solid var(--border);
  border-radius: 14px; padding: 26px;
}
.card h3 { margin-bottom: 10px; font-size: 1.2rem; }
.card p { color: var(--muted); }
.card .tag { color: var(--accent2); font-weight: 700; font-size: .8rem; text-transform: uppercase; letter-spacing: .1em; display: block; margin-bottom: 8px; }

/* Product hero split */
.product-hero { display: grid; grid-template-columns: 1.1fr .9fr; gap: 40px; align-items: start; }
@media (max-width: 820px) { .product-hero { grid-template-columns: 1fr; } }
.price-note { color: var(--muted); font-size: .9rem; margin-top: 14px; }

/* Article */
article.post { max-width: 76ch; }
article.post h1 { font-size: clamp(1.6rem, 3.5vw, 2.3rem); line-height: 1.25; margin-bottom: 14px; }
article.post .meta { color: var(--muted); font-size: .9rem; margin-bottom: 28px; }
article.post h2 { font-size: 1.35rem; margin: 34px 0 12px; }
article.post h3 { font-size: 1.1rem; margin: 26px 0 10px; }
article.post p { margin-bottom: 16px; color: #cfd9e2; }
article.post ul, article.post ol { margin: 0 0 18px 22px; color: #cfd9e2; }
article.post li { margin-bottom: 8px; }
article.post blockquote {
  border-left: 4px solid var(--accent); background: var(--card);
  padding: 16px 20px; border-radius: 0 10px 10px 0; margin: 22px 0; color: var(--text);
}
.callout {
  background: linear-gradient(135deg, #24313d, var(--card));
  border: 1px solid var(--border); border-radius: 14px; padding: 22px 26px; margin: 34px 0;
}
.callout strong { color: var(--accent); }

/* FAQ */
details.faq { background: var(--card); border: 1px solid var(--border); border-radius: 12px; padding: 18px 22px; margin-bottom: 12px; }
details.faq summary { cursor: pointer; font-weight: 700; }
details.faq p { margin-top: 12px; color: var(--muted); }

/* Codes table */
table.codes { width: 100%; border-collapse: collapse; margin: 20px 0; }
table.codes th, table.codes td { border: 1px solid var(--border); padding: 12px 16px; text-align: left; }
table.codes th { background: var(--card); }
table.codes code { background: var(--bg); border: 1px solid var(--border); padding: 3px 10px; border-radius: 6px; color: var(--accent2); font-size: 1.05em; font-weight: 700; }

/* Footer */
footer.site-footer { border-top: 1px solid var(--border); background: var(--bg2); padding: 40px 0; margin-top: 40px; }
.footer-cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 30px; }
footer.site-footer h4 { font-size: .85rem; text-transform: uppercase; letter-spacing: .1em; color: var(--muted); margin-bottom: 12px; }
footer.site-footer ul { list-style: none; }
footer.site-footer li { margin-bottom: 8px; }
footer.site-footer a { color: #cfd9e2; }
.legal { color: var(--muted); font-size: .82rem; margin-top: 30px; max-width: 90ch; }

.badge { display:inline-block; background:#22303b; color:var(--accent2); border-radius:6px; padding:2px 10px; font-size:.78rem; font-weight:700; }

/* New-courier guide */
.eyebrow{display:block;color:var(--accent2);font-size:.8rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;margin-bottom:8px}.check-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:12px}.check-item{display:flex;gap:12px;align-items:flex-start;background:var(--card);border:1px solid var(--border);border-radius:10px;padding:16px;color:#cfd9e2}.check-item input{width:20px;height:20px;accent-color:var(--accent2);flex:0 0 auto;margin-top:2px}.roadmap{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:12px}.roadmap a{display:flex;align-items:center;gap:14px;color:var(--text);background:var(--card);border:1px solid var(--border);border-radius:12px;padding:16px}.roadmap a:hover{border-color:var(--accent);text-decoration:none}.roadmap b{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--accent);color:#171717;flex:0 0 auto}.roadmap span,.roadmap small{display:block}.roadmap small{color:var(--muted);margin-top:2px}.card-link{margin-top:14px}.compare-table{display:grid;border:1px solid var(--border);border-radius:14px;overflow:hidden}.compare-table>div{display:grid;grid-template-columns:1.15fr 1fr 1fr}.compare-table span{padding:14px 16px;border-bottom:1px solid var(--border)}.compare-table span+span{border-left:1px solid var(--border);color:#cfd9e2}.compare-table>div:last-child span{border-bottom:0}.compare-head{background:var(--card);font-weight:800}.compare-head .wolt{color:#16c8f4}.compare-head .bolt{color:#3ddc84}.source-row{margin-top:20px}.number-list{counter-reset:item;list-style:none;display:grid;gap:12px}.number-list li{position:relative;background:var(--card);border:1px solid var(--border);border-radius:12px;padding:18px 18px 18px 58px;color:#cfd9e2}.number-list li::before{counter-increment:item;content:counter(item);position:absolute;left:16px;top:15px;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--accent);color:#171717;font-weight:800}.timeline{border-left:2px solid var(--border);margin-left:12px;display:grid;gap:22px}.timeline>div{position:relative;padding-left:28px}.timeline>div::before{content:"";position:absolute;left:-8px;top:7px;width:14px;height:14px;border-radius:50%;background:var(--accent2)}.timeline p{color:var(--muted);margin-top:4px}.calculator{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px;align-items:end}.calculator label{color:var(--muted);font-size:.9rem;font-weight:700}.calculator input{width:100%;margin-top:7px;padding:12px;border-radius:9px;border:1px solid var(--border);background:var(--bg);color:var(--text);font:inherit}.calculator button{border:0;cursor:pointer;min-height:50px}.result-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin-top:22px}.result-grid>div{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:18px}.result-grid small,.result-grid strong{display:block}.result-grid small{color:var(--muted)}.result-grid strong{font-size:1.45rem;margin-top:5px;color:var(--accent2)}.method-note{color:var(--muted);font-size:.88rem;margin-top:18px}.phrase-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}.phrase-grid>div{background:var(--card);border:1px solid var(--border);border-radius:10px;padding:16px}.phrase-grid b,.phrase-grid span{display:block}.phrase-grid span{color:var(--muted);margin-top:3px}.source-list{margin-left:22px;color:#cfd9e2}.source-list li{margin-bottom:8px}@media(max-width:640px){.compare-table{font-size:.88rem}.compare-table>div{grid-template-columns:.9fr 1fr 1fr}.compare-table span{padding:11px 9px}}