/* Nova42 – gemeinsames Stylesheet (Header/Nav/Footer/Formulare/Dark-Mode).
   Wird von allen Seiten eingebunden; seitenspezifische Regeln bleiben in
   einem kleinen <style> je Seite. */
:root{
  --bg:            #FBF3EE;
  --card:          #FFFFFF;
  --paper-soft:    #F4E4DC;
  --text:          #241A1F;
  --text-soft:     #6E5A57;
  --text-faint:    #A28F8A;
  --line:          #EAD9CF;
  --line-strong:   #DCC3B7;

  --heading:       #7A2361;
  --heading-dark:  #1A1A2E;
  --primary-soft:  #F1DCE9;

  --cta:           #CC0200;
  --cta-dark:      #A50200;
  --cta-soft:      #FBE0DD;

  --success:       #2F6B4F;
  --success-soft:  #E3EFE7;

  --radius:  14px;
}

:root[data-theme="dark"]{
  --bg:            #1A1A2E;
  --card:          #242440;
  --paper-soft:    #21213A;
  --text:          #EDE6E8;
  --text-soft:     #B9AFC0;
  --text-faint:    #8A8299;
  --line:          #38385A;
  --line-strong:   #46466E;

  --heading:       #E28AC4;
  --primary-soft:  #3A2440;
}
:root[data-theme="dark"] .stat-tile .num,
:root[data-theme="dark"] .pull-quote p{ color:var(--heading); }

*{ margin:0; padding:0; box-sizing:border-box; }
[hidden]{ display:none !important; }

html{ scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *, *::before, *::after{ animation:none !important; transition:none !important; }
}

body{
  background:var(--bg); color:var(--text);
  font-family:"Inter", system-ui, sans-serif;
  font-weight:500; font-size:1.0625rem; line-height:1.65;
  min-height:100vh; display:flex; flex-direction:column;
}
h1, h2{
  font-family:"Work Sans", sans-serif; font-weight:700;
  color:var(--heading); line-height:1.15;
}
h1{ font-size:clamp(1.9rem, 5vw, 2.6rem); margin-bottom:1.5rem; }
h2{ font-size:1.35rem; margin:2rem 0 .6rem; }
a{ color:var(--heading); }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible{
  outline:3px solid var(--heading); outline-offset:2px; border-radius:4px;
}

/* ── Skip-Link (Tastatur-Fokus) ── */
.skip-link{
  position:absolute; left:1rem; top:-3rem;
  background:var(--heading); color:#fff;
  padding:.7rem 1.1rem; border-radius:8px;
  font-weight:700; text-decoration:none;
  z-index:1000; transition:top .15s ease;
}
.skip-link:focus{ top:1rem; }

header{
  position:sticky; top:0; z-index:10;
  background:var(--bg); border-bottom:1px solid var(--line);
}
.site-nav{
  max-width:1080px; margin:0 auto;
  display:flex; align-items:center; justify-content:flex-start;
  padding:.9rem 1.25rem; gap:1rem;
}
.site-nav > nav{ margin-left:auto; }
.logo{
  display:flex; align-items:center; gap:.55rem;
  font-family:"Work Sans", sans-serif; font-weight:400;
  font-size:1.35rem; color:var(--text); text-decoration:none;
}
.logo img{ height:2.1rem; width:auto; display:block; }
.theme-toggle{
  position:relative;
  display:inline-flex; align-items:center;
  width:3.1rem; height:1.7rem; margin-left:.5rem;
  background:var(--line-strong); border:none;
  border-radius:999px; cursor:pointer; padding:.2rem;
  flex:none; transition:background .2s ease;
}
.theme-toggle:hover{ background:var(--text-faint); }
.theme-toggle .toggle-thumb{
  display:flex; align-items:center; justify-content:center;
  width:1.3rem; height:1.3rem; border-radius:50%;
  background:#fff; box-shadow:0 1px 3px rgba(0,0,0,.35);
  font-size:.75rem; line-height:1;
  transform:translateX(0); transition:transform .2s ease;
}
.theme-toggle[aria-checked="true"]{ background:var(--heading); }
.theme-toggle[aria-checked="true"] .toggle-thumb{ transform:translateX(1.4rem); }
:root[data-theme="dark"] .logo img{ filter:drop-shadow(0 0 4px rgba(251,243,238,.45)) drop-shadow(0 2px 3px rgba(0,0,0,.45)); }
.nav-controls{ display:flex; align-items:center; gap:.5rem; }
nav ul{ display:flex; gap:1.5rem; list-style:none; flex-wrap:wrap; }
nav a{ text-decoration:none; font-weight:600; color:var(--text); font-size:1rem; }
nav a:hover{ color:var(--heading); text-decoration:underline; }
nav a[aria-current="page"]{ color:var(--heading); }

main{
  flex:1; width:100%; max-width:820px;
  margin:0 auto; padding:3rem 1.25rem 4rem;
}
.card{
  background:var(--card); border-radius:14px;
  padding:2.25rem; box-shadow:0 2px 10px rgba(0,0,0,.08);
}
.card p{ margin-bottom:.9rem; }
.card ul{ margin:0 0 .9rem 1.25rem; }
.card li{ margin-bottom:.35rem; }
.card h2:first-child{ margin-top:0; }
.platzhalter{ background:#fdf1f0; padding:0 .25em; border-radius:4px; }

footer{
  background:var(--heading-dark); color:#fff; padding:2.5rem 1.25rem;
}
.footer-inner{
  max-width:1080px; margin:0 auto;
  display:flex; flex-direction:column; gap:1rem;
}
footer a{ color:#fff; font-weight:600; }
footer ul{ display:flex; gap:1.5rem; list-style:none; flex-wrap:wrap; }
.footer-top{
  display:flex; flex-wrap:wrap; gap:1.5rem;
  justify-content:space-between; align-items:center;
  width:100%;
}
.footer-whatsapp{ font-size:.95rem; margin:0; }
.footer-link-plain{ font-weight:500; }

/* ── KI-Transparenzhinweis (Footer) ── */
.ai-info{ position:relative; display:inline-flex; vertical-align:middle; margin-left:.4rem; }
.ai-info-btn{
  width:1.3rem; height:1.3rem;
  border-radius:50%;
  border:1.5px solid rgba(255,255,255,.55);
  background:rgba(255,255,255,.12);
  color:#ddd;
  font:inherit; font-size:.72rem; font-weight:700;
  line-height:1; cursor:pointer; padding:0;
  display:flex; align-items:center; justify-content:center;
}
.ai-info-btn:hover, .ai-info-btn:focus-visible{ background:rgba(255,255,255,.28); color:#fff; }
.ai-info-tip{
  display:none;
  position:absolute;
  bottom:calc(100% + .6rem); left:0;
  width:min(260px, 78vw);
  background:#fff; color:var(--text);
  font-size:.82rem; font-weight:500; line-height:1.45;
  padding:.65rem .85rem;
  border-radius:8px;
  box-shadow:0 6px 18px rgba(0,0,0,.3);
  z-index:20;
}
:root[data-theme="dark"] .ai-info-tip{ background:var(--card); color:var(--text); }
.ai-info:hover .ai-info-tip,
.ai-info.show .ai-info-tip{ display:block; }

/* ── Hamburger-Menü (nur Mobil) ── */
.nav-toggle{
  display:none;
  background:none; border:none;
  padding:.4rem; cursor:pointer;
  color:var(--heading);
  line-height:0;
}
.nav-toggle svg{ width:2rem; height:2rem; display:block; }

@media (max-width:700px){
  .nav-toggle{ display:block; }
  .logo-text{ display:none; }
  .logo img{ height:1.9rem; }
  .site-nav{ padding:.6rem 1rem; gap:.5rem; }
  .theme-toggle{ margin-left:auto; }

  nav{
    margin-left:0;
    position:absolute; top:100%; left:0; right:0;
    background:var(--bg);
    border-bottom:1px solid var(--line);
    box-shadow:0 6px 12px rgba(0,0,0,.12);
    max-height:0; overflow:hidden;
    transition:max-height .28s ease;
  }
  nav.open{ max-height:600px; }
  nav ul{
    flex-direction:column; gap:0;
    padding:.5rem 0;
  }
  nav li{ width:100%; }
  nav a{
    display:block;
    padding:.9rem 1.25rem;
    font-size:1.05rem;
    border-top:1px solid rgba(0,0,0,.06);
  }
  nav a:hover{ background:rgba(139,26,107,.08); text-decoration:none; }
}

/* Cookie-Hinweis */
.cookie-banner{
  position:fixed; left:0; right:0; bottom:0; z-index:100;
  background:var(--card); border-top:1px solid var(--line);
  box-shadow:0 -4px 16px rgba(0,0,0,.18);
  padding:1rem 1.25rem;
}
.cookie-banner-inner{
  max-width:1080px; margin:0 auto;
  display:flex; flex-wrap:wrap; gap:1rem;
  align-items:center; justify-content:space-between;
}
.cookie-banner p{
  margin:0; flex:1 1 320px;
  font-size:.92rem; color:var(--text-soft); line-height:1.5;
}
.cookie-banner a{ color:var(--heading); font-weight:600; }
.cookie-banner-actions{ display:flex; flex:none; gap:.75rem; }
.cookie-banner-actions button{
  font-family:inherit; font-size:.95rem; font-weight:700;
  border-radius:8px; padding:.65rem 1.3rem; cursor:pointer;
  border:none;
}
.cookie-accept{ background:var(--heading); color:#fff; }
.cookie-accept:hover{ opacity:.9; }
@media (max-width:520px){
  .cookie-banner-inner{ flex-direction:column; align-items:stretch; }
  .cookie-banner-actions{ justify-content:flex-end; }
}

/* Unterstuetzen-Dropdown im Header */
.nav-dropdown{ position:relative; }
.nav-dropdown-toggle{
  font-family:inherit; background:none; border:none; cursor:pointer;
  font-weight:600; color:var(--text); font-size:1rem;
  display:inline-flex; align-items:center; gap:.35rem;
  padding:0;
}
.nav-dropdown-toggle:hover{ color:var(--heading); text-decoration:underline; }
.nav-dropdown-toggle .chevron{ width:.7em; height:.7em; flex:none; transition:transform .2s ease; }
.nav-dropdown-toggle[aria-expanded="true"] .chevron{ transform:rotate(180deg); }
.nav-dropdown-menu{
  display:block; gap:0;
  list-style:none; margin:0; padding:.3rem;
  position:absolute; top:calc(100% + .6rem); left:0;
  background:var(--card); border:1px solid var(--line);
  border-radius:10px; box-shadow:0 8px 20px rgba(0,0,0,.15);
  min-width:190px; z-index:20;
}
.nav-dropdown-menu[hidden]{ display:none; }
.nav-dropdown-menu::before{
  content:"";
  position:absolute; top:-0.6rem; left:0; right:0; height:0.6rem;
}
.nav-dropdown-menu li{ width:100%; margin:0; }
.nav-dropdown-menu a{
  display:block; padding:.7rem .9rem; border-radius:6px;
  font-weight:600; font-size:1.05rem; line-height:1.3; color:var(--text); text-decoration:none;
}
.nav-dropdown-menu a:hover{ background:var(--primary-soft); color:var(--heading); text-decoration:none; }

@media (hover:hover){
  .nav-dropdown:hover .nav-dropdown-menu[hidden]{ display:block !important; }
  .nav-dropdown:hover .nav-dropdown-toggle .chevron{ transform:rotate(180deg); }
}

@media (max-width:700px){
  .nav-dropdown-toggle{
    display:flex; width:100%; justify-content:space-between;
    padding:.9rem 1.25rem; font-size:1.05rem;
    border-top:1px solid rgba(0,0,0,.06);
  }
  .nav-dropdown-menu{
    position:static; box-shadow:none; border:none; border-radius:0;
    background:transparent; padding:0; margin:0; min-width:0;
  }
  .nav-dropdown-menu a{ padding:.75rem 1.25rem .75rem 2.25rem; border-top:1px solid rgba(0,0,0,.06); border-radius:0; }
}

/* ── Barrierefreie Status-/Fehlermeldungen (Formulare) ── */
.form-status{ font-size:.92rem; font-weight:600; margin-top:.5rem; }
.form-status.error, .send-error{ color:var(--cta-dark); }
.form-status.success, .save-status{ color:var(--success); }

/* ── Kleine Utility-Klassen (ersetzen frühere style="..."-Attribute, CSP-konform) ── */
.mt-0{ margin-top:0; }
.mb-06{ margin-bottom:.6rem; }
.mb-1{ margin-bottom:1rem; }
.mb-1-5{ margin-bottom:1.5rem; }
.text-center{ text-align:center; }
.text-left{ text-align:left; }
.visually-hidden-field{ position:absolute; left:-9999px; }
.hint-text{ font-size:.85rem; opacity:.75; }
.hint-text-lg{ font-size:.9rem; opacity:.8; }
.hint-text-90{ font-size:.9rem; opacity:.75; }
.mt-06{ margin-top:.6rem; }
.mt-075{ margin-top:.75rem; }
.mt-1{ margin-top:1rem; }
.table-scroll{ overflow-x:auto; margin-top:1.25rem; }
.grid-gap-06{ display:grid; gap:.6rem; }
.tool-footer-credit{ text-align:center; padding:1.5rem 1rem; font-size:.85rem; color:var(--text-faint); }
.tool-footer-sep{ color:var(--text-faint); margin:0 .5rem; }

/* ── Karten-Fallback-Liste (A11y / falls Leaflet nicht lädt) ── */
.map-fallback{
  margin-top:1rem; background:var(--card); border:1px solid var(--line);
  border-radius:var(--radius); padding:1rem 1.25rem;
}
.map-fallback summary{ cursor:pointer; font-weight:700; color:var(--heading); }
.map-fallback ul{ margin:.75rem 0 0 1.1rem; }
.map-fallback li{ margin-bottom:.4rem; }
