/* ============================================
   legal.css — stijl voor juridische pagina's
   Glitter's Dream · laad dit NA main.css
   ============================================ */

/* Header zonder JavaScript: altijd de "scrolled" look */
.legal-header{position:fixed;inset:0 0 auto 0;z-index:50;
  background:rgba(251,248,246,.85);backdrop-filter:blur(12px);
  box-shadow:0 1px 0 var(--line)}
.legal-nav{display:flex;align-items:center;justify-content:space-between;
  height:74px;gap:1rem;flex-wrap:wrap}
.legal-nav .links{display:flex;align-items:center;gap:1.4rem}
.legal-nav .links a{font-weight:500;font-size:.95rem;opacity:.85;transition:.2s}
.legal-nav .links a:hover{opacity:1;color:var(--brand-deep)}

/* Paginakop */
.legal-hero{position:relative;padding:132px 0 48px;overflow:hidden}
.legal-hero-bg{position:absolute;inset:0;z-index:-1;
  background:
    radial-gradient(60% 50% at 85% 0%,rgba(231,185,168,.45),transparent 70%),
    radial-gradient(45% 55% at 5% 100%,rgba(194,116,142,.18),transparent 70%),
    var(--bg)}
.legal-hero h1{margin-bottom:.4rem}
.legal-updated{color:var(--muted);font-size:.95rem}

/* Artikeltekst */
.legal{max-width:760px;margin:0 auto;padding:48px 0 96px}
.legal p{margin:0 0 1rem;color:var(--ink)}
.legal .intro{font-size:1.08rem;color:var(--muted);margin-bottom:2rem}
.legal h2{font-size:clamp(1.35rem,2.4vw,1.7rem);margin:3rem 0 .9rem;
  scroll-margin-top:96px}
.legal h3{margin:1.8rem 0 .5rem;color:var(--brand-deep)}
.legal a{color:var(--brand-deep);text-decoration:underline;
  text-decoration-color:rgba(156,79,108,.35);text-underline-offset:3px;transition:.2s}
.legal a:hover{text-decoration-color:var(--brand-deep)}
.legal ul{list-style:none;margin:0 0 1rem;display:grid;gap:.55rem}
.legal ul li{position:relative;padding-left:1.7rem}
.legal ul li::before{content:"✦";position:absolute;left:0;top:0;
  color:var(--brand);font-weight:700;font-size:.85em;line-height:1.9}
.legal strong{color:var(--ink)}

/* Inhoudsopgave */
.legal-toc{background:var(--card);border:1px solid var(--line);
  border-radius:var(--radius);padding:28px 32px;margin:0 0 2.5rem;
  box-shadow:0 10px 30px -20px rgba(80,40,55,.4)}
.legal-toc strong{display:block;font-size:.78rem;font-weight:600;
  letter-spacing:.18em;text-transform:uppercase;color:var(--brand-deep);
  margin-bottom:.9rem}
.legal-toc ol{margin:0;padding-left:1.2rem;columns:2;column-gap:2.2rem;
  font-size:.95rem}
.legal-toc ol li{margin:.25rem 0;break-inside:avoid;padding-left:.2rem}
.legal-toc a{color:var(--ink);text-decoration:none}
.legal-toc a:hover{color:var(--brand-deep)}

/* Adres-/infoblok */
.legal address{font-style:normal;background:var(--card);
  border:1px solid var(--line);border-left:4px solid var(--brand);
  border-radius:0 var(--radius) var(--radius) 0;
  padding:22px 28px;margin:0 0 1rem;line-height:1.8}

/* Doel / rechtsgrond / bewaartermijn */
.legal ul.kv li::before{content:"—";color:var(--accent)}

/* Cookietabel */
.legal .table-wrap{overflow-x:auto;margin:0 0 1rem;
  border:1px solid var(--line);border-radius:var(--radius);
  box-shadow:0 10px 30px -20px rgba(80,40,55,.4)}
.legal table{border-collapse:collapse;width:100%;font-size:.92rem;
  background:var(--card)}
.legal th,.legal td{padding:.8rem 1.1rem;text-align:left;vertical-align:top;
  border-bottom:1px solid var(--line)}
.legal thead th{background:var(--bg-alt);font-family:'Fraunces',Georgia,serif;
  font-weight:600;color:var(--brand-deep);white-space:nowrap}
.legal tbody tr:last-child td{border-bottom:0}

/* Focus & responsive */
.legal :focus-visible,.legal-nav :focus-visible{outline:2px solid var(--brand-deep);
  outline-offset:3px;border-radius:4px}
@media(max-width:900px){
  .footer-grid{grid-template-columns:1fr}
  .legal-toc ol{columns:1}
  .legal-hero{padding-top:150px}
}
@media print{
  .legal-header,.legal-toc,.site-footer{display:none}
  .legal-hero{padding-top:24px}
  .legal a{color:inherit;text-decoration:none}
}