/* =========================================================================
   PVG Presse-Vertriebs-Gesellschaft — zentrale Stildatei
   EINZIGE QUELLE für Farben, Schriften, Abstände, Bausteine.
   Look ändern = hier die Token-Werte tauschen, niemals einzelne Seiten.
   ========================================================================= */

/* ---------- Schriften (lokal gehostet, woff2) ---------- */
@font-face{font-family:"Source Serif 4";src:url("../fonts/source-serif-4-latin-400-normal.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Source Serif 4";src:url("../fonts/source-serif-4-latin-600-normal.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Source Serif 4";src:url("../fonts/source-serif-4-latin-700-normal.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"Inter";src:url("../fonts/inter-latin-400-normal.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Inter";src:url("../fonts/inter-latin-500-normal.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Inter";src:url("../fonts/inter-latin-600-normal.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Inter";src:url("../fonts/inter-latin-700-normal.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap}

/* ---------- DESIGN-TOKENS ---------- */
:root{
  /* Marke / Akzent — abgeleitet aus dem PVG-Logo */
  --accent:#2C408D;
  --accent-strong:#1E2E6B;
  --accent-soft:#EDF0F8;

  /* Flächen */
  --bg:#FAF9F7;
  --bg-deep:#16213F;
  --surface:#FFFFFF;
  --card-bg:#FFFFFF;

  /* Text */
  --ink:#12172B;
  --text:#2A2F3D;
  --text-soft:#5A6172;
  --on-accent:#FFFFFF;
  --on-deep:#FFFFFF;
  --on-deep-soft:#BFC8DF;

  /* Linien */
  --line:#E3E1DC;
  --line-strong:#C6C3BC;
  --line-deep:#33406A;

  /* Schatten */
  --shadow:0 1px 2px rgba(18,23,43,.06), 0 8px 24px rgba(18,23,43,.06);
  --shadow-brand:0 10px 30px rgba(44,64,141,.18);

  /* Schriften */
  --font-display:"Source Serif 4", Georgia, "Times New Roman", serif;
  --font-body:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

  /* Layout */
  --maxw:1200px;
  --gutter:clamp(1.25rem, 5vw, 3rem);
  --radius:4px;
  --radius-sm:2px;

  /* Abstands-Skala */
  --s-1:.25rem; --s-2:.5rem;  --s-3:.75rem; --s-4:1rem;
  --s-5:1.5rem; --s-6:2rem;   --s-7:3rem;   --s-8:4rem;
  --s-9:6rem;   --s-10:8rem;
  --section-y:clamp(3.5rem, 9vw, 7.5rem);
  --header-h:76px;

  /* Typo-Skala */
  --t-xs:.8125rem; --t-sm:.9375rem; --t-base:1.0625rem;
  --t-lg:1.1875rem; --t-xl:1.375rem;
  --t-h3:clamp(1.375rem, 2.2vw, 1.75rem);
  --t-h2:clamp(1.6875rem, 4vw, 3rem);
  --t-h1:clamp(2.125rem, 6.4vw, 4.75rem);
  --t-huge:clamp(3rem, 10vw, 6.5rem);
}

/* ---------- Reset / Basis ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
}
body{
  margin:0;background:var(--bg);color:var(--text);
  font-family:var(--font-body);font-size:var(--t-base);line-height:1.65;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
img{max-width:100%;height:auto;display:block}
a{color:var(--accent);text-underline-offset:.18em;text-decoration-thickness:1px}
a:hover{color:var(--accent-strong)}
h1,h2,h3,h4{font-family:var(--font-display);color:var(--ink);margin:0;font-weight:600;letter-spacing:-.015em;
  overflow-wrap:break-word;hyphens:auto;text-wrap:balance}
h1{font-size:var(--t-h1);line-height:1.02;font-weight:700;letter-spacing:-.03em}
h2{font-size:var(--t-h2);line-height:1.08;letter-spacing:-.022em}
h3{font-size:var(--t-h3);line-height:1.2}
p{margin:0 0 var(--s-4)}
p,li,dd,dt{overflow-wrap:break-word}
ul{margin:0;padding:0}

:focus-visible{outline:3px solid var(--accent);outline-offset:3px;border-radius:var(--radius-sm)}

.skip-link{
  position:absolute;left:var(--s-4);top:-100px;z-index:200;
  background:var(--accent);color:var(--on-accent);padding:.75rem 1.25rem;
  border-radius:var(--radius);font-weight:600;text-decoration:none;transition:top .15s;
}
.skip-link:focus{top:var(--s-4);color:var(--on-accent)}

.wrap{width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:var(--gutter)}
.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}

/* ---------- SIGNATUR 1: Kolumnentitel (Zeitungs-Rubrik) ---------- */
.kolumne{
  font-family:var(--font-body);font-size:var(--t-xs);font-weight:600;
  letter-spacing:.18em;text-transform:uppercase;color:var(--accent);
  display:flex;align-items:center;gap:.75rem;margin:0 0 var(--s-5);
}
.kolumne::before{content:"";width:1.75rem;height:2px;background:var(--accent);flex:none}
.on-deep .kolumne{color:#93A6D8}
.on-deep .kolumne::before{background:#93A6D8}

/* ---------- SIGNATUR 2: Doppellinie wie ein Zeitungskopf ---------- */
.rule{border:0;height:0;border-top:3px solid var(--ink);border-bottom:1px solid var(--ink);
  padding-bottom:3px;margin:0 0 var(--s-6)}
.on-deep .rule{border-color:var(--on-deep)}
.rule--soft{border-top-color:var(--line-strong);border-bottom-color:var(--line-strong)}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.6rem;
  min-height:52px;padding:.85rem 1.6rem;border-radius:var(--radius);
  font-family:var(--font-body);font-size:var(--t-sm);font-weight:600;letter-spacing:.01em;
  text-decoration:none;border:1.5px solid transparent;cursor:pointer;
  transition:background-color .18s ease, border-color .18s ease, color .18s ease, transform .18s ease;
}
.btn--primary{background:var(--accent);color:var(--on-accent);border-color:var(--accent)}
.btn--primary:hover{background:var(--accent-strong);border-color:var(--accent-strong);color:var(--on-accent)}
.btn--ghost{background:transparent;color:var(--ink);border-color:var(--line-strong)}
.btn--ghost:hover{border-color:var(--ink);color:var(--ink);background:rgba(18,23,43,.03)}
.on-deep .btn--ghost{color:var(--on-deep);border-color:var(--line-deep)}
.on-deep .btn--ghost:hover{border-color:var(--on-deep);background:rgba(255,255,255,.07);color:var(--on-deep)}
.btn .ico{width:1.05em;height:1.05em;flex:none}

/* ---------- Header ---------- */
.site-header{
  /* Kein backdrop-filter: das würde einen Containing Block erzeugen und die
     fixierte Mobil-Navigation im Header einsperren. */
  position:sticky;top:0;z-index:100;background:var(--bg);
  border-bottom:1px solid var(--line);
}
.header-in{display:flex;align-items:center;gap:var(--s-4);min-height:var(--header-h)}
.brand{display:flex;align-items:center;gap:.7rem;text-decoration:none;margin-right:auto}
.brand img{width:44px;height:43px}
.brand b{font-family:var(--font-display);font-size:1.0625rem;font-weight:700;color:var(--ink);letter-spacing:-.01em;line-height:1.1}
.brand span{display:block;font-family:var(--font-body);font-size:.6875rem;font-weight:500;
  letter-spacing:.13em;text-transform:uppercase;color:var(--text-soft)}

.nav-list{display:flex;align-items:center;gap:.25rem;list-style:none}
.nav-list a{
  display:flex;align-items:center;min-height:44px;padding:.5rem .85rem;
  font-size:var(--t-sm);font-weight:500;color:var(--text);text-decoration:none;border-radius:var(--radius-sm);
  white-space:nowrap;
}
.nav-list a:hover{color:var(--accent);background:var(--accent-soft)}
.nav-list a[aria-current="page"]{color:var(--accent);font-weight:600}
.header-cta{display:none}

.nav-toggle{
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  min-width:44px;min-height:44px;padding:.5rem .8rem;background:transparent;
  border:1.5px solid var(--line-strong);border-radius:var(--radius);color:var(--ink);
  font-family:var(--font-body);font-size:var(--t-sm);font-weight:600;cursor:pointer;
}
.nav-toggle svg{width:18px;height:18px}
.nav-toggle .x{display:none}
.nav-toggle[aria-expanded="true"] .x{display:block}
.nav-toggle[aria-expanded="true"] .burger{display:none}

@media (max-width:1023px){
  .site-nav{
    position:fixed;inset:var(--header-h) 0 0;z-index:90;background:var(--bg);
    border-top:1px solid var(--line);padding:var(--s-5) 0 var(--s-8);
    overflow-y:auto;display:none;
  }
  .site-nav[data-open="true"]{display:block}
  .nav-list{flex-direction:column;align-items:stretch;gap:0;
    width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:var(--gutter)}
  .nav-list li{border-bottom:1px solid var(--line)}
  .nav-list a{min-height:60px;font-size:1.25rem;font-family:var(--font-display);font-weight:600;padding-inline:0}
  .site-nav .btn{margin:var(--s-6) var(--gutter) 0;display:flex}
}
@media (min-width:1024px){
  .nav-toggle{display:none}
  .site-nav{display:block!important}
  .site-nav .btn{display:none}
  .header-cta{display:inline-flex;margin-left:var(--s-4);white-space:nowrap;flex:none}
}
@media (min-width:1024px) and (max-width:1199px){
  .nav-list a{padding-inline:.6rem;font-size:var(--t-xs)}
}

/* ---------- Aktuell-Leiste ---------- */
.ticker{background:var(--accent);color:var(--on-accent)}
.ticker-in{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem 1.25rem;padding:.85rem 0}
.ticker .tag{
  font-size:var(--t-xs);font-weight:700;letter-spacing:.16em;text-transform:uppercase;
  border:1px solid rgba(255,255,255,.5);border-radius:var(--radius-sm);padding:.2rem .55rem;flex:none;
}
.ticker p{margin:0;font-size:var(--t-sm)}
.ticker a{color:var(--on-accent);font-weight:600;text-decoration:underline}
.ticker a:hover{color:var(--on-accent);text-decoration-thickness:2px}

/* ---------- Hero: großes Bild ganz oben ---------- */
.hero{position:relative}
.hero-media{margin:0;position:relative;background:var(--bg-deep)}
.hero-media img{
  width:100%;display:block;object-fit:cover;object-position:50% 42%;
  height:clamp(260px, 42vw, 620px);
}
.hero-caption{padding:var(--s-6) 0 var(--s-7)}
.hero h1{margin:0}
.hero h1 em{font-style:normal;color:var(--accent);display:block}

/* Mobil: Headline unter dem Bild auf Papier — auf großen Schirmen liegt sie im Bild */
@media (max-width:899px){
  .hero-caption{background:var(--bg)}
}
@media (min-width:900px){
  .hero-media::after{
    content:"";position:absolute;inset:0;pointer-events:none;
    background:linear-gradient(180deg, rgba(10,14,30,.10) 0%, rgba(10,14,30,.42) 45%, rgba(10,14,30,.86) 100%);
  }
  .hero-caption{
    position:absolute;inset:auto 0 0;z-index:1;
    padding-bottom:clamp(2rem,4vw,3.25rem);
  }
  .hero-caption h1{color:#fff;max-width:14ch}
  .hero-caption h1 em{color:#A9BCEC}
  .hero-caption .kolumne{color:#C6D2F0}
  .hero-caption .kolumne::before{background:#C6D2F0}
}

.hero-below{display:grid;gap:var(--s-5);padding-block:var(--s-6) var(--s-7);
  border-bottom:1px solid var(--line)}
.hero-lead{font-size:clamp(1.0625rem,1.9vw,1.375rem);line-height:1.5;color:var(--text);
  max-width:46ch;margin:0}
.hero-side{display:grid;gap:var(--s-4);align-content:start}
.hero-actions{display:flex;flex-wrap:wrap;gap:var(--s-3)}
.hero-meta{margin:0;font-size:var(--t-xs);color:var(--text-soft)}
.hero-meta b{color:var(--ink);font-weight:600;letter-spacing:.11em;text-transform:uppercase;
  font-size:.6875rem;margin-right:.5rem}
@media (min-width:900px){
  .hero-below{grid-template-columns:minmax(0,1fr) auto;gap:var(--s-8);align-items:start}
  .hero-side{justify-items:end;text-align:right}
}

/* ---------- Sektionen ---------- */
.section{padding-block:var(--section-y)}
.section--tight{padding-block:clamp(2.5rem,6vw,4.5rem)}
.section--deep{background:var(--bg-deep);color:var(--on-deep)}
.section--deep h2,.section--deep h3{color:var(--on-deep)}
.section--paper{background:var(--surface);border-block:1px solid var(--line)}
.section-head{max-width:34ch}
.section-head h2{margin-bottom:var(--s-4)}
.lead{font-size:var(--t-lg);line-height:1.6;color:var(--text-soft);max-width:62ch}
.prose h2+.lead,.prose h2+p,.section-head h2+.lead{margin-top:var(--s-4)}
.subhead h1+.claim{margin-top:var(--s-5)}
.on-deep .lead,.section--deep .lead{color:var(--on-deep-soft)}
.prose p{max-width:68ch}

/* Editorial-Doppelspalte: Text links, Ankermoment rechts */
.split{display:grid;gap:var(--s-6)}
@media (min-width:900px){
  .split{grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:var(--s-8);align-items:start}
  .split--wide-right{grid-template-columns:minmax(0,5fr) minmax(0,7fr)}
}

/* Große Zahl als Ankermoment */
.bigfigure{border-top:3px solid var(--accent);padding-top:var(--s-4)}
.bigfigure .num{
  font-family:var(--font-display);font-size:var(--t-huge);font-weight:700;
  line-height:.9;letter-spacing:-.045em;color:var(--accent);display:block;
}
.bigfigure .cap{display:block;margin-top:var(--s-3);font-size:var(--t-sm);color:var(--text-soft);max-width:28ch}

/* Kennzahlen-Reihe */
.figures{list-style:none;display:grid;gap:var(--s-5);margin-top:var(--s-7)}
.figures li{border-top:1px solid var(--line-deep);padding-top:var(--s-4)}
.figures .n{display:block;font-family:var(--font-display);font-size:clamp(2rem,5vw,2.75rem);
  font-weight:700;line-height:1;letter-spacing:-.03em;color:var(--on-deep)}
.figures .l{display:block;margin-top:.5rem;font-size:var(--t-sm);color:var(--on-deep-soft)}
@media (min-width:640px){.figures{grid-template-columns:1fr 1fr}}
@media (min-width:1000px){.figures{grid-template-columns:repeat(4,1fr);gap:var(--s-6)}}

/* Leistungen als redaktionelle Liste, nicht als Kartenreihe */
.entries{list-style:none;margin-top:var(--s-7);border-top:1px solid var(--line)}
.entries > li{border-bottom:1px solid var(--line)}
.entry{
  display:grid;gap:var(--s-2);padding:var(--s-6) 0;text-decoration:none;color:inherit;
  transition:background-color .18s ease;
}
.entry:hover{background:var(--accent-soft);color:inherit}
.entry:hover .entry-title{color:var(--accent)}
.entry .idx{font-size:var(--t-xs);font-weight:600;letter-spacing:.18em;color:var(--accent);
  font-variant-numeric:tabular-nums}
.entry-title{font-family:var(--font-display);font-size:var(--t-h3);font-weight:600;color:var(--ink);
  line-height:1.2;transition:color .18s ease}
.entry p{margin:0;color:var(--text-soft);font-size:var(--t-sm);max-width:60ch}
.entry .go{font-size:var(--t-sm);font-weight:600;color:var(--accent);display:inline-flex;align-items:center;gap:.4rem}
.entry .go svg{width:1em;height:1em;transition:transform .18s ease}
.entry:hover .go svg{transform:translateX(3px)}
@media (min-width:820px){
  .entry{grid-template-columns:4rem minmax(0,15rem) minmax(0,1fr) auto;
    align-items:baseline;gap:var(--s-5);padding-inline:var(--s-4)}
}

/* Standorte */
.regions{display:grid;gap:var(--s-6);margin-top:var(--s-7)}
@media (min-width:800px){.regions{grid-template-columns:repeat(3,1fr);gap:var(--s-6)}}
.region{border-top:3px solid var(--accent);padding-top:var(--s-4)}
.region h3{font-size:var(--t-xl);margin-bottom:var(--s-4)}
.region ul{list-style:none}
.region li{padding:.7rem 0;border-bottom:1px solid var(--line);font-size:var(--t-sm)}
.region li b{display:block;font-weight:600;color:var(--ink);font-size:var(--t-base)}
.region li span{color:var(--text-soft)}
.region .lead-loc b::after{content:"Vertriebszentrum";display:block;font-family:var(--font-body);
  font-size:var(--t-xs);font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin-bottom:.15rem}

/* Zitat */
.pullquote{max-width:24ch}
.pullquote blockquote{margin:0;font-family:var(--font-display);font-weight:600;
  font-size:clamp(1.5rem,3.6vw,2.375rem);line-height:1.2;letter-spacing:-.02em;color:var(--on-deep)}
.pullquote figcaption{margin-top:var(--s-4);font-size:var(--t-xs);letter-spacing:.14em;
  text-transform:uppercase;color:var(--on-deep-soft)}
@media (min-width:900px){.pullquote{max-width:30ch}}

/* Portal / MPP */
.portal-figure img{border-radius:var(--radius);width:100%;aspect-ratio:3/2;object-fit:cover}
.stores{display:flex;flex-wrap:wrap;gap:var(--s-3);margin-top:var(--s-5);list-style:none}

/* Kontakt */
.contact-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);
  padding:var(--s-6);box-shadow:var(--shadow)}
.contact-card dl{margin:0;display:grid;gap:var(--s-4)}
.contact-card dt{font-size:var(--t-xs);font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--text-soft)}
.contact-card dd{margin:.25rem 0 0;font-size:var(--t-lg);color:var(--ink);font-weight:500}
.contact-card dd a{font-weight:600;text-decoration:none}
.contact-card dd a:hover{text-decoration:underline}

/* Platzhalter-Markierung — muss sichtbar bleiben, bis echte Daten da sind */
.platzhalter{
  background:#FFF4D6;color:#5C4400;border:1px dashed #B8860B;border-radius:var(--radius-sm);
  padding:.05em .4em;font-family:var(--font-body);font-size:.9em;font-weight:600;font-style:normal;
}
.section--deep .platzhalter{background:#3A3520;color:#FFE49B;border-color:#B99B4A}

/* ---------- Unterseiten: Kopf, Brotkrumen, Bandbild, Punkte ---------- */
.crumbs{margin-bottom:var(--s-5)}
.crumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:.4rem .65rem;
  font-size:var(--t-xs);color:var(--text-soft)}
.crumbs li+li::before{content:"›";margin-right:.65rem;color:var(--line-strong)}
.crumbs a{color:var(--text-soft);text-decoration:none}
.crumbs a:hover{color:var(--accent);text-decoration:underline}
.crumbs [aria-current="page"]{color:var(--ink);font-weight:600}

.subhead h1{max-width:16ch;margin-bottom:var(--s-5)}
.subhead .claim{
  font-family:var(--font-display);font-size:clamp(1.25rem,2.4vw,1.75rem);
  font-weight:600;line-height:1.3;color:var(--accent);max-width:30ch;
  border-left:3px solid var(--accent);padding-left:var(--s-4);margin-bottom:var(--s-5);
}

.bandbild{margin:0;background:var(--bg-deep)}
.bandbild img{width:100%;display:block;object-fit:cover;height:clamp(180px,28vw,420px)}

.punkte{list-style:none;counter-reset:p;display:grid;gap:0;margin-top:var(--s-6);
  border-top:1px solid var(--line)}
.punkte li{counter-increment:p;border-bottom:1px solid var(--line);padding:var(--s-5) 0;
  display:grid;gap:var(--s-2)}
.punkte li::before{
  content:counter(p,decimal-leading-zero);font-family:var(--font-body);font-size:var(--t-xs);
  font-weight:600;letter-spacing:.18em;color:var(--accent);font-variant-numeric:tabular-nums;
}
.punkte h3{font-size:var(--t-xl);margin:0}
.punkte p{margin:0;color:var(--text-soft);max-width:64ch}
@media (min-width:820px){
  .punkte li{grid-template-columns:4rem minmax(0,16rem) minmax(0,1fr);
    align-items:baseline;gap:var(--s-5);padding-inline:var(--s-4)}
  .punkte li::before{grid-row:1}
}

.entries--flush{margin-top:var(--s-2)}

.nachbarn{list-style:none;display:grid;gap:var(--s-3);margin-top:var(--s-6)}
@media (min-width:720px){.nachbarn{grid-template-columns:repeat(3,1fr)}}
.nachbar{display:flex;align-items:baseline;gap:.75rem;text-decoration:none;
  border:1px solid var(--line);border-radius:var(--radius);padding:var(--s-4) var(--s-5);
  min-height:56px;background:var(--surface);transition:border-color .18s ease,background-color .18s ease}
.nachbar:hover{border-color:var(--accent);background:var(--accent-soft)}
.nachbar .idx{font-size:var(--t-xs);font-weight:600;letter-spacing:.16em;color:var(--accent);
  font-variant-numeric:tabular-nums}
.nachbar span:last-child{font-family:var(--font-display);font-size:var(--t-lg);font-weight:600;color:var(--ink)}

.contact-card--deep{background:rgba(255,255,255,.05);border-color:var(--line-deep);box-shadow:none}
.contact-card--deep dt{color:var(--on-deep-soft)}
.contact-card--deep dd{color:var(--on-deep)}
.contact-card--deep dd a{color:#A9BCEC}
.contact-card--deep dd a:hover{color:#fff}

/* ---------- Footer ---------- */
.site-footer{background:var(--bg-deep);color:var(--on-deep);padding-block:var(--s-8) var(--s-6)}
.footer-grid{display:grid;gap:var(--s-6)}
@media (min-width:760px){.footer-grid{grid-template-columns:minmax(0,1.4fr) repeat(2,minmax(0,1fr))}}
.footer-brand b{font-family:var(--font-display);font-size:1.25rem;display:block;margin-bottom:.35rem}
.footer-brand p{color:var(--on-deep-soft);font-size:var(--t-sm);max-width:34ch}
.site-footer h2{font-size:var(--t-xs);letter-spacing:.16em;text-transform:uppercase;
  font-family:var(--font-body);font-weight:600;color:var(--on-deep-soft);margin-bottom:var(--s-4)}
.site-footer ul{list-style:none}
.site-footer li{margin-bottom:.6rem}
.site-footer a{color:var(--on-deep);text-decoration:none;font-size:var(--t-sm)}
.site-footer a:hover{color:#fff;text-decoration:underline}
.footer-bottom{margin-top:var(--s-7);padding-top:var(--s-5);border-top:1px solid var(--line-deep);
  display:flex;flex-wrap:wrap;gap:var(--s-3) var(--s-5);align-items:center;
  font-size:var(--t-xs);color:var(--on-deep-soft)}
.footer-bottom nav{display:flex;flex-wrap:wrap;gap:var(--s-3) var(--s-5);margin-left:auto}

/* ---------- Mobile Feinschliff ---------- */
@media (max-width:560px){
  body{font-size:1.0625rem}
  .brand span{display:none}
  .brand b{font-size:1.25rem;letter-spacing:.02em}
  .nav-toggle svg{width:20px;height:20px}
  .hero-actions{flex-direction:column;align-items:stretch}
  .hero-actions .btn{width:100%}
}

/* Quellenangabe unter Kennzahlen */
.figures-quelle{margin:var(--s-6) 0 0;font-size:var(--t-xs);color:var(--on-deep-soft)}

/* ============================================================
   Bausteine der Unterseiten und der erweiterten Startseite
   ============================================================ */

/* ---------- Zwei Türen: Verlage / Einzelhändler ---------- */
.tueren-wrap{padding-block:var(--s-7);background:var(--bg)}
.tueren{list-style:none;display:grid;gap:var(--s-4)}
@media (min-width:820px){.tueren{grid-template-columns:1fr 1fr;gap:var(--s-5)}}
.tuer{
  display:grid;gap:var(--s-3);align-content:start;height:100%;
  padding:var(--s-6);text-decoration:none;color:inherit;
  background:var(--surface);border:1px solid var(--line);border-top:3px solid var(--accent);
  transition:border-color .18s ease, background-color .18s ease;
}
.tuer:hover{background:var(--accent-soft);border-color:var(--accent);color:inherit}
.tuer-label{font-size:var(--t-xs);font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--accent)}
.tuer-titel{font-family:var(--font-display);font-size:var(--t-h3);font-weight:600;color:var(--ink);line-height:1.2}
.tuer-text{color:var(--text-soft);font-size:var(--t-sm);max-width:46ch}
.tuer .go{margin-top:var(--s-2);font-size:var(--t-sm);font-weight:600;color:var(--accent);
  display:inline-flex;align-items:center;gap:.4rem}
.tuer .go svg{width:1em;height:1em;transition:transform .18s ease}
.tuer:hover .go svg{transform:translateX(3px)}

/* ---------- Zeitleiste: eine Nacht / Historie ---------- */
.zeitleiste{list-style:none;margin-top:var(--s-7);display:grid;gap:0}
.zeitleiste li{
  display:grid;gap:var(--s-2) var(--s-5);padding:var(--s-5) 0;
  border-top:1px solid var(--line-deep);position:relative;
}
.zeitleiste li:last-child{border-bottom:1px solid var(--line-deep)}
.zeitleiste .uhr{
  font-family:var(--font-display);font-size:clamp(1.25rem,2.6vw,1.75rem);font-weight:700;
  color:#A9BCEC;line-height:1.1;font-variant-numeric:tabular-nums;letter-spacing:-.02em;
}
.zeitleiste h3{font-size:var(--t-xl);margin:0 0 .35rem;color:var(--on-deep)}
.zeitleiste p{margin:0;color:var(--on-deep-soft);max-width:62ch}
@media (min-width:760px){
  .zeitleiste li{grid-template-columns:9rem minmax(0,1fr);align-items:baseline}
}
.zeitleiste--historie li{padding-block:var(--s-4)}
.zeitleiste--historie .uhr{font-size:var(--t-lg)}

/* ---------- Kennzahlen auch auf hellem Grund ---------- */
.figures--hell li{border-top-color:var(--line)}
.figures--hell .n{color:var(--accent)}
.figures--hell .l{color:var(--text-soft)}
.figures-quelle--hell{color:var(--text-soft)}

/* ---------- Karte des Vertriebsgebiets ---------- */
.karte{margin:0}
.karte svg{width:100%;height:auto;max-height:70vh;display:block}
.karte-land{fill:var(--accent-soft);stroke:var(--line-strong);stroke-width:1.2}
.karte-punkt circle{fill:var(--accent);opacity:.75}
.karte-punkt.ist-vz circle{opacity:1}
.karte-punkt text{
  font-family:var(--font-body);font-size:15px;font-weight:500;fill:var(--text-soft);
  paint-order:stroke;stroke:var(--bg);stroke-width:4px;stroke-linejoin:round;
}
.karte-punkt.ist-vz text{font-weight:700;fill:var(--ink);font-size:16px}
.karte-punkt.ist-aktiv circle{fill:var(--ink)}
.karte-punkt.ist-aktiv text{fill:var(--ink);font-weight:700}
.karte figcaption{display:flex;flex-wrap:wrap;gap:var(--s-5);margin-top:var(--s-4);
  font-size:var(--t-xs);color:var(--text-soft)}
.legende{display:inline-flex;align-items:center;gap:.5rem}
.legende .pt{width:9px;height:9px;border-radius:50%;background:var(--accent);opacity:.75;display:block}
.legende .pt.vz{width:14px;height:14px;opacity:1}
.karte-buehne{display:flex;justify-content:center}
.karte-buehne .karte{max-width:780px;width:100%}
.section--deep .karte-land{fill:rgba(255,255,255,.08);stroke:var(--line-deep)}
.section--deep .karte-punkt text{fill:var(--on-deep-soft);stroke:var(--bg-deep)}

/* ---------- Personenliste ---------- */
.personen{list-style:none;display:grid;gap:var(--s-4);margin-top:var(--s-6)}
@media (min-width:700px){.personen{grid-template-columns:1fr 1fr}}
@media (min-width:1000px){.personen{grid-template-columns:repeat(4,1fr)}
  .personen--breit{grid-template-columns:repeat(3,1fr)}}
.personen li{display:grid;gap:.2rem;border-top:3px solid var(--accent);padding-top:var(--s-4);
  font-size:var(--t-sm)}
.personen li b{font-family:var(--font-display);font-size:var(--t-lg);font-weight:600;color:var(--ink)}
.personen li span{color:var(--text-soft)}
.personen li a{word-break:break-word}

/* ---------- Downloads ---------- */
.downloads{list-style:none;display:grid;gap:0;border-top:1px solid var(--line)}
.downloads li{display:grid;gap:.25rem;padding:var(--s-4) 0;border-bottom:1px solid var(--line);
  font-size:var(--t-sm)}
.downloads li b{font-family:var(--font-display);font-size:var(--t-lg);font-weight:600;color:var(--ink)}
.downloads li span{color:var(--text-soft)}

/* ---------- Stellen ---------- */
.jobmeta{list-style:none;display:flex;flex-wrap:wrap;gap:var(--s-3) var(--s-6);
  margin:0 0 var(--s-5);padding:var(--s-4) 0;border-block:1px solid var(--line);font-size:var(--t-sm)}
.jobmeta b{display:block;font-size:var(--t-xs);font-weight:600;letter-spacing:.14em;
  text-transform:uppercase;color:var(--text-soft)}
.jobgrid{display:grid;gap:var(--s-7)}
@media (min-width:860px){.jobgrid{grid-template-columns:1fr 1fr;gap:var(--s-8) var(--s-7)}}
.jobblock h2{font-size:var(--t-h3);margin-bottom:var(--s-4);
  padding-bottom:var(--s-3);border-bottom:3px solid var(--accent)}
.jobblock p{color:var(--text-soft)}
.haken{list-style:none;display:grid;gap:var(--s-3)}
.haken li{position:relative;padding-left:1.6rem;color:var(--text-soft);font-size:var(--t-sm)}
.haken li::before{content:"";position:absolute;left:0;top:.55em;width:.7rem;height:2px;background:var(--accent)}

/* ---------- Formulare ---------- */
.formular{margin-top:var(--s-5)}
.felder{display:grid;gap:var(--s-4)}
@media (min-width:700px){.felder{grid-template-columns:1fr 1fr;gap:var(--s-4) var(--s-5)}
  .feld--breit,.feld--check{grid-column:1/-1}}
.feld{display:grid;gap:.4rem}
.feld label{font-size:var(--t-sm);font-weight:600;color:var(--ink)}
.feld abbr{color:var(--accent);text-decoration:none;border:0}
.feld input,.feld select,.feld textarea{
  font:inherit;font-size:var(--t-base);color:var(--text);background:var(--surface);
  border:1.5px solid var(--line-strong);border-radius:var(--radius);
  padding:.7rem .85rem;min-height:48px;width:100%;
}
.feld textarea{min-height:8rem;resize:vertical}
.feld input:focus,.feld select:focus,.feld textarea:focus{border-color:var(--accent)}
.feld--check{display:flex;align-items:flex-start;gap:.7rem}
.feld--check input{width:22px;height:22px;min-height:0;flex:none;margin-top:.15rem;accent-color:var(--accent)}
.feld--check label{font-weight:400;color:var(--text);font-size:var(--t-sm)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.formular-hinweis{margin:var(--s-5) 0 var(--s-4);font-size:var(--t-sm);color:var(--text-soft);
  border-left:3px solid var(--line-strong);padding-left:var(--s-4);max-width:62ch}
.formular button{margin-top:var(--s-5)}
.pflichtnote{margin:var(--s-3) 0 0;font-size:var(--t-xs);color:var(--text-soft)}

/* ---------- Rechtstexte ---------- */
.prose h2{font-size:var(--t-h3);margin-top:var(--s-7)}
.prose h2:first-child{margin-top:0}
.rechtshinweis{margin-top:var(--s-7)}

/* ---------- Header: Portal-Knopf ---------- */
@media (max-width:1023px){
  .site-nav .nav-portal,.site-nav .nav-tel{margin:var(--s-5) var(--gutter) 0;display:flex}
  .site-nav .nav-tel{margin-top:var(--s-3)}
}
@media (min-width:1024px){
  .site-nav .nav-portal,.site-nav .nav-tel{display:none}
}

/* ---------- Footer: vier Spalten ---------- */
@media (min-width:760px){.footer-grid{grid-template-columns:minmax(0,1.5fr) repeat(3,minmax(0,1fr))}}
.footer-adresse{margin-top:var(--s-4);font-size:var(--t-sm);color:var(--on-deep-soft)}
.footer-adresse a{color:var(--on-deep);text-decoration:none}