/* Bausafe self-hosted fonts (DSGVO-konform, kein Google-Request) */
@font-face{font-family:'DM Sans';font-style:normal;font-display:swap;font-weight:100 1000;src:url(/assets/fonts/dm-sans-latin-wght-normal.woff2) format('woff2-variations');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'DM Sans';font-style:normal;font-display:swap;font-weight:100 1000;src:url(/assets/fonts/dm-sans-latin-ext-wght-normal.woff2) format('woff2-variations');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Libre Baskerville';font-style:normal;font-display:swap;font-weight:400;src:url(/assets/fonts/libre-baskerville-latin-400-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Libre Baskerville';font-style:normal;font-display:swap;font-weight:400;src:url(/assets/fonts/libre-baskerville-latin-ext-400-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Libre Baskerville';font-style:normal;font-display:swap;font-weight:700;src:url(/assets/fonts/libre-baskerville-latin-700-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Libre Baskerville';font-style:normal;font-display:swap;font-weight:700;src:url(/assets/fonts/libre-baskerville-latin-ext-700-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Libre Baskerville';font-style:italic;font-display:swap;font-weight:400;src:url(/assets/fonts/libre-baskerville-latin-400-italic.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Libre Baskerville';font-style:italic;font-display:swap;font-weight:400;src:url(/assets/fonts/libre-baskerville-latin-ext-400-italic.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}

/* ============================================================
   Bausafe – Responsive Layer
   Geteiltes Stylesheet für alle Seiten. Wird NACH dem Inline-<style>
   geladen, daher gewinnen diese Regeln innerhalb der Media Queries.
   Rein additiv – Entfernen des <link>-Tags stellt den alten Zustand her.
   Breakpoints:  <= 900px (Tablet / Menü)   <= 600px (Smartphone)
   ============================================================ */

/* Burger-Button: standardmäßig ausgeblendet (Desktop) */
.nav-burger{
  display:none;
  flex-direction:column;justify-content:center;gap:5px;
  width:42px;height:42px;padding:9px;
  background:transparent;border:none;cursor:pointer;
  margin-left:auto;
}
.nav-burger span{
  display:block;height:2px;width:100%;
  background:var(--navy);border-radius:2px;
  transition:transform .25s var(--ease),opacity .2s var(--ease);
}
.nav.nav-open .nav-burger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav.nav-open .nav-burger span:nth-child(2){opacity:0}
.nav.nav-open .nav-burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

img,svg,video{max-width:100%}

/* ============================================================
   TABLET  ( <= 900px )
   ============================================================ */
@media (max-width:900px){

  /* --- Navigation: Burger + Dropdown-Panel --- */
  .nav{padding:0 20px}
  .nav-burger{display:flex}
  .nav-links{
    position:absolute;top:68px;left:0;right:0;
    flex-direction:column;align-items:stretch;gap:2px;
    background:var(--white);
    border-bottom:1px solid var(--silver-lt);
    box-shadow:0 14px 28px rgba(15,28,46,.10);
    padding:10px 14px 16px;
    display:none;
  }
  .nav.nav-open .nav-links{display:flex}
  .nav-links li{width:100%}
  .nav-links a{display:block;padding:13px 14px;font-size:15px;border-radius:6px}
  .nav-cta{margin-left:0!important;margin-top:6px;text-align:center;padding:13px 20px!important}

  /* --- Container-Padding reduzieren --- */
  .wrap,.trust-inner{padding-left:28px;padding-right:28px}

  /* --- Sektions-Abstände --- */
  .section,.section-dark,.kontakt-section,.standorte-strip{padding-top:64px;padding-bottom:64px}

  /* --- HERO --- */
  .hero{grid-template-columns:1fr;min-height:auto}
  .hero::after{display:none}
  .hero-left{padding:48px 28px 24px;max-width:none}
  .hero-right{padding:0 28px 56px}
  .hero-lead{max-width:none}

  /* --- Zwei-Spalten-Layouts -> einspaltig --- */
  .usp-grid,.ueber-grid,.ag-intro,.mission-grid,.tech-grid,.team-grid,
  .kontakt-grid,.markt-grid,.behoerde-box,.standort-detail-grid,
  .map-standorte-grid,.ag-grid,.ag-grid-rev,.content-grid,.article-layout,
  .main-grid,.kontakt-block,.kontext-grid,.featured-card{
    grid-template-columns:1fr;
    gap:40px;
  }

  /* --- Drei-/Mehr-Spalten-Karten -> zwei --- */
  .leist-grid,.ref-grid,.ref-grid-small,.vor-ort-grid,.zusatz-grid,
  .article-grid,.related-grid{
    grid-template-columns:repeat(2,1fr);
  }
  .img-grid-multi{grid-template-columns:1fr 1fr}

  /* --- Vier-Spalten -> zwei --- */
  .trust-inner{grid-template-columns:repeat(2,1fr);gap:14px}

  /* --- Standorte 6 -> 3 --- */
  .standorte-grid{grid-template-columns:repeat(3,1fr)}

  /* --- Footer 5 Spalten -> 2 --- */
  .footer-grid{grid-template-columns:repeat(2,1fr);gap:32px 28px}

  /* --- Newsletter-Block stapeln --- */
  .newsletter{grid-template-columns:1fr;gap:24px;padding:32px 28px;margin-bottom:56px}

  /* --- Deutschlandkarte etwas kompakter --- */
  .de-map{height:400px}
}

/* ============================================================
   SMARTPHONE  ( <= 600px )
   ============================================================ */
@media (max-width:600px){

  .wrap,.trust-inner{padding-left:20px;padding-right:20px}
  .section,.section-dark,.kontakt-section,.standorte-strip{padding-top:48px;padding-bottom:48px}

  /* --- HERO --- */
  .hero-left{padding:40px 20px 20px}
  .hero-right{padding:0 20px 44px}
  .hero h1{font-size:clamp(30px,8vw,40px)}
  .hero-lead{font-size:15.5px;margin-bottom:32px}
  .hero-actions .btn{flex:1 1 auto;justify-content:center}
  .stat-cell{padding:18px 16px}
  .stat-num{font-size:30px}

  /* --- Alles einspaltig --- */
  .leist-grid,.ref-grid,.ref-grid-small,.vor-ort-grid,.zusatz-grid,
  .ag-grid,.ag-grid-rev,.img-grid-multi,
  .article-grid,.related-grid,.werte-grid{
    grid-template-columns:1fr;
  }

  /* --- Trust & Standorte: zwei Spalten bleiben lesbar --- */
  .trust-inner{grid-template-columns:1fr}
  .standorte-grid{grid-template-columns:repeat(2,1fr)}

  /* --- Footer gestapelt --- */
  .footer-grid{grid-template-columns:1fr;gap:28px}
  .footer-bottom{flex-direction:column;align-items:flex-start;gap:6px}

  /* --- Formular: Felder untereinander --- */
  .form-row{grid-template-columns:1fr}
  .contact-form{padding:24px 20px}
  /* iOS-Zoom beim Fokus verhindern (>=16px) */
  .form-group input,.form-group select,.form-group textarea{font-size:16px}

  /* --- Leistungs-Zeilen umbrechen lassen --- */
  .leistung-row{grid-template-columns:1fr;gap:8px}
  .cta-block,.bundesweit-card{grid-template-columns:1fr;gap:16px;text-align:left}

  /* --- Titel etwas zähmen --- */
  .sec-title{font-size:clamp(24px,6vw,32px)}

  .de-map{height:340px}

  /* --- horizontale Logo-Leiste etwas enger --- */
  .logo-item{padding:0 28px}
}

/* ============================================================
   Accessibility AA – Kontrast & Heading-Fallbacks (2026-06)
   Diese Datei wird zuletzt geladen und gewinnt bei gleicher Spezifität.
   ============================================================ */

/* --- Kontrast: gedämpfter Fließtext auf hellem Grund (war #7A8899 = 3.61:1) --- */
:root{ --muted:#5E6C7D; }              /* 5.36:1 auf Weiß */

/* --muted wird auch auf dunklem Navy-Grund genutzt -> dort hell halten */
.hero-info-label,
.sr-label-dark{ color:#A9B4C2; }       /* 8.15:1 auf Navy */

/* Footer-Texte auf Navy */
.footer-col ul li a{ color:#A9B4C2; }              /* 8.15:1 */
.footer-bottom p,
.footer-bottom-simple p,
.footer-links a{ color:#94A1B2; }                  /* 6.53:1 */

/* Kleine orange Labels/Tags auf hellem bzw. Peach-Grund (war 3.07 / 2.81:1) */
.sec-label,
.pt-tag,
.leistung-tag,
.filter-context-link,
.ref-card-cta,
.infobox-label,
.standort-region{ color:#B05209; }     /* 5.18:1 Weiß / 4.73:1 Peach */

/* --- Heading-Fallbacks (0-Spezifität): falls eine Seite keine eigene
   Inline-Regel fuer das neue Heading-Level hat, bleibt der Look erhalten.
   Ueberschreibt KEINE vorhandene Inline-Regel (:where = Spezifität 0). --- */
:where(.footer-col) h2,
:where(.footer-col) h3,
:where(.footer-col) h4{
  font-size:10px;font-weight:700;letter-spacing:2px;text-transform:uppercase;
  color:var(--silver);margin-bottom:14px;
}
:where(.trust-item) h2,
:where(.trust-item) h3{
  font-size:12.5px;font-weight:600;color:var(--navy);margin-bottom:2px;
}
