/* glattt Menü — Kopfzeile und Menü.
 *
 * Aufbau:  1 Werte  2 Theme ausblenden  3 Grundgerüst  4 Desktop (ab 1000 px)
 *          5 Aufklappmenüs  6 Handy (unter 1000 px)  7 Menüblatt  8 Weniger Bewegung
 *
 * Regeln: bewegt werden nur transform und opacity (Ausnahme Akkordeon: grid-template-rows).
 * Nichts misst die Fensterhöhe — am Handy ändert sie sich beim Scrollen (Safari-Leiste).
 * Alle Selektoren hängen an #gm-header / #gm-sheet, damit Regeln des Themes nicht greifen.
 */

/* ---------- 1 Werte ---------- */
#gm-header, #gm-sheet, .gm-spacer {
  --gm-gold: #E1B520;
  --gm-ink: #14110d;
  --gm-mint: #B9EDE0;
  --gm-green: #1d5148;
  --gm-cream: #fdfaf3;
  --gm-white: #ffffff;
  --gm-text: #111111;
  --gm-grey: #6d6a64;
  --gm-hair: #e8e3d6;
  --gm-ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  --gm-ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);
  --gm-ease-drawer: cubic-bezier(0.32, 0.72, 0, 1);
  --gm-util-h: 34px;
  --gm-main-h: 58px;
  --gm-top: 0px;
  /* Zustand „normal“: dunkle Schrift auf Weiß */
  --gm-fg: var(--gm-text);
  --gm-fg-soft: var(--gm-grey);
  --gm-bg-o: 1;
  --gm-grad-o: 0;
  --gm-pill: var(--gm-cream);
  --gm-pill-line: var(--gm-hair);
  --gm-util-bg: var(--gm-cream);
  --gm-line: var(--gm-hair);
}
@media (min-width: 1000px) {
  #gm-header, #gm-sheet, .gm-spacer { --gm-main-h: 68px; }
}
body.admin-bar #gm-header, body.admin-bar #gm-sheet { --gm-top: 32px; }
@media (max-width: 782px) { body.admin-bar #gm-header, body.admin-bar #gm-sheet { --gm-top: 46px; } }
@media (max-width: 600px) { body.admin-bar #gm-header.is-scrolled { --gm-top: 0px; } }

/* Zustand „auf dem Kopfbild“: durchsichtig, weiße Schrift. Gilt oben auf Seiten, deren
   Theme-Kopfzeile durchsichtig ist — nicht mehr nach dem Scrollen und nicht bei offenem Menü. */
:is(body:has(#header-outer[data-transparent-header="true"]) #gm-header, #gm-header.is-hero):not(.is-scrolled):not(.is-open) {
  --gm-fg: var(--gm-white);
  --gm-fg-soft: #e6e0d4;
  --gm-bg-o: 0;
  --gm-grad-o: 1;
  --gm-pill: #ffffff29;
  --gm-pill-line: #ffffff47;
  --gm-util-bg: transparent;
  --gm-line: transparent; /* keine Linien auf dem Kopfbild (Jan, 14.11.2026) */
}

/* ---------- 2 Theme ausblenden ---------- */
/* #header-outer bleibt als unsichtbare Messlatte stehen — in der Höhe der neuen Kopfzeile.
   Das Buchungs-Plugin (Kopfbild, Preis-Kopf, Kalender) und das Theme messen daran, wie viel
   Platz die Kopfzeile oben belegt; mit display:none käme 0 heraus und der Inhalt der
   Kopfbild-Seiten rutschte unter die Kopfzeile. */
body.gm-on #header-outer#header-outer {
  visibility: hidden !important; pointer-events: none !important; overflow: hidden !important;
  position: fixed !important; top: 0 !important; left: 0 !important; right: 0 !important;
  height: 58px !important; min-height: 0 !important; padding: 0 !important; margin: 0 !important;
  transform: none !important; transition: none !important; box-shadow: none !important; z-index: -1 !important;
}
@media (min-width: 1000px) { body.gm-on #header-outer#header-outer { height: 102px !important; } }
body.gm-on #header-space,
body.gm-on #header-secondary-outer,
body.gm-on #search-outer,
body.gm-on #slide-out-widget-area,
body.gm-on #slide-out-widget-area-bg { display: none !important; }

html.gm-open, html.gm-open body { overflow: hidden; }
/* Das Umschlag-Abzeichen läge sonst über dem Buchungsknopf des Menüblatts. */
html.gm-open .gu-badge { opacity: 0 !important; pointer-events: none !important; }
html { scroll-padding-top: 70px; }

/* ---------- 3 Grundgerüst ---------- */
/* Platzhalter = Höhe der Kopfzeile + etwas Luft: Die alte Kopfzeile war 130 px hoch, viele
   Seiten beginnen ohne eigenen Abstand direkt mit der Überschrift (Jan, 14.11.2026). */
.gm-spacer { height: calc(var(--gm-main-h) + 20px); }
@media (min-width: 1000px) { .gm-spacer { height: calc(var(--gm-util-h) + var(--gm-main-h) + 36px); } }
body:has(#header-outer[data-transparent-header="true"]) .gm-spacer, .gm-spacer.is-hero { display: none; }
.gm-sentinel { position: absolute; top: 32px; left: 0; width: 1px; height: 1px; pointer-events: none; visibility: hidden; }

#gm-header {
  position: fixed; top: var(--gm-top); left: 0; right: 0; z-index: 9993;
  margin: 0; padding: 0; background: none; border: 0;
  color: var(--gm-fg); font-family: inherit; font-size: 16px; line-height: 1.3; font-weight: 400; letter-spacing: 0; text-transform: none;
  transition: transform 260ms var(--gm-ease-out), color 220ms ease;
}
html.gm-open #gm-header { z-index: 9998; }
#gm-header::before { content: ""; position: absolute; inset: 0; background: var(--gm-white); opacity: var(--gm-bg-o); transition: opacity 220ms ease, box-shadow 260ms ease, background-color 220ms ease; z-index: -1; }
#gm-header::after { content: ""; position: absolute; inset: 0 0 -22px; background: linear-gradient(#000000a6, #0000); opacity: var(--gm-grad-o); transition: opacity 220ms ease; z-index: -2; pointer-events: none; }
#gm-header.is-scrolled::before { box-shadow: 0 2px 12px #0000001f; }
#gm-header.is-open::before { background: var(--gm-cream); box-shadow: inset 0 -1px 0 var(--gm-hair); }

#gm-header *, #gm-sheet * { box-sizing: border-box; }
#gm-header ul, #gm-header li { list-style: none; margin: 0; padding: 0; }
#gm-header a, #gm-sheet a { color: inherit; text-decoration: none; box-shadow: none; }
#gm-header button, #gm-sheet button {
  -webkit-appearance: none; appearance: none; background: none; border: 0; border-radius: 0; box-shadow: none; margin: 0; padding: 0;
  font: inherit; color: inherit; letter-spacing: 0; text-transform: none; min-width: 0; min-height: 0; line-height: inherit; cursor: pointer; width: auto; height: auto;
}
#gm-header img, #gm-sheet img { max-width: none; margin: 0; border: 0; border-radius: 0; box-shadow: none; }
#gm-header .gm-i, #gm-sheet .gm-i { stroke: currentColor; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex: 0 0 auto; }
#gm-header :focus-visible, #gm-sheet :focus-visible { outline: 2px solid var(--gm-green); outline-offset: 2px; border-radius: 6px; }

#gm-header .gm-in { display: flex; align-items: center; justify-content: space-between; height: var(--gm-main-h); padding: 0 7px 0 14px; }
#gm-header .gm-util { display: none; }
#gm-header .gm-nav { display: none; }

/* Logo: drei Bilder übereinander, sichtbar ist je Zustand genau eines. */
#gm-header .gm-logo { position: relative; display: block; flex: 0 0 auto; width: 128px; height: 38px; }
#gm-header .gm-logo img { position: absolute; left: 0; top: 0; height: 100%; width: auto; display: block; transition: opacity 200ms ease, transform 260ms var(--gm-ease-out); }
#gm-header .gm-logo-d { opacity: 0; }
#gm-header .gm-logo-s { opacity: 0; transform: scale(.9); transform-origin: left center; }
:is(body:has(#header-outer[data-transparent-header="true"]) #gm-header, #gm-header.is-hero).gm--logo-dunkel:not(.is-scrolled):not(.is-open) .gm-logo-w { opacity: 0; }
:is(body:has(#header-outer[data-transparent-header="true"]) #gm-header, #gm-header.is-hero).gm--logo-dunkel:not(.is-scrolled):not(.is-open) .gm-logo-d { opacity: 1; }

/* Buchungsknopf */
#gm-header .gm-cta {
  display: flex; align-items: center; gap: 6px; flex: 0 0 auto; white-space: nowrap;
  background: var(--gm-mint); color: var(--gm-green); font-weight: 700; border-radius: 999px;
  transition: transform 140ms var(--gm-ease-out), box-shadow 200ms ease, opacity 160ms ease;
}
#gm-header .gm-cta:active { transform: scale(.97); }
#gm-header .gm-cta .gm-i { width: 15px; height: 15px; }

/* ---------- 4 Desktop (ab 1000 px) ---------- */
@media (min-width: 1000px) {
  #gm-header.is-scrolled { transform: translateY(calc(-1 * var(--gm-util-h))); }
  /* Seitenrand wie der Inhalt des Themes (90 px je Seite), in schmalen Fenstern weniger —
     sonst passen sechs Menüpunkte nicht in die Zeile. */
  #gm-header .gm-in { width: min(100% - clamp(44px, (100vw - 1000px) * 0.5 + 44px, 180px), 1244px); margin: 0 auto; padding: 0; gap: 16px; }

  #gm-header .gm-util { display: block; background: var(--gm-util-bg); box-shadow: inset 0 -1px 0 var(--gm-line); font-size: 13px; color: var(--gm-fg-soft); transition: background-color 220ms ease, box-shadow 220ms ease; }
  #gm-header .gm-util .gm-in { height: var(--gm-util-h); }
  #gm-header .gm-util-nav { display: flex; gap: 24px; color: var(--gm-fg); }
  #gm-header .gm-util-nav a { transition: color 160ms ease; }
  #gm-header .gm-util-nav a.is-cur { font-weight: 700; }

  #gm-header .gm-main { box-shadow: inset 0 -1px 0 var(--gm-line); transition: box-shadow 220ms ease; }
  #gm-header.is-scrolled .gm-main { box-shadow: none; }
  #gm-header .gm-logo { width: 133px; height: 40px; }
  #gm-header .gm-logo-s { display: none; }
  #gm-header .gm-burger { display: none; }

  #gm-header .gm-nav { display: flex; flex: 1; justify-content: center; min-width: 0; }
  #gm-header .gm-nav > ul { display: flex; gap: 2px; }
  #gm-header .gm-item { position: relative; }
  #gm-header .gm-pill { position: relative; display: flex; align-items: center; isolation: isolate; }
  #gm-header .gm-pill::after {
    content: ""; position: absolute; inset: 1px 0; border-radius: 10px; z-index: -1;
    background: var(--gm-pill); box-shadow: inset 0 0 0 1px var(--gm-pill-line);
    opacity: 0; transform: scale(.96);
    transition: opacity 160ms ease, transform 200ms var(--gm-ease-out);
  }
  #gm-header .gm-item.is-open > .gm-pill::after,
  #gm-header .gm-item.is-cur > .gm-pill::after { opacity: 1; transform: none; }
  #gm-header .gm-item.is-cur > .gm-pill > .gm-link { font-weight: 700; }
  #gm-header .gm-link { display: block; padding: 10px 14px; font-size: 16px; white-space: nowrap; }
  #gm-header .gm-has-sub > .gm-pill > .gm-link { padding-right: 2px; }
  #gm-header .gm-caret { display: grid; place-items: center; width: 30px; height: 40px; padding-right: 8px; }
  #gm-header .gm-caret .gm-i { width: 13px; height: 13px; stroke-width: 2.2; transition: transform 200ms var(--gm-ease-out); }
  #gm-header .gm-item.is-open .gm-caret .gm-i { transform: rotate(180deg); }

  #gm-header .gm-cta { font-size: 15px; padding: 12px 18px; gap: 8px; }
  #gm-header .gm-cta .gm-i { width: 16px; height: 16px; }
  #gm-header .gm-cta-k { display: none; }
}
@media (min-width: 1000px) and (max-width: 1149px) {
  #gm-header .gm-cta-l { display: none; }
  #gm-header .gm-cta-k { display: inline; }
  #gm-header .gm-link { padding-left: 11px; padding-right: 11px; }
  #gm-header .gm-in { gap: 12px; }
}
@media (min-width: 1000px) and (hover: hover) and (pointer: fine) {
  #gm-header .gm-item:hover > .gm-pill::after { opacity: 1; transform: none; }
  #gm-header .gm-cta:hover { transform: translateY(-1px); box-shadow: 0 6px 16px #1d514833; }
  #gm-header .gm-cta:hover:active { transform: scale(.97); }
  #gm-header .gm-util-nav a:hover { color: var(--gm-gold); }
  #gm-header .gm-zone:hover { background: var(--gm-cream); box-shadow: inset 0 0 0 1px var(--gm-hair); font-weight: 700; }
  #gm-header .gm-zone:hover .gm-i { opacity: 1; transform: none; }
}

/* ---------- 5 Aufklappmenüs ---------- */
@media (min-width: 1000px) {
  #gm-header .gm-panel {
    position: absolute; top: calc(100% + 8px); left: -16px; z-index: 2;
    display: flex; gap: 18px; padding: 16px; color: var(--gm-text); font-weight: 400;
    background: var(--gm-white); border: 1px solid var(--gm-hair); border-radius: 16px; box-shadow: 0 14px 40px #00000026;
    opacity: 0; transform: translateX(var(--gm-shift, 0px)) translateY(-6px) scale(.98); transform-origin: top left; visibility: hidden; pointer-events: none;
    transition: opacity 150ms var(--gm-ease-out), transform 150ms var(--gm-ease-out), visibility 0s linear 150ms;
  }
  /* Brücke über den Spalt zwischen Menüpunkt und Aufklappmenü, damit die Maus nicht „herausfällt“. */
  #gm-header .gm-panel::before { content: ""; position: absolute; left: 0; right: 0; top: -12px; height: 12px; }
  #gm-header .gm-item.is-open > .gm-panel {
    opacity: 1; transform: translateX(var(--gm-shift, 0px)); visibility: visible; pointer-events: auto;
    transition: opacity 200ms var(--gm-ease-out), transform 200ms var(--gm-ease-out), visibility 0s;
  }
  /* Wechsel zwischen zwei Aufklappmenüs: nur überblenden. */
  #gm-header.is-swap .gm-panel { transform: translateX(var(--gm-shift, 0px)); transition: opacity 120ms ease, visibility 0s linear 120ms; }
  #gm-header.is-swap .gm-item.is-open > .gm-panel { transition: opacity 120ms ease, visibility 0s; }

  #gm-header .gm-stg { opacity: 0; transform: translateY(6px); transition: opacity 120ms ease, transform 120ms ease; }
  #gm-header .gm-item.is-open .gm-stg {
    opacity: 1; transform: none;
    transition: opacity 220ms var(--gm-ease-out) calc(var(--i) * 18ms + 40ms), transform 220ms var(--gm-ease-out) calc(var(--i) * 18ms + 40ms);
  }

  /* Liste links, Bild rechts */
  #gm-header .gm-cities { position: relative; display: flex; flex-direction: column; width: 210px; }
  #gm-header .gm-hl { position: absolute; left: 0; right: 0; top: 0; height: 44px; border-radius: 10px; background: var(--gm-cream); box-shadow: inset 0 0 0 1px var(--gm-hair); opacity: 0; transition: transform 180ms var(--gm-ease-out), opacity 140ms ease; }
  #gm-header .gm-city { position: relative; display: flex; align-items: center; justify-content: space-between; height: 44px; padding: 0 14px; font-size: 16px; }
  #gm-header .gm-city .gm-i { width: 14px; height: 14px; opacity: 0; transform: translateX(-4px); transition: opacity 160ms ease, transform 160ms var(--gm-ease-out); }
  #gm-header .gm-city.is-on, #gm-header .gm-city.is-cur { font-weight: 700; }
  #gm-header .gm-city.is-on .gm-i { opacity: 1; transform: none; }
  #gm-header .gm-all { position: relative; margin-top: auto; padding: 10px 14px 2px; font-size: 14px; font-weight: 700; color: var(--gm-green); }

  #gm-header .gm-pane { position: relative; width: 340px; height: 226px; border-radius: 12px; overflow: hidden; background: var(--gm-ink); }
  #gm-header .gm-layer { position: absolute; inset: 0; display: block; color: var(--gm-white); opacity: 0; transform: scale(1.04); pointer-events: none; transition: opacity 260ms var(--gm-ease-out), transform 420ms var(--gm-ease-out); }
  #gm-header .gm-layer.is-on { opacity: 1; transform: none; pointer-events: auto; }
  #gm-header .gm-layer img { width: 100%; height: 100%; object-fit: cover; display: block; }
  #gm-header .gm-layer svg { position: absolute; inset: 0; width: 100%; height: 100%; font-family: inherit; }
  #gm-header .gm-lab { position: absolute; left: 0; right: 0; bottom: 0; display: flex; justify-content: space-between; align-items: flex-end; padding: 28px 14px 10px; background: linear-gradient(#0000, #000000c2); }
  #gm-header .gm-lab b { font-family: "Playfair Display", Georgia, serif; font-size: 19px; font-weight: 700; }
  #gm-header .gm-lab span { font-size: 13px; font-weight: 700; color: var(--gm-gold); }
  #gm-header .gm-info { position: absolute; right: 14px; top: 12px; display: flex; flex-direction: column; text-align: right; }
  #gm-header .gm-info small { font-size: 10px; letter-spacing: .14em; text-transform: uppercase; font-weight: 700; color: var(--gm-gold); }
  #gm-header .gm-info b { font-family: "Playfair Display", Georgia, serif; font-size: 19px; font-weight: 700; }
  #gm-header .gm-more { position: absolute; right: 14px; bottom: 10px; font-size: 13px; font-weight: 700; color: var(--gm-gold); }
  #gm-header .gm-dot { transform-box: fill-box; transform-origin: center; transform: scale(.4); opacity: 0; transition: transform 160ms ease, opacity 160ms ease; }
  #gm-header .gm-item.is-open .gm-dot { transform: none; opacity: 1; transition: transform 320ms var(--gm-ease-out) calc(var(--i) * 50ms + 120ms), opacity 220ms ease calc(var(--i) * 50ms + 120ms); }

  /* Spalten */
  #gm-header .gm-cols { display: grid; grid-template-columns: repeat(3, 168px); gap: 0 4px; }
  #gm-header .gm-zone { display: flex; align-items: center; justify-content: space-between; height: 40px; padding: 0 12px; border-radius: 10px; font-size: 15.5px; white-space: nowrap; }
  #gm-header .gm-zone .gm-i { width: 14px; height: 14px; opacity: 0; transform: translateX(-4px); transition: opacity 160ms ease, transform 160ms var(--gm-ease-out); }
  #gm-header .gm-zone.gm-alle { color: var(--gm-green); font-weight: 700; }
  #gm-header .gm-zone.is-cur { font-weight: 700; background: var(--gm-cream); box-shadow: inset 0 0 0 1px var(--gm-hair); }
  #gm-header .gm-item.is-open .gm-zone { transition: opacity 220ms var(--gm-ease-out) calc(var(--i) * 18ms + 40ms), transform 220ms var(--gm-ease-out) calc(var(--i) * 18ms + 40ms), background-color 160ms ease, box-shadow 160ms ease; }
}
@media (max-width: 999px) { #gm-header .gm-panel { display: none; } }

/* ---------- 6 Handy (unter 1000 px) ---------- */
@media (max-width: 999px) {
  #gm-header .gm-logo-w, #gm-header .gm-logo-d { transform-origin: left center; }
  #gm-header.is-scrolled:not(.is-open) .gm-logo-w, #gm-header.is-scrolled:not(.is-open) .gm-logo-d { opacity: 0; transform: translateX(-6px); }
  #gm-header.is-scrolled:not(.is-open) .gm-logo-s { opacity: 1; transform: none; }

  #gm-header .gm-cta { margin-left: auto; margin-right: 6px; padding: 9px 13px; font-size: 13px; opacity: 0; transform: translateY(6px); pointer-events: none; transition: opacity 160ms ease, transform 160ms ease; }
  #gm-header .gm-cta-l { display: none; }
  #gm-header.is-scrolled:not(.is-open) .gm-cta { opacity: 1; transform: none; pointer-events: auto; transition: opacity 240ms var(--gm-ease-out) 60ms, transform 240ms var(--gm-ease-out) 60ms; }
  #gm-header.is-scrolled:not(.is-open) .gm-cta:active { transform: scale(.97); }

  #gm-header .gm-burger { position: relative; flex: 0 0 auto; width: 44px; height: 44px; border-radius: 50% !important; background: transparent; transition: background-color 220ms ease, transform 140ms var(--gm-ease-out); }
  :is(body:has(#header-outer[data-transparent-header="true"]) #gm-header, #gm-header.is-hero):not(.is-scrolled):not(.is-open) .gm-burger { background: #00000052; }
  #gm-header .gm-burger:active { transform: scale(.94); }
  #gm-header .gm-burger i { position: absolute; left: 12px; right: 12px; top: 21px; height: 2px; border-radius: 1px; background: currentColor; transition: transform 260ms var(--gm-ease-in-out); }
  #gm-header .gm-burger i:first-child { transform: translateY(-4px); }
  #gm-header .gm-burger i:last-child { transform: translateY(4px); }
  #gm-header.is-open .gm-burger i:first-child { transform: rotate(45deg); }
  #gm-header.is-open .gm-burger i:last-child { transform: rotate(-45deg); }
}

/* ---------- 7 Menüblatt ---------- */
#gm-sheet {
  position: fixed; inset: 0; z-index: 9997;
  display: flex; flex-direction: column; padding-top: calc(var(--gm-top) + 58px);
  background: var(--gm-cream); color: var(--gm-text); font-family: inherit; font-size: 16px; line-height: 1.3;
  transform: translateX(100%); visibility: hidden;
  transition: transform 280ms var(--gm-ease-drawer), visibility 0s linear 280ms;
}
#gm-sheet.is-open { transform: none; visibility: visible; transition: transform 380ms var(--gm-ease-drawer), visibility 0s; }
@media (min-width: 1000px) { #gm-sheet { display: none; } }

#gm-sheet .gm-list { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; padding: 4px 18px 0; }
#gm-sheet .gm-it { border-bottom: 1px solid var(--gm-hair); }
#gm-sheet .gm-it, #gm-sheet .gm-sec { opacity: 0; transform: translateX(16px); transition: opacity 140ms ease, transform 140ms ease; }
#gm-sheet.is-open .gm-it, #gm-sheet.is-open .gm-sec {
  opacity: 1; transform: none;
  transition: opacity 320ms var(--gm-ease-out) calc(var(--i) * 40ms + 90ms), transform 320ms var(--gm-ease-out) calc(var(--i) * 40ms + 90ms);
}
#gm-sheet .gm-row, #gm-sheet .gm-acc {
  display: flex; align-items: center; justify-content: space-between; width: 100%; height: 50px; text-align: left;
  font-family: "Playfair Display", Georgia, serif; font-size: 22px; font-weight: 600; color: var(--gm-text);
}
#gm-sheet .gm-acc { border-radius: 0 !important; }
#gm-sheet .gm-acc .gm-i { width: 18px; height: 18px; transition: transform 260ms var(--gm-ease-out); }
#gm-sheet .gm-acc[aria-expanded="true"] .gm-i { transform: rotate(180deg); }
#gm-sheet .gm-row .gm-i { width: 16px; height: 16px; }
/* Aktuelle Seite: weiße Fläche mit feinem Rand (das Blatt selbst ist cremefarben). */
#gm-sheet .gm-it.is-cur { border-bottom-color: transparent; }
#gm-sheet .gm-it.is-cur > .gm-row { width: auto; height: 40px; margin: 5px -12px; padding: 0 12px; border-radius: 10px; background: var(--gm-white); box-shadow: inset 0 0 0 1px var(--gm-hair); }

#gm-sheet .gm-sub { display: grid; grid-template-rows: 0fr; visibility: hidden; transition: grid-template-rows 260ms var(--gm-ease-out), visibility 0s linear 260ms; }
#gm-sheet .gm-sub > div { overflow: hidden; min-height: 0; opacity: 0; transition: opacity 160ms ease; }
#gm-sheet .gm-sub.is-on { grid-template-rows: 1fr; visibility: visible; transition: grid-template-rows 260ms var(--gm-ease-out), visibility 0s; }
#gm-sheet .gm-sub.is-on > div { opacity: 1; padding-bottom: 8px; transition: opacity 260ms ease 60ms; }

#gm-sheet .gm-crow { display: flex; align-items: center; gap: 12px; height: 46px; margin: 0 -8px; padding: 0 8px; border-radius: 10px; font-size: 16px; transition: background-color 120ms ease; }
#gm-sheet .gm-crow:active, #gm-sheet .gm-crow.is-cur { background: var(--gm-white); box-shadow: inset 0 0 0 1px var(--gm-hair); }
#gm-sheet .gm-crow.is-cur { font-weight: 700; }
#gm-sheet .gm-crow img, #gm-sheet .gm-crow-leer { width: 36px; height: 36px; border-radius: 8px; object-fit: cover; flex: 0 0 auto; background: var(--gm-hair); }
#gm-sheet .gm-crow .gm-i { margin-left: auto; width: 15px; height: 15px; color: var(--gm-grey); }
#gm-sheet .gm-crow--alle { height: 40px; font-size: 15px; font-weight: 700; color: var(--gm-green); }
#gm-sheet .gm-zg { display: grid; grid-template-columns: 1fr 1fr; gap: 0 12px; }
#gm-sheet .gm-zg a { display: flex; align-items: center; height: 38px; font-size: 15px; }
#gm-sheet .gm-zg a.is-cur { font-weight: 700; }
#gm-sheet .gm-zg .gm-alle { grid-column: 1 / -1; font-weight: 700; color: var(--gm-green); }
#gm-sheet .gm-sec { display: flex; flex-wrap: wrap; gap: 6px 20px; padding: 14px 0 12px; font-size: 15px; color: var(--gm-grey); }
#gm-sheet .gm-sec a.is-cur { font-weight: 700; color: var(--gm-text); }

#gm-sheet .gm-foot { flex: 0 0 auto; padding: 12px 16px calc(18px + env(safe-area-inset-bottom, 0px)); border-top: 1px solid var(--gm-hair); background: var(--gm-cream); transform: translateY(100%); transition: transform 200ms ease; }
#gm-sheet.is-open .gm-foot { transform: none; transition: transform 360ms var(--gm-ease-out) 160ms; }
#gm-sheet .gm-scta { display: flex; align-items: center; justify-content: center; gap: 8px; height: 52px; border-radius: 999px; background: var(--gm-mint); color: var(--gm-green); font-size: 16px; font-weight: 700; transition: transform 140ms var(--gm-ease-out); }
#gm-sheet .gm-scta:active { transform: scale(.97); }
#gm-sheet .gm-scta .gm-i { width: 18px; height: 18px; }

/* ---------- 8 Weniger Bewegung ---------- */
@media (prefers-reduced-motion: reduce) {
  #gm-header, #gm-header .gm-logo img, #gm-header .gm-cta, #gm-header .gm-pill::after, #gm-header .gm-panel, #gm-header .gm-stg, #gm-header .gm-hl,
  #gm-header .gm-layer, #gm-header .gm-dot, #gm-header .gm-burger i, #gm-header .gm-caret .gm-i,
  #gm-sheet, #gm-sheet .gm-it, #gm-sheet .gm-sec, #gm-sheet .gm-foot, #gm-sheet .gm-acc .gm-i { transition-duration: 0.01ms !important; transition-delay: 0s !important; }
  #gm-header .gm-layer, #gm-header .gm-panel, #gm-sheet, #gm-sheet .gm-it, #gm-sheet .gm-sec { transition-property: opacity, visibility !important; transition-duration: 160ms !important; }
  #gm-header .gm-stg, #gm-header .gm-dot, #gm-sheet .gm-it, #gm-sheet .gm-sec, #gm-header .gm-layer { transform: none !important; }
  #gm-header .gm-panel { transform: translateX(var(--gm-shift, 0px)) !important; }
  #gm-sheet { transform: none !important; opacity: 0; }
  #gm-sheet.is-open { opacity: 1; }
  #gm-sheet .gm-foot { transform: none !important; }
  #gm-sheet .gm-sub { transition: none !important; }
}

/* ---------- Startseite: großes Logo mit Unterzeile, solange oben (Jan, 14.11.2026) ---------- */
#gm-header .gm-logo-g { opacity: 0; transform-origin: left center; }
#gm-header.gm--start .gm-logo { width: 150px; height: 48px; }
#gm-header.gm--start .gm-logo-w, #gm-header.gm--start .gm-logo-d { height: 38px; top: 5px; }
#gm-header.gm--start .gm-logo-s { height: 38px; top: 5px; }
#gm-header.gm--start:not(.is-scrolled):not(.is-open) .gm-logo-g { opacity: 1; }
#gm-header.gm--start:not(.is-scrolled):not(.is-open) .gm-logo-w,
#gm-header.gm--start:not(.is-scrolled):not(.is-open) .gm-logo-d { opacity: 0; }
@media (min-width: 1000px) {
  #gm-header.gm--start .gm-logo { width: 200px; height: 64px; }
  #gm-header.gm--start .gm-logo-w, #gm-header.gm--start .gm-logo-d { height: 40px; top: 12px; }
}

/* ---------- Karte mit echtem Kartenbild im Hintergrund (Jan, 14.11.2026) ---------- */
@media (min-width: 1000px) {
  #gm-header .gm-layer--map .gm-karte-bild { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
  #gm-header .gm-layer--map.hat-bild::before { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(#14110d8c 0%, #14110d00 34%, #14110d00 70%, #14110d73 100%); pointer-events: none; }
  #gm-header .gm-layer--map.hat-bild:not(.ist-hell) .gm-karte-bild { filter: brightness(2.1) contrast(1.08) sepia(.25); }
  #gm-header .gm-layer--map.hat-bild.ist-hell .gm-karte-bild { filter: grayscale(1) invert(1) brightness(.78) contrast(1.15); }
  #gm-header .gm-layer--map.hat-bild svg { z-index: 2; }
  #gm-header .gm-layer--map.hat-bild .gm-more { right: auto; left: 14px; } /* rechts unten steht der Quellenhinweis im Bild */
  #gm-header .gm-layer--map.hat-bild .gm-info, #gm-header .gm-layer--map.hat-bild .gm-more { z-index: 3; }
  #gm-header .gm-layer--map.hat-bild text { paint-order: stroke; stroke: #14110d; stroke-width: 3px; stroke-linejoin: round; font-weight: 700; }
}

/* ---------- Umriss-Karte (0.2.0) ---------- */
@media (min-width: 1000px) {
  #gm-header .gm-layer--map.ist-umriss { background: radial-gradient(120% 120% at 30% 20%, #2c2417 0%, var(--gm-ink) 70%); }
  #gm-header .gm-layer--map.ist-umriss::after { content: ""; position: absolute; right: 0; top: 0; width: 62%; height: 46%; background: radial-gradient(100% 100% at 100% 0%, #14110df2 0%, #14110d99 45%, #14110d00 100%); pointer-events: none; }
  #gm-header .gm-layer--map.ist-umriss .gm-info, #gm-header .gm-layer--map.ist-umriss .gm-more { z-index: 2; }
  #gm-header .gm-umriss-nb { fill: #ffffff05; stroke: #ffffff22; stroke-width: .8; }
  #gm-header .gm-umriss-land { fill: #ffffff12; stroke: #E1B520; stroke-opacity: .7; stroke-width: 1.1; stroke-linejoin: round; }
  #gm-header .gm-layer--map.ist-umriss text { font-weight: 700; font-size: 11.5px; paint-order: stroke; stroke: #14110d; stroke-width: 2.5px; stroke-linejoin: round; }
}

/* ---------- Logo je Seite (seit 0.2.2): eigenes Logo, z. B. mit Unterzeile „Laser Akademie“ ----------
   Höher als das normale Logo, damit die Unterzeile lesbar bleibt. Die Höhe der Kopfzeile
   (58 / 68 px) ändert sich nicht; die Breite folgt dem Seitenverhältnis des Bildes.
   Am Rechner ist die Hauptzeile in zwei Bereichen knapp (gemessen 14.11.2026 mit sechs
   Menüpunkten: knapp über 1000 px und ab 1150 px, wo der Buchungsknopf seinen langen Text
   bekommt). Dort bleibt das Logo kleiner, sonst liefe es in den ersten Menüpunkt. */
#gm-header.gm--seite { --gm-seite-h: 42px; }
/* Sehr schmale Telefone: Logo, Buchungsknopf und Menüknopf füllen die Zeile schon ohne Zuschlag. */
@media (max-width: 371px) { #gm-header.gm--seite { --gm-seite-h: 38px; } }
#gm-header.gm--seite .gm-logo { height: var(--gm-seite-h); width: calc(var(--gm-seite-h) * var(--gm-seite-ar, 3.32)); }
#gm-header.gm--seite .gm-logo-s { height: 38px; top: 2px; }
@media (min-width: 1000px) { #gm-header.gm--seite { --gm-seite-h: 44px; } }
@media (min-width: 1040px) { #gm-header.gm--seite { --gm-seite-h: 50px; } }
@media (min-width: 1150px) { #gm-header.gm--seite { --gm-seite-h: 40px; } }
@media (min-width: 1210px) { #gm-header.gm--seite { --gm-seite-h: 44px; } }
@media (min-width: 1260px) { #gm-header.gm--seite { --gm-seite-h: 50px; } }