:root{
      --bg:#ffffff;
      --text:#0b0f14;
      --muted:#4b5563;

      --green:#0f766e;
      --green-dark-ui:#5eead4;
      --green-strong:#065f46;

      --black:#0b0f14;
      --anth:#0b1220;

      --line:#e5e7eb;
      --radius:14px;
      --max:1080px;
      --shadow:0 10px 26px rgba(0,0,0,0.08);
    }

    *{ box-sizing:border-box; }
    body{
      margin:0;
      font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
      color: var(--text);
      background: var(--bg);
      line-height:1.6;
    }
    a{ color:inherit; }
    :where(a, button, input, select, textarea, summary):focus-visible{ outline:3px solid #14b8a6; outline-offset:3px; }
    html{ scroll-behavior:smooth; scroll-padding-top:105px; }
    :where(section, details, header)[id]{ scroll-margin-top:105px; }
    .skipLink{position:absolute; z-index:5000; left:12px; top:-70px; background:#fff; color:#064e3b; padding:12px 16px; font-weight:700; border-radius:10px;}
    .skipLink:focus{top:12px;}
    .wrap{ max-width:var(--max); margin:0 auto; padding:0 20px; }

    /* =========================
       STICKY NAV (klein)
       ========================= */
    .stickybar{
      position: sticky;
      top: 0;
      z-index: 4000;
      background: var(--black);
      border-bottom: 3px solid var(--green);
      transition: padding .18s ease, box-shadow .18s ease, background .18s ease;
    }
    .stickybar .topbar{ padding: 14px 0; }
    .stickybar.shrink .topbar{ padding: 8px 0; }
    .stickybar.shrink{
      box-shadow: 0 10px 24px rgba(0,0,0,0.28);
      background: #0a0f14;
    }

    .topbar{
      position:relative;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:16px;
      flex-wrap:wrap;
    }

    .brandbox{
      display:flex;
      flex-direction:column;
      cursor:pointer;
      user-select:none;
      text-decoration:none;
    }
    .brandbox strong{
      font-size:1.05rem;
      letter-spacing:0.2px;
      color: var(--green-dark-ui);
    }
    .brandbox span{ font-size:0.92rem; opacity:0.9; color:#fff; }

    .pillnav{
      display:flex; gap:10px; flex-wrap:wrap; justify-content:flex-end;
    }
    .pillnav a{
      text-decoration:none;
      border: 1px solid rgba(255,255,255,0.22);
      padding: 10px 12px;
      border-radius:999px;
      font-size:0.92rem;
      opacity:0.95;
      position: relative;
      transition: background .12s ease, border-color .12s ease, transform .12s ease, padding .18s ease, font-size .18s ease;
      color:#fff;
    }
    .stickybar.shrink .pillnav a{
      padding: 8px 10px;
      font-size: 0.88rem;
    }

    .pillnav a:hover{
      background: rgba(255,255,255,0.08);
      border-color: rgba(255,255,255,0.30);
    }

    /* grüne Unterlinie: NUR HOVER */
    .pillnav a::after{
      content:"";
      position:absolute;
      left: 14px;
      right: 14px;
      bottom: 6px;
      height: 2px;
      background: var(--green);
      border-radius: 999px;
      transform: scaleX(0);
      transform-origin: center;
      transition: transform .16s ease;
      opacity: 0.95;
      pointer-events:none;
    }
    .pillnav a:hover::after, .pillnav a:focus-visible::after{ transform: scaleX(1); }
    .mobileNav{display:none;}
    .mobileNav summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:9px;padding:9px 13px;border:1px solid rgba(255,255,255,.38);border-radius:10px;color:#fff;font-weight:700;}
    .mobileNav summary::-webkit-details-marker{display:none;}
    .mobileNav summary::before{content:"☰";font-size:1.15rem;line-height:1;}
    .mobileNav[open] summary::before{content:"✕";}
    .mobileNavLinks{position:absolute;right:0;top:calc(100% + 7px);display:grid;min-width:min(250px,calc(100vw - 40px));gap:4px;background:#0b0f14;padding:12px;border:1px solid rgba(255,255,255,.25);border-radius:12px;box-shadow:0 18px 28px rgba(0,0,0,.25);z-index:100;}
    .mobileNavLinks a{color:#fff;text-decoration:none;padding:12px;border-radius:8px;}
    .mobileNavLinks a:hover, .mobileNavLinks a:focus-visible{background:rgba(255,255,255,.1);}


    /* =========================
       HERO HEADER (groß, scrollt weg)
       ========================= */
    header.heroHeader{
      background: var(--black);
      color:#fff;
      padding: 44px 0 40px;
    }

    .hero{
      display:grid;
      grid-template-columns: 1.35fr 0.65fr;
      gap:22px;
      align-items:start;
      margin-top:6px;
    }
    .hero h1{
      margin:0 0 12px 0;
      font-size: clamp(2.0rem, 2.8vw, 2.6rem);
      line-height:1.15;
      letter-spacing:-0.4px;
      font-weight:800;
    }
    .hero p{
      margin:0 0 14px 0;
      max-width:64ch;
      opacity:0.95;
      font-size:1.05rem;
    }

    .trustline{
      margin: 10px 0 0;
      padding: 10px 12px;
      border: 1px solid rgba(255,255,255,0.16);
      background: rgba(255,255,255,0.06);
      border-radius: 12px;
      color: rgba(255,255,255,0.92);
      max-width: 72ch;
      font-size: 0.98rem;
    }
    .trustline strong{ color: var(--green-dark-ui); }

    .ctaRow{ display:flex; gap:12px; flex-wrap:wrap; align-items:center; }

    .btn{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      gap:10px;
      padding:12px 16px;
      border-radius:12px;
      border:1px solid transparent;
      text-decoration:none;
      font-weight:700;
      cursor:pointer;
      user-select:none;
      transition: transform .12s ease, background .12s ease, box-shadow .18s ease, border-color .18s ease;
      white-space: nowrap;
    }
    .btn:active{ transform: translateY(1px); }

    .btn-primary{
      background: var(--green);
      color:#ffffff;
      border: 1px solid var(--green-strong);
      box-shadow: 0 10px 22px rgba(0,0,0,0.25);
    }
    .btn-primary:hover{ background: var(--green-strong); }

    /* Arbeitsweise */
    .heroCard{
      background: rgba(255,255,255,0.06);
      border: 1px solid rgba(255,255,255,0.18);
      border-radius: var(--radius);
      padding:18px;
      box-shadow: 0 14px 34px rgba(0,0,0,0.22);
    }
    .heroCard h3{
      margin:0 0 10px 0;
      font-size:1.05rem;
      color: var(--green-dark-ui);
      letter-spacing:0.2px;
      font-weight: 800;
    }
    .heroCard ul{ margin:0; padding-left:18px; }
    .heroCard li{
      margin:6px 0;
      color: rgba(255,255,255,0.92);
    }

    /* Sections */
    section{ padding:46px 0; }
    .kicker{ color: var(--muted); margin:0 0 6px; font-weight:700; letter-spacing:0.2px; }

    h2{
      color: var(--green);
      margin:0 0 16px 0;
      font-size:1.6rem;
      letter-spacing:-0.2px;
      position: relative;
      padding-bottom: 6px;
    }
    h2:after{
      content:"";
      position:absolute;
      left:0;
      bottom:0;
      width: 64px;
      height: 3px;
      background: var(--green);
      border-radius: 999px;
      opacity: 0.9;
    }

    .grid{
      display:grid;
      grid-template-columns: repeat(12, 1fr);
      gap:16px;
    }

    .card{
      grid-column: span 6;
      border:1px solid var(--line);
      border-radius: var(--radius);
      padding:18px;
      box-shadow: var(--shadow);
      background:#fff;
      transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    }
    .card:hover{
      transform: translateY(-3px);
      box-shadow: 0 16px 34px rgba(0,0,0,0.12);
      border-color: rgba(15,118,110,0.30);
    }

    .cardHead{ display:flex; align-items:center; gap:12px; margin-bottom:6px; }
    .iconBox{
      width:44px; height:44px;
      border-radius:12px;
      background:#f0fdfa;
      display:grid; place-items:center;
      border:1px solid rgba(15,118,110,0.22);
      color: var(--green);
      transition: transform .18s ease, background .18s ease, border-color .18s ease;
      flex: 0 0 auto;
    }
    .iconBox svg{ width:26px; height:26px; stroke: currentColor; }
    .card:hover .iconBox{
      transform: translateY(-1px);
      background:#eaf7f5;
      border-color: rgba(15,118,110,0.34);
    }
    .card h3{ margin:0; font-size:1.05rem; }
    .card p{ margin:10px 0 0; color: var(--muted); }

    .link{
      display:inline-flex;
      margin-top:12px;
      font-weight:700;
      color: var(--green);
      text-decoration:none;
    }
    .link:hover{ text-decoration: underline; }

    .twoCol{
      display:grid;
      grid-template-columns: 1fr 1fr;
      gap:18px;
      align-items:start;
    }

    .panel{
      border:1px solid var(--line);
      border-radius: var(--radius);
      padding:18px;
      background:#fff;
      box-shadow: var(--shadow);
    }

    .note{
      border-left:4px solid var(--green);
      padding:12px 14px;
      background:#f8fafc;
      border-radius:10px;
      color: var(--muted);
    }

    .stepList{ list-style:none; padding-left:0; margin:0; display:grid; gap:12px; }
    .stepRow{ display:flex; gap:12px; align-items:flex-start; }
    .stepIcon{
      width:34px; height:34px;
      border-radius:10px;
      background:#f1f5f9;
      display:grid; place-items:center;
      border:1px solid var(--line);
      margin-top:2px;
      color: var(--green);
      flex: 0 0 auto;
      font-weight: 800;
    }

    /* About */
    .about{
      border:1px solid var(--line);
      border-radius: var(--radius);
      background:#fff;
      box-shadow: var(--shadow);
      overflow:hidden;
    }
    .aboutGrid{ display:grid; grid-template-columns: 0.95fr 1.05fr; gap:0; }
    .aboutMedia{ position:relative; min-height:340px; background: var(--anth); }
    .aboutMedia img{
      width:100%; height:100%;
      object-fit: cover;
      display:block;
      position:relative;
      z-index:1;
    }
    .aboutMedia:after{
      content:"";
      position:absolute; inset:0;
      background: linear-gradient(135deg, rgba(15,118,110,0.06), rgba(0,0,0,0.05));
      mix-blend-mode: multiply;
      pointer-events:none;
      z-index:2;
    }
    .aboutBody{ padding:22px; }
    .aboutBody p{ margin:0 0 12px; color: var(--muted); }

    /* Contact + forms */
    form label{ font-weight:700; font-size:0.92rem; }
    input, select, textarea{
      width:100%;
      padding:12px 12px;
      border-radius:12px;
      border:1px solid var(--line);
      font-size:1rem;
      outline:none;
      background:#fff;
    }
    textarea{ resize:vertical; min-height:110px; }
    input:focus, select:focus, textarea:focus{
      border-color: rgba(15,118,110,0.6);
      box-shadow: 0 0 0 4px rgba(15,118,110,0.12);
    }
    .formRow{ display:grid; gap:10px; margin-bottom:12px; }

    .success{
      display:none;
      border:1px solid rgba(15,118,110,0.35);
      background:#f0fdfa;
      color:#064e3b;
      border-radius:14px;
      padding:14px 16px;
      box-shadow: var(--shadow);
      margin-bottom: 14px;
    }
    .errorbox{
      display:none;
      border:1px solid rgba(239,68,68,0.35);
      background:#fef2f2;
      color:#7f1d1d;
      border-radius:14px;
      padding:12px 14px;
      box-shadow: var(--shadow);
      margin-bottom: 14px;
    }

    .checkRow{
      display:flex;
      align-items:flex-start;
      gap:10px;
      margin-top:6px;
    }
    .checkRow input[type="checkbox"]{
      width:auto;
      margin-top:3px;
      flex:0 0 auto;
    }
    .checkRow label{
      margin:0;
      font-weight:650;
      color:var(--muted);
      line-height:1.35;
    }

    /* Details (Accordion) */
    details{
      border:1px solid var(--line);
      border-radius: var(--radius);
      background:#fff;
      box-shadow: var(--shadow);
      overflow:hidden;
    }
    details + details{ margin-top:12px; }

    summary{
      list-style:none;
      cursor:pointer;
      padding:16px 18px;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:12px;
      font-weight:850;
    }
    summary::-webkit-details-marker{ display:none; }

    .sumLeft{
      display:flex;
      align-items:center;
      gap:10px;
      min-width: 0;
    }
    .sumDot{
      width:10px; height:10px;
      border-radius:999px;
      background: var(--green);
      flex: 0 0 auto;
    }
    .sumTitle{
      white-space:normal;
      overflow-wrap:anywhere;
    }
    .chev{
      width:10px; height:10px;
      border-right:2px solid var(--muted);
      border-bottom:2px solid var(--muted);
      transform: rotate(45deg);
      transition: transform .18s ease;
      flex: 0 0 auto;
      margin-top: -2px;
    }
    details[open] .chev{ transform: rotate(225deg); }

    .detailBody{
      padding:0 18px 18px;
      color: var(--muted);
    }
    .detailBody p{ margin:10px 0 0; }
    .detailBody ul{ margin:10px 0 0; padding-left:18px; }

    footer{
      background: var(--black);
      color:#9ca3af;
      padding:28px 0;
      font-size:0.92rem;
      border-top: 3px solid var(--green);
    }
    footer a{ color:#9ca3af; text-decoration:none; margin-right:12px; opacity:0.95; }
    footer a:hover{ color:#ffffff; }

    /* Mobile-Menü darf nicht die weiße Accordion-Karte erben. */
    .stickybar .mobileNav{border:0;background:transparent;box-shadow:none;border-radius:0;overflow:visible;}
    .stickybar .mobileNav summary{background:#0b0f14;color:#ffffff;border:1px solid rgba(255,255,255,.38);box-shadow:none;}
    .stickybar .mobileNav .mobileNavLinks{overflow:visible;}
    @media (max-width: 760px){
      .topbar{flex-wrap:nowrap;}
      .brandbox strong{font-size:.93rem;line-height:1.3;}
      .brandbox span{font-size:.78rem;}
      .pillnav{display:none;}
      .mobileNav{display:block;flex:0 0 auto;}
      .mobileNav summary{padding:9px 11px;}
      .stickybar .topbar{padding:11px 0;}
      .stickybar.shrink .topbar{padding:8px 0;}
      .hero h1{font-size:clamp(1.75rem,7vw,2.25rem);}
      .btn{white-space:normal;text-align:center;}
      .ctaRow .btn{width:100%;}
      section{padding:36px 0;}
      .wrap{padding:0 16px;}
      .aboutMedia{min-height:230px;}
      .card, .panel{padding:16px;}
      .heroCard{padding:16px;}
    }
    @media (max-width: 380px){
      .brandbox strong{font-size:.86rem;}
      .brandbox span{font-size:.73rem;}
      .mobileNav summary{font-size:.86rem;padding:8px 9px;}
      .hero h1{font-size:1.72rem;}
    }
    @media (prefers-reduced-motion: reduce){
      html{scroll-behavior:auto;}
      *, *::before, *::after{animation-duration:.01ms!important;transition-duration:.01ms!important;}
    }
    @media (max-width: 880px){
      .hero{ grid-template-columns:1fr; }
      .card{ grid-column: span 12; }
      .twoCol{ grid-template-columns:1fr; }
      .pillnav{ justify-content:flex-start; }
      .aboutGrid{ grid-template-columns:1fr; }
      .aboutMedia{ min-height:260px; }
      header.heroHeader{ padding-top: 34px; }
    }
  
/* V04: weitere Unterseiten */
.pageMain {min-height:55vh; padding:34px 0 64px}
.pageHero {border-bottom:1px solid var(--line);background:#f8fafc;padding:31px 0 25px}
.pageHero h1 {margin:0 0 6px;font-size:clamp(1.8rem,3.2vw,2.45rem);line-height:1.22;letter-spacing:-.03em}
.pageHero p {margin:0;color:var(--muted);max-width:70ch}
.pageMain .panel {max-width:930px;margin:0 auto}
.pageMain h2 {margin-top:28px;font-size:1.27rem}
.pageMain h2:first-child {margin-top:0}
.pageMain p,.pageMain li {line-height:1.75}
.pageMain .legalAddress {font-style:normal;line-height:1.8}
.pageMain .missing {color:#9f1239;background:#fff1f2;font-weight:750;border-radius:4px;padding:0 4px}
.pageMain .muted {color:var(--muted)}
.pageMain .requiredFlag {font-size:.86rem;color:var(--muted)}
.qGrid {display:grid;grid-template-columns:1fr 1fr;gap:0 14px}
.qSpan2 {grid-column:span 2}
.pageMain .twoCol .panel {max-width:unset}
.formHint {color:var(--muted);font-size:.9rem}
.visuallyHidden {position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:880px){.qGrid{grid-template-columns:1fr}.qSpan2{grid-column:span 1}}
@media(max-width:430px){.pageMain{padding-top:18px}.pageMain .panel{padding:15px}.pageHero{padding:24px 0 19px}}


/* ======================================================
   V06: einheitliche Marke, kompakter Einstieg, breiter Fragebogen
   ====================================================== */
:root { --green-dark-ui:#5eead4; --green:#0f766e; }
footer .footerBrand, footer strong { color:var(--green-dark-ui)!important; }
.heroHeader { padding-top:38px!important; padding-bottom:35px!important; }
.hero { grid-template-columns:minmax(0,1.45fr) minmax(245px,.65fr); gap:clamp(18px,3vw,40px); align-items:center; }
.heroMain { min-width:0; }
.hero .heroEyebrow { color:var(--green-dark-ui);font-weight:750;letter-spacing:.075em;text-transform:uppercase;font-size:.75rem;line-height:1.5;opacity:1;margin:0 0 14px; }
.hero h1 { font-size:clamp(2rem,3.25vw,2.85rem);line-height:1.11;letter-spacing:-.036em;margin-bottom:15px;max-width:19ch; }
.hero .heroLead { font-size:clamp(1rem,1.3vw,1.13rem);max-width:59ch;line-height:1.57;margin-bottom:18px;color:#e5e7eb;opacity:1; }
.heroActions { margin:0 0 9px;gap:18px; }
.heroSecondaryLink { color:var(--green-dark-ui);font-size:.92rem;font-weight:700;text-underline-offset:4px; }
.hero .heroFootnote { margin:0 0 22px;color:#cbd5e1;font-size:.85rem;line-height:1.52;opacity:1; }
.qualificationInline { display:flex;flex-direction:column;gap:4px;max-width:57ch;border-top:1px solid rgba(255,255,255,.20);padding-top:12px;font-size:.88rem;line-height:1.55;color:#d1d5db; }
.qualificationInline strong { color:var(--green-dark-ui);font-size:.84rem;letter-spacing:.02em; }
.heroCard { padding:23px;box-shadow:none; }
.heroCard .heroCardTitle { color:var(--green-dark-ui);font-size:1.1rem;line-height:1.35;margin:0 0 14px;padding:0; }
.heroCard .heroCardTitle::after { display:none; }
.heroCard ul { padding-left:20px; }
.heroCard li { margin:0 0 14px;line-height:1.5;font-size:.96rem; }
.heroCard li:last-child { margin-bottom:0; }
.card-core { border-top:3px solid var(--green);padding-top:16px; }
/* Kontakt: weniger Hinweise, E-Mail am Fuß des Kastens */
.contactGrid { align-items:stretch; }
.contactIntro { display:flex;flex-direction:column;justify-content:space-between;gap:30px; }
.contactIntro h3 { margin:0 0 10px;font-size:1.15rem; }
.contactIntro p { margin:0 0 14px;color:var(--muted); }
.contactIntro .contactSmall { font-size:.95rem; }
.contactQuestionnaire { margin-top:24px; }
.contactQuestionnaire p { margin:4px 0 2px;font-size:.93rem; }
.contactEmail { padding-top:16px;border-top:1px solid var(--line);overflow-wrap:anywhere;font-size:.94rem; }
.contactEmail a { color:var(--green);font-weight:750; }
/* Fragebogen – einheitliche, großzügige Felder statt schmaler rechter Spalte */
.questionnaireHero { padding:25px 0 22px; }
.questionnaireHero .pageEyebrow { color:var(--green);font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;font-weight:800;margin:0 0 5px; }
.questionnaireHero h1 { font-size:clamp(1.85rem,3vw,2.35rem); }
.questionnaireHero p:last-child { font-size:1rem; }
.questionnaireMain { padding-top:22px; }
.questionnaireMain .qIntro, .questionnaireMain .qFormPanel { max-width:none; }
.qIntro { display:grid;grid-template-columns:minmax(0,1.5fr) minmax(240px,.85fr);gap:26px;align-items:center;padding:19px 24px;margin-bottom:22px!important;background:#f8fafc;box-shadow:none; }
.qIntro h2 { font-size:1.15rem;margin:0 0 7px; }
.qIntro h2::after { display:none; }
.qIntro p { margin:0;color:var(--muted);font-size:.95rem;line-height:1.56!important; }
.qIntroAside { padding-left:20px;border-left:3px solid var(--green); }
.qIntroAside a { display:inline-block;margin-top:8px;color:var(--green);font-weight:750;font-size:.93rem; }
.questionnaireMain .qFormPanel { padding:24px 28px 28px; }
.qFieldset { border:0;padding:0;margin:0 0 19px;min-width:0; }
.qFieldset + .qFieldset { border-top:1px solid var(--line);padding-top:17px; }
.qFieldset legend { font-size:1.16rem;color:var(--green);font-weight:780;padding:0;margin-bottom:14px;line-height:1.4; }
.qGrid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:20px;row-gap:2px; }
.qGrid .formRow { min-width:0; }
.qGrid input, .qGrid select, .qGrid textarea { min-height:48px; }
.qGrid textarea { min-height:110px; }
.qFormPanel .checkRow { margin-top:8px; }
.qFormPanel .btn { margin-top:8px; }
@media(max-width:880px) {
 .hero { grid-template-columns:1fr; }
 .hero h1 { max-width:22ch; }
 .qIntro { grid-template-columns:1fr;gap:12px; }
 .qIntroAside {padding-left:14px;}
 .qGrid {grid-template-columns:repeat(2,minmax(0,1fr));}
 .qSpan2 {grid-column:span 2;}
}
@media(max-width:600px) {
 .heroHeader { padding-top:29px!important;padding-bottom:30px!important; }
 .hero .heroEyebrow {font-size:.69rem;}
 .hero h1 {font-size:clamp(1.85rem,7.7vw,2.35rem);max-width:none;}
 .heroActions { flex-direction:column;align-items:stretch;gap:12px; }
 .heroSecondaryLink { text-align:center;padding:4px; }
 .heroCard { padding:18px; }
 .qGrid {grid-template-columns:1fr;}
 .qSpan2 {grid-column:span 1;}
 .questionnaireMain .qFormPanel {padding:17px;}
 .qIntro {padding:17px;}
 .qIntroAside {padding-left:12px;}
}


/* ============================================================
   V07 — Gemeinsame Optimierung beider Designvarianten
   Navigation, Karten, Kontakt, Unterseiten, Responsive
   ============================================================ */
html { scroll-behavior:smooth; scroll-padding-top:0 !important; }
:where(section,details,header)[id] { scroll-margin-top:0; }
section[id] { scroll-margin-top:82px; }
details[id^="details-"] { scroll-margin-top:92px; }
#top {scroll-margin-top:0;}
@media(max-width:760px){section[id]{scroll-margin-top:72px;}details[id^="details-"]{scroll-margin-top:78px;}}
/* Ein einheitlicher Akzent für alle acht Leistungen. */
.card { border-top:3px solid var(--green); padding-top:16px; display:flex;flex-direction:column; }
.card-core { border-top:3px solid var(--green); }
.card .link { margin-top:auto; padding-top:14px; align-self:flex-start; }
.card:hover, .card:focus-within {transform:translateY(-3px);box-shadow:0 16px 34px rgba(0,0,0,.12);border-color:rgba(15,118,110,.38);border-top-color:var(--green);}
.card:focus-within {outline:2px solid rgba(15,118,110,.18);outline-offset:2px;}
/* Footer und Header: Türkis auf Anthrazit, dunkles Türkis auf Weiß */
.stickybar .brandbox strong, footer .footerBrand, footer strong {color:var(--green-dark-ui)!important;}
.stickybar{background:#0b0f14;}
/* Weniger großflächiger Leerraum beim Kontaktformular */
.contactGrid { align-items:start!important; grid-template-columns:minmax(0,.89fr) minmax(0,1.11fr); }
.contactGrid .contactIntro { align-self:start; justify-content:flex-start; gap:0; }
.contactGrid .contactQuestionnaire { margin-top:14px; }
.contactGrid .contactEmail { margin:17px 0 0; padding-top:13px; }
.contactGrid>.panel:last-child { min-width:0; }
/* Mehr Abstand unter der Navigation auf Rechteseiten und Fragebogen */
.pageHero {padding:41px 0 30px;}
.pageMain {padding-top:30px; min-height:unset; padding-bottom:55px;}
.pageMain .panel {box-shadow:0 12px 28px rgba(0,0,0,.055);}
.pageMain .legalAddress {overflow-wrap:anywhere;}
.pageHero h1 {line-height:1.18;}
/* Hero für beide Varianten: kürzer, besser balanciert */
.heroHeader {padding:51px 0 48px!important;}
.hero {grid-template-columns:minmax(0,1.32fr) minmax(275px,.72fr); gap:clamp(22px,4.2vw,54px); align-items:center;}
.hero h1 {font-size:clamp(2.12rem,3.15vw,2.95rem);line-height:1.11;letter-spacing:-.037em;max-width:20.5ch;margin-bottom:19px;}
.hero .heroLead {max-width:52ch;line-height:1.58;margin-bottom:23px;}
.heroActions {margin-bottom:13px;}
.hero .heroFootnote {max-width:55ch;margin-bottom:23px;}
.heroCard {align-self:center;padding:25px;border-radius:18px;}
.heroCard ul {margin:0;padding-left:20px;}
.heroCard li {margin-bottom:15px;}
.qualificationInline {max-width:57ch;padding-top:13px;}
.heroCard .heroCardTitle {margin-bottom:15px;}
/* Gemeinsame responsive Überarbeitungen */
@media (max-width:880px){
  .hero {grid-template-columns:1fr;gap:21px;}
  .heroCard {align-self:stretch;}
  .contactGrid {grid-template-columns:1fr;}
  .contactIntro {max-width:none;}
}
@media (max-width:600px){
  .heroHeader {padding:33px 0 37px!important;}
  .hero h1 {font-size:clamp(2rem,8vw,2.48rem);max-width:none;}
  .hero .heroLead {font-size:1.03rem;}
  .hero .heroFootnote {font-size:.82rem;}
  .heroCard {padding:19px;}
  .pageHero {padding:33px 0 23px;}
  .pageMain {padding:23px 0 44px;}
  .contactGrid {gap:14px;}
}
@media (prefers-reduced-motion:reduce) {
  .card:hover, .card:focus-within{transform:none;}
}

/* ============================================================
   V07 — Dunkle Variante A / Helle Variante B
   Die gemeinsame CSS-Datei ist identisch; body-Klasse wählt die
   Darstellung des ersten Bildschirmbereichs.
   ============================================================ */
body.theme-v07-dark .heroHeader {
  background:linear-gradient(120deg,#101c21 0%,#12282c 56%,#0d191f 100%);
  color:#fff;
}
body.theme-v07-dark .heroCard {
  background:rgba(255,255,255,.075);
  border:1px solid rgba(255,255,255,.18);
  box-shadow:0 10px 35px rgba(0,0,0,.11);
}
body.theme-v07-dark .hero .heroLead{color:#e0eaeb;}
body.theme-v07-dark .hero .heroFootnote{color:#ccd9dc;}
body.theme-v07-dark .qualificationInline{border-top-color:rgba(255,255,255,.20);color:#dae4e6;}
body.theme-v07-dark .heroCard li{color:#f2f7f7;}
body.theme-v07-dark .heroEyebrow,
body.theme-v07-dark .heroSecondaryLink,
body.theme-v07-dark .qualificationInline strong,
body.theme-v07-dark .heroCard .heroCardTitle{color:#5eead4;}
body.theme-v07-light .heroHeader {
  background:linear-gradient(128deg,#f7fbfa 0%,#ecf7f4 55%,#e6f1ee 100%);
  color:#10292c;
  border-bottom:1px solid #d8e8e4;
}
body.theme-v07-light .hero h1{color:#102329;}
body.theme-v07-light .hero .heroLead{color:#355158;opacity:1;}
body.theme-v07-light .hero .heroFootnote{color:#475b62;opacity:1;}
body.theme-v07-light .heroEyebrow,
body.theme-v07-light .heroSecondaryLink,
body.theme-v07-light .qualificationInline strong,
body.theme-v07-light .heroCard .heroCardTitle{color:#0f766e;}
body.theme-v07-light .heroCard {
  background:#ffffff;
  border:1px solid #d7e7e4;
  box-shadow:0 17px 45px rgba(17,54,55,.10);
}
body.theme-v07-light .heroCard li{color:#2c4449;}
body.theme-v07-light .qualificationInline {
  border-top:1px solid #c7d9d6;
  color:#395158;
}
body.theme-v07-light .hero .btn-primary {box-shadow:0 10px 24px rgba(15,118,110,.13);}
