/* ==========================================================================
   Template «Heitersberg 2.0 Breit» – baut auf «Heitersberg 2.0» auf (wird danach geladen).
   Farben, Schriften und Titel wie «Heitersberg 2.0», nur die Breite von «Heitersberg Weiss»:
   Inhalt nutzt rund 80 % des Bildschirms (Rand wächst mit). Lesetext bleibt bei gut
   lesbarer Zeilenlänge, Bilder, Galerien und Tabellen nutzen die volle Breite.
   ========================================================================== */

:root.theme-heitersberg2-breit {
  /* Seitenrand: Handy 20px, wächst mit dem Bildschirm, Inhalt ≈ 80–85 % */
  --hw-gutter: clamp(20px, 10vw - 24px, 260px);
  --hw-width: min(1680px, 100% - 2 * var(--hw-gutter));
  --hw-narrow: min(clamp(680px, 54vw, 940px), 100% - 2 * var(--hw-gutter));
  --h-measure: 70ch;
}

/* ---------- Breite: dynamisch statt fester Maximalbreite */
.theme-heitersberg2-breit .wrap { width: var(--hw-width); }
.theme-heitersberg2-breit .wrap.narrow { width: var(--hw-narrow); }
.theme-heitersberg2-breit .page-main .gallery { width: 100%; } /* Galerie in der Inhaltsspalte: kein zweiter Seitenrand */

/* ---------- Kopfbild etwas höher, passend zur Breite */
.theme-heitersberg2-breit .hero { min-height: clamp(440px, 70vh, 760px); }

/* ---------- Abschnitte und Bilder */
.theme-heitersberg2-breit .section-head { margin-bottom: clamp(28px, 3vw, 44px); }
.theme-heitersberg2-breit .article-figure { width: var(--hw-width); }
.theme-heitersberg2-breit .page-figure img, .theme-heitersberg2-breit .article-figure img { max-height: min(72vh, 760px); }
@media (max-width: 600px) {
  .theme-heitersberg2-breit .article-figure { width: 100%; }
  .theme-heitersberg2-breit .article-figure img { max-height: none; }
}

/* ---------- Beitragskarten: Spaltenzahl wächst mit der Breite */
.theme-heitersberg2-breit .card-grid { grid-template-columns: repeat(auto-fill, minmax(min(100%, 340px), 1fr)); gap: clamp(36px, 4vw, 56px) clamp(24px, 2.6vw, 40px); }
@media (max-width: 600px) {
  .theme-heitersberg2-breit .card-grid { grid-template-columns: 1fr; gap: 0; }
}

/* ---------- Inhaltsseiten: Seitenmenü und Inhalt passen sich der Breite an */
.theme-heitersberg2-breit .page-layout.with-aside { grid-template-columns: clamp(200px, 17vw, 280px) minmax(0, 1fr); gap: clamp(40px, 5vw, 104px); }
.theme-heitersberg2-breit .page-main { max-width: none; }
.theme-heitersberg2-breit .page-main .prose > :is(p, ul, ol, h2, h3, h4, blockquote, dl) { max-width: var(--h-measure); }
.theme-heitersberg2-breit .tile-list { grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); }
@media (max-width: 860px) {
  .theme-heitersberg2-breit .page-layout.with-aside { grid-template-columns: 1fr; }
}