/* ============================================================================
   FAYA · typo.css — das eine Typo-System für alle öffentlichen Seiten
   Stand 30.09.2026 · Vorlage: Design-Prototyp „B Inter“ (Menü) + „03 Nachher“
   ----------------------------------------------------------------------------
   Regeln
   · Inter ist die Schrift. Fließtext 400, Headlines 500 in Sentence Case mit
     leicht negativer Laufweite, Eyebrows als kleine gesperrte Versalien in Gold.
   · Bebas Neue nur noch für die Wortmarke „FAYA“ und Event-Marken, die wie ein
     Logo stehen (Golden Flame / Secret Flame auf der Startseite, „Golden Flame“
     als H1 der Markenseite). Nie für UI-Text, Zahlen, Menüs, Sektions-Titel.
   · Cormorant (kursiv) nur als editorialer Akzent: Kicker unter dem Intro,
     Zitate, Engel & Flamme und Secret Flame (eigene Markenstimme).
   · Alle Schriften lokal aus /fonts — nichts von Google Fonts.
   · Die Datei wird NACH dem Inline-CSS der Seite geladen und überschreibt
     gezielt; Seiten tragen data-tp="…" am <body>, damit nichts querschlägt.
   ============================================================================ */

/* ── Schriften (einmal, zentral) ─────────────────────────────────────────── */
@font-face {
  font-family: 'Inter';
  src: url('/fonts/Inter-Variable-100-900.woff2') format('woff2');
  font-weight: 100 900; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Bebas Neue';
  src: url('/fonts/BebasNeue-Regular.woff2') format('woff2');
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Cormorant Garamond';
  src: url('/fonts/CormorantGaramond-Italic400.woff2') format('woff2');
  font-weight: 300 700; font-style: italic; font-display: swap;
}
@font-face {
  font-family: 'Cormorant Garamond';
  src: url('/fonts/CormorantGaramond-Regular-300-700.woff2') format('woff2');
  font-weight: 300 700; font-style: normal; font-display: swap;
}

/* ── Tokens ──────────────────────────────────────────────────────────────── */
:root {
  --tp-sans:    'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --tp-display: 'Bebas Neue', 'Inter', sans-serif;
  --tp-serif:   'Cormorant Garamond', Georgia, serif;

  --tp-ink:     #F5F1E8;                 /* Headline-Farbe auf Dunkel */
  --tp-gold:    #C8A96E;
  --tp-gold-l:  #E0C490;

  /* Größenstaffel (Handy → Desktop) */
  --tp-h1:      clamp(32px, 8vw, 54px);   /* Seitentitel      · 500 · −0.022em · 1.08 */
  --tp-h1-xl:   clamp(34px, 9vw, 72px);   /* große Bühnen-H1  · 500 · −0.025em · 1.04 */
  --tp-h2:      clamp(23px, 5.6vw, 30px); /* Sektions-Titel   · 500 · −0.012em · 1.2  */
  --tp-h3:      16.5px;                   /* Karten-Titel     · 600 ·  0       · 1.3  */
  --tp-lede:    clamp(16px, 4.2vw, 18.5px);
  --tp-body:    16px;                     /* Fließtext        · 400 · 1.7 */
  --tp-small:   13.5px;
  --tp-micro:   11.5px;
  --tp-eyebrow: 10.5px;                   /* Versalien        · 500 · .32em */
  --tp-menu:    clamp(27px, 7vw, 38px);   /* Overlay-Menü     · 500 · −0.012em · 1.28 */
}

/* ── Basis ───────────────────────────────────────────────────────────────── */
html {
  -webkit-text-size-adjust: 100%;
  /* Kein künstliches Fett mehr: Bebas hat nur 400, Inter/Cormorant sind
     echte Variable-Fonts. Kursiv bleibt synthetisierbar (<em> in Inter). */
  font-synthesis-weight: none;
}
body {
  font-family: var(--tp-sans);
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}
/* Formularelemente erben die Seitenschrift (bisher Arial in Golden Moments) */
button, input, select, textarea { font-family: inherit; }

/* Bausteine — neutral benannt, damit neue Seiten sie direkt nutzen können */
.tp-eyebrow, .tp-eyebrow-gold {
  font-family: var(--tp-sans); font-weight: 500; font-size: var(--tp-eyebrow);
  letter-spacing: .32em; text-transform: uppercase; line-height: 1;
}
.tp-eyebrow-gold { color: var(--tp-gold); }
.tp-h1 { font-family: var(--tp-sans); font-weight: 500; font-size: var(--tp-h1); line-height: 1.08; letter-spacing: -.022em; color: var(--tp-ink); text-wrap: balance; }
.tp-h2 { font-family: var(--tp-sans); font-weight: 500; font-size: var(--tp-h2); line-height: 1.2;  letter-spacing: -.012em; color: var(--tp-ink); text-wrap: balance; }
.tp-h3 { font-family: var(--tp-sans); font-weight: 600; font-size: var(--tp-h3); line-height: 1.3; }
.tp-kicker { font-family: var(--tp-serif); font-style: italic; font-weight: 400; font-size: clamp(20px, 5vw, 23px); line-height: 1.3; color: var(--tp-gold-l); }
.tp-wordmark { font-family: var(--tp-display); font-weight: 400; letter-spacing: .2em; }
.tp-num { font-variant-numeric: tabular-nums; letter-spacing: -.02em; }

/* ============================================================================
   GUIDE-VORLAGE  (data-tp="guide") — FAQ, Golden-Flame-Seite, alle Guides,
   Guide-Übersicht. Gleiche Selektoren wie im Seiten-CSS, deshalb greift es
   ohne Änderung an den Seiten selbst.
   ============================================================================ */
[data-tp="guide"] h1 {
  font-family: var(--tp-sans); font-weight: 500; font-size: var(--tp-h1);
  line-height: 1.08; letter-spacing: -.022em; text-transform: none; text-wrap: balance;
  background: none; -webkit-text-fill-color: currentColor; color: var(--tp-ink);
}
[data-tp="guide"] h2 {
  font-family: var(--tp-sans); font-weight: 500; font-size: var(--tp-h2);
  line-height: 1.2; letter-spacing: -.012em; text-transform: none; text-wrap: balance;
  color: var(--tp-ink);
}
[data-tp="guide"] h3 { font-family: var(--tp-sans); font-weight: 600; font-size: var(--tp-h3); line-height: 1.3; letter-spacing: 0; }
[data-tp="guide"] .eyebrow { font-family: var(--tp-sans); font-weight: 500; font-size: var(--tp-eyebrow); letter-spacing: .32em; text-transform: uppercase; }
[data-tp="guide"] .lede { font-weight: 400; font-size: var(--tp-lede); line-height: 1.6; }
[data-tp="guide"] .kicker { font-family: var(--tp-serif); font-style: italic; font-weight: 400; font-size: clamp(20px, 5vw, 23px); line-height: 1.3; }
[data-tp="guide"] p { font-size: var(--tp-body); }
[data-tp="guide"] p.small { font-size: var(--tp-small); }
[data-tp="guide"] strong { font-weight: 600; }
[data-tp="guide"] summary { font-family: var(--tp-sans); font-weight: 500; font-size: 16px; line-height: 1.4; }
[data-tp="guide"] summary::after { font-family: var(--tp-sans); font-weight: 300; }

/* Zahlen und Akzente, die bisher in Bebas standen */
[data-tp="guide"] .step .n { font-family: var(--tp-sans); font-weight: 500; font-size: 22px; line-height: 1.15; letter-spacing: -.02em; font-variant-numeric: tabular-nums; min-width: 30px; padding-top: 1px; }
[data-tp="guide"] .stat b { font-family: var(--tp-sans); font-weight: 600; font-size: clamp(19px, 5vw, 22px); line-height: 1; letter-spacing: -.02em; font-variant-numeric: tabular-nums; white-space: nowrap; }
[data-tp="guide"] .fact .val { font-family: var(--tp-sans); font-weight: 600; font-size: 22px; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
[data-tp="guide"] .card-nr { font-family: var(--tp-sans); font-weight: 500; font-size: 40px; letter-spacing: -.03em; line-height: 1; font-variant-numeric: tabular-nums; }
[data-tp="guide"] .time-chip { font-family: var(--tp-sans); font-weight: 500; font-size: 15px; letter-spacing: .02em; font-variant-numeric: tabular-nums; }
[data-tp="guide"] .cafe-mono { font-family: var(--tp-sans); font-weight: 500; font-size: 18px; letter-spacing: -.01em; }
[data-tp="guide"] .time { font-family: var(--tp-sans); font-weight: 500; font-size: 11px; letter-spacing: .24em; text-transform: uppercase; }
[data-tp="guide"] .recipe h3 { font-size: 20px; letter-spacing: -.01em; }
[data-tp="guide"] .cat-head h3 { font-size: 18px; letter-spacing: -.01em; }
[data-tp="guide"] .shot-title { font-family: var(--tp-sans); font-weight: 500; font-size: 24px; letter-spacing: -.02em; line-height: 1.15; }
[data-tp="guide"] .mode-card b { font-family: var(--tp-sans); font-weight: 600; font-size: 17px; letter-spacing: 0; }
[data-tp="guide"] .q-text { font-family: var(--tp-sans); font-weight: 500; font-size: clamp(21px, 5.4vw, 28px); line-height: 1.25; letter-spacing: -.015em; }
[data-tp="guide"] .result h2 { font-size: clamp(26px, 6.5vw, 36px); line-height: 1.1; letter-spacing: -.02em; }

/* Buttons, Entdecken-Block, Fußzeile */
[data-tp="guide"] .btn { font-family: var(--tp-sans); font-weight: 500; font-size: 12.5px; letter-spacing: .16em; }
[data-tp="guide"] .faya-discover__label { font-weight: 500; font-size: var(--tp-eyebrow); letter-spacing: .3em; }
[data-tp="guide"] .faya-discover__links a { font-size: var(--tp-small); letter-spacing: 0; line-height: 1.5; }
[data-tp="guide"] footer.legal { font-size: 12px; letter-spacing: .02em; }
[data-tp="guide"] .nav-back { font-weight: 500; }

/* Markenseite: „Golden Flame“ bleibt als Wortmarke in Bebas (weiß statt Gold-Verlauf, wie im Prototyp) */
[data-tp="guide"][data-tp-brand-h1] h1 {
  font-family: var(--tp-display); font-weight: 400; font-size: clamp(60px, 15vw, 112px);
  line-height: .9; letter-spacing: .03em; color: #fff; -webkit-text-fill-color: #fff;
}

/* ============================================================================
   TOOL-VORLAGE  (data-tp="tool") — Party-Quiz, Party-Horoskop,
   Getting-Ready-Timer, Sommer-Outfits
   ============================================================================ */
[data-tp="tool"] h1 {
  font-family: var(--tp-sans); font-weight: 500; font-size: var(--tp-h1);
  line-height: 1.08; letter-spacing: -.022em; text-transform: none; text-wrap: balance;
  background: none; -webkit-text-fill-color: currentColor;
}
[data-tp="tool"] h2, [data-tp="tool"] .seo h2, [data-tp="tool"] .plan-head h2 {
  font-family: var(--tp-sans); font-weight: 500; font-size: var(--tp-h2);
  line-height: 1.2; letter-spacing: -.012em; text-transform: none; text-wrap: balance;
}
[data-tp="tool"] .card h2 { font-family: var(--tp-sans); font-weight: 500; font-size: clamp(24px, 6vw, 32px); line-height: 1.12; letter-spacing: -.018em; }
[data-tp="tool"] .result h2 { font-family: var(--tp-sans); font-weight: 500; font-size: clamp(26px, 6.5vw, 36px); line-height: 1.1; letter-spacing: -.02em; }
[data-tp="tool"] .q-text { font-family: var(--tp-sans); font-weight: 500; font-size: clamp(21px, 5.4vw, 28px); line-height: 1.25; letter-spacing: -.015em; }
[data-tp="tool"] h3 { font-family: var(--tp-sans); font-weight: 600; letter-spacing: 0; }
[data-tp="tool"] summary::after { font-family: var(--tp-sans); font-weight: 300; font-size: 22px; }
[data-tp="tool"] .st-time { font-family: var(--tp-sans); font-weight: 500; font-size: 17px; letter-spacing: -.01em; font-variant-numeric: tabular-nums; }
[data-tp="tool"] .plan-foot { font-family: var(--tp-sans); font-weight: 500; font-size: var(--tp-eyebrow); letter-spacing: .3em; text-transform: uppercase; }
[data-tp="tool"] .eyebrow { font-family: var(--tp-sans); font-weight: 500; font-size: var(--tp-eyebrow); letter-spacing: .32em; text-transform: uppercase; }
[data-tp="tool"] .kicker { font-family: var(--tp-serif); font-style: italic; font-weight: 400; font-size: clamp(20px, 5vw, 23px); line-height: 1.3; }

/* ============================================================================
   STARTSEITE  (data-tp="start")
   ============================================================================ */
/* Overlay-Menü: Variante „B Inter“ aus dem Prototyp */
[data-tp="start"] .overlay-menu > a {
  font-family: var(--tp-sans); font-weight: 500; font-size: var(--tp-menu);
  line-height: 1.28; letter-spacing: -.012em; padding: 4px 0; white-space: normal;
  color: rgba(255,255,255,.92);
}
[data-tp="start"] .overlay-menu > a:hover { letter-spacing: -.012em; color: var(--tp-gold-l); }
[data-tp="start"] .om-label { font-family: var(--tp-sans); font-weight: 500; font-size: 10px; letter-spacing: .42em; }
[data-tp="start"] .overlay-menu-bottom a { font-weight: 400; font-size: 11px !important; letter-spacing: .2em !important; }
@media (min-width: 1024px) {
  [data-tp="start"] .overlay-menu > a { font-size: 40px; }
}
/* Sektionen: Event-Namen bleiben Bebas (stehen für das Logo), Copy 400 */
[data-tp="start"] .event-name { font-weight: 400; }  /* bisher UA-Bold → Faux-Bold auf Bebas; Prototyp = 400 */
[data-tp="start"] .hero-tagline { font-family: var(--tp-sans); font-weight: 400; }
[data-tp="start"] .event-copy { font-weight: 400; }
/* Partner: Sektions-Titel ins System (Inter 500), Eyebrow gesperrt in Gold */
[data-tp="start"] .partners-title {
  font-family: var(--tp-sans); font-style: normal; font-weight: 500; font-size: var(--tp-h2);
  line-height: 1.2; letter-spacing: -.012em; text-wrap: balance;
}
[data-tp="start"] .partners-eyebrow { font-weight: 500; letter-spacing: .32em; }
[data-tp="start"] .partner-tag { font-weight: 500; }
/* Pills: auf dem Desktop eine Stufe größer (M5) */
@media (min-width: 1024px) {
  [data-tp="start"] .action-pill { font-size: 11.5px; letter-spacing: .16em; padding: 13px 24px; font-weight: 500; }
}

/* ============================================================================
   TICKETS  (data-tp="tickets")
   ============================================================================ */
[data-tp="tickets"] .title, [data-tp="tickets"] .live-headline {
  font-family: var(--tp-sans); font-weight: 500; font-size: clamp(30px, 7.4vw, 58px);
  line-height: 1.08; letter-spacing: -.022em; text-wrap: balance;
}
[data-tp="tickets"] .until-title {
  font-family: var(--tp-sans); font-weight: 500; font-size: clamp(24px, 5.8vw, 32px);
  line-height: 1.2; letter-spacing: -.015em;
}

/* ============================================================================
   GALERIE  (data-tp="galerie")  ·  GALERIE-EVENT  (data-tp="galerie-event")
   ============================================================================ */
[data-tp="galerie"] .hero-brand { font-family: var(--tp-sans); font-weight: 500; font-size: var(--tp-eyebrow); letter-spacing: .32em; text-transform: uppercase; }
[data-tp="galerie"] .hero-title {
  font-family: var(--tp-sans); font-weight: 500; font-size: clamp(32px, 7.4vw, 58px);
  line-height: 1.06; letter-spacing: -.022em; white-space: normal;
}
[data-tp="galerie"] .card-title { font-family: var(--tp-sans); font-weight: 500; font-size: 16px; line-height: 1.2; letter-spacing: -.01em; }

[data-tp="galerie-event"] .hero-title {
  font-family: var(--tp-sans); font-weight: 500; font-size: clamp(30px, 7vw, 60px);
  line-height: 1.06; letter-spacing: -.022em; text-wrap: balance;
}
[data-tp="galerie-event"] .gi-moment-title {
  font-family: var(--tp-sans); font-weight: 500; font-size: clamp(26px, 6.5vw, 44px);
  line-height: 1.1; letter-spacing: -.015em; text-transform: none;
}
[data-tp="galerie-event"] .gal-next h2 {
  font-family: var(--tp-sans); font-weight: 500; font-size: var(--tp-h2);
  line-height: 1.2; letter-spacing: -.012em;
}

/* ============================================================================
   GOLDEN MOMENTS  (data-tp="moments")
   ============================================================================ */
[data-tp="moments"] .hero-title {
  font-family: var(--tp-sans); font-weight: 500; font-size: var(--tp-h1-xl);
  line-height: 1.04; letter-spacing: -.025em; text-transform: none;
}
[data-tp="moments"] .sheet h2 { font-family: var(--tp-sans); font-weight: 500; font-size: clamp(24px, 6vw, 32px); line-height: 1.15; letter-spacing: -.015em; }
[data-tp="moments"] .success-state h3, [data-tp="moments"] .confirm-box h3, [data-tp="moments"] .del-sheet h3 {
  font-family: var(--tp-sans); font-weight: 500; font-size: clamp(22px, 5.5vw, 28px); line-height: 1.2; letter-spacing: -.015em;
}

/* ============================================================================
   AFTERMOVIES  (data-tp="aftermovies")
   ============================================================================ */
[data-tp="aftermovies"] .hero-brand, [data-tp="aftermovies"] .outro-brand {
  font-family: var(--tp-sans); font-weight: 500; font-size: var(--tp-eyebrow); letter-spacing: .32em; text-transform: uppercase;
}
[data-tp="aftermovies"] h1 { font-family: var(--tp-sans); font-weight: 500; font-size: clamp(32px, 8vw, 56px); line-height: 1.06; letter-spacing: -.022em; }
[data-tp="aftermovies"] .year-mark span { font-family: var(--tp-sans); font-weight: 500; font-size: clamp(22px, 4.2vw, 32px); line-height: 1; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
[data-tp="aftermovies"] .reel-title { font-family: var(--tp-sans); font-weight: 500; font-size: clamp(19px, 4.4vw, 26px); line-height: 1.2; letter-spacing: -.012em; }
[data-tp="aftermovies"] .outro h2 { font-family: var(--tp-sans); font-weight: 500; font-size: clamp(26px, 6.5vw, 40px); line-height: 1.1; letter-spacing: -.02em; }

/* ============================================================================
   ENGEL & FLAMME  (data-tp="ef") — Cormorant bleibt die Markenstimme,
   nur die Bebas-Reste (Kartenlabel, Grad-Zahl) wechseln zu Inter.
   ============================================================================ */
[data-tp="ef"] .card .k { font-family: var(--tp-sans); font-weight: 500; font-size: 11px; letter-spacing: .24em; text-transform: uppercase; }
[data-tp="ef"] .serve .item .n { font-family: var(--tp-sans); font-weight: 500; font-size: 26px; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }

/* ============================================================================
   COMMUNITY-HUB  (data-tp="hub")  ·  Textseiten  (data-tp="page")
   App, EULA, Nutzungsbedingungen, Community, App-Datenschutz
   ============================================================================ */
[data-tp="hub"] .hub-headline { font-family: var(--tp-sans); font-weight: 500; font-size: var(--tp-h1-xl); line-height: 1.04; letter-spacing: -.025em; }
[data-tp="hub"] .event-card-title { font-family: var(--tp-sans); font-weight: 500; font-size: clamp(22px, 5.5vw, 34px); line-height: 1.1; letter-spacing: -.018em; }
[data-tp="hub"] .app-cta-headline { font-family: var(--tp-sans); font-weight: 500; font-size: clamp(28px, 7vw, 48px); line-height: 1.08; letter-spacing: -.02em; }
[data-tp="hub"] .galerie-banner-title { font-family: var(--tp-sans); font-weight: 500; font-size: 22px; letter-spacing: -.012em; }

[data-tp="page"] .page-title {
  font-family: var(--tp-sans); font-weight: 500; font-size: clamp(30px, 7vw, 46px);
  line-height: 1.1; letter-spacing: -.022em; text-transform: none; text-wrap: balance;
}

/* ============================================================================
   RECHTSTEXTE  (data-tp="legal") — Impressum, Datenschutz
   ============================================================================ */
[data-tp="legal"] h1 {
  font-family: var(--tp-sans); font-weight: 500; font-size: clamp(28px, 6.5vw, 38px);
  line-height: 1.1; letter-spacing: -.02em; text-transform: none; color: var(--tp-ink);
  overflow-wrap: anywhere;
}
[data-tp="legal"] h2 { font-family: var(--tp-sans); font-weight: 500; font-size: 11px; letter-spacing: .2em; }
[data-tp="legal"] .faya-seo-discover { font-family: inherit; }

/* ============================================================================
   „Passende Guides“-Block auf den Tool-Seiten (haben das Guide-CSS nicht)
   ============================================================================ */
[data-tp="tool"] .faya-discover { max-width: 820px; margin: 0 auto; padding: 34px 22px 46px; border-top: 1px solid rgba(240,216,168,.10); }
[data-tp="tool"] .faya-discover__label { font-family: var(--tp-sans); font-weight: 500; font-size: var(--tp-eyebrow); letter-spacing: .3em; text-transform: uppercase; color: rgba(200,169,110,.6); margin: 0 0 14px; }
[data-tp="tool"] .faya-discover__links { display: flex; flex-wrap: wrap; gap: 12px 22px; }
[data-tp="tool"] .faya-discover__links a { font-family: var(--tp-sans); font-size: var(--tp-small); line-height: 1.5; color: rgba(245,241,232,.5); text-decoration: none; transition: color .2s; }
[data-tp="tool"] .faya-discover__links a:hover { color: var(--tp-gold-l); }

/* Link-Streifen unter Galerie und Aftermovies: Sentence Case statt 8-px-Versalien */
[data-tp="galerie"] .next-bar a, [data-tp="galerie"] .legal-bar a { font-size: 12.5px; letter-spacing: .02em; text-transform: none; }
[data-tp="galerie"] .next-bar .nb-dot, [data-tp="galerie"] .legal-bar .nb-dot { font-size: 12.5px; }
[data-tp="galerie"] .next-bar .nb-label { font-family: var(--tp-sans); font-weight: 500; font-size: var(--tp-eyebrow); letter-spacing: .3em; text-transform: uppercase; }
[data-tp="aftermovies"] .more-bar a { font-size: 12.5px; letter-spacing: .02em; text-transform: none; }
[data-tp="aftermovies"] .more-bar .mb-dot { font-size: 12.5px; }
[data-tp="aftermovies"] .more-bar .mb-label { font-weight: 500; font-size: var(--tp-eyebrow); letter-spacing: .3em; }

/* ============================================================================
   MINDESTMASSE v5 (01.10.2026) — nur additiv, eigener Block für leichte Merges
   ----------------------------------------------------------------------------
   Mikrotext/Meta ≥ 12 px · Links ≥ 13 px · Tap-Flächen ≥ 44 px (über Padding/
   min-height, nicht über Schriftgröße). Versalien-Laufweite nur bei Eyebrows.
   Gilt für Secret Flame Gate + Brief, Bewerbung, Einladung (data-tp="secret")
   und Tickets (data-tp="tickets"). Farben/Schriften bleiben, wie sie sind —
   nur zu blasse Rechtslinks werden lesbar.
   ============================================================================ */
/* Secret Flame · Gate */
[data-tp="secret"] .gate-eyebrow { font-size: 12px; letter-spacing: .42em; }
[data-tp="secret"] .gate-value { font-size: 12px; letter-spacing: .14em; }
[data-tp="secret"] .gate-cta { font-size: 15px; letter-spacing: .2em; }
[data-tp="secret"] .gate-cta:hover { letter-spacing: .24em; }
[data-tp="secret"] .gate-footer {
  display: inline-flex; align-items: center; min-height: 44px; margin-top: 18px;
  font-size: 13px; letter-spacing: .04em; text-transform: none; color: rgba(255,255,255,.5);
}
[data-tp="secret"] .gate-legal,
[data-tp="secret"] .inv-legal,
[data-tp="secret"] .page-legal { font-size: 12px; letter-spacing: .02em; text-transform: none; color: rgba(255,255,255,.3); }
[data-tp="secret"] .gate-legal,
[data-tp="secret"] .page-legal { margin-top: 0; }
[data-tp="secret"] .gate-legal a,
[data-tp="secret"] .inv-legal a,
[data-tp="secret"] .page-legal a { display: inline-flex; align-items: center; min-height: 44px; padding: 0; color: rgba(255,255,255,.48); }
[data-tp="secret"] .gate-legal,
[data-tp="secret"] .inv-legal,
[data-tp="secret"] .page-legal { display: flex; flex-wrap: wrap; justify-content: center; column-gap: 16px; }
[data-tp="secret"] .gate-error { font-size: 13px; }
[data-tp="secret"] .gate-btn { font-size: 13px; letter-spacing: .24em; }
/* Secret Flame · Brief (Event-Modus) */
[data-tp="secret"] .tap-label,
[data-tp="secret"] #soundOv,
[data-tp="secret"] #scrollCue { font-size: 12px; letter-spacing: .2em; }
[data-tp="secret"] .section-eye,
[data-tp="secret"] .info-lbl,
[data-tp="secret"] .inv-footer { font-size: 12px; letter-spacing: .28em; }
/* Bewerbung */
[data-tp="secret"] .back {
  min-height: 44px; margin-bottom: 28px; padding-right: 8px;
  font-size: 13px; letter-spacing: .04em; text-transform: none;
}
[data-tp="secret"] .eyebrow { font-size: 12px; letter-spacing: .4em; }
[data-tp="secret"] .form-grid label,
[data-tp="secret"] .ig-label { font-size: 12px; letter-spacing: .16em; }
[data-tp="secret"] .ap-pill { font-size: 14px; letter-spacing: .02em; text-transform: none; }
[data-tp="secret"] .field-error { font-size: 13px; letter-spacing: 0; }
[data-tp="secret"] .legal-note { font-size: 13px; letter-spacing: 0; max-width: 36ch; }
[data-tp="secret"] .page-footer {
  display: inline-flex; align-items: center; min-height: 44px; margin-top: 26px;
  font-size: 13px; letter-spacing: .04em; text-transform: none; color: rgba(255,255,255,.45);
}
[data-tp="secret"] .success-sub { font-size: 14px; letter-spacing: 0; line-height: 1.7; }
/* Einladung */
[data-tp="secret"] .inv-eyebrow,
[data-tp="secret"] .inv-selected,
[data-tp="secret"] .inv-info-lbl { font-size: 12px; letter-spacing: .3em; }
[data-tp="secret"] .inv-app-hint { font-size: 13px; letter-spacing: 0; }
[data-tp="secret"] .error-sub { font-size: 14px; letter-spacing: 0; line-height: 1.6; }

/* Tickets */
[data-tp="tickets"] .nav-back { min-height: 44px; font-size: 13px; letter-spacing: .04em; text-transform: none; }
[data-tp="tickets"] .cd-lbl { font-size: 12px; letter-spacing: 0; text-transform: none; }
[data-tp="tickets"] .reminder-hint,
[data-tp="tickets"] .footer-newsletter-label,
[data-tp="tickets"] .footer-newsletter-hint { font-size: 13px; letter-spacing: 0; }
[data-tp="tickets"] .event-meta-soon,
[data-tp="tickets"] .until-label,
[data-tp="tickets"] .ug-guide-tag { font-size: 12px; letter-spacing: .24em; }
[data-tp="tickets"] .scroll-hint { min-height: 44px; justify-content: flex-end; font-size: 13px; letter-spacing: .16em; color: rgba(255,255,255,.6); }
[data-tp="tickets"] .ug-caption { font-size: 12.5px; letter-spacing: 0; }
[data-tp="tickets"] .until-credits { font-size: 12px; }
[data-tp="tickets"] .until-gallery-cta { height: 46px; font-size: 13px; letter-spacing: .04em; text-transform: none; }
[data-tp="tickets"] .until-legal { font-size: 12px; }
[data-tp="tickets"] .until-legal a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 3px; }

/* Cookie-Banner (cookie-consent.js setzt html.faya-cc-open + --faya-cc-h):
   Inhalte auf diesen Seiten rutschen über den Banner statt darunter. */
html.faya-cc-open body[data-tp="secret"],
html.faya-cc-open body[data-tp="tickets"] { padding-bottom: var(--faya-cc-h, 0px); }
html.faya-cc-open body[data-tp="secret"] #gate { justify-content: flex-start; padding-bottom: calc(var(--faya-cc-h, 0px) + 8px); }
html.faya-cc-open body[data-tp="secret"] .gate-inner { margin-block: auto; }
/* ── Ende MINDESTMASSE v5 ── */
