:root {
  --bg:#0a0b0e; --panel:#101218; --panel2:#14171f; --border:#1e2230; --border2:#2c3350;
  --text:#e6e9f0; --muted:#8b91a5; --accent:#5eead4; --accent2:#2dd4bf; --good:#4ade80;
}
* { box-sizing:border-box; scrollbar-width:thin; scrollbar-color:#262b3a transparent; }
*::-webkit-scrollbar { width:8px; } *::-webkit-scrollbar-thumb { background:#262b3a; border-radius:8px; }
*::-webkit-scrollbar-track { background:transparent; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--bg); color:var(--text); font:16px/1.6 "Segoe UI", system-ui, -apple-system, sans-serif; }
a { color:var(--accent); text-decoration:none; }
a:focus-visible, button:focus-visible { outline:2px solid var(--accent2); outline-offset:3px; border-radius:4px; }
.wrap { max-width:1120px; margin:0 auto; padding:0 28px; }

nav { position:sticky; top:0; z-index:10; backdrop-filter:blur(12px); background:rgba(10,11,14,.75); border-bottom:1px solid var(--border); }
nav .wrap { display:flex; align-items:center; justify-content:space-between; height:64px; }
.brand { display:flex; align-items:center; gap:10px; font-weight:800; letter-spacing:-.02em; font-size:18px; color:var(--text); }
.brand svg { width:28px; height:28px; }
nav .links { display:flex; gap:26px; align-items:center; font-size:14px; color:var(--muted); }
nav .links a { color:var(--muted); transition:color .15s; } nav .links a:hover { color:var(--text); }
nav .links a[aria-current="page"] { color:var(--accent); }

.btn { display:inline-block; border-radius:12px; padding:12px 22px; font-weight:700; font-size:15px;
  background:linear-gradient(90deg, var(--accent), #7dd3fc); color:#04211c; border:0; cursor:pointer;
  transition:transform .15s, box-shadow .15s; box-shadow:0 0 0 rgba(94,234,212,0); }
.btn:hover { transform:translateY(-1px); box-shadow:0 8px 30px rgba(94,234,212,.25); }
.btn.ghost { background:transparent; color:var(--text); border:1px solid var(--border2); }
.btn.ghost:hover { border-color:var(--accent2); box-shadow:none; }

.hero { position:relative; overflow:hidden; border-bottom:1px solid var(--border); }
.hero::before { content:""; position:absolute; inset:0;
  background:url('/assets/hero.png') center right / cover no-repeat; opacity:.55; }
.hero::after { content:""; position:absolute; inset:0;
  background:linear-gradient(90deg, rgba(10,11,14,.96) 0%, rgba(10,11,14,.82) 45%, rgba(10,11,14,.35) 100%); }
.hero .wrap { position:relative; z-index:1; padding:110px 28px 120px; max-width:1120px; }
.eyebrow { display:inline-flex; align-items:center; gap:8px; font-size:12px; font-weight:700; letter-spacing:.12em;
  text-transform:uppercase; color:var(--accent); border:1px solid rgba(94,234,212,.35); background:rgba(94,234,212,.07);
  border-radius:999px; padding:6px 14px; }
h1 { font-size:clamp(34px, 5.5vw, 58px); line-height:1.08; letter-spacing:-.035em; font-weight:800; margin:22px 0 18px; max-width:640px; }
h1 em { font-style:normal; background:linear-gradient(90deg, var(--accent), #7dd3fc); -webkit-background-clip:text; background-clip:text; color:transparent; }
.sub { color:var(--muted); font-size:18px; max-width:560px; margin-bottom:34px; }
.cta-row { display:flex; gap:14px; flex-wrap:wrap; }
.trust { margin-top:46px; color:var(--muted); font-size:13px; display:flex; gap:10px; align-items:flex-start; max-width:560px; }
.trust svg { width:16px; height:16px; flex:none; margin-top:3px; stroke:var(--accent2); }

section { padding:88px 0; } section.alt { background:linear-gradient(180deg, transparent, rgba(94,234,212,.03), transparent); }
h2 { font-size:clamp(24px, 3vw, 34px); letter-spacing:-.03em; font-weight:800; margin:0 0 10px; }
.lede { color:var(--muted); max-width:640px; margin-bottom:44px; }
.grid { display:grid; gap:16px; grid-template-columns:repeat(auto-fit, minmax(280px, 1fr)); }
.card { background:linear-gradient(180deg, var(--panel2), var(--panel)); border:1px solid var(--border);
  border-radius:16px; padding:26px; transition:border-color .18s, transform .18s; }
.card:hover { border-color:var(--border2); transform:translateY(-2px); }
.card svg { width:26px; height:26px; stroke:var(--accent2); margin-bottom:14px; }
.card h3 { margin:0 0 8px; font-size:17px; letter-spacing:-.01em; }
.card p { margin:0; color:var(--muted); font-size:14.5px; }

.steps { counter-reset:step; display:grid; gap:16px; grid-template-columns:repeat(auto-fit, minmax(230px, 1fr)); }
.step { position:relative; border:1px solid var(--border); border-radius:16px; padding:26px; background:var(--panel); }
.step::before { counter-increment:step; content:"0" counter(step); font-size:13px; font-weight:800; letter-spacing:.1em;
  color:var(--accent); display:block; margin-bottom:12px; }
.step h3 { margin:0 0 8px; font-size:16px; } .step p { margin:0; color:var(--muted); font-size:14px; }

.honest { border:1px solid rgba(94,234,212,.3); background:rgba(94,234,212,.05); border-radius:16px; padding:28px 30px; display:flex; gap:16px; }
.honest svg { width:24px; height:24px; stroke:var(--accent2); flex:none; margin-top:2px; }
.honest p { margin:0; color:var(--text); font-size:15px; } .honest strong { color:var(--accent); }

/* Long-form article pages */
.article { max-width:760px; margin:0 auto; padding:72px 28px 96px; }
.article header { margin-bottom:40px; }
.article h1 { font-size:clamp(30px, 4.5vw, 44px); max-width:none; }
.article .meta { color:var(--muted); font-size:14px; }
.article h2 { margin-top:56px; }
.article h3 { font-size:18px; letter-spacing:-.01em; margin:34px 0 8px; }
.article p, .article li { color:#c6cbd9; font-size:16.5px; }
.article ul, .article ol { padding-left:24px; }
.article li { margin:6px 0; }
.article table { width:100%; border-collapse:collapse; margin:26px 0; font-size:15px; }
.article th, .article td { text-align:left; padding:12px 14px; border:1px solid var(--border); vertical-align:top; }
.article th { background:var(--panel2); color:var(--text); font-size:13.5px; letter-spacing:.02em; }
.article td { color:#c6cbd9; }
.article blockquote { margin:26px 0; padding:18px 22px; border-left:3px solid var(--accent2);
  background:rgba(94,234,212,.05); border-radius:0 12px 12px 0; color:var(--text); }
.article .sources { border-top:1px solid var(--border); margin-top:56px; padding-top:24px; font-size:14px; color:var(--muted); }
.article .sources li { margin:8px 0; }

/* FAQ */
details { border:1px solid var(--border); border-radius:14px; background:var(--panel); margin:12px 0; overflow:hidden; }
details summary { cursor:pointer; padding:18px 22px; font-weight:700; font-size:16px; list-style:none; position:relative; transition:color .15s; }
details summary::-webkit-details-marker { display:none; }
details summary::after { content:"+"; position:absolute; right:20px; color:var(--accent); font-weight:800; font-size:18px; }
details[open] summary::after { content:"–"; }
details summary:hover { color:var(--accent); }
details .a { padding:0 22px 20px; color:#c6cbd9; font-size:15.5px; }
details .a p { margin:0 0 10px; }

.contact-panel { background:linear-gradient(180deg, var(--panel2), var(--panel)); border:1px solid var(--border);
  border-radius:18px; padding:34px; max-width:560px; }
.contact-panel p { color:var(--muted); font-size:15px; margin:0 0 18px; }
.contact-panel .email { font-size:19px; font-weight:700; }

footer { border-top:1px solid var(--border); padding:34px 0 46px; color:var(--muted); font-size:13.5px; }
footer .wrap { display:flex; justify-content:space-between; gap:20px; flex-wrap:wrap; align-items:center; }
footer nav2, footer .fl { display:flex; gap:18px; flex-wrap:wrap; }
footer .fl a { color:var(--muted); } footer .fl a:hover { color:var(--text); }