/* design2027-landing.css v1 (31.10.2026) – Design 2027 für die 60 Landingpages (40 Stadtseiten eventverleih-*.html, 20 Anlass-Seiten).
   Lädt NACH schmidtson-landingpage.css und stadt-karten.css und übersteuert nur Farben, Schrift und Kopf/Hero/Fuß.
   Texte, Links, JSON-LD, Preise (daten.js/gesamtpreis.js) bleiben unverändert. Gelb #FFC629 nur für Knöpfe und Akzente auf Dunkelblau,
   nie als Fließtext und nie auf Weiß (Kontrast 1,57:1). Links auf hellem Grund Blau #1F5FA8 (5,9:1), Fließtext #0B2A4A, Nebentext #4A5568 (7,5:1). */

:root{
  --schwarz:#071D35;--flaeche:#FFFFFF;--karte:#FFFFFF;--linie:#DCE4EE;
  --gold:#FFC629;--gold-hell:#FFD45C;--gold-dunkel:#E0AA00;
  --text:#0B2A4A;--muted:#4A5568;
  --d27-blau:#0B2A4A;--d27-tief:#071D35;--d27-hell:#EAF2FB;--d27-link:#1F5FA8;--d27-karte:#12365E
}
body{background:#fff;color:var(--text)}
h1,h2,h3{font-family:"DM Sans",system-ui,sans-serif;font-weight:500;letter-spacing:0}
a{color:var(--d27-link)}
:focus-visible{outline-color:var(--d27-link)}
.eyebrow{color:var(--d27-link)}

/* Kopf: dunkelblau, Logo, Anfrage als gelber Knopf */
.kopf{background:var(--d27-tief);border-bottom:0}
.kopf .wrap{max-width:1160px;padding-top:10px;padding-bottom:10px;gap:12px}
.marke{display:inline-flex;align-items:center;gap:.6rem;font-family:"DM Sans",sans-serif;font-weight:500;color:#fff;font-size:1rem;min-height:44px}
.marke img{width:40px;height:auto;border-radius:6px;background:#fff;padding:2px;flex:none}
.kopf .marke{color:#fff}  /* Prüfer 31.10.: stadt-karten.css .kopf .marke war stärker */
.kopf nav{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem .6rem}
.kopf nav a{color:#fff;margin-left:0;padding:.45rem .6rem;font-size:.9rem;white-space:nowrap}
.kopf nav a:hover{color:var(--gold)}
.kopf nav a:last-child{background:var(--gold);color:var(--d27-blau);border-radius:8px;padding:.5rem 1rem;font-weight:500}
.kopf nav a:last-child:hover{background:var(--gold-hell);color:var(--d27-blau)}

/* Hero: Foto Sternenzelt (wie Startseite) mit dunklem Verlauf, Text links */
.hero{color:#fff;border-bottom:0;padding:72px 0 56px;
  background:linear-gradient(90deg,rgba(7,29,53,.95) 0%,rgba(7,29,53,.8) 40%,rgba(7,29,53,.3) 75%,rgba(7,29,53,.15) 100%),
    url(../img/design2027-hero-sternenzelt.webp) center 45%/cover no-repeat var(--d27-blau)}
.hero .wrap{max-width:1160px}
.hero .eyebrow{color:var(--gold)}
.hero h1{color:#fff;max-width:18ch;line-height:1.1}
.hero p.sub{color:#E6EDF5}
.hero .reserv{background:rgba(7,29,53,.72);border:1px solid rgba(255,255,255,.22);color:#fff;font-weight:500;margin-top:14px}
.hero .btn{background:var(--gold);color:var(--d27-blau);font-weight:500}
.hero .btn:hover{background:var(--gold-hell);color:var(--d27-blau)}
.hero .btn-neben{background:transparent;color:#fff;border-color:#fff}
.hero .btn-neben:hover{background:#fff;color:var(--d27-blau)}

/* Knöpfe im Inhalt */
.btn{background:var(--gold);color:var(--d27-blau);font-weight:500}
.btn:hover{background:var(--gold-hell);color:var(--d27-blau)}
.btn:focus-visible{outline:3px solid var(--d27-link);outline-offset:3px}
.btn-neben{color:var(--d27-blau);border-color:var(--d27-blau)}
.btn-neben:hover{background:var(--d27-blau);color:#fff}
.stadt-karte .btn,.hero .btn{background:var(--gold);color:var(--d27-blau)}
.stadt-karte .btn:hover,.hero .btn:hover{background:var(--gold-hell);color:var(--d27-blau)}

/* Abschnitte, Listen, Karten */
.abschnitt .wrap,.hero .wrap{max-width:1160px}
h2.abschnitt,.abschnitt h2{color:var(--d27-blau)}
.abschnitt p.satz,.preis-note,.stadt-karte .satz{color:var(--muted);opacity:1}
.details li{border-bottom-color:var(--linie)}
.details li::before{color:var(--d27-link)}
.stadt-raster{gap:18px}
.stadt-karte{background:#fff;border:1px solid var(--linie);border-radius:12px;box-shadow:0 6px 18px rgba(11,42,74,.08)}
.stadt-karte:hover{border-color:var(--d27-link);transform:translateY(-2px)}
.stadt-karte h3{color:var(--d27-blau)}
.stadt-karte .preis{color:var(--d27-blau);font-weight:500}
.stadt-karte .preis-inkl{color:var(--muted)}
.stadt-karte .aktion .stadt-mehr,.stadt-karte .stadt-mehr{color:var(--d27-link);opacity:1}
.stadt-karte .aktion .stadt-mehr:hover,.stadt-karte .stadt-mehr:hover{color:var(--d27-blau)}
.anlass-chips a,.verwandt a{background:#fff;border-color:var(--linie);color:var(--d27-blau)}
.anlass-chips a:hover,.verwandt a:hover{border-color:var(--d27-link);color:var(--d27-link)}
.preis-karte{background:var(--d27-hell);border-color:var(--linie)}
.preis-karte .preis{color:var(--d27-blau);font-family:"DM Sans",sans-serif}
.preis-karte .preis small{color:var(--muted)}
.produktfoto{box-shadow:0 6px 18px rgba(11,42,74,.12)}
.foto{border-color:var(--linie);background:var(--d27-hell);color:var(--muted)}

/* FAQ-Aufklapper wie auf den Artikelseiten (blauer Kreis, gelbes Plus) */
.faq details{background:#fff;border:1px solid var(--linie);border-radius:12px}
.faq summary{color:var(--d27-blau);font-weight:500;display:flex;align-items:center;justify-content:space-between;gap:1rem}
.faq summary::after{float:none;flex:none;width:1.8rem;height:1.8rem;border-radius:50%;background:var(--d27-blau);color:var(--gold);display:flex;align-items:center;justify-content:center;font-size:1.2rem;line-height:1}
.faq details[open] summary::after{content:"\2212"}
.faq details p{color:var(--muted)}

/* Fuß */
footer{background:var(--d27-tief);color:#C3D0E0;border-top:0}
footer .wrap{max-width:1160px;border-top:0}
footer a{color:#fff}
footer a:hover{color:var(--gold)}

@media (max-width:700px){
  .kopf .wrap{flex-wrap:wrap}
  .kopf nav a{padding:.35rem .4rem;font-size:.86rem}
  .hero{padding:48px 0 40px;
    background:linear-gradient(180deg,rgba(7,29,53,.55) 0%,rgba(7,29,53,.88) 40%,var(--d27-tief) 100%),
      url(../img/design2027-hero-sternenzelt.webp) center top/auto 300px no-repeat var(--d27-tief)}
  .hero .eyebrow{margin-top:120px;display:block}
}