/* ==========================================================================
   WISEBRIDGE — legal.css
   Shared legal stylesheet for privacy.html and terms-of-service.html.
   Legal pages load ONLY this stylesheet, so the body background is defined
   here. Bridge-stone dark theme: body #131010, text #F2ECE6, accent
   #6E7F8A, fog-white #E3E9ED, dark panel #1B2126.
   ========================================================================== */

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}

body{
  font-family:'Georgia','Times New Roman',serif;
  background:#131010;
  color:#F2ECE6;
  font-size:16px;
  line-height:1.85;
  overflow-x:hidden;
}

a{color:inherit;text-decoration:none}
p{margin:0 0 16px}

/* --------------------------------------------------------------------------
   LEGAL HEADER — a <header> element with a solid dark background; the h1 in
   fog-white #E3E9ED contrasts strongly against #131010.
   -------------------------------------------------------------------------- */
.legal-header{
  background:#131010;
  border-bottom:4px solid #6E7F8A;
  padding:64px 0 48px;
}
.legal-header .container{max-width:900px;margin:0 auto;padding:0 24px}
.legal-header .back-home{
  display:inline-block;
  font-family:'Courier New',ui-monospace,Menlo,Consolas,monospace;
  font-size:.8rem;
  font-weight:700;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:#E3E9ED;
  border:1px solid #6E7F8A;
  padding:10px 16px;
  margin-bottom:32px;
  transition:background-color .2s ease,color .2s ease;
}
.legal-header .back-home:hover{background:#6E7F8A;color:#131010}
.legal-header h1{
  font-size:clamp(2rem,4.5vw,3rem);
  font-weight:700;
  line-height:1.15;
  color:#E3E9ED;
  margin-bottom:14px;
  letter-spacing:-.01em;
}
.legal-header .legal-meta{
  color:#E3E9ED;
  font-size:.98rem;
}

/* --------------------------------------------------------------------------
   TABLE OF CONTENTS — styled with class selectors only (never bare nav)
   -------------------------------------------------------------------------- */
.toc{
  background:#1B2126;
  border:1px solid #6E7F8A;
  padding:32px 36px;
  margin:48px 0 8px;
}
.toc h2{
  font-family:'Courier New',ui-monospace,Menlo,Consolas,monospace;
  font-size:.85rem;
  font-weight:700;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:#E3E9ED;
  margin-bottom:18px;
}
.toc ul{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:8px 32px}
.toc li{margin:0}
.toc a{
  display:inline-block;
  color:#E3E9ED;
  font-size:.96rem;
  border-bottom:1px solid #6E7F8A;
  padding:4px 0;
  transition:color .2s ease,border-color .2s ease;
}
.toc a:hover{color:#FFFFFF;border-color:#E3E9ED}

/* --------------------------------------------------------------------------
   LEGAL CONTENT
   -------------------------------------------------------------------------- */
.legal-content{padding:48px 0 80px}
.legal-content .container{max-width:900px;margin:0 auto;padding:0 24px}

/* Scope isolation: legal sections must never inherit banded backgrounds. */
.legal-page .legal-content section{
  background-color:transparent !important;
}

.legal-content section{margin-bottom:24px}
.legal-content h2{
  font-size:1.55rem;
  font-weight:700;
  line-height:1.25;
  color:#E3E9ED;
  margin:56px 0 18px;
  padding-bottom:12px;
  border-bottom:1px solid #6E7F8A;
  scroll-margin-top:24px;
}
.legal-content h3{
  font-size:1.18rem;
  font-weight:700;
  color:#E3E9ED;
  margin:28px 0 12px;
}
.legal-content p{
  color:#F2ECE6;
  margin-bottom:16px;
}
.legal-content ul{
  color:#F2ECE6;
  margin:0 0 16px 26px;
}
.legal-content li{margin-bottom:10px}
.legal-content strong{color:#E3E9ED}

/* Inline home link at the end of the document */
.legal-content .legal-nav{
  margin-top:64px;
  padding-top:32px;
  border-top:1px solid #6E7F8A;
}
.legal-content .legal-nav a{
  display:inline-block;
  color:#E3E9ED;
  font-weight:700;
  border-bottom:2px solid #6E7F8A;
  padding-bottom:4px;
  transition:color .2s ease,border-color .2s ease;
}
.legal-content .legal-nav a:hover{color:#FFFFFF;border-color:#E3E9ED}

/* --------------------------------------------------------------------------
   LEGAL FOOTER
   -------------------------------------------------------------------------- */
.legal-footer{
  background:#1B2126;
  border-top:4px solid #6E7F8A;
  padding:40px 0;
}
.legal-footer .container{
  max-width:900px;
  margin:0 auto;
  padding:0 24px;
  display:flex;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:12px 24px;
}
.legal-footer p{
  color:#F2ECE6;
  font-size:.92rem;
  margin:0;
}
.legal-footer a{
  color:#E3E9ED;
  border-bottom:1px solid #6E7F8A;
  font-size:.92rem;
  transition:color .2s ease;
}
.legal-footer a:hover{color:#FFFFFF}

/* --------------------------------------------------------------------------
   RESPONSIVE
   -------------------------------------------------------------------------- */
@media (max-width:700px){
  .toc ul{grid-template-columns:1fr}
  .toc{padding:26px 24px}
  .legal-header{padding:48px 0 36px}
  .legal-content h2{font-size:1.35rem}
}
