/* Hetivo — shared styles for legal pages (privacy, cookies).
   Reuses the design tokens from index.html so the pages match the site. */

:root{
  --orange:#FF783E;
  --blue:#213ca7;
  --black:#111111;
  --cool-gray:#6F7685;
  --soft-gray:#F5F6F8;
  --peach:#FFD4C3;
  --white:#ffffff;
  --serif:'EB Garamond', Georgia, serif;
  --sans:'Poppins', system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  --maxw:1180px;
  --readw:760px;
  --radius:18px;
  --shadow-sm:0 6px 20px rgba(17,17,17,.07);
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:var(--sans);
  color:var(--black);
  background:var(--white);
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
a{color:inherit}
img{max-width:100%;display:block}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px}

/* ---------- header ---------- */
header.site{
  position:sticky;top:0;z-index:50;background:var(--orange);
  box-shadow:0 2px 0 rgba(0,0,0,.04);
}
.nav{display:flex;align-items:center;justify-content:space-between;height:74px;gap:20px}
.nav .logo img{height:40px;width:auto}
.nav nav{display:flex;align-items:center;gap:28px}
.nav nav a{
  color:#fff;font-weight:500;font-size:.95rem;opacity:.92;
  text-decoration:none;transition:opacity .15s;white-space:nowrap;
}
.nav nav a:hover{opacity:1;text-decoration:underline}

/* ---------- title band ---------- */
.legal-hero{background:var(--orange);color:#fff;padding:34px 0 58px}
.legal-hero .eyebrow{
  font-weight:600;font-size:.78rem;letter-spacing:.16em;
  text-transform:uppercase;color:rgba(255,255,255,.85);margin-bottom:12px;
}
.legal-hero h1{
  font-family:var(--serif);font-weight:600;line-height:1.1;letter-spacing:-.01em;
  font-size:clamp(2.1rem,5vw,3.2rem);
}
.legal-hero p.sub{
  color:rgba(255,255,255,.92);font-weight:300;margin-top:14px;max-width:60ch;font-size:1.02rem;
}
.legal-meta{
  margin-top:22px;display:flex;flex-wrap:wrap;gap:10px 28px;
  font-size:.86rem;color:rgba(255,255,255,.9);
}
.legal-meta strong{font-weight:600}

/* ---------- body ---------- */
.legal-body{padding:0 0 84px}
.legal-col{max-width:var(--readw);margin:0 auto}

/* table of contents card, pulled up over the orange band */
.toc{
  background:#fff;border:1px solid rgba(17,17,17,.09);border-radius:var(--radius);
  box-shadow:var(--shadow-sm);padding:24px 28px;margin:-34px 0 46px;position:relative;z-index:2;
}
.toc h2{
  font-family:var(--sans);font-size:.76rem;letter-spacing:.15em;text-transform:uppercase;
  color:var(--cool-gray);font-weight:600;margin-bottom:14px;
}
.toc ol{list-style:none;counter-reset:toc;columns:2;column-gap:32px}
.toc li{counter-increment:toc;margin-bottom:8px;break-inside:avoid;font-size:.92rem}
.toc li a{text-decoration:none;color:var(--black);opacity:.85}
.toc li a:hover{opacity:1;color:var(--orange)}
.toc li a::before{content:counter(toc) ". ";color:var(--orange);font-weight:600}

.legal-col h2{
  font-family:var(--serif);font-weight:600;font-size:1.62rem;line-height:1.2;
  letter-spacing:-.01em;margin:44px 0 14px;scroll-margin-top:90px;
}
.legal-col h2:first-of-type{margin-top:0}
.legal-col h3{
  font-family:var(--sans);font-weight:600;font-size:1rem;margin:26px 0 8px;
}
.legal-col p{margin-bottom:14px;color:#26282e}
.legal-col ul,.legal-col ol{margin:0 0 16px 22px;color:#26282e}
.legal-col li{margin-bottom:9px}
.legal-col a{color:var(--blue);text-decoration:underline;text-underline-offset:2px}
.legal-col a:hover{color:var(--orange)}
.legal-col strong{font-weight:600}

/* highlighted statement box */
.callout{
  background:var(--soft-gray);border-left:4px solid var(--orange);
  border-radius:0 12px 12px 0;padding:20px 24px;margin:22px 0 26px;
}
.callout p:last-child{margin-bottom:0}
.callout .callout-title{
  font-weight:600;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--orange);margin-bottom:8px;
}

/* unmistakable placeholder for details that must be filled in before launch */
.todo{
  background:#FFF3CD;border:1px dashed #C8A21A;border-radius:6px;
  padding:2px 8px;font-weight:600;color:#7A5C00;font-size:.93em;white-space:nowrap;
}

/* data table */
.legal-table{width:100%;border-collapse:collapse;margin:8px 0 22px;font-size:.92rem}
.legal-table th,.legal-table td{
  text-align:left;padding:12px 14px;border-bottom:1px solid rgba(17,17,17,.1);vertical-align:top;
}
.legal-table th{
  font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;
  color:var(--cool-gray);font-weight:600;
}
.legal-table tr:last-child td{border-bottom:none}
.table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}

/* ---------- footer ---------- */
footer.site{background:var(--orange);color:#fff;padding:56px 0 28px;margin-top:auto}
footer .logo img{height:38px;margin-bottom:16px}
footer p.tag{color:rgba(255,255,255,.9);max-width:34ch;font-weight:300;font-size:.95rem}
footer h4{
  font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;
  margin-bottom:14px;color:rgba(255,255,255,.8);
}
footer ul{list-style:none}
footer ul li{margin-bottom:9px}
footer ul li a{color:rgba(255,255,255,.92);font-size:.92rem;text-decoration:none}
footer ul li a:hover{color:#fff;text-decoration:underline}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:40px;margin-bottom:36px}
.foot-bottom{
  border-top:1px solid rgba(255,255,255,.25);padding-top:20px;display:flex;
  justify-content:space-between;gap:16px;flex-wrap:wrap;
  font-size:.86rem;color:rgba(255,255,255,.9);
}

/* ---------- responsive ---------- */
@media (max-width:900px){
  .foot-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  .nav{height:64px}
  .nav .logo img{height:32px}
  .nav nav{gap:18px}
  .nav nav a{font-size:.88rem}
  .toc ol{columns:1}
  .foot-grid{grid-template-columns:1fr}
  .legal-hero{padding:26px 0 48px}
}

@media print{
  header.site,footer.site,.toc{display:none}
  .legal-hero{background:none;color:#000;padding:0 0 18px}
  .legal-hero h1,.legal-hero p.sub,.legal-meta{color:#000}
  body{line-height:1.5}
}