*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --red:#e0151a;--red-dark:#a80f13;
  --bg:#080808;--dark:#0f0f0f;--card:#141414;
  --border:#222;--border2:#2c2c2c;
  --text:#f0f0f0;--muted:#888;--dim:#555;
  --fd:'Barlow Condensed',sans-serif;--fb:'Barlow',sans-serif;
}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--text);font-family:var(--fb);line-height:1.7;overflow-x:hidden}
a{color:var(--red);text-decoration:none}
a:hover{text-decoration:underline}

/* NAV */
nav{
  position:sticky;top:0;z-index:100;
  background:rgba(8,8,8,.96);backdrop-filter:blur(18px);
  border-bottom:1px solid var(--border);
  height:60px;padding:0 2.5rem;
  display:flex;align-items:center;justify-content:space-between;
}
.nav-logo{font-family:var(--fd);font-weight:900;font-size:1.25rem;letter-spacing:.06em;color:var(--text)}
.nav-logo span{color:var(--red)}
.nav-logo img{height:34px;width:auto;display:block}
.nav-back{font-family:var(--fb);font-size:.85rem;font-weight:600;color:var(--muted);display:flex;align-items:center;gap:.4rem;transition:color .2s}
.nav-back:hover{color:var(--text);text-decoration:none}
.nav-back svg{flex-shrink:0}

/* HERO STRIP */
.hero-strip{
  background:linear-gradient(135deg,#0e0202 0%,#180404 50%,#0a0a0a 100%);
  border-bottom:1px solid var(--border);
  padding:3.5rem 4rem 3rem;
}
.hero-strip .eyebrow{font-family:var(--fd);font-size:.72rem;font-weight:700;color:var(--red);letter-spacing:.18em;text-transform:uppercase;margin-bottom:.65rem;display:block}
.hero-strip h1{font-family:var(--fd);font-size:clamp(2.5rem,5vw,4rem);font-weight:900;text-transform:uppercase;letter-spacing:.03em;line-height:.95;margin-bottom:.9rem}
.hero-strip .meta{font-size:.85rem;color:var(--muted);display:flex;flex-wrap:wrap;gap:1.5rem}
.hero-strip .meta span{display:flex;align-items:center;gap:.35rem}

/* LAYOUT */
.page-wrap{max-width:900px;margin:0 auto;padding:3.5rem 4rem 5rem}

/* TOC */
.toc{background:var(--card);border:1px solid var(--border);border-radius:10px;padding:1.5rem 1.75rem;margin-bottom:3rem}
.toc h3{font-family:var(--fd);font-size:.72rem;font-weight:700;color:var(--muted);letter-spacing:.18em;text-transform:uppercase;margin-bottom:1rem}
.toc ol{padding-left:1.1rem;display:grid;grid-template-columns:1fr 1fr;gap:.35rem .5rem}
.toc li{font-size:.88rem;color:var(--muted)}
.toc li a{color:var(--muted);transition:color .2s}
.toc li a:hover{color:var(--red);text-decoration:none}

/* SECTIONS */
.section{margin-bottom:3rem;scroll-margin-top:80px}
.section h2{
  font-family:var(--fd);font-size:1.6rem;font-weight:800;
  text-transform:uppercase;letter-spacing:.04em;
  color:var(--text);
  padding-bottom:.75rem;
  border-bottom:2px solid var(--border);
  margin-bottom:1.25rem;
  display:flex;align-items:center;gap:.65rem;
}
.section h2 .num{
  background:var(--red);color:white;
  font-family:var(--fd);font-size:.75rem;font-weight:700;
  padding:.2rem .55rem;border-radius:3px;letter-spacing:.04em;
  flex-shrink:0;
}
.section h3{font-family:var(--fd);font-size:1.05rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--text);margin:1.5rem 0 .6rem}
.section p{font-size:.93rem;color:#ccc;line-height:1.78;margin-bottom:.9rem}
.section p:last-child{margin-bottom:0}
.section ul,.section ol{padding-left:1.3rem;margin-bottom:.9rem}
.section ul li,.section ol li{font-size:.93rem;color:#ccc;line-height:1.72;margin-bottom:.4rem}
.section ul li::marker{color:var(--red)}

/* CALLOUT BOXES */
.callout{border-radius:7px;padding:1.1rem 1.3rem;margin:1.2rem 0;font-size:.88rem;line-height:1.7}
.callout-red{background:rgba(224,21,26,.08);border:1px solid rgba(224,21,26,.25);color:#e8a0a0}
.callout-dark{background:var(--card);border:1px solid var(--border2);color:var(--muted)}
.callout strong{color:var(--text)}

/* CONTACT BOX */
.contact-box{background:var(--card);border:1px solid var(--border);border-radius:10px;padding:2rem;margin-top:3rem;text-align:center}
.contact-box h3{font-family:var(--fd);font-size:1.4rem;font-weight:800;text-transform:uppercase;margin-bottom:.6rem}
.contact-box p{font-size:.9rem;color:var(--muted);margin-bottom:1.2rem}
.contact-box .links{display:flex;flex-wrap:wrap;justify-content:center;gap:.75rem}
.btn-red{background:var(--red);color:#fff;font-family:var(--fb);font-weight:700;font-size:.88rem;padding:.55rem 1.2rem;border-radius:5px;display:inline-flex;align-items:center;gap:.4rem;transition:background .2s}
.btn-red:hover{background:var(--red-dark);text-decoration:none}
.btn-ghost{background:transparent;color:var(--text);font-family:var(--fb);font-weight:600;font-size:.88rem;padding:.55rem 1.2rem;border-radius:5px;border:1.5px solid var(--border2);display:inline-flex;align-items:center;gap:.4rem;transition:border-color .2s}
.btn-ghost:hover{border-color:#555;text-decoration:none}

/* FOOTER */
footer{background:var(--dark);border-top:1px solid var(--border);padding:2rem 4rem;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:1rem}
footer p{font-size:.8rem;color:var(--dim)}
footer .links{display:flex;gap:1.5rem}
footer .links a{font-size:.8rem;color:var(--dim);transition:color .2s}
footer .links a:hover{color:var(--text)}

/* RESPONSIVE */
@media(max-width:768px){s
  nav{padding:0 1.25rem}
  .hero-strip{padding:2.5rem 1.25rem 2rem}
  .page-wrap{padding:2.5rem 1.25rem 4rem}
  .toc ol{grid-template-columns:1fr}
  footer{padding:1.5rem 1.25rem;flex-direction:column;align-items:flex-start}
}
@media(max-width:480px){
  .hero-strip h1{font-size:2.2rem}
  .section h2{font-size:1.3rem}
}