:root{
  --bg:#ffffff; --ink:#101114;
  --maxw:1200px; --chip-bg:#f6f9ff; --chip-border:#e2ebff;
  --shadow:0 10px 30px rgba(16,17,20,.09),0 6px 16px rgba(16,17,20,.04);
}
*{margin:0;padding:0;box-sizing:border-box}
html,body{height:100%;width:100%;overflow-x:hidden;font-family:'Josefin Sans',system-ui,sans-serif;background:#fff;color:#101114;scroll-behavior:smooth}
main{position:relative;z-index:10}

/* PAGE HERO + CONTENT INDEX */
.page-hero{ max-width: var(--maxw); margin: 42px auto 0; padding: 24px 18px 0; }
.page-hero-card{
  background:#fff; border:1px solid #e6ebf5; border-radius: 22px; box-shadow: var(--shadow);
  padding: clamp(18px, 3vw, 28px); position: relative; overflow: hidden;
}
.page-hero-card::after{
  content:''; position:absolute; inset: -2px; border-radius: 22px; pointer-events:none;
  background: radial-gradient(80% 50% at 20% 0%, rgba(159,182,255,.12), transparent 60%),
			  radial-gradient(80% 50% at 80% 0%, rgba(226,61,61,.08), transparent 60%);
  filter: blur(10px);
}
.page-eyebrow{
  display:inline-flex; align-items:center; gap:8px;
  font: 700 .8rem/1 'Work Sans', system-ui;
  background: var(--chip-bg); border:1px solid var(--chip-border); color:#1b2440;
  padding: 8px 12px; border-radius: 999px; margin-bottom: 10px;
}
.hero-title{ font-weight: 900; font-size: clamp(2rem, 5vw, 3rem); letter-spacing:.2px; }
.hero-sub{ color:black; font-size: clamp(1.25rem, 2.2vw, 1.35rem); line-height:1.75; margin-top:10px; }
.blue{ color:#0021AD } .red{ color:#e8000d }
.login-link {
  display: inline-flex;
  align-items: center;
  text-decoration: none;
}

/* 
.login-link__label {
  font-size: 1.5em;
  font-weight: 700;
  line-height: 1.1;
}
 */

.login-link__label { font-size: clamp(1.1em, 2vw + .2em, 1.6em); }

.login-link:hover .login-link__label { text-decoration: underline; }

/* TOC rail */
.content-grid{
  max-width: var(--maxw); margin: 18px auto 0; padding: 0 18px 18px; display:grid;
  grid-template-columns: clamp(220px,18vw,320px) 1fr; gap: clamp(18px,2vw,28px);
}
.content-rail{
  position: sticky; top: 110px; align-self: start; background: rgba(255,255,255,.9);
  border:1px solid #e6ebf5; border-radius: 16px; box-shadow: var(--shadow); padding: 12px;
}
.toc{ display:flex; flex-direction:column; gap:6px; }
.toc a{ display:flex; align-items:center; gap:10px; padding:10px 12px; border-radius:10px; text-decoration:none; color:#1a2242; font-weight:800; font-size:.95rem; }
.toc a i{ opacity:.8; width:18px; text-align:center }
.toc a:hover{ background:#f3f7ff }
.toc a.active{ background:#eaf1ff; color:#0b2a6f; box-shadow: inset 0 0 0 1px #dbe6ff }

/* Mobile TOC ribbon */
.toc-mobile{
  position: sticky; top: 92px; z-index: 5; display:none; gap:10px; padding:8px; margin:0 auto 10px;
  max-width: var(--maxw); overflow:auto hidden;
}
.chip{
  display:inline-flex; align-items:center; gap:8px;
  padding:10px 14px; border-radius:999px; background:#fff; border:1px dashed #cfe0ff;
  box-shadow:0 4px 12px rgba(18,48,114,.06); font-weight:800; letter-spacing:.2px;
  color:#18305a !important; text-decoration:none !important;
}
.toc-mobile .chip{white-space:nowrap}

@media (max-width: 920px){
  .content-grid{ grid-template-columns: 1fr; }
  .content-rail{ display:none }
  .toc-mobile{ display:flex }
  .toc-mobile .chip{
	border:1px solid #e6ebf5; padding:.6rem .9rem; box-shadow:0 6px 16px rgba(16,17,20,.06);
  }
  .toc-mobile .chip:hover{ background:#f3f7ff; color:#0b2a6f!important; }
}

/* Cards / sections */
.card{ background:#fff; border:1px solid #e6ebf5; border-radius: 20px; box-shadow: var(--shadow); position:relative; overflow:hidden; }
.section-card{ padding: clamp(20px, 2.8vw, 34px); border-radius:22px; }
.section-title{ font-size: clamp(1.6rem, 3.2vw, 2.2rem); color:#0021AD; margin-bottom:.6rem; }
.section-lead, .section-card p, .section-card li{ font-size: clamp(1rem, 1vw + .75rem, 1.25rem); line-height:1.85; color:#000; }
ul.tick{ margin: .4rem 0 0 1.1rem; }
ul.tick li{ margin:.35rem 0; }
ul.tick li::marker{ color:#6e8fff; }

.aurora-divider{
  max-width: var(--maxw); margin-inline: auto; padding-inline: clamp(22px, 4vw, 44px);
  width:auto; height:4px; margin-top:36px; margin-bottom:36px;
  background: linear-gradient(90deg, rgba(18,48,114,.05), rgba(18,48,114,.18), rgba(18,48,114,.05));
  box-shadow: 0 0 22px rgba(18,48,114,.06); border-radius:2px;
}

/* Reveal */
.reveal{ opacity:0; transform: translateY(22px); transition: opacity .6s ease, transform .6s ease }
.reveal.show{ opacity:1; transform: translateY(0) }
