/* ============================================================
   legal.css — privacy.html and terms.html
   Reuses the tokens defined in styles.css (:root). Kept in a
   separate file so the marketing page's payload is unchanged.
   ============================================================ */

.legal-body{
  background:var(--cream);
  color:var(--ink);
}

.legal-wrap{
  width:100%;
  max-width:820px;
  margin:0 auto;
  padding:0 28px;
}

/* ---------- header ---------- */

.legal-head{
  background:var(--navy-deep);
  color:var(--cream);
  padding:20px 0;
}
.legal-head .legal-wrap{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  flex-wrap:wrap;
}
.legal-back{
  display:inline-flex;
  align-items:center;
  gap:12px;
  color:var(--cream);
  text-decoration:none;
  font-family:var(--font-display);
  font-weight:700;
  font-size:1.05rem;
  letter-spacing:.01em;
}
.legal-back img{
  display:block;
  border-radius:50%;
}
.legal-back:hover span{ color:var(--gold-soft); }

.legal-nav{
  display:flex;
  gap:22px;
  font-size:.94rem;
  font-weight:600;
}
.legal-nav a{
  color:rgba(247,242,232,.72);
  text-decoration:none;
  padding-bottom:3px;
  border-bottom:2px solid transparent;
}
.legal-nav a:hover{ color:var(--cream); }
.legal-nav a[aria-current="page"]{
  color:var(--gold-soft);
  border-bottom-color:var(--gold);
}

/* ---------- document ---------- */

.legal-doc{
  padding-top:clamp(44px,6vw,72px);
  padding-bottom:clamp(56px,7vw,88px);
}

.legal-eyebrow{
  margin:0 0 10px;
  font-size:.74rem;
  font-weight:700;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--navy-soft);
}

.legal-doc h1{
  font-family:var(--font-display);
  font-weight:900;
  font-size:clamp(2.1rem,5.4vw,3.1rem);
  line-height:1.08;
  letter-spacing:-.015em;
  color:var(--navy);
  margin:0 0 10px;
}

.legal-date{
  margin:0 0 30px;
  font-size:.9rem;
  font-weight:600;
  color:#5d6570;
}

.legal-lede{
  font-size:1.14rem;
  line-height:1.62;
  color:#2c333c;
  border-left:3px solid var(--gold);
  padding-left:20px;
  margin:0 0 40px;
}

.legal-doc h2{
  font-family:var(--font-display);
  font-weight:700;
  font-size:clamp(1.32rem,2.7vw,1.62rem);
  line-height:1.25;
  color:var(--navy);
  margin:44px 0 12px;
  padding-top:22px;
  border-top:1px solid rgba(28,56,89,.14);
}
.legal-doc h2:first-of-type{ margin-top:0; }

.legal-doc h3{
  font-family:var(--font-body);
  font-weight:700;
  font-size:1.02rem;
  color:var(--navy-soft);
  margin:26px 0 8px;
}

.legal-doc p{ margin:0 0 16px; }

.legal-doc ul{
  margin:0 0 18px;
  padding-left:22px;
}
.legal-doc li{
  margin-bottom:9px;
  padding-left:4px;
}
.legal-doc li::marker{ color:var(--gold); }

.legal-doc a{
  color:var(--navy);
  text-decoration:underline;
  text-underline-offset:3px;
  text-decoration-thickness:1px;
  text-decoration-color:rgba(208,148,35,.7);
}
.legal-doc a:hover{
  color:var(--gold);
  text-decoration-color:var(--gold);
}

.legal-doc strong{ color:var(--navy-deep); }

.legal-mono{
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:.92em;
  background:rgba(28,56,89,.07);
  padding:1px 6px;
  border-radius:var(--r-sm);
  white-space:nowrap;
}

/* ---------- footer ---------- */

.legal-foot{
  background:var(--navy-deep);
  color:var(--cream);
  padding:38px 0 32px;
}
.legal-foot .disclaimer{
  margin:0 0 14px;
  font-size:.8rem;
  line-height:1.6;
  color:rgba(247,242,232,.6);
  max-width:70ch;
}
.legal-foot .copyright{
  margin:0;
  font-size:.85rem;
  color:rgba(247,242,232,.78);
}
.legal-foot a{
  color:var(--gold-soft);
  text-decoration:none;
}
.legal-foot a:hover{ text-decoration:underline; }

@media (max-width:560px){
  .legal-head .legal-wrap{ gap:12px; }
  .legal-back span{ font-size:.96rem; }
  .legal-lede{ font-size:1.05rem; padding-left:16px; }
}