/* ═══════════════════════════════════════════════════════════
   SMEULDERS DIGITAL — leespagina's

   Voor pagina's die vooral tekst zijn, zoals /privacy/. Laadt ná
   style.css en gebruikt dezelfde tokens.

   Eén regel bepaalt hier bijna alles: de tekstkolom is smal. Een
   privacyverklaring over de volle breedte van een scherm leest
   niemand, en dan haalt hij zijn doel niet.
   ═══════════════════════════════════════════════════════════ */

.tp-hero{
  position:relative; overflow:hidden;
  padding:clamp(7.5rem,15vh,10rem) 0 clamp(1.5rem,3vw,2.5rem);
}
.tp-hero__glow{
  position:absolute; z-index:0; pointer-events:none;
  width:min(110vw,900px); aspect-ratio:1; left:50%; top:-52%;
  transform:translateX(-50%);
  background:radial-gradient(circle, rgba(245,37,31,.13), transparent 62%);
  filter:blur(30px);
}
.tp-hero .wrap{ position:relative; z-index:1; }
.tp-hero__titel{
  font-family:var(--f-display); font-weight:800;
  font-size:clamp(2.1rem,5.6vw,3.8rem); line-height:1.03; letter-spacing:-.03em;
  margin-top:.7rem; max-width:16ch;
}
.tp-hero__titel em{ font-family:var(--f-serif); font-style:italic; font-weight:400; color:var(--ember); }
.tp-hero__lead{ color:var(--ash-2); max-width:56ch; margin-top:1.2rem; }
.tp-datum{ color:var(--ash-3); font-size:.82rem; margin-top:1.2rem; }

/* ── De tekstkolom ─────────────────────────────────────── */
/* 68ch is ongeveer tien tot twaalf woorden per regel. Breder en je oog
   verliest bij het terugspringen de volgende regel. */
.tp-tekst{ max-width:68ch; }
.tp-tekst h2{
  font-family:var(--f-display); font-weight:700; letter-spacing:-.02em;
  font-size:clamp(1.3rem,2.6vw,1.7rem);
  margin:clamp(2.4rem,5vw,3.2rem) 0 .8rem;
  padding-top:clamp(1.4rem,3vw,2rem);
  border-top:1px solid var(--line);
}
.tp-tekst h2:first-of-type{ margin-top:0; padding-top:0; border-top:0; }
.tp-tekst h3{
  font-family:var(--f-display); font-weight:600; font-size:1.05rem;
  margin:1.8rem 0 .5rem; color:var(--ash);
}
.tp-tekst p{ color:var(--ash-2); }
.tp-tekst p + p{ margin-top:.9rem; }
.tp-tekst strong{ color:var(--ash); font-weight:600; }
.tp-tekst a{ color:var(--ash); border-bottom:1px solid var(--line-2); transition:border-color .3s; }
.tp-tekst a:hover{ border-color:var(--ember); }

.tp-tekst ul{ list-style:none; padding:0; margin:1rem 0 0; display:grid; gap:.7rem; }
.tp-tekst li{ position:relative; padding-left:1.4rem; color:var(--ash-2); }
.tp-tekst li::before{
  content:""; position:absolute; left:0; top:.62em;
  width:8px; height:1.5px; background:var(--ember);
}

.tp-slot{
  margin-top:clamp(2.4rem,5vw,3.2rem); padding-top:1.6rem;
  border-top:1px solid var(--line);
  font-size:.92rem; color:var(--ash-3) !important;
}

/* ── Waarschuwing zolang de gegevens ontbreken ─────────── */
/* Bewust lelijk genoeg om op te vallen. Deze mag nooit ongemerkt
   mee online gaan. */
.tp-let-op{
  border:1px solid var(--ember); border-radius:var(--r);
  background:rgba(245,37,31,.08);
  padding:1.1rem 1.3rem; margin-bottom:2rem;
  color:var(--ash-2); font-size:.94rem;
}
.tp-let-op strong{ display:block; color:var(--ash); margin-bottom:.3rem; }
.tp-let-op code{
  font-family:ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size:.9em; color:var(--ember);
}