/* ===== Fleischerei Hommelsheim – gemeinsame Gestaltung ===== */
@font-face{font-family:"HG Inter";font-weight:400;font-style:normal;font-display:swap;src:url(fonts/hg-inter-400.woff) format("woff")}
@font-face{font-family:"HG Inter";font-weight:700;font-style:normal;font-display:swap;src:url(fonts/hg-inter-700.woff) format("woff")}
:root{
  --rot:#8C1D2C; --rot-dunkel:#6B1421; --text:#1F1B18; --grau:#5C524B;
  --karte:#FBF8F4; --rand:#E8E0D8; --seite:#EEEEEE; --hell:#F3EAE2;
  --titel:Rockwell,"Roboto Slab","Zilla Slab",Georgia,serif;
  --schrift:"HG Inter",Arial,Helvetica,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--seite);color:var(--text);font-family:var(--schrift);font-size:17px;line-height:1.55}
img{max-width:100%;height:auto}
a{color:var(--rot)}
h1,h2,h3{margin:0;line-height:1.15}

/* Kopf */
.kopf{background:#FAF7F2;display:flex;align-items:center;justify-content:center;padding:22px 16px}
.kopf img{width:230px;display:block}
.menue{position:sticky;top:0;z-index:10;background:#1F1B18;display:flex;justify-content:center;gap:4px;flex-wrap:wrap;padding:8px}
.menue a{color:#fff;text-decoration:none;font-size:14px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:8px 14px;border-radius:8px}
.menue a:hover,.menue a[aria-current]{background:rgba(255,255,255,.14)}

/* Inhalt */
main{max-width:1160px;margin:0 auto;padding:20px 10px}
.modul{padding:5px}
.modul .karte{margin-bottom:0}
.unten{text-align:center;font-size:14px;padding:6px 16px 26px;color:#5C524B}
.unten a{color:#5C524B}
.karte{background:var(--karte);border:1px solid var(--rand);padding:36px;margin-bottom:28px}
.marke{display:inline-block;font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--rot)}
.marke.box{background:var(--rot);color:#fff;padding:5px 12px;border-radius:6px}
.titel{font-family:var(--titel);font-size:42px;font-weight:700;margin:6px 0 8px}
.mitte{text-align:center}
.unter{font-size:20px;color:var(--grau);margin:0 0 20px}
.linie{width:70px;height:3px;background:var(--rot);margin:10px auto 18px;border:0}
.hinweis{font-size:15px;color:var(--grau)}

/* Knöpfe */
.knoepfe{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.mitte .knoepfe{justify-content:center}
.knopf{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:0 20px;border-radius:10px;font-weight:700;font-size:17px;text-decoration:none;border:2px solid var(--text);color:var(--text);background:transparent;cursor:pointer;font-family:inherit}
.knopf:hover{background:var(--hell)}
.knopf.voll{background:var(--rot);border-color:var(--rot);color:#fff}
.knopf.voll:hover{background:var(--rot-dunkel)}

/* Raster & Kästen */
.raster{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.kasten{background:#fff;border:1px solid var(--rand);border-radius:12px;padding:20px}
.kasten h3{font-size:19px;margin-bottom:4px}
.kasten.betont{border:2px solid var(--rot)}
.preis{font-family:var(--titel);font-size:30px;font-weight:700;color:var(--rot);margin:6px 0 10px}
.liste{margin:0;padding-left:20px}
.liste li{margin:3px 0}
.etikett{display:inline-block;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--rot)}
.etikett.voll{background:var(--rot);color:#fff;padding:3px 8px;border-radius:5px}

/* Preistabellen */
.tabelle{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--rand);border-radius:12px;overflow:hidden}
.tabelle td{padding:12px 16px;border-bottom:1px solid var(--rand);vertical-align:top}
.tabelle tr:last-child td{border-bottom:0}
.tabelle td:last-child{text-align:right;white-space:nowrap;font-weight:700;color:var(--rot)}
.tabelle small{display:block;color:var(--grau);font-weight:400}

/* Stellenanzeige */
.stelle{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;background:#fff;border:2px solid var(--rot);border-radius:14px;padding:18px 22px;margin:16px 0}
.stelle b{font-family:var(--titel);font-size:32px;color:var(--rot)}
.chip{border:2px solid var(--text);border-radius:8px;padding:2px 10px;font-weight:700;font-size:15px}

/* Auswahl-Kacheln (Schalen, Gläser) */
.kacheln{display:grid;gap:10px;grid-template-columns:repeat(auto-fill,minmax(190px,1fr))}
.kachel{background:#fff;border:1px solid var(--rand);border-radius:10px;padding:14px 16px;font-weight:700}
.kachel .etikett{display:block;margin-top:2px}

/* Fuß */
.fuss{background:#1F1B18;color:#EDE6DF;margin-top:20px}
.fuss .innen{max-width:1140px;margin:0 auto;padding:36px 16px;display:grid;gap:28px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.fuss h2{font-family:var(--titel);font-size:24px;margin-bottom:12px;color:#fff}
.fuss a{color:#fff}
.fuss p{margin:0 0 10px}
.zeiten{display:grid;grid-template-columns:44px 1fr;gap:4px 10px}
.fuss .knopf{border-color:#fff;color:#fff}
.fuss .knopf:hover{background:rgba(255,255,255,.1)}
.fuss .knopf.voll{border-color:var(--rot)}
.rechtliches{text-align:center;font-size:14px;padding:14px 16px 24px;color:#BDB3AA}
.rechtliches a{color:#BDB3AA}

/* Textseiten (Impressum, Datenschutz) */
.text h2{font-family:var(--titel);font-size:24px;margin:28px 0 8px}
.text h3{font-size:18px;margin:18px 0 6px}
.text p{margin:0 0 12px}

@media (max-width:600px){
  .karte{padding:20px}
  .titel{font-size:30px}
  .unter{font-size:17px}
  .kopf{padding:14px 16px}
  .kopf img{width:160px}
  .menue{gap:2px;padding:7px 10px;flex-wrap:nowrap;justify-content:flex-start}
  .menue a{font-size:13px;padding:8px 10px;letter-spacing:.06em}
  .stelle b{font-size:26px}
  .knopf{flex:1 1 auto}
  .tabelle td{padding:10px 10px}
  .tabelle td:first-child{overflow-wrap:anywhere}
}

/* ===== Durchgehende Seite: alle Abschnitte in einer Fläche, getrennt durch feine Linien ===== */
.bahn{max-width:1140px;margin:0 auto 10px;background:#FBF8F4;border:1px solid #E8E0D8}
.bahn>.modul{padding:0}
.bahn>.modul>div:not([style]),.bahn>.modul>section{max-width:none!important;border:0!important;background:transparent!important;margin:0!important}
.bahn>.modul+.modul{border-top:1px solid #E8E0D8}
.bahn>.modul+.modul>div:not([style])::before,.bahn>.modul+.modul>section::before{content:"";display:block;width:60px;height:3px;background:#8C1D2C;margin:-36px auto 33px;border-radius:2px;position:relative;top:-1px}
.bahn>.modul-tafel{padding:36px 16px}

/* Zusammengelegte Abschnitte: keine Trennlinie, kleiner Abstand */
.bahn>.modul.zusammen{border-top:0}
.bahn>.modul.zusammen>div:not([style])::before,.bahn>.modul.zusammen>section::before{display:none}
html body main .bahn>.modul.zusammen>div:not([style]){padding-top:4px!important}
.bahn>.modul-tafel.zusammen{padding-top:4px}

/* Nur der Schriftzug "Willkommen" größer */
html body main .hg-willk p.hg-dach{font-size:18px!important}
@media (max-width:600px){html body main .hg-willk p.hg-dach{font-size:15px!important}}

/* Telefon-Knopf im Menüstreifen */
.menue a.menue-tel{position:absolute;right:16px;top:50%;transform:translateY(-50%);display:inline-flex;align-items:center;gap:8px;background:#8C1D2C;letter-spacing:.02em;text-transform:none;font-size:15px;padding:7px 14px}
.menue a.menue-tel:hover{background:#6B1421}
.menue a.menue-tel svg{width:17px;height:17px}
@media (max-width:760px){
  .menue a.menue-tel{position:static;transform:none;margin-left:auto;flex:0 0 auto;padding:8px 12px}
}
@media (max-width:600px){
  .menue a.menue-tel span{display:none}
}

/* Immer günstig: Preise rechtsbündig */
html body main .hg-preisl .hg-zeile span.hg-wert{margin-left:auto;text-align:right;white-space:nowrap;padding-left:12px}

/* Handy: Backofenschalen & Gläser kompakt in zwei Spalten */
@media (max-width:600px){
  html body main .hg-ofen ul.hg-raster,html body main .hg-glas ul.hg-raster{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:6px!important}
  html body main .hg-ofen ul.hg-raster li,html body main .hg-glas ul.hg-raster li{font-size:14px!important;padding:9px 8px!important;gap:7px!important;border-radius:9px!important}
  html body main .hg-ofen ul.hg-raster li.hg-top,html body main .hg-glas ul.hg-raster li.hg-top{border-width:2px!important;padding:8px 7px!important}
  html body main .hg-ofen ul.hg-raster li svg,html body main .hg-glas ul.hg-raster li svg{flex:0 0 18px!important;width:18px!important;height:18px!important}
  html body main .hg-ofen ul.hg-raster li small,html body main .hg-glas ul.hg-raster li small{font-size:10px!important}
}
@media (max-width:600px){
  html body main .hg-ofen ul.hg-raster li svg,html body main .hg-glas ul.hg-raster li svg{display:none!important}
  html body main .hg-ofen ul.hg-raster li,html body main .hg-glas ul.hg-raster li,
  html body main .hg-ofen ul.hg-raster li span,html body main .hg-glas ul.hg-raster li span{-webkit-hyphens:manual!important;hyphens:manual!important;word-break:normal!important;overflow-wrap:normal!important}
  html body main .hg-ofen ul.hg-raster li,html body main .hg-glas ul.hg-raster li{padding:9px 10px!important;min-height:44px}
}

/* Kikok: Foto und Vorbestell-Hinweis */
html body main .hk-kikok img.hk-bild{flex:0 0 340px!important;width:340px!important;max-width:340px!important;aspect-ratio:16/10;object-fit:cover}
html body main .hk-kikok .hk-bestellen{margin:28px 0 22px}
html body main .hk-kikok p.hk-b-text{font-size:20px!important;color:#1F1B18!important;margin:0 0 16px!important}
html body main .hk-kikok .hk-b-knoepfe{display:flex;flex-wrap:wrap;gap:14px}
html body main .hk-kikok a.hk-b-knopf{display:inline-flex;align-items:center;justify-content:center;min-height:60px;padding:0 26px;border:2px solid #1F1B18;border-radius:12px;color:#1F1B18;font-weight:700;font-size:22px;line-height:1;text-decoration:none}
html body main .hk-kikok a.hk-b-knopf:hover{background:#F3EAE2}
html body main .hk-kikok a.hk-b-haupt{background:#8C1D2C;border-color:#8C1D2C;color:#fff;padding:0 30px}
html body main .hk-kikok a.hk-b-haupt:hover{background:#6B1421}
@media (max-width:600px){
  html body main .hk-kikok img.hk-bild{flex:1 1 100%!important;width:100%!important;max-width:100%!important}
  html body main .hk-kikok p.hk-b-text{font-size:17px!important}
  html body main .hk-kikok a.hk-b-knopf{min-height:48px;font-size:17px;padding:0 18px}
}

/* Für Geburtstage & Feiern */
.feiern .kasten h3{font-size:22px}
.feiern-gerichte{margin-bottom:18px;grid-template-columns:repeat(2,minmax(0,1fr))!important}
.feiern .kasten{padding:16px 20px;display:flex;flex-direction:column;justify-content:center}
.feiern-punkte{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.feiern-punkte li{display:flex;align-items:center;gap:12px;font-size:18px;color:#3A332E}
.feiern-punkte svg{flex:0 0 24px;width:24px;height:24px}
@media (max-width:600px){.feiern-punkte li{font-size:16px}.feiern .kasten{padding:12px 14px}.feiern .kasten h3{font-size:18px}.feiern-gerichte{gap:8px}}

/* Grillsortiment */
.grill .grill-gruppe{font-family:var(--titel);font-size:26px;margin:30px 0 12px;padding-top:18px;border-top:1px solid #E8E0D8}
.grill .grill-gruppe:first-of-type{border-top:0;padding-top:0}
.grill-kacheln .kachel{display:flex;flex-direction:column;justify-content:center;font-size:17px}
.grill-kacheln .kachel small{display:block;font-weight:400;font-size:14px;color:#5C524B;margin-top:2px}
.grill .grill-knopf{min-height:60px;font-size:22px;padding:0 30px}
@media (max-width:600px){
  .grill-kacheln{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
  .grill-kacheln .kachel{font-size:14px;padding:9px 10px}
  .grill-kacheln .kachel small{font-size:12px}
  .grill .grill-gruppe{font-size:22px}
  .grill .grill-knopf{min-height:48px;font-size:17px;width:100%}
}
@media (max-width:600px){.grill-kacheln .kachel{-webkit-hyphens:manual;hyphens:manual;word-break:normal;overflow-wrap:normal}}

.kachel.betont{border:2px solid #8C1D2C}

/* Google-Bewertung unter Willkommen */
html body main .bahn>.modul.zusammen>section.google-bew{padding-top:0!important}
.google-bew{padding-bottom:30px!important}
.gb-zeile{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:14px 26px;background:#fff;border:1px solid #E8E0D8;border-radius:14px;padding:18px 24px;max-width:900px;margin:0 auto}
.gb-wert{display:flex;align-items:center;gap:10px}
.gb-zahl{font-family:var(--titel);font-size:40px;font-weight:700;line-height:1;color:#1F1B18}
.gb-sterne{color:#E0A526;font-size:26px;letter-spacing:.08em}
.gb-text{margin:0;font-size:18px;color:#3A332E;flex:1 1 280px;text-align:left}
.gb-knoepfe .knopf{min-height:52px;font-size:18px}
@media (max-width:600px){
  .gb-zeile{flex-direction:column;text-align:center;padding:16px}
  .gb-text{text-align:center;font-size:16px;flex:none}
  .gb-knoepfe,.gb-knoepfe .knopf{width:100%}
  .gb-knoepfe .knopf{min-height:48px;font-size:17px}
}

/* Grillpakete: ganzjährig */
html body p.ganzjahr{font-size:15px!important;font-weight:700!important;color:#2F6B3A!important;margin:-6px 0 12px!important;padding:0!important}

@media (max-width:700px){.menue .menue-lang{display:none}}
@media (max-width:440px){.menue a{padding:8px 7px;letter-spacing:.02em;font-size:12.5px}.menue a.menue-tel{padding:8px 10px}}
@media (max-width:370px){.menue{padding:7px 6px}.menue a{padding:8px 5px;font-size:11.5px;letter-spacing:0}.menue a.menue-tel{padding:8px 8px}}
.menue{justify-content:center!important}