:root{
  --bg:#0b0b0b; --text:#eee; --muted:#a7a7a7; --accent:#ffd166; --border:#222;
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial}
.wrap{max-width:800px;margin:0 auto}

/* Header (centered) */
.site-header{position:sticky;top:0;z-index:10;background:#101010;border-bottom:1px solid var(--border);box-shadow:0 6px 20px rgba(0,0,0,.25)}
.header-centered{display:flex;flex-direction:column;gap:10px;align-items:center;justify-content:center;padding:14px 16px}
.brand.center{display:flex;flex-direction:column;align-items:center;gap:8px;color:inherit;text-decoration:none}
.logo.big{max-height:72px;width:auto;object-fit:contain;display:block}
.brand-text{font-weight:800;letter-spacing:.3px}
.row-cta{display:flex;gap:10px;width:100%}
.btn{display:inline-flex;align-items:center;justify-content:center;height:38px;padding:0 14px;border-radius:999px;border:1px solid var(--border);text-decoration:none;color:var(--text);font-weight:700}
.btn.ghost{background:#131313}
.btn.primary{background:var(--accent);color:#111;border-color:#000}
.btn:hover{transform:translateY(-1px)}

/* Announcement */
.announce{position:relative;z-index:5;background:#0f0f0f;border-bottom:1px solid var(--border)}
.announce-inner{display:flex;gap:10px;align-items:center;justify-content:space-between;padding:8px 12px}
.announce .ann-close{background:#131313;border:1px solid var(--border);color:var(--text);border-radius:8px;height:28px;padding:0 10px;cursor:pointer}

/* Main */
.main{padding:0}
.stack{display:flex;flex-direction:column;gap:0}
.card{margin:0}
.card .head{all:unset;display:block;width:100%;cursor:pointer}
.card img{display:block;width:100%;height:auto;margin:0}
.panel{overflow:hidden;max-height:0;transition:max-height .3s ease;background:#0f0f0f;border-top:0px solid var(--border)}
.panel .content{padding:14px 16px;line-height:1.6}
.panel .content h3{margin:0 0 6px 0;color:var(--accent)}
.panel .content ul{padding-left:18px;margin:8px 0}
.panel .content li{margin:.35rem 0}

/* FAQ */
.faq{padding:18px 0 8px;border-top:1px solid var(--border)}
.faq h2{font-size:18px;margin:0 0 12px;color:var(--accent)}
.faq-list{display:flex;flex-direction:column;gap:8px}
.faq-item{border:1px solid var(--border);border-radius:10px;overflow:hidden;background:#101010}
.faq-q{all:unset;display:block;width:100%;cursor:pointer;font-weight:700;padding:12px 14px}
.faq-a{overflow:hidden;max-height:0;transition:max-height .3s ease;background:#0f0f0f;border-top:1px solid var(--border)}
.faq-a .inner{padding:12px 14px;color:var(--text);line-height:1.6}

/* Footer */
.site-footer{border-top:1px solid var(--border);color:var(--muted);font-size:13px}
.site-footer .wrap{padding:24px 14px;text-align:center}

/* FAB */
.fab{position:fixed;right:14px;bottom:14px;background:#111;border:1px solid var(--border);width:48px;height:48px;border-radius:999px;display:flex;align-items:center;justify-content:center;text-decoration:none;color:var(--text);font-weight:800}
.fab:hover{transform:translateY(-1px)}

/* ===== Header tidy v3 ===== */
.header-centered{gap:8px;padding:12px 16px}
.logo.big{max-height:76px}
/* Button row centered and boxed */
.row-cta{display:flex;gap:12px;width:100%;max-width:420px;margin:0 auto}  /* keeps it within the red box area */
.row-cta .btn{flex:1;min-width:0}
/* Remove any leftover small text spacing under logo */
.brand-text{display:none !important}
/* Announcement align with 800px container */
.announce .announce-inner{max-width:800px;margin:0 auto}
