@font-face{font-family:'Alegreya Sans';font-style:normal;font-weight:400;font-display:swap;src:url(schrift/AlegreyaSans-400-greek.woff2) format('woff2');unicode-range:U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF}
@font-face{font-family:'Alegreya Sans';font-style:normal;font-weight:400;font-display:swap;src:url(schrift/AlegreyaSans-400-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Alegreya Sans';font-style:normal;font-weight:400;font-display:swap;src:url(schrift/AlegreyaSans-400-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Alegreya Sans';font-style:normal;font-weight:500;font-display:swap;src:url(schrift/AlegreyaSans-500-greek.woff2) format('woff2');unicode-range:U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF}
@font-face{font-family:'Alegreya Sans';font-style:normal;font-weight:500;font-display:swap;src:url(schrift/AlegreyaSans-500-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Alegreya Sans';font-style:normal;font-weight:500;font-display:swap;src:url(schrift/AlegreyaSans-500-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Alegreya Sans';font-style:normal;font-weight:700;font-display:swap;src:url(schrift/AlegreyaSans-700-greek.woff2) format('woff2');unicode-range:U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF}
@font-face{font-family:'Alegreya Sans';font-style:normal;font-weight:700;font-display:swap;src:url(schrift/AlegreyaSans-700-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Alegreya Sans';font-style:normal;font-weight:700;font-display:swap;src:url(schrift/AlegreyaSans-700-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Alegreya Sans';font-style:normal;font-weight:800;font-display:swap;src:url(schrift/AlegreyaSans-800-greek.woff2) format('woff2');unicode-range:U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF}
@font-face{font-family:'Alegreya Sans';font-style:normal;font-weight:800;font-display:swap;src:url(schrift/AlegreyaSans-800-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Alegreya Sans';font-style:normal;font-weight:800;font-display:swap;src:url(schrift/AlegreyaSans-800-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Alegreya';font-style:normal;font-weight:700;font-display:swap;src:url(schrift/Alegreya-700-greek.woff2) format('woff2');unicode-range:U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF}
@font-face{font-family:'Alegreya';font-style:normal;font-weight:700;font-display:swap;src:url(schrift/Alegreya-700-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Alegreya';font-style:normal;font-weight:700;font-display:swap;src:url(schrift/Alegreya-700-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Alegreya';font-style:normal;font-weight:800;font-display:swap;src:url(schrift/Alegreya-800-greek.woff2) format('woff2');unicode-range:U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF}
@font-face{font-family:'Alegreya';font-style:normal;font-weight:800;font-display:swap;src:url(schrift/Alegreya-800-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Alegreya';font-style:normal;font-weight:800;font-display:swap;src:url(schrift/Alegreya-800-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}

/* ============================================================
   SCHRIFT UND SCHILD
   Das Logo ist die Marke und traegt den ersten Bildschirm. Alles
   andere ist Satz: Papier und Tinte aus dem Logo, zwei Familien
   Alegreya, Weissraum statt Kaesten, die Karte wie gedruckt.
   ============================================================ */

:root{
  --papier:   #F4F1E8;   /* Logogrund, gemessen */
  --papier-2: #EDE7D6;   /* Hinweisband, die einzige zweite Flaeche */
  --tinte:    #2E3537;   /* Text, eine Stufe unter der Logotinte — 11,5:1 */
  --schiefer: #4E5759;   /* Logotinte, gemessen — 6,6:1 */
  --grau:     #636A6C;   /* Zweitsprache, Nummern, Hinweise — 4,9:1 */
  --linie:    rgba(78,87,89,.24);
  --oliv:     #55672F;   /* Zustand: geoeffnet */
  --bernstein:#B4762A;   /* Zustand: oeffnet gleich, Kueche zu, Urlaub */
  --aus:      #9AA0A0;   /* Zustand: geschlossen */
  --rand:     clamp(1.25rem, 5vw, 3rem);
  --f:  'Alegreya Sans', ui-sans-serif, system-ui, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --fd: 'Alegreya', Georgia, 'Times New Roman', serif;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; background:var(--papier); scrollbar-color:#A3A8A8 var(--papier); scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }
body{ margin:0; background:var(--papier); color:var(--tinte); font:400 1.0625rem/1.6 var(--f);
  font-variant-numeric:lining-nums; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }
::selection{ background:var(--schiefer); color:var(--papier); }
a{ color:inherit; text-decoration-thickness:1px; text-underline-offset:.22em; }
a:hover{ text-decoration-thickness:2px; }
:focus-visible{ outline:2px solid var(--tinte); outline-offset:4px; border-radius:2px; }
h1,h2,h3{ margin:0; font-family:var(--fd); text-wrap:balance; font-variant-numeric:lining-nums; }
p, ul, ol, address{ margin:0; }
address{ font-style:normal; }
img{ max-width:100%; }
.wrap{ max-width:68rem; margin-inline:auto; }
.sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; }
.skip{ position:absolute; left:1rem; top:-5rem; z-index:30; padding:.75rem 1.1rem; border-radius:3px;
  background:var(--tinte); color:var(--papier); font-weight:700; text-decoration:none; }
.skip:focus{ top:1rem; }

/* ---------- Kopfzeile: leise, nur Wege ---------------------- */
.kopf{ display:flex; justify-content:space-between; align-items:center; gap:1rem; padding:.55rem var(--rand); font-weight:500; font-size:.98rem; }
.kopf nav{ display:flex; gap:.4rem; margin-left:-.6rem; }
.kopf a{ display:inline-flex; align-items:center; min-height:2.75rem; padding:0 .6rem; text-decoration:none; }
.kopf a:hover{ text-decoration:underline; }
.kopf__tel{ font-weight:700; font-variant-numeric:tabular-nums; margin-right:-.6rem; }
.kopf__marke{ margin-left:-.6rem; }
.kopf__marke img{ display:block; width:auto; height:2.6rem; }
@media (max-width:719px){ .kopf .weg{ display:none; } }

/* ---------- Hinweisband (Betriebsferien) ---------------------- */
.hinweis{ background:var(--papier-2); border-block:1px solid var(--linie); padding:.85rem var(--rand); text-align:center; }
.hinweis__in{ display:flex; flex-wrap:wrap; justify-content:center; gap:.2rem .8rem; }
.hinweis__t{ font-family:var(--fd); font-weight:700; }
.hinweis__x{ color:var(--schiefer); }
.hinweisMini{ display:none; }
/* Das Kopfskript vergleicht vor dem ersten Malen das Berliner Datum mit dem
   Hinweis. Nach dem letzten Urlaubstag verschwindet das Band von selbst. */
.hinweis-vorbei .hinweis, .hinweis-vorbei .hinweisMini{ display:none !important; }

/* ---------- Das Schild: das Logo traegt den ersten Bildschirm -- */
.schild{ min-height:calc(100svh - 3.9rem); display:flex; flex-direction:column; align-items:center; justify-content:center;
  text-align:center; padding:1rem var(--rand) 4rem; }
.schild h1{ font-size:1rem; line-height:0; }
.schild__logo{ width:min(84vw, 640px); height:auto; display:block; }
.ort{ margin-top:2.4rem; color:var(--schiefer); font-size:1.05rem; }
.status{ margin-top:.9rem; line-height:1.3; }
.status__now{ font-family:var(--fd); font-weight:700; font-size:clamp(1.2rem, 1rem + 1vw, 1.5rem); }
.status__now::before{ content:""; display:inline-block; width:.6rem; height:.6rem; margin-right:.55rem; border-radius:50%;
  background:var(--aus); vertical-align:.12em; }
.status.is-open .status__now::before{ background:var(--oliv); }
.status.is-soon .status__now::before,
.status.is-kueche .status__now::before,
.status.is-urlaub .status__now::before{ background:var(--bernstein); }
.status__sub{ display:block; margin-top:.25rem; color:var(--grau); }
.nummer{ margin-top:1.4rem; font-family:var(--fd); font-weight:800; font-size:clamp(2.5rem, 1.4rem + 5.4vw, 4.6rem);
  line-height:1; letter-spacing:-.012em; font-variant-numeric:tabular-nums lining-nums;
  text-decoration-thickness:2px; text-underline-offset:.16em; }
.nummer:hover{ text-decoration-thickness:3px; }
.telhinweis{ margin-top:.9rem; color:var(--grau); max-width:30rem; }
.weiter{ margin-top:2.4rem; display:inline-flex; gap:.45rem; align-items:center; min-height:2.75rem; font-weight:500; text-decoration:none; }
.weiter:hover{ text-decoration:underline; }
.weiter svg{ width:.8rem; height:.8rem; }

/* ---------- Abschnitte: Weissraum statt Kaesten ---------------- */
.abschnitt{ padding:clamp(4rem, 9vw, 7.5rem) var(--rand); border-top:1px solid var(--linie); }
.abschnitt > h2{ text-align:center; font-weight:800; font-size:clamp(2rem, 1.4rem + 2.8vw, 3.2rem); letter-spacing:-.018em; line-height:1.08; }

.brief{ max-width:34rem; margin:2.4rem auto 0; }
.brief .lede{ font-family:var(--fd); font-weight:700; font-size:clamp(1.25rem, 1.1rem + .7vw, 1.5rem); line-height:1.4; }
.brief p + p{ margin-top:1.1rem; }

/* ---------- Speisekarte wie die gedruckte Karte des Hauses ---- */
.karteTop{ text-align:center; margin-top:1rem; color:var(--grau); }
.karteTop a{ color:var(--tinte); font-weight:700; font-variant-numeric:tabular-nums; }
/* Waehrend der Ferien darf dort nicht stehen, man koenne zum Mitnehmen
   bestellen. Vorher und nachher schon — deshalb per Datum, nicht beim Bau. */
.im-urlaub .karteTop{ display:none; }
.inhalt{ position:sticky; top:0; z-index:5; margin:2.2rem calc(var(--rand) * -1) 0; padding:0 var(--rand);
  background:rgba(244,241,232,.96); border-bottom:1px solid var(--linie); }
.inhalt__in{ overflow-x:auto; white-space:nowrap; scrollbar-width:none; text-align:center; padding-block:.25rem; }
.inhalt__in::-webkit-scrollbar{ display:none; }
.inhalt__a{ display:inline-block; padding:.6rem .7rem; font-weight:500; font-size:.95rem; color:var(--schiefer);
  text-decoration:none; border-bottom:2px solid transparent; }
.inhalt__a:hover{ color:var(--tinte); }
.inhalt__a.is-here{ color:var(--tinte); border-bottom-color:var(--tinte); }
/* Fokus nach innen: die Leiste schneidet sonst den Rahmen oben und unten ab */
.inhalt__a:focus-visible{ outline-offset:-3px; }
.spalten{ max-width:68rem; margin:0 auto; }
@media (min-width:960px){ .spalten{ columns:2; column-gap:5rem; column-rule:1px solid var(--linie); } }
.kat{ padding-top:3rem; scroll-margin-top:3.4rem; }
.kat h3{ text-align:center; break-after:avoid; margin-bottom:1.3rem; }
.kat__de{ display:block; font-weight:700; font-size:1.06rem; letter-spacing:.14em; text-transform:uppercase; }
.kat__en{ display:block; margin-top:.2rem; font-family:var(--f); font-weight:400; font-size:.92rem; color:var(--grau); }
.gerichte{ list-style:none; padding:0; }
.gericht{ display:grid; grid-template-columns:2.1rem 1fr auto; column-gap:.9rem; padding:.7rem 0; break-inside:avoid;
  /* Bezugsrahmen fuer den Screenreader-Text „Nummer 01.“ (.sr-only, absolut). Ohne ihn
     setzt Safari diese Texte in der zweispaltigen Karte, als stuende alles in einer
     Spalte — die der rechten Spalte landeten bis 1126 px unter dem Fuss, und die
     Seite bekam unten eine leere Fensterhoehe (gemessen in Safari 27.2, 25.10.2026). */
  position:relative; }
.gericht__nr{ font-family:var(--fd); font-weight:700; color:var(--grau); font-size:.95rem; font-variant-numeric:tabular-nums lining-nums; padding-top:.1rem; }
.gericht__text{ min-width:0; }
.gericht__name{ font-weight:700; font-size:1.04rem; line-height:1.35; }
.gericht__de{ color:var(--schiefer); line-height:1.45; }
.gericht__en{ color:var(--grau); font-size:.92rem; line-height:1.4; margin-top:.1rem; }
.gericht__preis{ font-weight:700; font-variant-numeric:tabular-nums; white-space:nowrap; padding-top:.05rem; }
.gericht__eur{ font-weight:400; color:var(--grau); }
.katnote{ color:var(--grau); font-size:.95rem; text-align:center; max-width:30rem; margin:1rem auto 0; break-inside:avoid; }

/* ---------- Zeiten und Anfahrt ---------------------------------- */
.raster{ max-width:52rem; margin:2.6rem auto 0; display:grid; gap:2.8rem; }
@media (min-width:820px){ .raster{ grid-template-columns:1.1fr .9fr; gap:4.5rem; } }
.raster h3{ font-weight:700; font-size:1.06rem; letter-spacing:.14em; text-transform:uppercase; margin-bottom:1rem; }
.raster h3 + p, .raster h3 + address{ margin-top:0; }
.zeiten{ width:100%; border-collapse:collapse; font-variant-numeric:tabular-nums; }
.zeiten th, .zeiten td{ padding:.5rem 0; border-bottom:1px solid var(--linie); vertical-align:top; text-align:left; font-weight:400; }
.zeiten td{ text-align:right; }
.zeiten tr.is-today th, .zeiten tr.is-today td{ font-weight:700; }
.zeiten .closed{ color:var(--grau); }
.hoursNote{ margin-top:1rem; color:var(--grau); }
.adresse{ font-family:var(--fd); font-weight:700; font-size:1.3rem; line-height:1.35; }
.anfahrt p, .anfahrt ul{ margin-top:.8rem; }
.anfahrt h3:not(:first-child){ margin-top:2.4rem; }
.gut{ list-style:none; padding:0; }
.gut li + li{ margin-top:.55rem; }

/* ---------- Der Gruss als letzter Moment ------------------------ */
.gruss{ text-align:center; padding:clamp(4.5rem, 10vw, 8rem) var(--rand); border-top:1px solid var(--linie); }
.gruss__el{ font-family:var(--fd); font-weight:800; font-size:clamp(2rem, 1.2rem + 3.6vw, 3.6rem); line-height:1.15; letter-spacing:-.01em; text-wrap:balance; }
.gruss__um{ margin-top:.9rem; color:var(--grau); }
.gruss__von{ margin-top:1.6rem; font-family:var(--fd); font-weight:700; font-size:1.25rem; }

/* ---------- Fuss ------------------------------------------------- */
.fuss{ text-align:center; padding:3.5rem var(--rand) 3rem; border-top:1px solid var(--linie); color:var(--schiefer); }
.fuss__logo{ width:180px; height:auto; display:block; margin:0 auto 1.6rem; }
.fuss p + p{ margin-top:.5rem; }
.fuss__links{ margin-top:1.4rem; display:flex; flex-wrap:wrap; justify-content:center; gap:0 .4rem; }
.fuss__links a{ display:inline-flex; align-items:center; min-height:2.75rem; padding:0 .5rem; }
.fuss__klein{ margin-top:1rem; color:var(--grau); font-size:.92rem; }

/* ---------- Unterseiten (Impressum, Datenschutz, 404) ----------- */
.rechts > h1{ text-align:center; font-weight:800; font-size:clamp(2rem, 1.4rem + 2.8vw, 3.2rem); letter-spacing:-.018em; line-height:1.08; }
.rechtstext{ max-width:40rem; margin:2.4rem auto 0; }
.rechtstext h2{ font-size:1.3rem; font-weight:700; margin:2rem 0 .5rem; }
.rechtstext p + p, .rechtstext ul{ margin-top:.8rem; }
.story__lede{ font-family:var(--fd); font-weight:700; font-size:1.35rem; line-height:1.4; }

/* ---------- Am Handy: der Anruf bleibt im Daumen ----------------- */
.rufleiste{ display:none; }
@media (max-width:719px){
  body.mit-ruf{ padding-bottom:calc(4.4rem + env(safe-area-inset-bottom)); }
  .rufleiste{ display:flex; position:fixed; left:0; right:0; bottom:0; z-index:10; align-items:center; justify-content:space-between;
    gap:1rem; padding:.65rem 1.1rem calc(.65rem + env(safe-area-inset-bottom)); background:var(--tinte); color:var(--papier); text-decoration:none; }
  .rufleiste__st{ display:inline-flex; align-items:center; gap:.5rem; font-size:.95rem; }
  .rufleiste__st::before{ content:""; width:.55rem; height:.55rem; border-radius:50%; background:#A9AEAE; flex:none; }
  .rufleiste.is-open .rufleiste__st::before{ background:#A3BA6E; }
  .rufleiste.is-soon .rufleiste__st::before,
  .rufleiste.is-kueche .rufleiste__st::before,
  .rufleiste.is-urlaub .rufleiste__st::before{ background:#E3A85A; }
  .rufleiste b{ font-size:1.05rem; padding:.55rem 1rem; border:1.5px solid rgba(244,241,232,.55); border-radius:3px; white-space:nowrap; }
}

/* ---------- Druck: die Karte auf Papier ------------------------- */
@media print{
  .kopf, .inhalt, .rufleiste, .weiter, .skip, .status, .hinweis, .kapitel, .gruss, .fuss, .telhinweis{ display:none !important; }
  html, body{ background:#fff; color:#000; }
  body{ font-size:10.5pt; }
  .schild{ min-height:0; padding:0 0 1rem; }
  .schild__logo{ width:9cm; }
  .abschnitt{ padding:1rem 0; border:0; }
  .spalten{ columns:2; column-gap:1.4cm; column-rule:none; }
  .gericht{ padding:.2rem 0; }
  .gericht__en, .kat__en{ display:none; }
  a{ text-decoration:none; }
}
