/* pages.css - Zusatzstil fuer die Rechtstexte (mentions legales, confidentialite).
   Wird NACH style.css geladen und nutzt dessen Tokens; hier steht nur, was
   die Hauptseite nicht braucht: schlanker Kopf, Fliesstext-Spalte, Definitionsliste.
   Platzhalter im Markup sind als [[…]] markiert - siehe Kommentar in den HTML-Dateien. */

/* ---------- schlanker Kopf: Logo links, ein Rueckweg rechts ---------- */
.mast-lite{
  border-bottom:1px solid var(--ink); background:var(--paper);
  position:sticky; top:0; z-index:30;
}
.mast-lite .mast-in{
  display:flex; align-items:center; justify-content:space-between; gap:24px;
  max-width:1160px; margin-inline:auto; padding:16px 30px;
}
.mast-back{
  text-decoration:none; font:400 12.5px/1 Jost,sans-serif;
  letter-spacing:var(--ls-meta); text-transform:uppercase; color:var(--ink-2);
  padding-bottom:3px; border-bottom:1px solid transparent;
  transition:border-color .45s var(--ease), color .45s var(--ease);
}
.mast-back:hover{color:var(--ink); border-color:var(--ink)}

/* ---------- Textseite ---------- */
.page{padding:78px 0 var(--sect)}
.page-head{max-width:62ch; margin-bottom:52px}
.page-head h1{font-size:clamp(38px, 6vw, 62px); margin-bottom:18px}
.page-head .lede{font-size:19px; color:var(--ink-2); margin:0; max-width:56ch}

/* Eine schmale Spalte - Rechtstexte werden gelesen, nicht ueberflogen. */
.prose{max-width:68ch}
.prose h2{
  font-size:26px; margin:52px 0 14px;
  padding-top:22px; border-top:1px solid var(--rule-2);
}
.prose h2:first-of-type{margin-top:0; padding-top:0; border-top:0}
.prose h3{font-size:19px; margin:28px 0 8px}
.prose p{margin:0 0 14px}
.prose ul{margin:0 0 16px; padding-left:20px}
.prose li{margin-bottom:6px}
.prose a{color:var(--blue-dp); text-decoration:underline; text-underline-offset:3px; text-decoration-thickness:1px}
.prose a:hover{color:var(--ink)}

/* Kontaktbloecke und Ausweisdaten: Label/Wert-Paare */
.facts{
  display:grid; grid-template-columns:minmax(11rem,auto) 1fr; gap:9px 28px;
  margin:0 0 18px; padding:22px 24px; background:var(--paper-2);
}
.facts dt{
  font:400 11.5px/1.6 Jost,sans-serif; letter-spacing:var(--ls-meta);
  text-transform:uppercase; color:var(--ink-3);
}
.facts dd{margin:0; font-size:16.5px}

/* Stand-Zeile am Fuss des Textes */
.page-updated{
  margin-top:46px; padding-top:18px; border-top:1px solid var(--rule-2);
  font:400 12.5px/1.6 Jost,sans-serif; letter-spacing:.06em; color:var(--ink-3);
}

/* Platzhalter sichtbar machen, solange Julies Angaben fehlen.
   Faellt weg, sobald die echten Werte eingesetzt sind (siehe HTML-Kommentar). */
.todo{
  background:var(--sand); color:var(--sand-dp);
  padding:1px 7px; font:400 13px/1.5 Jost,sans-serif; letter-spacing:.04em;
  border-bottom:1px solid var(--sand-dp);
}

@media (max-width:640px){
  .page{padding-top:52px}
  .mast-lite .mast-in{padding-inline:22px}
  .facts{grid-template-columns:1fr; gap:2px 0; padding:20px}
  .facts dd{margin-bottom:12px}
  .facts dd:last-child{margin-bottom:0}
}