/*
Theme Name: Byzantinische Musik
Theme URI: https://www.byzantinischemusik.at/
Author: Schule für Byzantinische und Traditionelle Musik der Metropolis von Austria
Author URI: https://www.byzantinischemusik.at/
Description: Zweisprachiges Theme (Deutsch/Griechisch) für die Schule für Byzantinische und Traditionelle Musik der Griechisch-orthodoxen Metropolis von Austria. Farben und Zierleisten aus dem Emblem der Schule, Schriften mit vollständiger polytonischer Unterstützung (Cardo, Gentium Book Plus), heller und dunkler Modus, Bausteine für Zeichentafeln, Intervalldiagramme, Archontenverzeichnisse und Glossare.
Version: 1.2.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: byzmusik
Tags: education, two-columns, right-sidebar, custom-logo, custom-menu, featured-images, translation-ready, block-patterns, block-styles, wide-blocks, accessibility-ready
*/

/* ============================================================
   1 · Farben aus dem Emblem
   Kronenrot #7A1410 · Zierrot #D74848 · Weizenocker #A86C24
   Weinlaubgrün #246C3C · Lapis #1E3A6E · Tinte #171512
   ============================================================ */
:root{
  --bg:#F5F3EF; --surface:#FFFFFF; --surface-2:#EFEBE4;
  --ink:#171512; --ink-soft:#4A4640; --muted:#7A746B;
  --accent:#7A1410; --accent-ink:#5E0F0C; --accent-wash:#F7E9E5; --on-accent:#FFF8F3;
  --ornament:#D74848; --ochre:#A86C24; --ochre-wash:#F7EFE1;
  --vine:#246C3C; --lapis:#1E3A6E;
  --line:#DFD8CC; --line-soft:#EBE5DB;
  --shadow-sm:0 1px 2px rgba(23,21,18,.05);
  --shadow:0 1px 2px rgba(23,21,18,.05), 0 10px 26px rgba(23,21,18,.07);
  --shadow-lg:0 2px 4px rgba(23,21,18,.06), 0 20px 48px rgba(23,21,18,.11);
  --display:"Cardo",Georgia,"Times New Roman",serif;
  --body:"Gentium Book Plus","Cardo",Georgia,serif;
  --ui:"Noto Sans","Helvetica Neue",Arial,sans-serif;
  --maxw:1180px; --measure:66ch; --radius:12px;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --bg:#14120F; --surface:#1C1916; --surface-2:#252118;
    --ink:#EFEAE1; --ink-soft:#BDB5A8; --muted:#8C8478;
    --accent:#E2765F; --accent-ink:#F0937E; --accent-wash:#2E1A16; --on-accent:#17120F;
    --ornament:#D9604F; --ochre:#D2A05A; --ochre-wash:#2A2317;
    --vine:#6FB98A; --lapis:#8EA9DC;
    --line:#332D25; --line-soft:#272219;
    --shadow-sm:0 1px 2px rgba(0,0,0,.4);
    --shadow:0 1px 2px rgba(0,0,0,.4), 0 10px 26px rgba(0,0,0,.4);
    --shadow-lg:0 2px 4px rgba(0,0,0,.5), 0 20px 48px rgba(0,0,0,.5);
  }
}
:root[data-theme="dark"]{
  --bg:#14120F; --surface:#1C1916; --surface-2:#252118;
  --ink:#EFEAE1; --ink-soft:#BDB5A8; --muted:#8C8478;
  --accent:#E2765F; --accent-ink:#F0937E; --accent-wash:#2E1A16; --on-accent:#17120F;
  --ornament:#D9604F; --ochre:#D2A05A; --ochre-wash:#2A2317;
  --vine:#6FB98A; --lapis:#8EA9DC;
  --line:#332D25; --line-soft:#272219;
  --shadow-sm:0 1px 2px rgba(0,0,0,.4);
  --shadow:0 1px 2px rgba(0,0,0,.4), 0 10px 26px rgba(0,0,0,.4);
  --shadow-lg:0 2px 4px rgba(0,0,0,.5), 0 20px 48px rgba(0,0,0,.5);
}

/* ============================================================
   2 · Grundlagen
   ============================================================ */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--body);
  font-size:17.5px;line-height:1.64;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4,h5,h6{font-family:var(--display);font-weight:700;line-height:1.16;
  text-wrap:balance;margin:1.7em 0 .5em;color:var(--ink)}
h1{font-size:clamp(30px,4.6vw,46px);letter-spacing:-.014em}
h2{font-size:clamp(23px,3.1vw,30px);letter-spacing:-.008em}
h3{font-size:20.5px;font-family:var(--ui);font-weight:600;letter-spacing:-.004em}
h4{font-size:18px;font-family:var(--ui);font-weight:600}
p,ul,ol,dl,table,figure,blockquote,pre{margin:0 0 1.1em}
a{color:var(--accent);text-decoration:none;text-underline-offset:2px}
a:hover,a:focus{text-decoration:underline}
img{max-width:100%;height:auto}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:3px}
hr{border:0;border-top:1px solid var(--line);margin:2.4em 0}
code,kbd,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.92em}
pre{background:var(--surface-2);padding:14px 16px;border-radius:8px;overflow-x:auto}
blockquote{border-left:3px solid var(--accent);padding:2px 0 2px 20px;
  color:var(--ink-soft);font-style:italic}
.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;
  clip:rect(1px,1px,1px,1px);white-space:nowrap}
.skip-link{position:absolute;left:-9999px;top:0;z-index:100;background:var(--surface);
  color:var(--ink);padding:12px 18px;border:1px solid var(--line);border-radius:0 0 8px 0}
.skip-link:focus{left:0}
.wrap{max-width:var(--maxw);margin:0 auto;padding-inline:22px}
.wrap-narrow{max-width:860px;margin:0 auto;padding-inline:22px}

/* Zierband aus dem Ring des Emblems */
.zierband{height:11px;background-repeat:repeat-x;background-position:center;
  background-size:28px 11px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='11' viewBox='0 0 28 11'%3E%3Cg fill='%23D74848'%3E%3Cpath d='M0 11L7 1l7 10z'/%3E%3Cpath d='M14 0l7 10 7-10z' opacity='.5'/%3E%3C/g%3E%3C/svg%3E")}
.zierband.duenn{height:7px;background-size:18px 7px;opacity:.75}

/* ============================================================
   3 · Kopf und Navigation
   ============================================================ */
.site-head{position:sticky;top:0;z-index:40;background:var(--surface);
  box-shadow:var(--shadow-sm)}
@supports (backdrop-filter:blur(8px)){
  .site-head{background:color-mix(in srgb,var(--surface) 93%,transparent);backdrop-filter:blur(12px)}
}
.head-row{display:flex;align-items:center;gap:16px;padding-block:13px}
.brand{display:flex;align-items:center;gap:13px;min-width:0;max-width:370px;text-decoration:none}
.brand:hover{text-decoration:none}
.brand img,.brand .brand-logo,.brand .custom-logo{width:58px;height:58px;
  max-width:58px;border-radius:50%;object-fit:contain;
  background:#fff;flex:0 0 auto;box-shadow:0 0 0 1px var(--line)}
.brand-text{display:flex;flex-direction:column;gap:1px;min-width:0}
.brand-gr{font-family:var(--display);font-size:12.5px;letter-spacing:.045em;
  color:var(--accent);line-height:1.26}
.brand-de{font-family:var(--display);font-size:17px;font-weight:700;color:var(--ink);line-height:1.18}
.nav-toggle{display:none;margin-left:auto;font-family:var(--ui);font-size:13px;
  border:1px solid var(--line);background:transparent;color:var(--ink-soft);
  border-radius:999px;padding:8px 15px;cursor:pointer}
.nav-toggle[aria-expanded="true"]{background:var(--accent);border-color:var(--accent);
  color:var(--on-accent)}
.main-nav{margin-left:auto}
.main-nav ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:1px}
.main-nav li{position:relative}
.main-nav a{display:block;font-family:var(--ui);font-size:13.5px;color:var(--ink-soft);
  padding:8px 10px;border-radius:7px;white-space:nowrap;transition:background .14s,color .14s}
.main-nav a:hover{background:var(--surface-2);color:var(--ink);text-decoration:none}
.main-nav .current-menu-item>a,.main-nav .current_page_item>a,
.main-nav .current-menu-ancestor>a,.main-nav .current_page_ancestor>a{
  color:var(--accent-ink);font-weight:600;box-shadow:inset 0 -2px 0 var(--accent)}
.main-nav .menu-item-has-children>a::after{content:" ▾";color:var(--muted);font-size:10px}
.main-nav .sub-menu{position:absolute;left:0;top:100%;display:none;flex-direction:column;
  min-width:240px;background:var(--surface);border:1px solid var(--line);
  border-radius:10px;padding:6px;box-shadow:var(--shadow-lg);z-index:50}
.main-nav li:hover>.sub-menu,.main-nav li:focus-within>.sub-menu{display:flex}
.main-nav .sub-menu a{white-space:normal;border-radius:6px;padding:9px 11px;box-shadow:none}
.theme-toggle{font-family:var(--ui);font-size:12px;border:1px solid var(--line);
  background:transparent;color:var(--muted);border-radius:999px;padding:7px 13px;
  cursor:pointer;flex:0 0 auto}
.theme-toggle:hover{color:var(--ink);border-color:var(--muted)}

/* ============================================================
   4 · Startseite
   ============================================================ */
.hero{position:relative;background:
    radial-gradient(1200px 420px at 18% -8%, var(--ochre-wash), transparent 70%),
    linear-gradient(180deg, var(--surface), var(--bg));
  border-bottom:1px solid var(--line)}
.hero-inner{display:grid;grid-template-columns:auto minmax(0,1fr);gap:44px;
  align-items:center;padding-block:58px 52px}
.hero.ohne-emblem .hero-inner{grid-template-columns:minmax(0,1fr);padding-block:44px 40px}
.hero .emblem{width:190px;height:190px;border-radius:50%;background:#fff;
  box-shadow:0 0 0 1px var(--line), var(--shadow-lg)}
.hero-title{margin:0;font-size:clamp(30px,4.6vw,46px)}
.hero-gr{font-family:var(--display);font-style:italic;font-size:clamp(17px,2.3vw,23px);
  color:var(--accent);margin:12px 0 0}
.hero-text{font-size:19px;line-height:1.56;color:var(--ink-soft);max-width:44ch;margin:18px 0 0}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}
.neumenregel{display:block;width:100%;max-width:330px;height:26px;color:var(--ink);
  margin:20px 0 0;opacity:.85}

.btn{display:inline-block;font-family:var(--ui);font-size:14.5px;font-weight:600;
  padding:11px 22px;border-radius:999px;border:1px solid transparent;cursor:pointer;
  transition:background .14s,color .14s,border-color .14s}
.btn-primary{background:var(--accent);color:var(--on-accent)}
.btn-primary:hover{background:var(--accent-ink);color:var(--on-accent);text-decoration:none}
.btn-ghost{background:transparent;color:var(--accent);border-color:var(--line)}
.btn-ghost:hover{border-color:var(--accent);text-decoration:none}

.section{padding-block:52px}
.section-alt{background:var(--surface);border-block:1px solid var(--line)}
.section-head{display:flex;flex-direction:column;gap:6px;margin-bottom:26px;max-width:var(--measure)}
.section-head h2{margin:0;position:relative;padding-left:22px}
.section-head h2::before{content:"";position:absolute;left:0;top:.52em;width:11px;height:11px;
  background:var(--ornament);transform:rotate(45deg)}
.section-head p{margin:0;color:var(--ink-soft);font-size:17px}

/* ============================================================
   5 · Seitenkopf und Inhalt
   ============================================================ */
.page-head{padding-block:44px 6px;max-width:var(--measure)}
.eyebrow{font-family:var(--ui);font-size:11.5px;letter-spacing:.17em;
  text-transform:uppercase;color:var(--ochre);margin:0 0 10px;font-weight:600}
.page-title{margin:0}
.untertitel-griechisch{font-family:var(--display);font-style:italic;
  font-size:clamp(17px,2.2vw,23px);color:var(--accent);margin:11px 0 0}
.lead{font-size:20.5px;line-height:1.56;color:var(--ink-soft);font-style:italic;
  max-width:36em;margin:20px 0 0}
.site-main{padding-bottom:70px}
.layout{display:grid;grid-template-columns:minmax(0,1fr);gap:46px;margin-top:30px}
.layout.has-sidebar{grid-template-columns:minmax(0,1fr) 296px}
.entry-meta{font-family:var(--ui);font-size:13px;color:var(--muted);margin:12px 0 0}

/* Lesebreite für Fließtext, volle Breite für Tabellen und Abbildungen */
.entry-content{max-width:none;margin-top:26px}
.entry-content > p,.entry-content > ul,.entry-content > ol,.entry-content > dl,
.entry-content > h2,.entry-content > h3,.entry-content > h4,.entry-content > h5,
.entry-content > blockquote,.entry-content > pre,.entry-content > .lead,
.entry-content > dl.angaben,.entry-content > blockquote.hinweis,
.entry-content > .wp-block-paragraph,.entry-content > .wp-block-list,
.entry-content > .wp-block-heading,.entry-content > .wp-block-quote{max-width:var(--measure)}
.entry-content > ul.teaser,.entry-content > ul.zeichentafel,.entry-content > table,
.entry-content > figure,.entry-content > .tablewrap,.entry-content > .alignwide,
.entry-content > .alignfull,.entry-content > p.parallage,.entry-content > p.aufruf,
.entry-content > .karten{max-width:none}

/* Initial für den ersten Absatz einer Seite */
.entry-content.mit-initial > p:first-of-type::first-letter{
  float:left;font-family:var(--display);font-weight:700;font-size:4.1em;line-height:.82;
  padding:.06em .1em 0 0;color:var(--accent)}

/* ============================================================
   6 · Bausteine der Fachseiten
   ============================================================ */
/* Tabellen */
.entry-content table,table.zeitleiste,table.glossar{border-collapse:collapse;width:100%;
  font-size:15.5px;background:var(--surface);border:1px solid var(--line);
  border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-sm)}
.entry-content th,.entry-content td{text-align:left;padding:10px 15px;
  border-bottom:1px solid var(--line-soft);vertical-align:top}
.entry-content thead th{font-family:var(--ui);font-size:11.5px;letter-spacing:.08em;
  text-transform:uppercase;color:var(--muted);font-weight:600;
  background:var(--surface-2);border-bottom:1px solid var(--line)}
.entry-content tbody tr:last-child td{border-bottom:none}
.entry-content tbody tr:hover td{background:var(--ochre-wash)}
.entry-content caption{caption-side:top;text-align:left;font-family:var(--ui);
  font-size:12.5px;color:var(--muted);padding:11px 15px 7px}
.tablewrap{overflow-x:auto;border-radius:var(--radius)}
table.zeitleiste th[scope="row"]{font-family:var(--ui);font-size:13.5px;font-weight:600;
  color:var(--accent-ink);white-space:nowrap;width:124px}
table.glossar td:nth-child(2){font-family:var(--display);color:var(--accent);font-size:17.5px}
table.glossar td:first-child{font-weight:600}
td[lang="grc"],span[lang="grc"],.gr,.name-gr{font-family:var(--display)}

/* Redaktions- und Merkkasten */
blockquote.hinweis{border-left:4px solid var(--accent);background:var(--accent-wash);
  padding:15px 18px;border-radius:0 10px 10px 0;font-size:15.5px;color:var(--ink-soft);
  font-style:normal;margin-block:1.5em}
blockquote.hinweis strong{color:var(--ink)}
blockquote.merksatz{border-left:4px solid var(--ochre);background:var(--ochre-wash);
  padding:15px 18px;border-radius:0 10px 10px 0;font-style:normal;color:var(--ink)}

/* Abbildungen, Diagramme, Zeichentafel */
figure.abbildung{background:var(--surface);border:1px solid var(--line);
  border-radius:var(--radius);padding:22px 20px 15px;box-shadow:var(--shadow);
  display:flex;flex-direction:column;gap:13px}
figure.abbildung svg{display:block;width:100%;height:auto;max-width:680px;
  margin:0 auto;color:var(--ink)}
figure.abbildung img{display:block;margin:0 auto;max-width:360px;
  border:1px solid var(--line);border-radius:5px;background:#fff}
figure.abbildung figcaption{font-family:var(--ui);font-size:13.5px;line-height:1.5;
  color:var(--muted);border-top:1px solid var(--line-soft);padding-top:11px}
figure.abbildung figcaption strong{color:var(--ink-soft)}
ul.zeichentafel{display:grid;grid-template-columns:repeat(auto-fit,minmax(116px,1fr));
  gap:11px;list-style:none;margin:0;padding:0}
ul.zeichentafel li{display:flex;flex-direction:column;align-items:center;gap:5px;
  padding:12px 6px;border:1px solid var(--line-soft);border-radius:9px;
  background:var(--bg);color:var(--ink);font-family:var(--ui);font-size:12.5px;
  transition:border-color .14s,background .14s}
ul.zeichentafel li:hover{border-color:var(--ornament);background:var(--surface)}
ul.zeichentafel svg{width:72px;height:44px;max-width:none;margin:0}

/* Tonsilben */
p.parallage{font-family:var(--display);font-size:26px;letter-spacing:.05em;
  color:var(--ink);background:var(--surface);border:1px solid var(--line);
  border-radius:var(--radius);padding:18px 20px;text-align:center;box-shadow:var(--shadow-sm)}
.scale{display:flex;flex-wrap:wrap;gap:9px;margin-block:1.2em}
.tone{font-family:var(--display);font-size:21px;background:var(--surface);
  border:1px solid var(--line);border-radius:9px;padding:9px 15px;color:var(--ink)}
.tone small{display:block;font-family:var(--ui);font-size:11px;color:var(--muted);letter-spacing:.06em}

/* Angaben, Porträts */
dl.angaben{display:grid;grid-template-columns:auto 1fr;gap:9px 24px;font-size:15.5px;
  background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);
  padding:18px 20px;box-shadow:var(--shadow-sm)}
dl.angaben dt{font-family:var(--ui);font-size:12px;letter-spacing:.06em;
  text-transform:uppercase;color:var(--muted);padding-top:3px;margin:0;font-weight:600}
dl.angaben dd{margin:0;color:var(--ink)}
p.kennzeile{font-family:var(--ui);font-size:13px;color:var(--muted);margin:-.65em 0 .85em}
p.kennzeile span[lang="grc"]{font-family:var(--display);font-style:italic;
  font-size:15.5px;color:var(--accent)}

/* Kästchenreihen */
ul.teaser,.karten{list-style:none;padding:0;display:grid;
  grid-template-columns:repeat(auto-fit,minmax(256px,1fr));gap:16px;margin-block:1.3em}
ul.teaser li,.karte{position:relative;background:var(--surface);border:1px solid var(--line);
  border-radius:var(--radius);padding:20px 20px 22px;box-shadow:var(--shadow);
  font-size:15.5px;color:var(--ink-soft);overflow:hidden;
  transition:transform .16s,box-shadow .16s,border-color .16s}
ul.teaser li::before,.karte::before{content:"";position:absolute;inset:0 0 auto 0;
  height:3px;background:linear-gradient(90deg,var(--accent),var(--ochre))}
ul.teaser li:hover,.karte:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg);
  border-color:var(--ochre)}
ul.teaser li strong,.karte h3{display:block;font-family:var(--display);font-size:19px;
  font-weight:700;color:var(--ink);margin:0 0 7px}
ul.teaser li a{color:inherit}
ul.teaser li a:hover{color:var(--accent-ink)}
.karte p{margin:0}
.karte .karte-gr{font-family:var(--display);font-style:italic;color:var(--accent);
  font-size:15px;margin:-4px 0 8px}
.karte .go{display:inline-block;font-family:var(--ui);font-size:13px;
  color:var(--accent);margin-top:12px}

/* Aufrufband */
p.aufruf,.aufruf-band{background:
    linear-gradient(120deg,var(--accent-wash),var(--ochre-wash));
  border:1px solid var(--line);border-radius:var(--radius);
  padding:24px 26px;box-shadow:var(--shadow);font-size:17px;color:var(--ink-soft)}
p.aufruf strong,.aufruf-band strong{color:var(--ink)}
p.aufruf a{font-family:var(--ui);font-size:14.5px;font-weight:600;background:var(--accent);
  color:var(--on-accent);padding:10px 20px;border-radius:999px;display:inline-block;margin-top:12px}
p.aufruf a:hover{background:var(--accent-ink);color:var(--on-accent);text-decoration:none}

/* Zitat mit griechischem Original */
blockquote.spruch{border:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  padding:22px 0;text-align:center;font-style:normal;max-width:none}
blockquote.spruch p{font-family:var(--display);font-size:21px;color:var(--ink);margin:0 auto;max-width:40em}
blockquote.spruch p[lang="grc"]{font-style:italic;color:var(--accent);font-size:19px;margin-top:8px}
blockquote.spruch cite{display:block;font-family:var(--ui);font-size:12.5px;
  font-style:normal;color:var(--muted);margin-top:12px;letter-spacing:.04em}

/* Listen */
.entry-content ul:not(.teaser):not(.zeichentafel),.entry-content ol{padding-left:1.25em}
.entry-content li{margin-bottom:.38em}
.entry-content ul:not(.teaser):not(.zeichentafel) li::marker{color:var(--accent)}

/* ============================================================
   7 · Beitragslisten
   ============================================================ */
.post-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:20px}
.post-card{position:relative;background:var(--surface);border:1px solid var(--line);
  border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);
  display:flex;flex-direction:column;transition:transform .16s,box-shadow .16s}
.post-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}
.post-card .thumb{display:block;position:relative;background:var(--surface-2)}
.post-card .thumb img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover}
.post-card .thumb-leer{aspect-ratio:16/9;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,var(--ochre-wash),var(--accent-wash));color:var(--accent);padding:0 26px}
.post-card .thumb-leer svg{width:100%;max-width:230px;height:auto;opacity:.5}
.post-card .body{padding:17px 19px 21px;display:flex;flex-direction:column;gap:7px;flex:1}
/* Beitrag ohne Bild: ein feiner Strich in Kronenrot statt eines leeren Kastens. */
.post-card.ohne-bild{border-top:3px solid var(--accent)}
.post-card.ohne-bild .body{padding-top:19px}
.post-card h2{font-size:20px;margin:0;font-family:var(--display)}
.post-card h2 a{color:var(--ink)}
.post-card h2 a:hover{color:var(--accent-ink);text-decoration:none}
.post-card .date{font-family:var(--ui);font-size:12.5px;color:var(--ochre);
  letter-spacing:.04em;text-transform:uppercase;font-weight:600}
.post-card p{font-size:15.5px;color:var(--ink-soft);margin:0}
.post-card .more{font-family:var(--ui);font-size:13px;color:var(--accent);margin-top:auto;padding-top:10px}
.pagination{display:flex;gap:8px;flex-wrap:wrap;margin-top:38px;font-family:var(--ui);font-size:14px}
.pagination .page-numbers{padding:8px 14px;border:1px solid var(--line);
  border-radius:8px;color:var(--ink-soft);background:var(--surface)}
.pagination .current{background:var(--accent);border-color:var(--accent);
  color:var(--on-accent);font-weight:600}

/* ============================================================
   8 · Seitenleiste und Fuß
   ============================================================ */
.sidebar{font-size:15.5px}
.widget{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);
  padding:18px 20px;margin-bottom:17px;box-shadow:var(--shadow-sm)}
.widget-title{font-family:var(--ui);font-size:11.5px;letter-spacing:.11em;text-transform:uppercase;
  color:var(--ochre);font-weight:600;margin:0 0 11px}
.widget ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:7px}
.widget a{color:var(--ink-soft)}
.widget a:hover{color:var(--accent)}

.site-foot{background:var(--surface);margin-top:0;position:relative}
.foot-emblem{position:absolute;right:3%;top:40px;width:230px;height:230px;opacity:.045;
  pointer-events:none;user-select:none}
.foot-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:30px;
  padding-block:38px 14px;font-size:14.5px;color:var(--muted);position:relative}
.foot-row .widget{background:none;border:0;box-shadow:none;padding:0;margin:0}
.foot-bottom{display:flex;flex-wrap:wrap;gap:14px;justify-content:space-between;
  border-top:1px solid var(--line-soft);padding-block:18px 30px;
  font-family:var(--ui);font-size:13px;color:var(--muted);position:relative}
.foot-nav ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:18px}

/* ============================================================
   9 · Formulare
   ============================================================ */
input[type=text],input[type=email],input[type=search],input[type=url],input[type=tel],
input[type=number],input[type=password],textarea,select{
  width:100%;font-family:var(--ui);font-size:15px;color:var(--ink);background:var(--surface);
  border:1px solid var(--line);border-radius:8px;padding:10px 13px}
button,input[type=submit],.wp-block-button__link{font-family:var(--ui);font-size:14px;
  font-weight:600;background:var(--accent);color:var(--on-accent);border:0;
  border-radius:999px;padding:10px 20px;cursor:pointer}
button:hover,input[type=submit]:hover,.wp-block-button__link:hover{background:var(--accent-ink)}
.search-form{display:flex;gap:8px;margin-bottom:24px}

/* ============================================================
   10 · Block-Editor
   ============================================================ */
.wp-block-image figcaption,.wp-caption-text{font-family:var(--ui);font-size:13.5px;color:var(--muted)}
.wp-block-quote{border-left:3px solid var(--accent);padding-left:20px}
.alignleft{float:left;margin:.3em 1.5em 1em 0}
.alignright{float:right;margin:.3em 0 1em 1.5em}
.aligncenter{display:block;margin-inline:auto}
.wp-block-separator{border-top:1px solid var(--line)}
.wp-block-table table{border-collapse:collapse;width:100%}

/* ============================================================
   11 · Schmale Bildschirme
   ============================================================ */
@media (max-width:980px){
  .layout.has-sidebar{grid-template-columns:minmax(0,1fr)}
  .hero-inner{grid-template-columns:minmax(0,1fr);gap:26px;padding-block:40px 38px}
  .hero .emblem{width:132px;height:132px}
  .foot-emblem{display:none}
}
/* ---- Tablet und Telefon: Kopfzeile wird schmal ---- */
@media (max-width:860px){
  body{font-size:17px}

  /* Eine einzige Zeile, die nicht umbricht:
     kleines Logo links — Name daneben — Schaltflächen rechts. */
  .head-row{flex-wrap:wrap;gap:10px;padding-block:9px}
  /* flex-basis 0: der Markenblock darf unter seine Textbreite schrumpfen,
     damit „Menü" und „Ansicht" in derselben Zeile bleiben. */
  .brand{max-width:none;flex:1 1 0;gap:10px;min-width:0;overflow:hidden}
  .brand img,.brand .brand-logo,.brand .custom-logo{width:40px;height:40px;max-width:40px}
  .brand-text{min-width:0}
  .brand-de{font-size:15px;line-height:1.2;
    overflow:hidden;text-overflow:ellipsis;display:-webkit-box;
    -webkit-line-clamp:2;-webkit-box-orient:vertical}
  .brand-gr{font-size:10.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

  .nav-toggle{display:inline-block;margin-left:0;flex:0 0 auto;padding:7px 13px}
  .theme-toggle{padding:6px 11px;font-size:11.5px}

  /* Menü klappt unter der Kopfzeile auf, über die volle Breite. */
  .main-nav{order:3;width:100%;margin-left:0;display:none;
    border-top:1px solid var(--line-soft);padding-top:6px;
    max-height:min(70vh,560px);overflow-y:auto;overscroll-behavior:contain}
  .main-nav.is-open{display:block}
  .main-nav ul{flex-direction:column;gap:0;padding-block:6px}
  .main-nav a{padding:12px 12px;border-radius:8px;font-size:15px}
  .main-nav .current-menu-item>a{box-shadow:none;background:var(--accent-wash)}
  .main-nav .menu-item-has-children>a::after{content:""}
  .main-nav .sub-menu{position:static;display:flex;border:0;box-shadow:none;
    padding:0 0 6px 14px;background:none;min-width:0;
    border-left:2px solid var(--line-soft);margin-left:12px}
  .main-nav .sub-menu a{font-size:14px;padding:9px 11px;color:var(--muted)}

  /* Begrüßungsbereich und Inhalt enger stellen. */
  .hero-inner{padding-block:30px 28px;gap:20px}
  .hero .emblem{width:104px;height:104px}
  .hero-text{font-size:17.5px;max-width:none}
  .section{padding-block:34px}
  .site-main{padding-bottom:46px}
  .page-head{padding-block:28px 4px}
  .layout{gap:34px;margin-top:22px}
  .wrap,.wrap-narrow{padding-inline:16px}

  dl.angaben{grid-template-columns:1fr;gap:2px 0}
  dl.angaben dd{margin-bottom:11px}
  table.zeitleiste th[scope="row"]{width:auto}
  .entry-content.mit-initial > p:first-of-type::first-letter{font-size:3.2em}
}

/* ---- Telefon ---- */
@media (max-width:560px){
  body{font-size:16.5px}
  .head-row{gap:8px;padding-block:8px}
  .brand img,.brand .brand-logo,.brand .custom-logo{width:36px;height:36px;max-width:36px}
  .brand-gr{display:none}            /* zwei Zeilen sind hier zu viel */
  .brand-de{font-size:14px;-webkit-line-clamp:2}
  .nav-toggle{padding:7px 12px;font-size:12.5px}
  .theme-toggle{padding:6px 10px;font-size:11px}

  .hero .emblem{width:84px;height:84px;justify-self:start}
  .hero-inner{grid-template-columns:minmax(0,1fr);padding-block:24px 24px;gap:14px}
  .hero-title{font-size:26px}
  .hero-gr{font-size:16.5px;margin-top:8px}
  .hero-text{font-size:17px;margin-top:12px}
  .hero-actions{margin-top:18px}
  .btn{display:block;text-align:center;width:100%}

  .section{padding-block:26px}
  .section-head{margin-bottom:18px}
  .section-head h2{padding-left:18px}
  .wrap,.wrap-narrow{padding-inline:14px}

  /* Breite Inhalte dürfen seitlich rollen statt die Seite zu sprengen. */
  .entry-content table,.entry-content pre{display:block;max-width:100%;
    overflow-x:auto;-webkit-overflow-scrolling:touch}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto}}

/* ============================================================
   12 · Druck
   ============================================================ */
@media print{
  :root{--bg:#fff;--surface:#fff;--surface-2:#fff;--ink:#000;--ink-soft:#222;
        --muted:#555;--line:#999;--line-soft:#ccc;--accent:#000;--accent-ink:#000;
        --accent-wash:#fff;--ochre:#333;--ochre-wash:#fff;--ornament:#666;
        --shadow:none;--shadow-sm:none;--shadow-lg:none}
  .site-head,.site-foot,.sidebar,.theme-toggle,.nav-toggle,.pagination,
  .skip-link,.zierband,.hero-actions,.foot-emblem{display:none!important}
  body{font-size:11pt}
  .wrap,.wrap-narrow{max-width:none;padding:0}
  .entry-content{max-width:none}
  figure.abbildung,.widget,p.aufruf,ul.teaser li,.karte{border:1px solid #999;
    box-shadow:none;break-inside:avoid;transform:none}
  ul.teaser li::before,.karte::before{display:none}
  table{break-inside:avoid}
  h1,h2,h3{break-after:avoid}
  a{color:#000;text-decoration:none}
  .entry-content a[href^="http"]::after{content:" (" attr(href) ")";font-size:9pt;color:#555}
}

/* Blockstile */
.wp-block-quote.is-style-byzmusik-hinweis{border-left:4px solid var(--accent);
  background:var(--accent-wash);padding:15px 18px;border-radius:0 10px 10px 0;font-style:normal}
.wp-block-quote.is-style-byzmusik-merksatz{border-left:4px solid var(--ochre);
  background:var(--ochre-wash);padding:15px 18px;border-radius:0 10px 10px 0;font-style:normal}
.wp-block-group.is-style-byzmusik-abbildung{background:var(--surface);border:1px solid var(--line);
  border-radius:var(--radius);padding:22px 20px;box-shadow:var(--shadow)}