/* ==========================================================================
   TELCONODE — Legal document stylesheet
   Shared by: terms.html, privacy.html, platform-terms.html
   Portable: this file is intentionally standalone so the same legal pages can
   be served from the NeuralGate developer portal without restyling.
   ========================================================================== */

:root{
  --paper:#0B0F17; --surface:#0F1B33; --surface-alt:#152444;
  --ink:#E7ECF3; --ink-2:#C2CCDB; --muted:#9AA7BD;
  --border:rgba(255,255,255,0.08); --border-strong:rgba(255,255,255,0.20);
  --orange:#F45B24; --orange-light:#FF7A47; --teal:#17B8C4;
  --sans:"Inter", ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}
*{box-sizing:border-box; margin:0; padding:0;}
body{font-family:var(--sans); background:var(--paper); color:var(--ink); line-height:1.7; -webkit-font-smoothing:antialiased;}
a{color:var(--orange-light); text-decoration:none;}
a:hover{text-decoration:underline;}
.wrap{max-width:820px; margin:0 auto; padding:0 24px;}

/* --- Header / nav ------------------------------------------------------- */
header{position:sticky; top:0; z-index:50; background:rgba(11,15,23,0.85); backdrop-filter:blur(12px); border-bottom:1px solid var(--border);}
/* Scoped to the header bar — the table of contents is also a <nav>, and must
   not inherit this flex layout. */
header > nav{display:flex; align-items:center; justify-content:space-between; gap:16px; padding:18px 24px; max-width:1160px; margin:0 auto;}
.logo{display:flex; align-items:center; gap:10px; font-weight:600; font-size:17px; color:var(--ink); letter-spacing:0.02em;}
.logo:hover{text-decoration:none;}
.logo svg{width:28px; height:28px;}
.backlink{font-size:14px; color:var(--muted);}
.backlink:hover{color:var(--ink); text-decoration:none;}

/* --- Legal document switcher ------------------------------------------- */
.legalnav{border-bottom:1px solid var(--border); background:rgba(15,27,51,0.45);}
.legalnav-inner{max-width:1160px; margin:0 auto; padding:0 24px; display:flex; gap:6px; overflow-x:auto; scrollbar-width:none;}
.legalnav-inner::-webkit-scrollbar{display:none;}
.legalnav a{white-space:nowrap; font-size:13.5px; color:var(--muted); padding:13px 14px; border-bottom:2px solid transparent;}
.legalnav a:hover{color:var(--ink); text-decoration:none;}
.legalnav a[aria-current="page"]{color:var(--ink); border-bottom-color:var(--orange);}

/* --- Document body ------------------------------------------------------ */
main{padding:64px 24px 104px;}
.doc-kicker{font-size:12px; text-transform:uppercase; letter-spacing:0.14em; color:var(--teal); font-weight:600; margin-bottom:14px;}
h1{font-size:35px; font-weight:600; letter-spacing:-0.03em; line-height:1.14; margin-bottom:8px;}
.subtitle{font-size:17px; color:var(--ink-2); margin-bottom:16px;}
.updated{color:var(--muted); font-size:14px; margin-bottom:40px;}

h2{font-size:21px; font-weight:600; margin:44px 0 14px; color:var(--ink); letter-spacing:-0.02em; scroll-margin-top:120px;}
h2 .num{color:var(--orange); margin-right:10px;}
h3{font-size:16.5px; font-weight:600; margin:28px 0 10px; color:var(--ink-2); letter-spacing:-0.01em; scroll-margin-top:120px;}
h3 .num{color:var(--orange); margin-right:8px; font-weight:600;}
p, li{color:var(--muted); font-size:15.5px; margin-bottom:12px;}
ul, ol{padding-left:22px; margin-bottom:18px;}
li::marker{color:var(--border-strong);}
li > strong{color:var(--ink-2);}
p.caps{text-transform:none;}
address{font-style:normal; color:var(--muted); font-size:15.5px;}

/* --- Table of contents -------------------------------------------------- */
.toc{background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:26px 30px; margin-bottom:8px;}
.toc h2{font-size:12px; text-transform:uppercase; letter-spacing:0.14em; color:var(--teal); margin:0 0 16px; font-weight:600;}
.toc ol{padding-left:20px; columns:2; gap:24px; margin-bottom:0;}
.toc li{margin-bottom:9px; font-size:14px;}
.toc a{color:var(--ink);}
.toc a:hover{color:var(--orange-light);}

/* --- Cross-reference callout -------------------------------------------- */
.notice{background:var(--surface); border:1px solid var(--border); border-left:3px solid var(--teal); border-radius:10px; padding:18px 22px; margin:0 0 40px;}
.notice p{margin-bottom:0; font-size:14.5px;}

/* --- Footer ------------------------------------------------------------- */
footer{padding:44px 24px; text-align:center; color:var(--muted); font-size:13.5px; border-top:1px solid var(--border);}
footer a{color:var(--muted);}
footer a:hover{color:var(--orange-light);}

@media (max-width:640px){
  .toc ol{columns:1;}
  h1{font-size:29px;}
  h2{font-size:19.5px;}
  main{padding:44px 20px 80px;}
}