/* Shared styles for the legal pages (privacy, terms, security).
   Tokens and nav/footer mirror index.html so the pages feel like one site. */
:root{
  --brand:#0a5bb5; --brand-600:#084c98; --brand-50:#eaf2fc;
  --navy:#071b33; --navy-2:#0c2748;
  --ink:#0f1b2d; --muted:#5b6b80; --line:#dde5ef; --soft:#f4f7fb;
  --font-sans:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --font-mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
}
html{scroll-behavior:smooth; scroll-padding-top:96px}
body{font-family:var(--font-sans); color:var(--ink); background:#fff; -webkit-font-smoothing:antialiased}
a{color:var(--brand)}
.eyebrow{font-family:var(--font-mono); font-size:.8rem; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--brand)}
.btn{border-radius:10px; font-weight:600; padding:.7rem 1.25rem}
.btn-brand{background:var(--brand); color:#fff; border:1px solid var(--brand)}
.btn-brand:hover,.btn-brand:focus{background:var(--brand-600); border-color:var(--brand-600); color:#fff}
.btn-outline-brand{border:1px solid var(--brand); color:var(--brand)}
.btn-outline-brand:hover{background:var(--brand); color:#fff}

/* NAV */
.navbar{background:rgba(255,255,255,.92); backdrop-filter:saturate(1.4) blur(10px); box-shadow:0 1px 0 var(--line)}
.navbar-brand{font-weight:800; letter-spacing:-.02em; color:var(--navy)!important; display:flex; align-items:center; gap:.55rem}
.brand-mark{width:34px;height:34px;border-radius:9px;background:var(--navy);display:grid;place-items:center;color:#fff}
.nav-link{font-weight:500; color:var(--ink)!important; padding:.5rem .9rem!important}
.nav-link:hover,.nav-link.active{color:var(--brand)!important}

/* PAGE HEADER */
.legal-hero{padding:136px 0 48px; background:radial-gradient(900px 420px at 85% -10%, var(--brand-50), transparent 60%), var(--soft); border-bottom:1px solid var(--line)}
.legal-hero h1{font-weight:800; letter-spacing:-.03em; font-size:clamp(2.1rem,4.6vw,3.2rem); margin:.4rem 0 .8rem}
.legal-hero .lead{color:var(--muted); max-width:640px; font-size:1.08rem}
.meta{display:flex; flex-wrap:wrap; gap:8px 20px; font-size:.88rem; color:var(--muted); margin-top:1.2rem}
.meta i{color:var(--brand); margin-right:6px}

/* BODY */
.legal{padding:56px 0 96px}
.toc{position:sticky; top:96px; font-size:.9rem}
.toc h2{font-family:var(--font-mono); font-size:.72rem; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); margin-bottom:12px}
.toc ol{list-style:none; padding:0; margin:0; counter-reset:toc; border-left:1px solid var(--line)}
.toc li{counter-increment:toc}
.toc a{display:block; padding:5px 0 5px 14px; margin-left:-1px; border-left:2px solid transparent; color:var(--muted); text-decoration:none}
.toc a::before{content:counter(toc) ". "; font-variant-numeric:tabular-nums}
.toc a:hover{color:var(--ink)}
.toc a.active{color:var(--brand); border-left-color:var(--brand); font-weight:600}

.prose{max-width:760px; font-size:1rem; line-height:1.7; color:#26354a}
.prose section{padding-bottom:12px}
.prose section+section{border-top:1px solid var(--line); padding-top:28px}
.prose h2{font-size:1.35rem; font-weight:800; letter-spacing:-.015em; color:var(--ink); margin:0 0 14px; display:flex; gap:10px; align-items:baseline}
.prose h2 .n{font-family:var(--font-mono); font-size:.85rem; color:var(--brand); font-weight:600}
.prose h3{font-size:1.02rem; font-weight:700; color:var(--ink); margin:22px 0 8px}
.prose ul{padding-left:1.2rem}
.prose li{margin-bottom:6px}
.prose strong{color:var(--ink)}
.prose code{font-family:var(--font-mono); font-size:.84em; background:var(--soft); border:1px solid var(--line); border-radius:6px; padding:1px 6px; color:var(--ink)}

.callout{display:flex; gap:14px; background:var(--brand-50); border:1px solid #cfe0f5; border-radius:14px; padding:16px 18px; margin:0 0 32px; font-size:.95rem}
.callout i{color:var(--brand); font-size:1.2rem; line-height:1.4}

.table-wrap{overflow-x:auto; border:1px solid var(--line); border-radius:12px; margin:14px 0 18px}
.legal-table{width:100%; border-collapse:collapse; font-size:.9rem; min-width:560px}
.legal-table th{background:var(--soft); text-align:left; font-weight:700; color:var(--ink); padding:10px 14px; border-bottom:1px solid var(--line)}
.legal-table td{padding:10px 14px; border-bottom:1px solid var(--line); vertical-align:top}
.legal-table tr:last-child td{border-bottom:0}

.cards{display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:14px; margin:18px 0 8px}
.card-s{border:1px solid var(--line); border-radius:14px; padding:18px; background:#fff}
.card-s i{width:38px; height:38px; border-radius:10px; background:var(--brand-50); color:var(--brand); display:grid; place-items:center; font-size:1.1rem; margin-bottom:10px}
.card-s b{display:block; color:var(--ink); margin-bottom:4px}
.card-s p{font-size:.9rem; color:var(--muted); margin:0; line-height:1.55}

.contact-box{background:var(--navy); color:#dfe8f3; border-radius:16px; padding:24px 26px; margin-top:8px}
.contact-box h3{color:#fff; margin-top:0}
.contact-box a{color:#8fc0f5}

/* Fill-in markers: replace before publishing */
.todo{background:#fff3cd; color:#7a5200; border-radius:4px; padding:0 4px; font-weight:600}

/* FOOTER */
footer{background:var(--navy); color:#a9bbd1; font-size:.92rem}
footer h4{color:#fff; font-size:.95rem; font-weight:700; margin-bottom:14px}
footer a{color:#a9bbd1; text-decoration:none}
footer a:hover,footer a[aria-current]{color:#fff}
footer ul{list-style:none; padding:0; margin:0}
footer li{padding:4px 0}

@media (max-width:991.98px){ .legal{padding-top:36px} }
@media print{ .navbar,.toc-col,footer{display:none!important} .legal-hero{padding:0 0 20px; background:none} }
