:root{--brand:#b91c1c;--brand-dark:#7f1d1d;--ink:#111827;--mist:#f3f4f6}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;color:var(--ink);background:#fff;line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:var(--brand);text-decoration:none}
a:hover{text-decoration:underline}
.wrap{max-width:1100px;margin:0 auto;padding:0 20px}

/* HEADER */
header.site{border-bottom:1px solid #e5e7eb;position:sticky;top:0;background:#fff;z-index:50}
header.site .row{display:flex;align-items:center;justify-content:space-between;padding:14px 0;gap:16px}
.logo{font-weight:800;font-size:20px;letter-spacing:-.5px;color:var(--ink)}
.logo span{color:var(--brand)}
nav.main{display:none;gap:24px;font-size:14px;font-weight:500}
nav.main a{color:#374151}
nav.main a:hover{color:var(--brand);text-decoration:none}
.btn{display:inline-block;padding:10px 18px;border-radius:10px;font-weight:700;font-size:14px;transition:.15s;border:1px solid transparent;cursor:pointer}
.btn-primary{background:var(--brand);color:#fff}
.btn-primary:hover{background:var(--brand-dark);text-decoration:none}
.btn-outline{border-color:#d1d5db;color:var(--ink);background:#fff}
.btn-outline:hover{border-color:var(--brand);color:var(--brand);text-decoration:none}
@media(min-width:800px){nav.main{display:flex}}

/* HERO */
.hero{background:linear-gradient(180deg,var(--mist) 0%,#fff 100%);padding:60px 0 70px;border-bottom:1px solid #e5e7eb}
.eyebrow{color:var(--brand);font-weight:700;text-transform:uppercase;letter-spacing:1px;font-size:12px;margin-bottom:12px}
h1{font-size:38px;line-height:1.15;font-weight:800;letter-spacing:-1px;max-width:820px}
@media(min-width:800px){h1{font-size:48px}}
.lead{margin-top:18px;font-size:18px;color:#4b5563;max-width:680px}
.hero-ctas{margin-top:28px;display:flex;flex-wrap:wrap;gap:12px}
section{padding:60px 0}
h2{font-size:26px;font-weight:800;letter-spacing:-.5px;margin-bottom:8px}
h3{font-size:18px;font-weight:700}

/* CARDS */
.cards{display:grid;grid-template-columns:1fr;gap:16px;margin-top:24px}
@media(min-width:700px){.cards{grid-template-columns:repeat(3,1fr)}}
.card{display:block;border:1px solid #e5e7eb;border-radius:16px;padding:22px;color:var(--ink);transition:.15s}
.card:hover{border-color:var(--brand);text-decoration:none;box-shadow:0 4px 20px rgba(0,0,0,.05)}
.card .desc{color:#6b7280;font-size:14px;margin-top:8px}
.card .more{display:inline-block;margin-top:14px;color:var(--brand);font-weight:600;font-size:14px}

/* CHECKLIST */
.mist-section{background:var(--mist);border-top:1px solid #e5e7eb;border-bottom:1px solid #e5e7eb}
.split{display:grid;grid-template-columns:1fr;gap:32px}
@media(min-width:800px){.split{grid-template-columns:1fr 1.2fr;gap:48px;align-items:start}}
ol.checklist{list-style:none;display:grid;gap:12px}
ol.checklist li{background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:16px;display:flex;gap:14px;align-items:flex-start}
ol.checklist .num{flex-shrink:0;width:28px;height:28px;border-radius:50%;background:var(--brand);color:#fff;font-weight:700;font-size:13px;display:grid;place-items:center}

/* COSTS TABLE */
table.costs{width:100%;border-collapse:collapse;border:1px solid #e5e7eb;border-radius:16px;overflow:hidden;margin-top:20px}
table.costs th,table.costs td{text-align:left;padding:14px 18px;font-size:15px}
table.costs thead{background:var(--mist)}
table.costs tbody tr{border-top:1px solid #e5e7eb}
table.costs td:last-child{font-weight:700}

/* CTA BLOCK */
.cta-block{background:var(--brand);color:#fff;border-radius:20px;padding:40px;margin:20px 0 60px}
.cta-block h2{color:#fff}
.cta-block p{color:rgba(255,255,255,.9);margin-top:10px;max-width:620px}
.cta-block .btn{background:#fff;color:var(--brand);margin-top:22px}

/* ARTICLE */
.article{max-width:760px;margin:0 auto;padding:50px 20px}
.article h1{font-size:34px;margin-bottom:12px}
.article .meta{font-size:12px;color:#6b7280;text-transform:uppercase;letter-spacing:1px;margin-bottom:10px}
.article .intro{font-size:18px;color:#4b5563;margin-bottom:28px}
.article h2{font-size:24px;margin-top:36px;margin-bottom:10px}
.article h3{font-size:18px;margin-top:24px;margin-bottom:8px}
.article p{margin:14px 0;color:#1f2937}
.article ul,.article ol{margin:14px 0 14px 22px;color:#1f2937}
.article li{margin:6px 0}
.article a{text-decoration:underline;text-underline-offset:2px}
.article details{border:1px solid #e5e7eb;border-radius:12px;padding:14px 18px;margin:10px 0}
.article summary{font-weight:600;cursor:pointer}
.article details p{margin:8px 0 0}
.notice{background:#fef3c7;border:1px solid #fde68a;border-radius:12px;padding:14px 18px;font-size:14px;margin:20px 0;color:#78350f}

/* FOOTER */
footer.site{background:var(--mist);border-top:1px solid #e5e7eb;padding:40px 0 20px;font-size:14px;color:#4b5563}
footer.site .cols{display:grid;grid-template-columns:1fr;gap:28px}
@media(min-width:700px){footer.site .cols{grid-template-columns:repeat(3,1fr)}}
footer.site h4{color:var(--ink);font-weight:700;margin-bottom:10px;font-size:14px}
footer.site ul{list-style:none;display:grid;gap:6px}
footer.site ul a{color:#4b5563}
footer.site .legal{border-top:1px solid #e5e7eb;margin-top:32px;padding-top:16px;text-align:center;font-size:12px;color:#6b7280}
footer.site .small{font-size:13px;margin-top:10px}
/* ============ TOPICAL CLUSTER NAVIGATION ============ */
.cluster-nav {
  background: #fafafa;
  border: 1px solid #e5e7eb;
  border-left: 4px solid #b91c1c;
  border-radius: 8px;
  padding: 18px 22px;
  margin: 24px 0;
}
.cluster-label {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: #b91c1c;
  margin: 0 0 10px;
}
.cluster-nav ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 6px;
  font-size: 14px;
}
.cluster-nav li { margin: 0; }
.cluster-nav a { color: #374151; }
.cluster-nav a:hover { color: #b91c1c; }
.cluster-nav .current {
  color: #6b7280;
  font-style: italic;
  font-size: 13px;
}

.cluster-breadcrumb {
  font-size: 12px;
  color: #6b7280;
  margin: 0 0 20px;
  padding-bottom: 12px;
  border-bottom: 1px dashed #e5e7eb;
}
.cluster-breadcrumb a {
  color: #b91c1c;
  text-decoration: underline;
  text-underline-offset: 2px;
}
