/* ============================================================
   Mehrere Seiten (25.10.2026): Sichtbarkeit je Seite + Seitenkopf
   html[data-seite] setzt seite.php; ohne Attribut bleibt alles wie bisher.
   ============================================================ */
html[data-seite] .seite-aus { display: none !important; }

/* Startseite: Angebote, Fragen und Formular stehen auf eigenen Seiten */
html[data-seite="start"] #angebote,
html[data-seite="start"] #fragen,
html[data-seite="start"] #kontakt { display: none; }

/* Angebotsseiten */
html[data-seite="buffets"] #hero, html[data-seite="fingerfood"] #hero, html[data-seite="suppen-salate-desserts"] #hero,
html[data-seite="buffets"] #ueber-uns, html[data-seite="fingerfood"] #ueber-uns, html[data-seite="suppen-salate-desserts"] #ueber-uns,
html[data-seite="buffets"] #fragen, html[data-seite="fingerfood"] #fragen, html[data-seite="suppen-salate-desserts"] #fragen,
html[data-seite="buffets"] #kontakt, html[data-seite="fingerfood"] #kontakt, html[data-seite="suppen-salate-desserts"] #kontakt,
html[data-seite="buffets"] #referenzen, html[data-seite="fingerfood"] #referenzen, html[data-seite="suppen-salate-desserts"] #referenzen,
html[data-seite="buffets"] #partner, html[data-seite="fingerfood"] #partner, html[data-seite="suppen-salate-desserts"] #partner,
html[data-seite="buffets"] #angebote-headline, html[data-seite="fingerfood"] #angebote-headline, html[data-seite="suppen-salate-desserts"] #angebote-headline,
html[data-seite="buffets"] #angebote-linie, html[data-seite="fingerfood"] #angebote-linie, html[data-seite="suppen-salate-desserts"] #angebote-linie,
html[data-seite="buffets"] .sprung-menue, html[data-seite="fingerfood"] .sprung-menue, html[data-seite="suppen-salate-desserts"] .sprung-menue { display: none; }

/* Anfrage-Seite: nur das Formular */
html[data-seite="anfrage"] #hero, html[data-seite="anfrage"] #ueber-uns, html[data-seite="anfrage"] #angebote,
html[data-seite="anfrage"] #fragen, html[data-seite="anfrage"] #referenzen, html[data-seite="anfrage"] #partner,
html[data-seite="anfrage"] #kontakt-headline, html[data-seite="anfrage"] #kontakt-linie { display: none; }

/* Fragen-Seite: nur die Fragen */
html[data-seite="fragen"] #hero, html[data-seite="fragen"] #ueber-uns, html[data-seite="fragen"] #angebote,
html[data-seite="fragen"] #kontakt, html[data-seite="fragen"] #referenzen, html[data-seite="fragen"] #partner,
html[data-seite="fragen"] #fragen-headline, html[data-seite="fragen"] #fragen-linie { display: none; }

/* Seitenkopf der Unterseiten */
.seitenkopf { display: flex; flex-direction: column; align-items: center; gap: 0.6rem; text-align: center; padding: 2.6rem 1rem 1.8rem; border-bottom: 1px solid rgba(150, 191, 12, 0.35); background: radial-gradient(ellipse at top, rgba(150, 191, 12, 0.12), transparent 70%); }
.seitenkopf-kicker { margin: 0; font-size: 0.8rem; font-weight: bold; letter-spacing: 0.14em; text-transform: uppercase; color: var(--accents); }
.seitenkopf h1 { margin: 0; font-size: clamp(1.7rem, 4.5vw, 2.6rem); line-height: 1.15; color: #fff; text-wrap: balance; }
.seitenkopf-text { margin: 0; max-width: 60ch; color: rgba(250, 250, 247, 0.82); line-height: 1.5; }
#nav .nav-links.aktiv { color: #fff; text-decoration: underline; text-decoration-color: var(--accents); text-underline-offset: 0.35em; }

/* Info-Leiste: Text hell genug (auch auf der Einzelseite) */
.infoleiste li { color: rgba(250, 250, 247, 0.85); }

/* Angebotsseiten: Kategorien sind immer offen – kein Ein-/Ausklappen */
html[data-seite="buffets"] #angebote .einklapp-btn,
html[data-seite="fingerfood"] #angebote .einklapp-btn,
html[data-seite="suppen-salate-desserts"] #angebote .einklapp-btn { display: none; }
html[data-seite="buffets"] #angebote .kategorie-bild,
html[data-seite="fingerfood"] #angebote .kategorie-bild,
html[data-seite="suppen-salate-desserts"] #angebote .kategorie-bild { cursor: default; }

/* Anfrage-Seite: Links zu weiteren Angeboten */
.seiten-mehr { margin: 0.6rem 0 0; font-size: 0.9rem; color: rgba(250, 250, 247, 0.8); }
.seiten-mehr a, #angebote-liste ~ p a { color: var(--accents); }

/* Startseite: Vorschau beliebte Buffets (nur auf der Startseite der neuen Aufteilung) */
#beliebt { display: none; }
html[data-seite="start"] #beliebt { display: flex; flex-direction: column; align-items: center; gap: 1.2rem; max-width: calc(1080px + 2rem); margin: 0 auto; padding: 3rem 1rem 1.5rem; box-sizing: border-box; text-align: center; }
#beliebt h2 { margin: 0; font-size: clamp(1.6rem, 4vw, 2.2rem); color: #fff; }
.beliebt-text { margin: 0; max-width: 60ch; color: rgba(250, 250, 247, 0.8); }
.beliebt-liste { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; width: 100%; }
.beliebt-karte { display: flex; flex-direction: column; background: var(--bg-cards); border: 1px solid rgba(150, 191, 12, 0.3); border-radius: 1rem; overflow: hidden; text-align: left; text-decoration: none; color: var(--txt-color); transition: border-color 0.2s, transform 0.2s; }
.beliebt-karte:hover, .beliebt-karte:focus-visible { border-color: var(--accents); transform: translateY(-2px); }
.beliebt-karte img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; background: #111; }
.beliebt-info { display: flex; flex-direction: column; gap: 0.35rem; padding: 0.9rem 1rem 1.1rem; flex: 1; }
.beliebt-name { font-weight: bold; font-size: 1.05rem; color: #fff; }
.beliebt-inhalt { font-size: 0.85rem; line-height: 1.4; color: rgba(250, 250, 247, 0.75); flex: 1; }
.beliebt-preis { font-weight: bold; color: var(--accents); font-size: 0.95rem; }
.beliebt-weiter { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 0.8rem 1.4rem; }
.beliebt-knopf { display: inline-block; padding: 0.7rem 1.6rem; border-radius: 999px; background: var(--accents); color: #0b0d06; font-weight: bold; text-decoration: none; text-transform: uppercase; letter-spacing: 0.03em; }
.beliebt-weiter a:not(.beliebt-knopf) { color: var(--accents); }
@media (max-width: 900px) { .beliebt-liste { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 420px) { .beliebt-info { padding: 0.7rem 0.75rem 0.9rem; } .beliebt-name { font-size: 0.95rem; } }

/* Referenzen mit drei Fotos (großes links, zwei rechts) + dunkles Logo (25.10.2026) */
.ref-fotos.ref-fotos-3 { grid-template-columns: 2fr 1fr; grid-template-rows: 1fr 1fr; }
.ref-fotos.ref-fotos-3 img:first-child { grid-row: 1 / -1; }
.ref-fotos.ref-fotos-3 img { min-height: 0; }
.ref-logo.ref-logo-dunkel { background: #000; height: 3.4rem; aspect-ratio: 296 / 168; object-fit: cover; padding: 0.15rem 0.4rem; }

/* Handy: Referenzkarten nicht breiter als der Bildschirm (Inhalt zog die Spalte auf 454 px) */
@media (max-width: 820px) {
  .ref-gross, .ref-reihe { grid-template-columns: minmax(0, 1fr); }
  .ref-gross .ref-fotos, .ref-reihe .ref-fotos { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .ref-fotos.ref-fotos-3 { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); }
}

/* Startbild Grillplatte (25.10.2026): weniger abgedunkelt, kein Weichzeichner mehr über dem Foto */
#hero { background-image: linear-gradient(180deg, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0.2) 45%, rgba(0, 0, 0, 0.7) 100%), url("/img/hero-grill.jpg"); background-image: linear-gradient(180deg, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0.2) 45%, rgba(0, 0, 0, 0.7) 100%), image-set(url("/img/hero-grill.webp") type("image/webp"), url("/img/hero-grill.jpg") type("image/jpeg")); background-position: center 55%; }
#hero-content { -webkit-backdrop-filter: none; backdrop-filter: none; background: rgba(0, 0, 0, 0.28); }
#hero-content h1, #hero-content .hero-kicker, #hero-content p { text-shadow: 0 2px 10px rgba(0, 0, 0, 0.85); }
@media (max-width: 700px) {
  #hero { background-image: linear-gradient(180deg, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0.2) 45%, rgba(0, 0, 0, 0.7) 100%), image-set(url("/img/hero-grill-mobil.webp") 1x type("image/webp"), url("/img/hero-grill-mobil.jpg") 1x type("image/jpeg")); }
}

/* Menü einzeilig (25.10.2026) */
#nav .nav-links { white-space: nowrap; }

/* Gratis-Dessert gilt nur für Buffets – auf Seiten ohne Buffets ausblenden (25.10.2026) */
html[data-seite="fingerfood"] .infoleiste-dessert, html[data-seite="suppen-salate-desserts"] .infoleiste-dessert { display: none; }

/* Startseite: Kachel Imbiss & Snacks ohne Foto (25.10.2026) */
.beliebt-imbiss { display: flex; align-items: center; justify-content: space-between; gap: 1rem; width: 100%; box-sizing: border-box; padding: 1rem 1.25rem; background: var(--bg-cards); border: 1px solid rgba(150, 191, 12, 0.3); border-radius: 1rem; text-align: left; text-decoration: none; color: var(--txt-color); transition: border-color 0.2s, transform 0.2s; }
.beliebt-imbiss:hover, .beliebt-imbiss:focus-visible { border-color: var(--accents); transform: translateY(-2px); }
.beliebt-imbiss-text { display: flex; flex-direction: column; gap: 0.3rem; }
.beliebt-imbiss-pfeil { flex: none; font-weight: bold; color: var(--accents); white-space: nowrap; }
@media (max-width: 520px) { .beliebt-imbiss { flex-direction: column; align-items: flex-start; } }

/* Zitat aus der schauinsland-Dankeskarte (25.10.2026) */
.ref-zitat { margin: 0.4rem 0 0.9rem; padding: 0.7rem 0 0.7rem 1rem; border-left: 3px solid var(--accents); }
.ref-zitat p { margin: 0; font-style: italic; color: #fff; line-height: 1.5; }
.ref-zitat footer { margin-top: 0.35rem; font-size: 0.85rem; color: rgba(250, 250, 247, 0.7); }