/* ============================================================
   Shared styles for the legal / policy pages.
   Tokens mirror index.html so the whole site reads as one place.
   ============================================================ */
:root{
  --blue:#2f6ae0;--blue-lite:#4982f6;--blue-wash:#eaf1fe;
  --green:#15805c;--red:#c0392b;
  --amber-wash:#fff6e2;
  --ink:#101114;--ink-2:#3a3f4a;--muted:#5b6270;
  --line:#e7e8eb;--line-2:#f0f1f3;--bg:#fff;--bg-alt:#f6f7f8;
  --font:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --shadow:0 1px 3px rgba(16,17,20,.06),0 8px 24px -14px rgba(16,17,20,.22);
  --r:12px;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition-duration:.001ms!important;animation-duration:.001ms!important}}
body{margin:0;background:var(--bg);color:var(--ink);font:400 16px/1.7 var(--font);-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{margin:0 0 .5em;line-height:1.25;letter-spacing:-.02em;font-weight:700}
h1{font-size:clamp(1.75rem,4vw,2.5rem);font-weight:800;letter-spacing:-.03em}
h2{font-size:clamp(1.25rem,2.4vw,1.6rem);margin-top:2.5rem;scroll-margin-top:88px}
h3{font-size:1.08rem;margin-top:1.75rem}
p,li{color:var(--ink-2)}
p{margin:0 0 1em}
a{color:var(--blue);text-underline-offset:2px}
a:hover{color:#1e4fb5}
:focus-visible{outline:3px solid var(--blue-lite);outline-offset:2px;border-radius:4px}
.wrap{width:100%;max-width:1180px;margin-inline:auto;padding-inline:20px}
.skip{position:absolute;left:-9999px}
.skip:focus{left:10px;top:10px;z-index:200;background:var(--blue);color:#fff;padding:.7rem 1rem;border-radius:8px;font-weight:700}

/* header */
.site-head{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.94);backdrop-filter:saturate(1.6) blur(8px);border-bottom:1px solid var(--line)}
.site-head .wrap{display:flex;align-items:center;gap:1.25rem;padding-block:.85rem}
.logo{font-weight:800;font-size:1.05rem;letter-spacing:-.03em;color:var(--ink);text-decoration:none;white-space:nowrap}
.logo span{color:var(--blue)}
.nav{display:none;gap:1.3rem;margin-left:auto;font-size:.92rem;font-weight:500}
.nav a{color:var(--ink-2);text-decoration:none}
.nav a:hover{color:var(--blue)}
.nav a[aria-current="page"]{color:var(--blue);font-weight:700}
@media(min-width:860px){.nav{display:flex}}

/* page head */
.doc-head{background:linear-gradient(180deg,#f7f9fd,#fff);border-bottom:1px solid var(--line)}
.doc-head .wrap{padding-block:clamp(2rem,4.5vw,3.25rem);max-width:860px}
.crumb{font-size:.875rem;color:var(--muted);margin:0 0 .9rem}
.crumb a{text-decoration:none}
.crumb a:hover{text-decoration:underline}
.updated{display:inline-flex;align-items:center;gap:.45rem;background:var(--blue-wash);color:#1e4fb5;font:700 .74rem/1 var(--font);letter-spacing:.05em;text-transform:uppercase;padding:.5rem .7rem;border-radius:99px;margin-bottom:1rem}
.doc-head .intro{font-size:1.06rem;color:var(--ink-2);max-width:64ch;margin:0}

/* body */
.doc{max-width:860px;padding-block:clamp(2rem,4vw,3rem)}
.doc>section{scroll-margin-top:88px}
.doc ul,.doc ol{padding-left:1.3rem;margin:0 0 1.15em}
.doc li{margin-bottom:.5em}
.doc h2:first-of-type{margin-top:0}

/* table of contents */
.toc{background:var(--bg-alt);border:1px solid var(--line);border-radius:var(--r);padding:1.15rem 1.35rem;margin-bottom:2.25rem}
.toc p{font:700 .74rem/1 var(--font);letter-spacing:.09em;text-transform:uppercase;color:var(--muted);margin:0 0 .8rem}
.toc ol{margin:0;padding-left:1.15rem;columns:2;column-gap:2rem}
.toc li{margin-bottom:.4rem;font-size:.92rem;break-inside:avoid}
.toc a{color:var(--ink-2);text-decoration:none}
.toc a:hover{color:var(--blue);text-decoration:underline}
@media(max-width:640px){.toc ol{columns:1}}

/* callouts */
.note{background:var(--blue-wash);border:1px solid #cddcfa;border-left:4px solid var(--blue);border-radius:10px;padding:1.1rem 1.25rem;margin:1.5rem 0}
.note p:last-child,.warn p:last-child{margin-bottom:0}
.note p{color:#1b3a75}
.warn{background:var(--amber-wash);border:1px solid #f0dfb4;border-left:4px solid #d9a63a;border-radius:10px;padding:1.1rem 1.25rem;margin:1.5rem 0}
.warn p{color:#4a3b12}
.warn strong{color:#3a2e0c}

/* visible placeholder marker - never ship these to production */
.ph{
  display:inline-block;background:var(--amber-wash);border:1px dashed #d9a63a;color:#7a5406;
  font:700 .8rem/1.35 var(--font);letter-spacing:.02em;padding:.1rem .4rem;border-radius:5px;
}

/* tables */
.tbl-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--line);border-radius:var(--r);margin:1.5rem 0}
table.tbl{border-collapse:collapse;width:100%;min-width:620px;font-size:.92rem;background:#fff}
table.tbl th,table.tbl td{text-align:left;padding:.8rem .9rem;border-bottom:1px solid var(--line-2);vertical-align:top}
table.tbl thead th{background:var(--bg-alt);font:700 .72rem/1.3 var(--font);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);border-bottom:1px solid var(--line)}
table.tbl tbody tr:last-child td{border-bottom:none}

/* contact cards */
.cards{display:grid;gap:1rem;margin:1.75rem 0}
@media(min-width:620px){.cards{grid-template-columns:1fr 1fr}}
.cards .c{border:1px solid var(--line);border-radius:var(--r);padding:1.25rem;background:#fff;box-shadow:0 1px 2px rgba(16,17,20,.04)}
.cards h3{margin:0 0 .4rem;font-size:1.02rem}
.cards p{font-size:.93rem;margin-bottom:.5rem}
.cards p:last-child{margin-bottom:0}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;font:700 .95rem/1 var(--font);padding:.85rem 1.25rem;border-radius:10px;border:1.5px solid transparent;text-decoration:none;transition:background-color .15s ease,box-shadow .15s ease}
.btn-primary{background:var(--blue);color:#fff}
.btn-primary:hover{background:#255ccd;color:#fff;box-shadow:0 4px 14px -4px rgba(47,106,224,.55)}
.btn-outline{background:#fff;color:var(--blue);border-color:#cddcfa}
.btn-outline:hover{background:var(--blue-wash);color:var(--blue)}

/* footer */
.site-foot{background:#101114;color:#a9b0bd;font-size:.9rem;padding-block:2.5rem 2.75rem;margin-top:clamp(2.5rem,5vw,4rem)}
.site-foot a{color:#dfe4ec}
.site-foot a:hover{color:#fff}
.foot{display:grid;gap:1.75rem}
@media(min-width:820px){.foot{grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:3rem}}
.foot p{margin:0 0 .75rem;line-height:1.65;max-width:64ch;color:#a9b0bd}
.foot .bm{display:block;font-weight:800;font-size:1.05rem;color:#fff;letter-spacing:-.03em;margin-bottom:.9rem}
.foot .bm span{color:var(--blue-lite)}
.foot ul{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:.5rem 1.3rem}
.foot li{color:#a9b0bd}
.todo{color:#f0c46a;font-weight:700}

/* ---- contact form ---- */
.cform{background:var(--bg-alt);border:1px solid var(--line);border-radius:var(--r);padding:1.4rem;margin:1.6rem 0 2rem}
.cform .fld{margin-bottom:1rem}
.cform label{display:block;font-weight:600;font-size:.9rem;margin-bottom:.35rem;color:var(--ink)}
.cform input,.cform select,.cform textarea{
  width:100%;padding:.7rem .8rem;font:inherit;font-size:.95rem;color:var(--ink);
  background:#fff;border:1px solid #ccd2dc;border-radius:8px;box-sizing:border-box}
.cform textarea{resize:vertical;min-height:120px}
.cform input:focus,.cform select:focus,.cform textarea:focus{
  outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(47,106,224,.16)}
.cform .frow{display:grid;gap:1rem}
@media(min-width:560px){.cform .frow{grid-template-columns:1fr 1fr}}
.cform .fnote{font-size:.85rem;color:var(--muted);margin:.9rem 0 0}
.cform .hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* ---- brand lockup: the favicon mark paired with the wordmark ---- */
.brand{display:inline-flex;align-items:center;gap:.58rem;text-decoration:none;color:var(--ink);line-height:1}
.brand-mark{flex:none;border-radius:7px;display:block}
.brand-txt{font-weight:600;font-size:1.02rem;letter-spacing:-.03em;white-space:nowrap;color:var(--ink)}
.brand-txt b{font-weight:800}
a.brand:hover .brand-txt{color:var(--blue)}
@media(max-width:420px){.brand-txt{font-size:.95rem}.brand-mark{width:26px;height:26px}}
