/* Container spacing */
.dr { margin-top: .5rem; }

/* HERO */
.hero-pro {
  background: radial-gradient(1200px 500px at 10% -10%, rgba(14,165,233,.12), transparent),
              linear-gradient(180deg, #fff 0%, #f8fafc 100%);
  border: 1px solid #e5e7eb;
  border-radius: 1rem;
  padding: 1.25rem;
  margin: .75rem 0 1rem;
}
.hero-grid { display:grid; grid-template-columns:1fr; gap:1rem; align-items:start; }
.eyebrow { font-size:.85rem; letter-spacing:.02em; color:#0284c7; font-weight:600; margin:0 0 .25rem; }
.hero-pro h1 { font-size:2rem; line-height:1.2; margin:0 0 .25rem; }
.subhead { color:#334155; margin:.25rem 0 .75rem; }

.quick-facts { margin:0 0 .9rem; padding-left:1.25rem; }
.quick-facts li { margin:.25rem 0; }

.hero-cta { display:flex; gap:.6rem; flex-wrap:wrap; margin:.25rem 0 .75rem; }
.btn { display:inline-block; padding:.6rem 1rem; border-radius:.75rem; text-decoration:none; }
.btn-primary { background:#0ea5e9; color:#fff; }
.btn-outline { color:#0ea5e9; border:1px solid #bae6fd; background:#f0f9ff; }

.trust-row { display:flex; gap:.5rem; flex-wrap:wrap; }
.badge { background:#f1f5f9; border:1px solid #e5e7eb; color:#334155; padding:.35rem .6rem; border-radius:999px; font-size:.85rem; }

/* TOC */
.sticky-toc { margin:.75rem 0 1rem; }
.toc-desktop { position:sticky; top:90px; background:#fff; border:1px solid #e5e7eb; border-radius:.75rem; padding:1rem; }
.toc-desktop h2 { font-size:1rem; margin:0 0 .5rem; color:#0f172a; }
.toc-desktop ol { margin:0; padding-left:1rem; line-height:1.6; }
.toc-desktop a { color:#0ea5e9; text-decoration:none; }
.toc-desktop a:hover { text-decoration:underline; }

/* CONTENT */
.content { margin-top:.75rem; }
.block { background:#fff; border:1px solid #e5e7eb; border-radius:.75rem; padding:1rem; margin:0 0 .75rem; }
.block h2 { margin:.2rem 0 .6rem; }
.checklist { padding-left:1.25rem; }
.table-wrap { overflow:auto; margin:.5rem 0; }
.table-wrap table { width:100%; border-collapse:collapse; }
.table-wrap th, .table-wrap td { border:1px solid #e5e7eb; padding:.6rem .5rem; text-align:left; }
.note { font-size:.95rem; color:#334155; margin-top:.5rem; }

/* Steps */
.steps { counter-reset: step; list-style:none; padding:0; margin:0; }
.steps li { position:relative; padding-left:2rem; margin:.5rem 0; }
.steps li::before {
  counter-increment: step; content: counter(step);
  position:absolute; left:0; top:0; width:1.5rem; height:1.5rem;
  display:grid; place-items:center; border-radius:999px;
  background:#e0f2fe; border:1px solid #bae6fd; color:#0369a1; font-weight:700;
}

/* Breadcrumbs */
.breadcrumbs { font-size:.9rem; margin:.5rem 0 1rem; color:#6b7280; }
.breadcrumbs a { color:#6b7280; text-decoration:none; }
.breadcrumbs .current { color:#111827; }

/* Alt links */
.alt-links { padding-left:1.25rem; list-style:none; }
.alt-links li { margin:.5rem 0; }
.alt-links a { color:#0ea5e9; text-decoration:none; }
.alt-links a:hover { text-decoration:underline; }

/* Details/FAQ */
.details { border:1px solid #e5e7eb; border-radius:.5rem; padding:.6rem .8rem; margin:.5rem 0; background:#fff; }
.details summary { cursor:pointer; font-weight:600; }

/* Responsive */
@media (max-width: 1024px){
  .toc-desktop { display:none; }
}
