/* =============================================================
   Zülfi’s — Token-Brücke für die Weihnachts-Site
   Die Weihnachts-Site bringt ihr eigenes style.css mit und kennt die
   Rollennamen aus tokens.css nicht. Statt tokens.css dazuzuladen (das
   würde ihre Gestaltung verändern) bildet diese Datei die vorhandenen
   Markenfarben auf die Namen ab, die Header und Formular erwarten.
   Es kommt keine neue Farbe dazu — nur andere Namen für dieselben Werte.
   ============================================================= */
[data-site="xmas"]{
  /* Das Vollbild-Menü malt seine Fläche mit --blue-900. Auf der
     Weihnachts-Site gab es den Namen nicht, das Overlay blieb deshalb
     durchsichtig und die Schrift stand im Seiteninhalt. */
  --blue-900:var(--navy-deep);
  --bg:var(--navy);
  --surface:var(--navy-deep);
  --surface-alt:var(--navy-soft);
  --text-muted:var(--text-dim);
  --line:var(--navy-line);
  --line-light:var(--navy-line);
  --line-dark:var(--navy-line);
  --brand:var(--orange);
  --accent:var(--orange);
  /* Stand bis zum 6. November 2026 auf Navy (4,92:1), damit die
     gemeinsamen Bausteine hier AA erfüllten, während die Seite für ihre
     eigenen Knöpfe Weiß nutzte. Das Ergebnis war, dass derselbe
     Anfrage-Knopf im Kopf auf dieser Seite anders aussah als auf den
     anderen beiden. Chris hat sich nach Vorlage der Messwerte für Weiß
     auf Orange entschieden — überall. Siehe tokens.css. */
  --on-accent:#fff;
  --paper-50:var(--navy);
  --paper-100:var(--navy-soft);
  --white:var(--navy-deep);
  --ink-700:rgba(255,247,239,.74);
  --radius-pill:999px;
  --font-sans:'Instrument Sans',system-ui,-apple-system,'Segoe UI',Roboto,
              Helvetica,Arial,sans-serif;
  --shadow-card:0 18px 40px -28px rgba(0,0,0,.7);
  --shadow-float:0 18px 38px -16px rgba(0,0,0,.6);
  --fs-xs:.82rem;
  --fs-sm:.92rem;
  --fs-base:1rem;
  --fs-h3:clamp(1.15rem,1.05rem + .5vw,1.4rem);
  /* Die Hero-Komponente rechnet mit diesen Namen. Sie stehen in tokens.css,
     das die Weihnachtsseite nicht lädt — hier mit denselben Werten. */
  --fs-lead:clamp(1.08rem,1rem + .4vw,1.25rem);
  --fs-held-rampe:1.8rem + 4.85vw;
  --lh-display:1.02;
  --ls-display:-.015em;
  --font-display:'Playfair Display','Playfair Ersatz',Georgia,'Times New Roman',serif;
  --curry-500:var(--gold);
  --curry-700:var(--gold);
  --ketchup-600:var(--orange);
  --on-ketchup:#fff;
}
/* --shell stand hier auf 1220 px und galt damit auch für den Kopf — der
   stand dadurch auf der Weihnachtsseite zehn Pixel weiter innen als auf
   Imbiss und Catering, und mit ihm jedes einzelne Element darin. Der Kopf
   gehört allen Bereichen und nimmt jetzt die gemeinsamen 1240 px; der
   Inhalt der Weihnachtsseite behält seine 1220. */
[data-site="xmas"] main{--shell:1220px}
[data-site="xmas"] main .held{--shell:1240px}

/* Dasselbe Spiel beim Seitenrand. Die gemeinsame Skala hat ihre
   Untergrenze von 20 auf 24 px gehoben; style.css der Weihnachtsseite
   bringt aber ihren eigenen --gutter mit und blieb dadurch bei 20. Der
   Kopf stand auf dieser einen Seite vier Pixel weiter außen als auf den
   anderen beiden — gemessen an neun Elementen bei 390 und 360 px.

   Kopf und Hero gehören allen Bereichen und nehmen deshalb die
   gemeinsamen 24 px. Der übrige Inhalt der Weihnachtsseite behält seine
   20 px, damit sich an ihr sonst nichts verschiebt. */
[data-site="xmas"]{--gutter:clamp(1.5rem,5vw,2.5rem)}
[data-site="xmas"] main{--gutter:clamp(1.25rem,5vw,2.5rem)}
[data-site="xmas"] main .held{--gutter:clamp(1.5rem,5vw,2.5rem)}


/* ============================================================
   Stimmen auf der Weihnachtsseite
   ============================================================
   Die Seite lädt bewusst kein sektionen.css — die Klassen .stimmen__*
   aus tools/bauen.py haben dort also keine Gestalt. Statt die große
   Datei nachzuladen (das würde jede Sektion der Seite umstellen) steht
   hier das Nötige, und zwar auf main begrenzt, damit der gemeinsame
   Kopf unberührt bleibt.

   Keine der beiden Bewertungen nennt eine Weihnachtsfeier. Sie stehen
   hier als Beleg für Pünktlichkeit und Ablauf bei einer Feier — die
   Überschrift sagt genau das und behauptet keinen Anlass. */
[data-site="xmas"] main .xmas-stimmen__titel{margin:.4rem 0 clamp(1.5rem,4vw,2.5rem)}
[data-site="xmas"] main .stimmen__gross{
  font-family:var(--font-display);font-weight:700;
  font-size:clamp(1.5rem,1.1rem + 1.6vw,2.3rem);
  line-height:1.25;letter-spacing:-.01em;
  color:var(--cream);margin:0;max-width:30ch;
}
[data-site="xmas"] main blockquote{margin:0 0 clamp(1.25rem,3vw,2rem)}
[data-site="xmas"] main .stimmen__klein{
  display:grid;gap:clamp(1rem,2.5vw,1.5rem);
  grid-template-columns:repeat(auto-fit,minmax(min(100%,22rem),1fr));
  border-top:1px solid rgba(255,247,239,.18);padding-top:clamp(1.25rem,3vw,2rem);
}
[data-site="xmas"] main .stimmen__klein p{margin:0;color:var(--text-dim);line-height:1.6}
[data-site="xmas"] main .stimmen__quelle{
  margin-top:.6rem;font-family:var(--font-head);font-weight:600;
  font-size:.85rem;letter-spacing:.04em;text-transform:uppercase;
  color:var(--text-faint);
}
[data-site="xmas"] main .stimmen__alle{margin-top:clamp(1.5rem,4vw,2.25rem)}
[data-site="xmas"] main .stimmen__alle a{color:var(--gold);display:inline-flex;align-items:center;min-height:24px;padding-block:.15rem}
