:root{
  --ink1:#000000; --ink2:#000000; --ink3:#000000; --muted:#B0B0B0;
  --accent:#cc0a2f; --accent-2:#0ea5e9; --card:#000000; --ring:rgba(255,255,255,.06);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--ink1);color:#ffffff;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:none;color:#ffffff}
.container{max-width:1100px;margin:0 auto;padding:0 20px}
.container-narrow{max-width:1120px;margin:0 auto;padding:0 24px}
.container-wide{max-width:1320px;margin:0 auto;padding:0 24px}
.section{padding:72px 0}
.section-tight{padding:56px 0}
.hstack{display:flex;align-items:center;gap:12px}
.small{font-size:13px}
.navbar{position:fixed;top:0;left:0;width:100%;background:rgba(0,0,0,.7);backdrop-filter:blur(10px);z-index:1000;padding:15px 0;border-bottom:1px solid rgba(255,255,255,.1);transition:background .3s ease}
.navbar .container{display:flex;justify-content:space-between;align-items:center;padding:0 20px}
.navbar-brand{font-size:1.8em;font-weight:700;color:#fff;display:flex;align-items:center}
.navbar-brand img.logo{height:64px;width:auto;margin-right:10px}
.navbar-brand .brand-sep{display:inline-block;align-self:center;width:0;height:48px;border-left:1px solid rgba(255,255,255,.65);margin:0 14px}
.navbar-brand .brand-title{line-height:1}
.nav-links{list-style:none;margin:0;padding:0;display:flex}
.nav-links li{margin-left:30px}
.nav-links a{color:#B0B0B0;font-weight:500;font-size:1.05em;transition:color .3s ease,transform .2s ease;position:relative;padding-bottom:5px}
.nav-links a::after{content:'';position:absolute;width:0;height:2px;background:var(--accent);left:0;bottom:0;transition:width .3s ease}
.nav-links a:hover{color:#fff}
.nav-links a:hover::after{width:100%}
.hero{padding:84px 0;background:#000000}
h1{font-size:clamp(30px,5vw,46px);line-height:1.05;margin:8px 0 10px}
.lead{font-size:1.15rem;max-width:850px;color:#c7d4e5}
.btn{display:inline-block;padding:10px 16px;border-radius:12px;border:1px solid var(--ring);background:#0b0b0b;color:#ffffff}
.btn.primary{background:linear-gradient(90deg,var(--accent),#f97316);border:none}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
.card{background:var(--card);border:1px solid rgba(255,255,255,.1);border-radius:18px;padding:18px}
.card h3{margin:8px 0 6px}
.footer{padding:32px 0;border-top:1px solid var(--ring);color:#97a6ba}
.footer .container{display:flex;justify-content:space-between;flex-wrap:wrap;text-align:left}
.footer-col{flex:1;min-width:200px;margin-bottom:30px}
.footer-col h4{font-size:1.2em;margin-bottom:20px;color:#fff;font-weight:700}
.footer-col ul{list-style:none;padding:0;margin:0}
.footer-col ul li{margin-bottom:10px}
.footer-col ul li a{color:#97a6ba;transition:color .3s ease;font-weight:400}
.footer-col ul li a:hover{color:var(--accent)}
.footer-bottom{margin-top:40px;padding-top:30px;border-top:1px solid rgba(255,255,255,.05);text-align:center}
.social-icons a{font-size:1.5em;margin:0 10px;color:#97a6ba}
.skip-link{position:absolute;left:-999px;top:auto;width:1px;height:1px;overflow:hidden}
.skip-link:focus{position:fixed;left:20px;top:20px;width:auto;height:auto;background:#111;color:#fff;padding:10px 14px;border:1px solid var(--accent);border-radius:6px;z-index:2000}
.tag{display:inline-block;padding:2px 8px;border-radius:999px;border:1px solid var(--ring);font-size:.75rem;color:#c7d4e5;margin-right:6px}
.section{padding:46px 0}
.hero a.btn{margin-right:10px}
.hero .cta-buttons{display:flex;gap:12px;justify-content:center;align-items:center;flex-wrap:nowrap}
.kv{display:grid;grid-template-columns:1fr;gap:12px}
.kv div{display:flex;justify-content:space-between;border-bottom:1px dotted var(--ring);padding:8px 0}
h2{font-size:clamp(24px,3.6vw,32px)}
small, .meta{color:#9db0c6}
.table{width:100%;border-collapse:collapse}
.table th,.table td{border-bottom:1px solid var(--ring);padding:10px;text-align:left}
.pillnav{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.pillnav a{background:#0e1523;border:1px solid var(--ring);padding:6px 10px;border-radius:999px}
.hero .eyebrow{letter-spacing:.12em;color:#ffb3b3;text-transform:uppercase;font-weight:700;font-size:.8rem}
hr{border:none;border-top:1px solid var(--ring);margin:24px 0}
@media(min-width:900px){.kv{grid-template-columns:1fr 1fr}}

/* Ensure subpage heroes center like homepage */
body.qdef .hero{height:100vh;padding:0;display:flex;align-items:center;justify-content:center;text-align:center}
body.qdef .hero > .container{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;text-align:center}
.hero p.lead{margin:0 auto}

/* Mobile hero tuning: center text and stack buttons */
/* Match nav collapse breakpoint: stack hero buttons when menu collapses */
@media (max-width: 1280px){
  /* Center-aligned 1-col/2-row grid; column matches widest button */
  .hero .cta-buttons{
    display:inline-grid;
    grid-template-columns:max-content;
    grid-template-rows:auto auto;
    row-gap:12px;
    justify-content:center;  /* center the grid itself */
    justify-items:center;    /* center items within the single column */
    align-items:center;      /* vertical centering for completeness */
    margin:10px auto 0;
  }
  .hero .cta-buttons > a.btn,
  .hero .cta-buttons > .btn-primary{
    display:block;
    margin:0;
    width:auto;             /* keep intrinsic width; column width equals widest button */
    justify-self:center;    /* explicitly center each button in the grid cell */
    text-align:center;
  }
}

@media (max-width: 768px){
  .hero h1{font-size:clamp(26px,7.6vw,34px);line-height:1.15}
  .hero p.lead{font-size:1rem;margin:10px auto 18px}
  .hero a.btn{display:block;margin:10px auto 0;min-width:0}
}