/* Gastkontor -- Seitenaufbau der Homepage (Entwurf O2, Abschnitt 5).
   Voraussetzung: tokens.css und basis.css sind VORHER eingebunden. Diese Datei benutzt nur
   Zwecktokens und Masstokens, nie einen Hexwert und nie die Grundpalette. Kein Stil steht in den
   Seiten selbst -- die Content-Security-Policy default-src 'self' verbietet Inline-Stile. */

.gk-seite{max-width:44rem;margin:0 auto;padding:0 var(--gk-a4)}
.gk-abschnitt{padding:var(--gk-a7) 0;border-bottom:1px solid var(--gk-rand)}
.gk-abschnitt:last-child{border-bottom:0}
.gk-oben{padding-top:var(--gk-a8)}
/* Das laengste Wort der Ueberschrift, "Ferienhausvermietung", misst bei 39 px 413 px, bei 25 px 265 px
   (gemessen im Browser am 29.09.2026); bei 360 px Breite bleiben 328 px. Schmal deshalb die Groesse
   von h2, die Schaugroesse erst ab 560 px. */
.gk-oben .gk-schau{font-size:var(--gk-groesse-h2)}
.gk-liste{margin:0 0 var(--gk-a4);padding-left:1.25em}
.gk-liste li{margin:0 0 var(--gk-a2)}

/* Kopfzeile: Marke und Textverweise so hoch wie ein Knopf, damit jedes Ziel 44 px misst -- die Marke
   braechte sonst nur die 36 px des Signets mit (gemessen in der Pruefung von Aufgabe 3, 29.09.2026) */
.gk-kopf__marke{min-height:var(--gk-hoehe-bedien)}
.gk-kopf__nav a{min-height:var(--gk-hoehe-bedien);display:inline-flex;align-items:center}

/* Fuss mit Rechtlichem und TENGE */
.gk-fuss{border-top:1px solid var(--gk-rand);padding:var(--gk-a6) 0 var(--gk-a7)}
.gk-fuss__links{display:flex;flex-wrap:wrap;gap:var(--gk-a4);margin:0 0 var(--gk-a5)}
.gk-fuss__links a{min-height:var(--gk-hoehe-bedien);display:inline-flex;align-items:center}

/* TENGE-Block (E4, E13): immer auf heller Karte -- die Schrift im Bild ist dunkelblau. Das
   data-theme="light" am Behaelter setzt die hellen Werte (tokens.css, Block
   :root,[data-theme="light"]). Breit die Zeile
   mit eingebranntem "EIN BETRIEB VON" in natuerlicher Groesse (Wappen 72 px); schmal der Stapel
   ohne eingebrannte Zeile, darueber derselbe Text als echter Text. Das Wappen steht erst unterhalb
   von etwa 294 px Fensterbreite unter 64 px (gerechnet; bei 280 px gemessen 60,2 px am 30.09.2026):
   Die Zeile erscheint erst, wenn sie ganz hineinpasst (458 + 2 x 16 + 2 x 16 = 522 px plus Reserve);
   der Stapel ist hoechstens 300 px breit (gerechnet 84 px Wappen; bei 360 px Fensterbreite gemessen
   82,7 px am 29.09.2026). */
.gk-tenge{display:flex;justify-content:center;padding:var(--gk-a4)}
.gk-tenge__zeile{display:none;width:458px;max-width:none;height:auto}
.gk-tenge__stapel{display:grid;justify-items:center;gap:var(--gk-a2);width:min(100%,300px)}
.gk-tenge__stapel img{display:block;width:100%;height:auto}
.gk-tenge__vor{margin:0;font-size:var(--gk-groesse-klein);letter-spacing:0.2em;text-transform:uppercase;color:var(--gk-text-still)}
@media (min-width:560px){
  .gk-oben .gk-schau{font-size:var(--gk-groesse-schau)}
  .gk-tenge__zeile{display:block}
  .gk-tenge__stapel{display:none}
}