/* Zum Bierbug – Stylesheet */
:root {
  --holz: #2b1d14;
  --holz-2: #3d2a1d;
  --bernstein: #c8892b;
  --bernstein-hell: #e9b45a;
  --papier: #f8f1e4;
  --papier-2: #efe3cc;
  --tinte: #2a211b;
  --grau: #6e6157;
  --see: #2f5d6b;
  --rad: 14px;
  --schatten: 0 10px 30px rgba(43, 29, 20, .12);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0; background: var(--papier); color: var(--tinte);
  font: 17px/1.6 "Source Sans 3", system-ui, sans-serif;
}
img { max-width: 100%; display: block; }
a { color: var(--see); }
h1, h2, h3 { font-family: "Playfair Display", Georgia, serif; line-height: 1.2; margin: 0 0 .6em; }
h1 { font-size: clamp(2rem, 5vw, 3.4rem); }
h2 { font-size: clamp(1.4rem, 3vw, 1.9rem); }
.wrap { width: min(1120px, 100% - 32px); margin-inline: auto; }
.schmal { max-width: 760px; }
.abschnitt { padding: 56px 0; }
.klein { font-size: .9rem; color: var(--grau); }
.mitte { text-align: center; }

/* Hinweis-Banner aus aktuelles.txt */
.banner { background: var(--bernstein); color: var(--holz); font-size: .95rem; padding: 8px 0; text-align: center; }
.banner span + span::before { content: " · "; }

/* Kopf */
.kopf { background: var(--holz); color: var(--papier); position: sticky; top: 0; z-index: 10; box-shadow: 0 2px 12px rgba(0,0,0,.25); }
.kopf-innen { display: flex; align-items: center; justify-content: space-between; min-height: 72px; flex-wrap: wrap; }
.logo { color: var(--papier); text-decoration: none; display: flex; flex-direction: column; line-height: 1; }
.logo small { font-size: .7rem; letter-spacing: .3em; text-transform: uppercase; color: var(--bernstein-hell); }
.logo span { font-family: "UnifrakturMaguntia", serif; font-size: 2rem; }
.kopf nav { display: flex; gap: 4px; }
.kopf nav a { color: var(--papier); text-decoration: none; padding: 8px 14px; border-radius: 999px; font-weight: 600; }
.kopf nav a:hover { background: var(--holz-2); }
.kopf nav a.aktiv { background: var(--bernstein); color: var(--holz); }
#menu-toggle, .burger { display: none; }
@media (max-width: 820px) {
  .burger { display: flex; flex-direction: column; gap: 5px; cursor: pointer; padding: 10px; }
  .burger i { width: 26px; height: 2px; background: var(--papier); display: block; }
  .kopf nav { display: none; width: 100%; flex-direction: column; padding-bottom: 12px; }
  #menu-toggle:checked ~ nav { display: flex; }
}

/* Held */
.held {
  background: linear-gradient(90deg, rgba(43,29,20,.88) 0%, rgba(43,29,20,.55) 60%, rgba(43,29,20,.2) 100%), var(--bild) center/cover;
  color: var(--papier); padding: clamp(70px, 14vw, 150px) 0;
}
.held-text { max-width: 640px; margin-left: max(16px, (100% - 1120px) / 2); }
.held p { font-size: 1.15rem; }
.vorzeile { text-transform: uppercase; letter-spacing: .2em; font-size: .8rem !important; color: var(--bernstein-hell); }
.knoepfe { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 24px; }
.knopf {
  display: inline-block; background: var(--bernstein); color: var(--holz); text-decoration: none; font-weight: 600;
  padding: 12px 22px; border-radius: 999px; border: 0; font: inherit; font-weight: 600; cursor: pointer;
}
.knopf:hover { background: var(--bernstein-hell); }
.knopf.hell { background: transparent; color: var(--papier); box-shadow: inset 0 0 0 2px var(--papier); }
.pfeil { font-weight: 600; text-decoration: none; }
.pfeil::after { content: " →"; }

/* Raster & Boxen */
.raster-2, .raster-3 { display: grid; gap: 28px; }
.raster-2 { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); }
.raster-3 { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.karte-box { background: #fff; border-radius: var(--rad); padding: 28px; box-shadow: var(--schatten); }
.tipps { list-style: none; padding: 0; margin: 0 0 16px; }
.tipps li { display: flex; justify-content: space-between; gap: 12px; padding: 10px 0; border-bottom: 1px dashed var(--papier-2); }
.hinweis-freitag { background: var(--papier); border-left: 4px solid var(--bernstein); padding: 10px 14px; border-radius: 6px; }

/* Öffnungszeiten */
.zeitraum { margin: 0 0 8px; font-weight: 600; }
.zeiten { border-collapse: collapse; width: 100%; }
.zeiten th { text-align: left; white-space: nowrap; padding: 6px 16px 6px 0; vertical-align: top; }
.zeiten td { padding: 6px 0; }
.zeiten tr.zu td { color: var(--grau); }
.oeffnung.gross .zeiten tr + tr { border-top: 1px solid var(--papier-2); }
.oeffnung.gross .zeiten tr.offen th { color: var(--see); }

/* Kacheln */
.streifen { background: var(--holz); padding: 48px 0; }
.kachel {
  min-height: 200px; border-radius: var(--rad); display: flex; align-items: flex-end; padding: 20px; text-decoration: none;
  background: linear-gradient(to top, rgba(43,29,20,.85), rgba(43,29,20,.05) 70%), var(--bild) center/cover;
  color: var(--papier); font-family: "Playfair Display", serif; font-size: 1.4rem; transition: transform .2s;
}
.kachel:hover { transform: translateY(-4px); }

/* Seitenkopf */
.seitenkopf { background: var(--holz); color: var(--papier); padding: 48px 0 40px; }
.seitenkopf p { color: var(--papier-2); margin: 0; }

/* Speisekarte */
.sprung { display: flex; flex-wrap: wrap; gap: 8px; padding: 20px 0; position: sticky; top: 72px; background: var(--papier); z-index: 5; }
.sprung a { text-decoration: none; padding: 6px 14px; border-radius: 999px; background: #fff; color: var(--tinte); font-size: .92rem; box-shadow: 0 1px 4px rgba(0,0,0,.08); }
.sprung a:hover { background: var(--bernstein); }
.menukarte {
  background: #fffdf8; border-radius: var(--rad); box-shadow: var(--schatten);
  padding: clamp(24px, 5vw, 56px); margin: 8px 0 32px; border: 1px solid var(--papier-2);
}
.kategorie { scroll-margin-top: 140px; }
.kategorie + .kategorie { margin-top: 44px; }
.kategorie h2 { text-align: center; color: var(--holz-2); }
.kategorie h2::after { content: ""; display: block; width: 60px; height: 3px; background: var(--bernstein); margin: 10px auto 0; border-radius: 2px; }
.kategorie ul { list-style: none; padding: 0; margin: 0; }
.kategorie li { display: flex; align-items: baseline; gap: 10px; padding: 12px 0; }
.gericht { flex: 0 1 auto; }
.gericht .name { font-weight: 600; font-size: 1.08rem; }
.gericht .beschr { display: block; color: var(--grau); font-size: .95rem; }
.punkte { flex: 1 1 24px; border-bottom: 2px dotted #cdbfa6; transform: translateY(-5px); min-width: 24px; }
.preis { font-family: "Playfair Display", serif; font-weight: 700; white-space: nowrap; color: var(--holz-2); }

/* Galerie */
.galerie { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 12px; }
.galerie a { aspect-ratio: 1; overflow: hidden; border-radius: 10px; background: var(--papier-2); }
.galerie img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s; }
.galerie a:hover img { transform: scale(1.05); }

/* Termine */
.termine { list-style: none; padding: 0; margin: 0 0 24px; }
.termine li { display: flex; gap: 20px; background: #fff; border-radius: var(--rad); padding: 20px 24px; box-shadow: var(--schatten); margin-bottom: 16px; align-items: center; }
.termine time { font-family: "Playfair Display", serif; font-weight: 700; color: var(--bernstein); min-width: 130px; }
.termine strong { display: block; font-size: 1.2rem; }
.termine span { color: var(--grau); }
@media (max-width: 560px) { .termine li { flex-direction: column; align-items: flex-start; gap: 4px; } }

/* Fuß */
.fuss { background: var(--holz); color: var(--papier-2); margin-top: 40px; }
.fuss a { color: var(--bernstein-hell); }
.fuss h3 { color: var(--papier); font-size: 1.15rem; }
.fuss-raster { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 32px; padding: 48px 0 32px; }
.fuss .zeiten th, .fuss .zeiten td { padding: 3px 12px 3px 0; font-size: .95rem; }
.fuss .zeiten tr.zu td { color: #b5a796; }
.fuss-unten { border-top: 1px solid var(--holz-2); padding: 18px 0; font-size: .85rem; }

/* Druck: nur die Speisekarte */
@media print {
  .banner, .kopf, .fuss, .sprung, .drucken, .seitenkopf p { display: none !important; }
  body { background: #fff; font-size: 11pt; }
  .seitenkopf { background: none; color: #000; padding: 0; text-align: center; }
  .menukarte { box-shadow: none; border: 0; padding: 0; }
  .kategorie { break-inside: avoid; }
}

/* Status „heute“ (berücksichtigt [Ausnahmen]) */
.status { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; margin: 0 0 12px;
  padding: 6px 14px; border-radius: 999px; background: rgba(255,255,255,.12); }
.status span { width: 10px; height: 10px; border-radius: 50%; background: currentColor; flex: none; }
.status.offen { color: #7fd38a; }
.status.zu { color: #ff9b85; }
.status.info { color: var(--bernstein-hell); }
.held .status { background: rgba(0,0,0,.35); margin-top: 8px; }
.fuss .status { font-size: .92rem; }

/* Ausnahmen */
.ausnahmen { margin-top: 14px; padding: 10px 14px; border-left: 4px solid var(--bernstein); background: rgba(200,137,43,.1); border-radius: 6px; }
.ausnahmen ul { margin: 4px 0 0; padding-left: 18px; }
.ausnahmen li.heute { font-weight: 700; }
.fuss .ausnahmen { background: rgba(255,255,255,.06); font-size: .92rem; }