/* ENERZIM – Verteilerseite enerzim.de
   Bewusst minimal: eine Frage, zwei Wege. Kein Marketingtext, keine Leistungs-Keywords –
   die Seite soll den beiden Fachseiten weder Aufmerksamkeit noch Sichtbarkeit nehmen. */
@font-face{font-family:'Archivo';src:url('fonts/archivo-var.woff2') format('woff2-variations');font-weight:100 900;font-style:normal;font-display:swap}

:root{
  --paper:#F7F6F2;--white:#fff;--ink:#2F3232;--ink-soft:#4A4E4C;
  --green:#73C70A;--green-text:#45790A;--green-pale:#EFF6E2;
  --gray:#8C8C8F;--gray-text:#6E6E71;--muted:#6B706D;--line:#DFDED7;
  --sans:'Archivo','Helvetica Neue',Arial,sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);
  font-size:16.5px;line-height:1.65;-webkit-font-smoothing:antialiased;
  min-height:100vh;min-height:100dvh;display:flex;flex-direction:column}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
:focus-visible{outline:2px solid var(--green-text);outline-offset:3px}
.shell{width:min(560px,100% - 2*clamp(20px,6vw,40px));margin-inline:auto}

/* Auswahl vertikal in der Seitenmitte */
.mitte{flex:1;display:flex;align-items:center;padding:clamp(32px,7vw,64px) 0}
.logo{width:clamp(200px,52vw,268px);height:auto;margin-bottom:clamp(30px,6vw,44px)}
h1{margin:0 0 clamp(22px,4vw,30px);font-size:clamp(23px,5.4vw,30px);font-weight:640;
  letter-spacing:-.016em;line-height:1.2;text-wrap:balance}

/* Die beiden Wege */
.wahl{display:grid;gap:12px}
.karte{display:flex;align-items:center;gap:16px;padding:20px clamp(16px,3vw,22px);
  background:var(--white);border:1px solid var(--line);border-radius:2px;
  text-decoration:none;color:inherit;
  transition:border-color .16s ease,background-color .16s ease,transform .16s ease}
.karte:hover{border-color:var(--green-text);background:var(--green-pale);transform:translateY(-1px)}
.karte-txt{flex:1;min-width:0}
.karte-txt strong{display:block;font-size:clamp(17px,3.6vw,19px);font-weight:640;letter-spacing:-.01em}
.karte-txt small{display:block;margin-top:3px;font-size:13.5px;color:var(--ink-soft);line-height:1.5}
.karte-txt .zielgruppe{margin-top:1px;font-size:14px;color:#55595A}
.karte .pfeil{flex:none;color:var(--green-text);font-size:19px;
  transition:transform .16s ease}
.karte:hover .pfeil{transform:translateX(3px)}

/* Markenzeile: Trennpunkt hängt am Ende des vorigen Abschnitts (nie am Zeilenanfang) */
.marke{margin:clamp(20px,4vw,26px) 0 0;font-size:14px;line-height:1.55;color:var(--ink-soft);text-wrap:pretty}
.marke .seg + .seg::before{content:"·\00a0";color:var(--muted)}
@media (max-width:560px){.marke .seg{display:block}.marke .seg + .seg::before{display:none}}

/* Direktkontakt – Tap-Ziele mindestens 44 px hoch */
.direkt{margin:clamp(14px,3vw,18px) 0 0;font-size:14.5px;color:var(--muted)}
.direkt a{display:inline-flex;align-items:center;min-height:44px;padding:0 2px;color:var(--green-text);
  text-decoration:underline;text-underline-offset:3px;white-space:nowrap}
.direkt a:hover{color:var(--ink)}
.direkt .eintrag{white-space:nowrap}
/* Trenner gehört zum folgenden Eintrag und steht nie allein am Zeilenende */
.direkt .eintrag + .eintrag::before{content:"·\00a0";color:var(--muted)}
/* Schmale Viewports: Zeile bricht um – dort ohne Trenner, damit kein Punkt am Zeilenanfang/-ende steht */
@media (max-width:560px){.direkt .eintrag + .eintrag::before{display:none}.direkt .eintrag{margin-right:14px}}

/* Verbandslogos (unter dem Direktkontakt). Beide Logos unverändert auf weißer Kachel:
   dena-Logo hat weißen Grund eingebrannt, GIH-Logo ist transparent mit dunkler Schrift. */
.verbaende{list-style:none;margin:clamp(20px,4vw,26px) 0 0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.verbaende a{position:relative;display:flex;align-items:center;height:58px;padding:0 14px;background:var(--white);
  border:1px solid var(--line);border-radius:2px;transition:border-color .16s ease}
.verbaende a:hover{border-color:var(--green-text)}
.verbaende img{width:auto}
.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}
.verbaende .logo-dena{height:32px}
.verbaende .logo-gih{height:42px}
@media (max-width:359px){
  .verbaende{gap:8px}
  .verbaende a{height:54px;padding:0 10px}
  .verbaende .logo-dena{height:30px}
  .verbaende .logo-gih{height:38px}
}

/* Fuß */
.fuss{border-top:1px solid var(--line);padding:6px 0;font-size:12.5px;color:var(--gray-text)}
.fuss-inner{display:flex;flex-wrap:wrap;gap:6px 20px;align-items:center;justify-content:space-between}
.fuss a{display:inline-flex;align-items:center;min-height:44px;padding:0 4px;color:var(--muted);text-decoration:none}
.fuss a:hover,.fuss a[aria-current="page"]{color:var(--ink)}
.fuss nav{display:flex;flex-wrap:wrap;gap:0 10px;margin-inline:-4px}
.fuss-legal{width:min(700px,100% - 2*clamp(20px,6vw,40px));margin-inline:auto}

/* Impressum / Datenschutz / AGB */
.legal-body{display:block}
.legal{width:min(700px,100% - 2*clamp(20px,6vw,40px));margin:0 auto;padding:clamp(30px,5vw,52px) 0 56px}
.legal .logo{width:clamp(180px,44vw,230px);margin-bottom:26px}
.legal h1{font-size:clamp(24px,4.4vw,32px);margin-bottom:22px}
.legal h2{margin:30px 0 8px;font-size:18px;font-weight:640;letter-spacing:-.01em}
.legal h3{margin:24px 0 8px;font-size:16.5px;font-weight:640;letter-spacing:-.005em}
.legal h2[id],.legal h3[id]{scroll-margin-top:16px}
.legal p{margin:0 0 12px;font-size:15.5px;color:var(--ink-soft)}
.legal ul{margin:0 0 12px;padding-left:1.3em}
.legal li{font-size:15.5px;color:var(--ink-soft)}
.legal ul > li{margin-bottom:4px}
.legal a{color:var(--green-text);overflow-wrap:anywhere}
.zurueck{display:inline-flex;align-items:center;gap:8px;margin-bottom:24px;
  font-size:14.5px;font-weight:600;color:var(--green-text);text-decoration:none}
.zurueck:hover{color:var(--ink)}
.nowrap{white-space:nowrap}
.todo{background:#FFF7DB;border-bottom:1px solid #D4AF37;padding:0 3px}

/* AGB: PDF-Hinweis unter der Überschrift */
.legal-pdf{margin:-6px 0 22px}
.legal-pdf a{font-weight:600;text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:1px}
.legal-pdf a:hover{color:var(--ink)}

/* Rechtstexte: Sprungliste, nummerierte Absätze, Angabenlisten, Formularlinien
   (übernommen aus build/legal/agb-inhalt.vorschlag.css) */
.legal-toc{margin:8px 0 32px;padding:16px 18px;border:1px solid var(--line);background:var(--white)}
.legal-toc ul{list-style:none;margin:0;padding:0;columns:2 260px;column-gap:28px}
.legal-toc ul > li{margin:0 0 6px;break-inside:avoid;font-size:14.5px}
.legal-toc a{text-decoration:none}
.legal-toc a:hover{text-decoration:underline}
.legal ol{margin:0 0 12px;padding-left:1.6em}
.legal ol > li{margin-bottom:8px;overflow-wrap:break-word}
.legal ol > li::marker{font-weight:700}
.legal h4{font-size:15.5px;margin:18px 0 6px;font-family:var(--sans);font-weight:660}
.legal dl{display:grid;grid-template-columns:minmax(0,13em) minmax(0,1fr);gap:6px 18px;margin:20px 0;font-size:15px}
.legal dt{font-weight:650;color:var(--ink)}
.legal dd{margin:0;color:var(--ink-soft);overflow-wrap:anywhere}
.legal table{width:100%;border-collapse:collapse;margin:14px 0 22px;font-size:15px}
.legal th{text-align:left;font-weight:650;vertical-align:bottom;padding:16px 14px 4px 0;width:42%}
.legal td:empty{border-bottom:1px solid currentColor;height:2.4em}
/* Hervorgehobener Block, z. B. Widerspruchsrecht Art. 21 DSGVO (wie .legal-box im Theme, hier auf Weiß wegen Papiergrund) */
.legal .legal-box{margin:26px 0;padding:2px 20px 6px;border:1px solid var(--line);border-left:3px solid var(--green);background:var(--white)}
.legal .legal-box h3{margin-top:16px}
.legal .legal-box p{overflow-wrap:break-word}
@media (max-width:560px){
  .legal dl{grid-template-columns:minmax(0,1fr);gap:2px}
  .legal dd{margin-bottom:10px}
  .legal table,.legal tbody,.legal tr,.legal th,.legal td{display:block;width:100%}
  .legal th{padding:14px 0 0}
}

/* Druck (auch Grundlage für das AGB-PDF) */
@media print{
  @page{size:A4;margin:18mm 17mm 20mm}
  body{background:#fff;color:#000;font-size:10.5pt;line-height:1.5}
  .zurueck,.fuss,.legal-pdf,.legal-toc{display:none}
  .legal{width:auto;margin:0;padding:0}
  .legal .logo{width:46mm;margin-bottom:8mm}
  .legal h1{font-size:18pt;margin:0 0 5mm}
  .legal h2{font-size:12.5pt;margin:7mm 0 2mm}
  .legal h3{font-size:11.5pt}
  .legal h4{font-size:10.5pt}
  .legal p,.legal li,.legal dd,.legal dl,.legal table{font-size:10.5pt;color:#000}
  .legal h2,.legal h3,.legal h4{break-after:avoid}
  #anlage-1,#anlage-2,#anlage-3{break-before:page}
  .legal ol > li,.legal tr,.legal dl{break-inside:avoid}
  .legal a{color:inherit;text-decoration:none}
}
