@font-face{font-family:"Roboto";font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/roboto-400.woff2") format("woff2");}
  @font-face{font-family:"Roboto";font-style:normal;font-weight:500;font-display:swap;src:url("../fonts/roboto-500.woff2") format("woff2");}
  @font-face{font-family:"Roboto";font-style:normal;font-weight:600;font-display:swap;src:url("../fonts/roboto-600.woff2") format("woff2");}
  @font-face{font-family:"Roboto";font-style:normal;font-weight:700;font-display:swap;src:url("../fonts/roboto-700.woff2") format("woff2");}
  @font-face{font-family:"Roboto";font-style:normal;font-weight:900;font-display:swap;src:url("../fonts/roboto-900.woff2") format("woff2");}

  :root{
    --bg:#112035;
    --bg-alt:#0d1a2b;
    --panel-bg:linear-gradient(160deg, rgba(255,255,255,0.058) 0%, rgba(255,255,255,0.028) 100%);
    --panel-border:rgba(255,255,255,0.12);
    --panel-border-strong:rgba(255,255,255,0.2);
    --subpanel-bg:linear-gradient(160deg, rgba(255,255,255,0.066) 0%, rgba(255,255,255,0.036) 100%);
    --subpanel-border:rgba(90,143,196,0.3);
    --accent:#5A8FC4;
    --accent-dark:#4977a3;
    --accent-green:#A2CFB5;      /* Positiv-Akzent: Preise, Rabatte, Rechner-Hinweise.
                                    Bewusst KEIN Rot – ein Angebot soll einladen, nicht warnen. */
    --accent-green-ink:#0d1a2b;  /* Schrift auf grüner Fläche (10:1 Kontrast) */
    --accent-red:#DA2927;      /* AXA-Rot – nur noch für echte Warnungen und Pflichtfeld-Marker */
    --accent-red-text:#DA2927; /* Alias, identisch zu --accent-red (bewusst nur ein Rotton).
                                  Rot wird NICHT für Fließtext verwendet: auf dunklem Grund
                                  erreicht es nur 2,9:1 und wäre schlecht lesbar. */
    --text:#ffffff;
    --text-dim:rgba(255,255,255,0.72);
    --text-dimmer:rgba(255,255,255,0.52);
  }
  *{box-sizing:border-box;}
  [hidden]{display:none !important;}
  html{scroll-behavior:smooth;}
  body{margin:0;font-family:"Roboto",Helvetica,Arial,sans-serif;color:var(--text);background:linear-gradient(165deg, #12233c 0%, var(--bg) 45%, var(--bg-alt) 100%);background-repeat:no-repeat;line-height:1.65;-webkit-font-smoothing:antialiased;overflow-x:hidden;}
  a{color:inherit;}
  img{max-width:100%;display:block;}
  picture{display:block;line-height:0;flex-shrink:0;}
  h1,h2,h3,h4,p,li,.section-title,.hero h1{overflow-wrap:break-word;word-break:break-word;hyphens:auto;}
  .container{max-width:1120px;margin:0 auto;padding:0 24px;}
  a:focus-visible, button:focus-visible{outline:3px solid var(--accent);outline-offset:2px;}

  /* Nutzer, die in ihrem System reduzierte Bewegung eingestellt haben, bekommen
     keine weichen Scroll-Sprünge und keine Übergangsanimationen. */
  @media (prefers-reduced-motion: reduce){
    html{scroll-behavior:auto;}
    *, *::before, *::after{
      animation-duration:0.01ms !important;
      animation-iteration-count:1 !important;
      transition-duration:0.01ms !important;
      scroll-behavior:auto !important;
    }
  }
  .skip-link{position:absolute;left:16px;top:-60px;background:var(--accent-dark);color:#fff;padding:12px 20px;border-radius:8px;font-weight:700;font-size:13px;text-decoration:none;z-index:200;transition:top .15s ease;}
  .skip-link:focus{top:16px;}

  header{position:sticky;top:0;z-index:50;background:rgba(17,32,53,0.9);border-bottom:1px solid var(--panel-border);backdrop-filter:blur(16px);}
  .header-inner{display:flex;align-items:center;justify-content:space-between;padding:8px 24px;max-width:1120px;margin:0 auto;gap:16px;flex-wrap:nowrap;}
  .brand{display:flex;align-items:center;gap:14px;flex-shrink:0;text-decoration:none;}
  .axa-logo{height:51px;width:auto;display:block;}
  .main-nav{display:flex;align-items:center;gap:20px;flex-shrink:1;}
  .main-nav a{font-size:13px;font-weight:600;color:var(--text-dim);text-decoration:none;text-transform:uppercase;letter-spacing:1px;}
  .main-nav a:hover{color:var(--text);}
  .header-phone{display:inline-flex;align-items:center;gap:6px;font-weight:700;color:var(--accent);font-size:14px;text-decoration:none;white-space:nowrap;flex-shrink:0;}
  .header-phone:hover{text-decoration:underline;}
  .header-phone svg{flex-shrink:0;}
  .header-cta{display:inline-flex;align-items:center;gap:8px;background:var(--accent-dark);color:#fff;padding:11px 22px;border-radius:10px;font-weight:600;font-size:13px;text-decoration:none;white-space:nowrap;text-transform:uppercase;letter-spacing:0.6px;transition:background .15s ease, transform .15s ease;flex-shrink:0;}
  .header-cta:hover{background:var(--accent);transform:translateY(-1px);}
  /* Feste Handlungsleiste am unteren Rand – nur auf Smartphones/Tablets.
     Dort blendet der Header Telefonnummer und CTA aus, sonst gäbe es auf der
     ganzen Seite keinen schnellen Weg zu Anruf oder Angebot. */
  .mobile-cta{display:none;}
  .mobile-cta.is-hidden{transform:translateY(110%);}
  @media (max-width:900px){
    .mobile-cta{
      display:flex;gap:10px;position:fixed;left:0;right:0;bottom:0;z-index:60;
      padding:10px 16px;padding-bottom:calc(10px + env(safe-area-inset-bottom, 0px));
      background:rgba(13,26,43,0.96);backdrop-filter:blur(16px);
      border-top:1px solid var(--panel-border);
      transition:transform .2s ease;
    }
    .mobile-cta a{
      flex:1;display:inline-flex;align-items:center;justify-content:center;gap:8px;
      padding:13px 10px;border-radius:10px;font-weight:700;font-size:13.5px;
      text-decoration:none;text-transform:uppercase;letter-spacing:0.5px;line-height:1.1;
    }
    .mobile-cta .mc-call{border:1px solid var(--panel-border-strong);color:var(--text);}
    .mobile-cta .mc-offer{background:var(--accent-dark);color:#fff;}
    .mobile-cta svg{flex-shrink:0;}
    /* Platz schaffen, damit die Leiste nichts verdeckt */
    body{padding-bottom:78px;}
  }

  .nav-toggle{display:none;flex-direction:column;justify-content:center;gap:5px;width:40px;height:40px;background:transparent;border:1px solid var(--panel-border-strong);border-radius:8px;cursor:pointer;flex-shrink:0;padding:0;}
  .subnav{background:var(--bg-alt);border-bottom:1px solid var(--panel-border);}
  .subnav-inner{display:flex;align-items:center;gap:10px;padding:12px 24px;overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:1120px;margin:0 auto;}
  .subnav-label{font-size:11.5px;font-weight:700;text-transform:uppercase;letter-spacing:0.8px;color:var(--text-dimmer);white-space:nowrap;flex-shrink:0;margin-right:2px;}
  .subnav-link{font-size:13px;font-weight:600;color:var(--text-dim);text-decoration:none;padding:7px 15px;border-radius:20px;border:1px solid var(--panel-border);white-space:nowrap;flex-shrink:0;transition:background .15s ease, color .15s ease, border-color .15s ease;}
  .subnav-link:hover{color:var(--text);border-color:var(--panel-border-strong);}
  .subnav-link.active{background:var(--accent-dark);color:#fff;border-color:var(--accent-dark);}
  .nav-toggle span{display:block;width:18px;height:2px;background:var(--text);margin:0 auto;transition:transform .15s ease, opacity .15s ease;}
  .nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg);}
  .nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0;}
  .nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

  .hero{position:relative;padding:72px 0 64px;overflow:hidden;border-bottom:1px solid var(--panel-border);}
  .hero-inner.hero-split{display:grid;grid-template-columns:1.3fr 1fr;gap:48px;align-items:center;}
  .hero-inner.hero-split.hero-split-dynamic{align-items:start;}
  .hero-inner.hero-split .hero-highlight{margin-top:0;}
  .eyebrow{display:inline-block;background:var(--subpanel-bg);border:1px solid var(--subpanel-border);color:var(--text);font-size:12px;font-weight:700;padding:7px 16px;border-radius:20px;margin-bottom:24px;letter-spacing:1.5px;text-transform:uppercase;}
  .hero h1{font-size:38px;line-height:1.25;font-weight:900;margin:0 0 20px;letter-spacing:0.5px;text-transform:uppercase;}
  .hero p.lead{font-size:16px;color:var(--text-dim);margin:0 0 32px;max-width:600px;font-weight:400;}
  .hero-actions{display:flex;gap:14px;flex-wrap:wrap;}
  .check{color:var(--accent);font-weight:800;flex-shrink:0;}
  .hero-highlight{background:var(--subpanel-bg);border:2px solid var(--subpanel-border);border-radius:20px;padding:24px 28px;margin-top:8px;max-width:600px;}
  .hero-highlight h3{margin:0 0 6px;font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:0.6px;color:var(--text-dim);}
  .hero-highlight .big{font-size:26px;font-weight:900;color:var(--accent);margin:0 0 16px;}
  .hero-highlight .big span{font-size:12.5px;font-weight:600;color:var(--text-dim);text-transform:uppercase;letter-spacing:0.5px;margin-left:8px;}
  .hero-highlight ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px;}
  .hero-highlight li{display:flex;gap:8px;font-size:13.5px;color:var(--text-dim);font-weight:500;}
  .hero-quickfacts{margin:16px 0 0;font-size:13.5px;color:var(--text-dim);font-weight:500;}

  .hero-calc{max-width:none;}
  .hero-calc h3{text-transform:none;font-size:17px;color:var(--text);margin:0 0 4px;}
  .calc-sub{margin:0 0 22px;font-size:12.5px;color:var(--text-dim);}
  .calc-field{margin-bottom:18px;}
  .calc-field label{display:block;font-size:12px;font-weight:600;color:var(--text-dim);text-transform:uppercase;letter-spacing:0.4px;margin-bottom:10px;}
  .calc-slider-row{display:flex;align-items:center;gap:14px;}
  .calc-slider-value{min-width:70px;text-align:right;font-size:18px;font-weight:800;color:var(--accent);flex-shrink:0;}
  input[type="range"]{-webkit-appearance:none;appearance:none;flex:1;height:6px;border-radius:4px;background:var(--panel-border-strong);outline:none;cursor:pointer;}
  input[type="range"]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:22px;height:22px;border-radius:50%;background:var(--accent);border:3px solid #fff;box-shadow:0 2px 6px rgba(0,0,0,0.4);cursor:pointer;}
  input[type="range"]::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:var(--accent);border:3px solid #fff;box-shadow:0 2px 6px rgba(0,0,0,0.4);cursor:pointer;}
  input[type="range"]::-moz-range-track{height:6px;border-radius:4px;background:var(--panel-border-strong);}
  input[type="range"]:focus-visible{outline:2px solid var(--accent);outline-offset:4px;}
  .calc-result{background:rgba(255,255,255,0.03);border:1px solid var(--panel-border);border-radius:14px;padding:18px 20px;margin-top:4px;}
  .calc-result-row{display:flex;justify-content:space-between;gap:12px;font-size:13.5px;color:var(--text-dim);padding:5px 0;}
  .calc-result-row strong{color:var(--text);font-weight:700;}
  .calc-result-total{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-top:10px;padding-top:14px;border-top:1px solid var(--panel-border);}
  .calc-result-total span{font-size:12.5px;font-weight:700;text-transform:uppercase;letter-spacing:0.5px;color:var(--text-dim);}
  .calc-result-total strong{font-size:28px;font-weight:900;color:var(--accent);}
  .calc-result-percent{margin:12px 0 0;font-size:13px;color:var(--text-dim);}
  /* Hinweistext in Weiß auf rot getöntem Grund mit rotem Rand: Das Rot bleibt als
     Signal erhalten, der Text bleibt aber lesbar (rote Schrift käme hier nur auf 2,9:1). */
  .calc-result-hint{margin:8px 0 0;font-size:12px;color:var(--text);background:rgba(218,41,39,0.14);border-left:3px solid var(--accent-red);border-radius:6px;padding:8px 10px;line-height:1.5;}
  .calc-footnote{margin:14px 0 0;font-size:11.5px;color:var(--text-dimmer);line-height:1.5;}
  .hero-photo-wrap{margin-top:40px;}
  .hero-photo{width:100%;height:auto;max-height:440px;object-fit:cover;border-radius:24px;border:1px solid var(--panel-border);box-shadow:0 24px 48px rgba(0,0,0,0.4);display:block;}
  .btn-primary{display:inline-flex;align-items:center;gap:10px;background:var(--accent-dark);color:#fff;padding:15px 28px;border-radius:10px;font-weight:600;font-size:14px;text-decoration:none;text-transform:uppercase;letter-spacing:0.6px;box-shadow:0 12px 28px rgba(90,143,196,0.35);transition:transform .15s ease, background .15s ease;}
  .btn-primary:hover{background:var(--accent);transform:translateY(-1px);}
  .btn-secondary{display:inline-flex;align-items:center;gap:8px;background:transparent;color:var(--text);padding:15px 24px;border-radius:10px;font-weight:600;font-size:13px;text-decoration:none;border:1.5px solid var(--panel-border-strong);text-transform:uppercase;letter-spacing:0.6px;}
  .btn-secondary:hover{background:var(--subpanel-bg);}

  .trust-strip{background:var(--panel-bg);border-top:1px solid var(--panel-border);border-bottom:1px solid var(--panel-border);padding:20px 0;}
  .trust-grid{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;}
  .trust-item{display:flex;align-items:center;gap:10px;font-size:13.5px;font-weight:500;color:var(--text-dim);}
  .trust-item .dot{width:8px;height:8px;border-radius:50%;background:var(--accent);flex-shrink:0;}

  .section{padding:64px 0;}
  .section-eyebrow{font-size:12px;font-weight:700;color:var(--accent);text-transform:uppercase;letter-spacing:2px;margin:0 0 12px;}
  .section-title{font-size:26px;font-weight:900;margin:0 0 16px;letter-spacing:1px;text-transform:uppercase;}
  .section-sub{font-size:15px;color:var(--text-dim);max-width:680px;margin:0 0 36px;font-weight:400;}
  .bg-alt{background:var(--bg-alt);}

  .glass-card{background:var(--panel-bg);border:1px solid var(--panel-border);border-radius:32px;backdrop-filter:blur(20px);box-shadow:0 24px 48px rgba(0,0,0,0.4);}

  .about-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:40px;align-items:start;}
  .about-grid p{color:var(--text-dim);font-size:14.5px;margin:0 0 16px;font-weight:400;}
  .quote-box{background:var(--subpanel-bg);border:2px solid var(--subpanel-border);border-radius:16px;padding:24px 26px;font-size:14.5px;color:var(--text);font-weight:500;font-style:italic;}
  .stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
  .stat-card{background:var(--subpanel-bg);border:1px solid var(--panel-border);border-radius:16px;padding:22px;text-align:center;}
  .stat-card .num{font-size:26px;font-weight:900;color:var(--accent);}
  .stat-card .label{font-size:12px;color:var(--text-dim);font-weight:600;margin-top:6px;text-transform:uppercase;letter-spacing:0.6px;}

  .team-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-bottom:24px;}
  .team-card{background:var(--subpanel-bg);border:1px solid var(--panel-border);border-radius:16px;padding:20px;display:flex;gap:16px;align-items:center;}
  .team-avatar{width:88px;height:88px;border-radius:50%;object-fit:cover;flex-shrink:0;border:2px solid var(--subpanel-border);}
  .team-avatar.placeholder{background:rgba(90,143,196,0.18);color:var(--accent);display:flex;align-items:center;justify-content:center;font-weight:900;font-size:22px;border:1px solid var(--subpanel-border);}
  .team-card h3{margin:0 0 2px;font-size:15px;font-weight:700;}
  .team-card p{margin:0;font-size:13px;color:var(--text-dim);}
  .team-note{font-size:13.5px;color:var(--text-dim);background:var(--subpanel-bg);border:1px dashed var(--panel-border-strong);border-radius:16px;padding:18px 20px;}

  .leistungen-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
  .leistung-card{background:var(--subpanel-bg);border:1px solid var(--panel-border);border-radius:24px;padding:26px;}
  .leistung-card h3{margin:0 0 6px;font-size:16px;font-weight:700;text-transform:uppercase;letter-spacing:0.5px;}
  .leistung-card p.desc{margin:0 0 16px;font-size:13px;color:var(--text-dim);}
  .tag-row{display:flex;flex-wrap:wrap;gap:8px;}
  .tag{font-size:11.5px;font-weight:600;background:rgba(255,255,255,0.06);color:var(--text-dim);padding:5px 11px;border-radius:14px;border:1px solid var(--panel-border);}
  a.tag{text-decoration:none;cursor:pointer;transition:background .15s ease, border-color .15s ease, color .15s ease;}
  a.tag:hover{background:rgba(90,143,196,0.18);color:var(--text);border-color:var(--subpanel-border);}

  .produkt-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;}
  .produkt-card{background:var(--subpanel-bg);border:1px solid var(--panel-border);border-radius:24px;padding:28px;display:flex;flex-direction:column;gap:14px;transition:box-shadow .15s ease, transform .15s ease;position:relative;}
  .produkt-card:hover{box-shadow:0 16px 34px rgba(0,0,0,0.35);transform:translateY(-2px);border-color:var(--subpanel-border);}
  .produkt-badge{display:inline-block;background:rgba(90,143,196,0.16);color:var(--accent);font-size:11.5px;font-weight:700;padding:5px 12px;border-radius:14px;width:fit-content;text-transform:uppercase;letter-spacing:0.5px;}
  .produkt-corner-tag{position:absolute;top:16px;right:16px;background:var(--accent-green);color:var(--accent-green-ink);font-size:10.5px;font-weight:700;padding:5px 11px;border-radius:12px;text-transform:uppercase;letter-spacing:0.4px;}
  .produkt-card h3{margin:0;font-size:17px;font-weight:700;}
  .produkt-card p{margin:0;font-size:13.5px;color:var(--text-dim);flex-grow:1;}
  .btn-theme{display:inline-flex;align-items:center;gap:8px;background:var(--accent-dark);color:#fff;padding:11px 20px;border-radius:10px;font-weight:600;font-size:13px;text-decoration:none;text-transform:uppercase;letter-spacing:0.6px;width:fit-content;transition:background .15s ease, transform .15s ease;}
  .btn-theme:hover{background:var(--accent);transform:translateY(-1px);}
  .produkt-card.placeholder{border-style:dashed;justify-content:center;align-items:center;text-align:center;color:var(--text-dimmer);}

  .services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
  .service-card{background:var(--subpanel-bg);border:1px solid var(--panel-border);border-radius:24px;padding:32px 28px;text-align:left;transition:box-shadow .15s ease, transform .15s ease, border-color .15s ease;}
  .service-card:hover{box-shadow:0 16px 34px rgba(0,0,0,0.35);transform:translateY(-2px);border-color:var(--subpanel-border);}
  .service-icon{display:inline-flex;align-items:center;justify-content:center;width:52px;height:52px;border-radius:14px;background:rgba(90,143,196,0.14);color:var(--accent);margin-bottom:18px;}
  .service-card h3{margin:0 0 10px;font-size:17px;font-weight:700;text-transform:uppercase;letter-spacing:0.4px;}
  .service-card p{margin:0 0 16px;font-size:14px;color:var(--text-dim);line-height:1.5;}
  .service-card a{font-size:13px;font-weight:700;color:var(--accent);text-decoration:none;text-transform:uppercase;letter-spacing:0.4px;}
  .service-card a:hover{text-decoration:underline;}

  .contact-card{padding:36px;display:grid;grid-template-columns:1fr 1fr;gap:36px;}
  .contact-block h3{margin:0 0 14px;font-size:15px;font-weight:700;text-transform:uppercase;letter-spacing:0.6px;}
  .contact-block p{margin:0 0 8px;font-size:14px;color:var(--text-dim);}
  .contact-block a{color:var(--accent);font-weight:600;text-decoration:none;}
  .contact-block a:hover{text-decoration:underline;}
  .contact-form-card{padding:36px;margin-top:24px;max-width:640px;}
  .contact-form-card h3{margin:0 0 8px;font-size:15px;font-weight:700;text-transform:uppercase;letter-spacing:0.6px;}
  .contact-form-card .section-sub{margin:0 0 22px;text-align:left;max-width:none;}
  .hours-table{width:100%;font-size:14px;color:var(--text-dim);border-collapse:collapse;}
  .hours-table td{padding:4px 0;}
  .hours-table td:last-child{text-align:right;color:var(--text);font-weight:600;}

  footer{background:var(--bg-alt);color:var(--text-dimmer);padding:44px 0 28px;font-size:13px;border-top:1px solid var(--panel-border);}
  .footer-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:32px;margin-bottom:28px;}
  .footer-grid h3{color:var(--text);font-size:13px;margin:0 0 12px;font-weight:700;text-transform:uppercase;letter-spacing:0.6px;}
  .footer-grid p, .footer-grid a{color:var(--text-dimmer);margin:0 0 6px;text-decoration:none;display:block;line-height:1.6;}
  .footer-grid a:hover{color:var(--text);}
  .footer-bottom{border-top:1px solid var(--panel-border);padding-top:20px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;font-size:12px;color:var(--text-dimmer);}
  .footer-bottom a{color:var(--text-dimmer);text-decoration:underline;text-underline-offset:2px;}
  .footer-bottom a:hover{color:var(--text);}
  .footer-legal-links{display:flex;gap:16px;flex-wrap:wrap;}

  @media (max-width:1080px){
    .header-phone{display:none;}
  }
  @media (max-width:480px){
    .header-cta{display:none;}
  }
  @media (max-width:900px){
    .hero-inner.hero-split{grid-template-columns:1fr;gap:28px;}
    .hero-inner.hero-split .hero-highlight{margin-top:8px;}
    .hero-photo-wrap{margin-top:24px;}
    .hero-photo{max-height:240px;}
    .about-grid{grid-template-columns:1fr;}
    .team-grid{grid-template-columns:1fr 1fr;}
    .leistungen-grid{grid-template-columns:1fr;}
    .produkt-grid{grid-template-columns:1fr;}
    .services-grid{grid-template-columns:1fr;}
    .contact-card{grid-template-columns:1fr;padding:26px;}
    .contact-form-card{padding:26px;}
    .footer-grid{grid-template-columns:1fr;}
    .nav-toggle{display:flex;}
    .main-nav{
      display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;
      align-items:flex-start;gap:2px;background:var(--bg-alt);border-bottom:1px solid var(--panel-border);
      box-shadow:0 16px 28px rgba(0,0,0,0.35);padding:10px 24px 16px;
    }
    .main-nav.open{display:flex;}
    .main-nav a{width:100%;padding:12px 0;border-bottom:1px solid var(--panel-border);}
    .main-nav a:last-child{border-bottom:none;}
  }
  @media (max-width:700px){
    .team-grid{grid-template-columns:1fr;}
  }
  @media (max-width:560px){
    .services-grid{grid-template-columns:1fr;}
    .hero h1{font-size:26px;}
    .stat-grid{grid-template-columns:1fr 1fr;}
  }

/* ===== Problem / Lösung (Themenseiten) ===== */
.problem-grid{display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:start;}
.problem-box{background:var(--subpanel-bg);border:1px solid var(--panel-border);border-left:4px solid var(--accent-red);border-radius:16px;padding:28px;}
/* Überschrift bewusst in Weiß: Das Rot markiert die Box bereits über den linken
   Rand. Als Textfarbe käme das kräftige Rot auf dunklem Grund nur auf 2,9:1 und
   wäre damit schlecht lesbar (WCAG AA verlangt 4,5:1 für Fließtext). */
.problem-box h3{margin:0 0 10px;font-size:16px;font-weight:700;color:var(--text);text-transform:uppercase;letter-spacing:0.4px;}
.problem-box p{margin:0;color:var(--text-dim);font-size:14px;}
.solution-box{background:var(--subpanel-bg);border:1px solid var(--panel-border);border-left:4px solid var(--accent);border-radius:16px;padding:28px;}
.solution-box h3{margin:0 0 10px;font-size:16px;font-weight:700;color:var(--accent);text-transform:uppercase;letter-spacing:0.4px;}
.solution-box p{margin:0;color:var(--text-dim);font-size:14px;}

/* ===== Basis-Deckung (großes Feature) ===== */
.basis-card{display:grid;grid-template-columns:1.1fr 1fr;gap:36px;align-items:center;background:var(--panel-bg);border:1px solid var(--panel-border);border-radius:32px;padding:36px;backdrop-filter:blur(20px);box-shadow:0 24px 48px rgba(0,0,0,0.4);margin-bottom:36px;}
.basis-card h3{font-size:20px;font-weight:800;margin:0 0 12px;text-transform:uppercase;letter-spacing:0.5px;}
.basis-card p{margin:0 0 18px;color:var(--text-dim);font-size:14.5px;}
.basis-tags{display:flex;flex-wrap:wrap;gap:8px;}
.basis-perils{background:var(--subpanel-bg);border:1px solid var(--panel-border);border-radius:16px;padding:22px;}
.basis-perils h4{margin:0 0 12px;font-size:12px;text-transform:uppercase;letter-spacing:0.6px;color:var(--text-dim);font-weight:700;}
.basis-perils ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px 14px;}
.basis-perils li{display:flex;gap:8px;font-size:13.5px;font-weight:600;color:var(--text);}

/* ===== Zusatzbausteine-Karten ===== */
.cov-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
.cov-card{background:var(--subpanel-bg);border:1px solid var(--panel-border);border-radius:24px;padding:24px;transition:box-shadow .15s ease, transform .15s ease;}
.cov-card:hover{box-shadow:0 16px 34px rgba(0,0,0,0.35);transform:translateY(-2px);border-color:var(--subpanel-border);}
.cov-icon{width:38px;height:38px;border-radius:10px;background:rgba(90,143,196,0.16);display:flex;align-items:center;justify-content:center;color:var(--accent);font-size:16px;font-weight:800;margin-bottom:14px;}
.cov-card h3{margin:0 0 8px;font-size:16px;font-weight:700;}
.cov-card p{margin:0;font-size:13.5px;color:var(--text-dim);}
.tag.warn{background:rgba(218,41,39,0.15);color:#ff8a8a;border-color:rgba(218,41,39,0.4);}

.note{font-size:13.5px;color:var(--text-dim);background:var(--subpanel-bg);border:1px dashed var(--panel-border-strong);border-radius:16px;padding:16px 18px;margin-top:28px;}
.note strong{color:var(--text);}

.basis-facts{display:grid;grid-template-columns:1fr 1fr;gap:10px 24px;list-style:none;margin:0;padding:0;}
.basis-facts li{display:flex;gap:8px;font-size:14px;color:var(--text-dim);line-height:1.4;}

.foerder-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:28px;}
.foerder-card{background:var(--subpanel-bg);border:1px solid var(--panel-border);border-radius:20px;padding:24px;}
.foerder-card h3{margin:0 0 8px;font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:0.5px;color:var(--text-dim);}
.foerder-amount{font-size:26px;font-weight:900;color:var(--accent);margin:0 0 10px;}
.foerder-card p:last-child{margin:0;font-size:13.5px;color:var(--text-dim);line-height:1.5;}

/* ===== Ablauf-Schritte ===== */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.step{text-align:left;}
.step-num{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;background:var(--accent);color:#fff;font-weight:800;font-size:16px;margin-bottom:16px;}
.step h3{margin:0 0 8px;font-size:16px;font-weight:700;}
.step p{margin:0;font-size:13.5px;color:var(--text-dim);}

/* ===== Vorteile ===== */
.adv-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.adv-item{text-align:left;}
.adv-num{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;background:var(--accent);color:#fff;font-weight:800;font-size:15px;margin-bottom:14px;}
.adv-item h3{margin:0 0 8px;font-size:16px;font-weight:700;}
.adv-item p{margin:0;font-size:13.5px;color:var(--text-dim);}

/* ===== Zielgruppe ===== */
.target-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:8px;}
.target-card{background:var(--subpanel-bg);border:1px solid var(--panel-border);border-radius:24px;padding:26px;}
.target-card h3{margin:0 0 8px;font-size:17px;font-weight:700;}
.target-card p{margin:0;font-size:13.5px;color:var(--text-dim);}

/* ===== Ansprechpartner-Karte ===== */
.ansprechpartner-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.ansprechpartner-grid .ansprechpartner-card{padding:26px;}
.ansprechpartner-card{display:flex;align-items:center;gap:24px;flex-wrap:wrap;padding:32px;}
.ansprechpartner-photo{width:96px;height:96px;border-radius:50%;object-fit:cover;border:2px solid var(--subpanel-border);flex-shrink:0;}
.ansprechpartner-info h3{margin:0 0 4px;font-size:18px;font-weight:700;}
.ansprechpartner-info p{margin:0 0 4px;font-size:14px;color:var(--text-dim);}
.ansprechpartner-info a{color:var(--accent);font-weight:600;text-decoration:none;}
.ansprechpartner-info a:hover{text-decoration:underline;}

/* ===== Baustein-Konfigurator ===== */
.config-card{background:var(--panel-bg);border:1px solid var(--panel-border);border-radius:32px;padding:36px;backdrop-filter:blur(20px);box-shadow:0 24px 48px rgba(0,0,0,0.4);}
.config-section{margin-bottom:28px;}
.config-section:last-of-type{margin-bottom:0;}
/* Nummerierte Schritte im Formular – machen sichtbar, wie weit es noch ist. */
.config-section-label .step-badge{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;background:var(--accent-dark);color:#fff;font-size:11.5px;font-weight:800;letter-spacing:0;margin-right:9px;vertical-align:-5px;}
.config-section-contact{margin-top:28px;}
/* Platzhalter für den noch gesperrten Angebotsteil: Der Schritt bleibt sichtbar,
   das Formular erscheint aber erst, wenn ein Beitrag berechnet wurde. */
.config-step-locked{display:flex;align-items:flex-start;gap:12px;margin-top:28px;padding:20px 22px;border:1px dashed var(--panel-border-strong);border-radius:16px;color:var(--text-dimmer);font-size:13.5px;line-height:1.55;}
.config-step-locked svg{flex-shrink:0;margin-top:2px;}
.config-section-label{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:0.6px;color:var(--text-dim);margin:0 0 20px;padding-bottom:10px;border-bottom:1px solid var(--panel-border);}
.checkbox-inline{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:500;color:var(--text);padding:12px 14px;border:1px solid var(--panel-border-strong);border-radius:10px;background:rgba(255,255,255,0.03);}
.checkbox-inline input{accent-color:var(--accent);width:16px;height:16px;cursor:pointer;flex-shrink:0;}
.config-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-bottom:24px;}
.field{display:flex;flex-direction:column;gap:6px;}
.field label{font-size:13px;font-weight:600;color:var(--text-dim);text-transform:uppercase;letter-spacing:0.4px;}
.field input[type="text"], .field input[type="tel"], .field input[type="number"], .field input[type="email"], .field input[type="date"], .field select, .field textarea{
  padding:12px 14px;border:1px solid var(--panel-border-strong);border-radius:10px;font-size:14.5px;
  font-family:inherit;color:var(--text);background:rgba(255,255,255,0.03);
  width:100%;
}
.field textarea{resize:vertical;min-height:110px;line-height:1.5;}
.field select{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5 8l5 5 5-5' fill='none' stroke='%23a8b8ca' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding-right:36px;}
.field select option{background:#16253a;color:#fff;}
.field input::placeholder, .field textarea::placeholder{color:var(--text-dimmer);}
.field input:focus, .field select:focus, .field textarea:focus{outline:2px solid var(--accent);outline-offset:1px;border-color:var(--accent);}
/* Pflichtfeld-Sternchen und ✕-Marker: bewusst im kräftigen Rot. Beides sind
   Zeichen, deren Bedeutung zusätzlich im Text steht ("* Pflichtfeld" bzw. der
   Satz daneben) – die Farbe ist also nie der alleinige Träger der Information. */
.field .req{color:var(--accent-red);margin-left:2px;}
.cross{color:var(--accent-red);font-weight:800;flex-shrink:0;}
.radio-row{display:flex;gap:20px;align-items:center;margin-top:4px;}
.radio-row label{display:flex;align-items:center;gap:6px;font-size:14px;font-weight:500;color:var(--text-dim);}
.radio-row input{accent-color:var(--accent);width:16px;height:16px;}
.indoor-hint{display:none;background:var(--subpanel-bg);border-left:3px solid var(--accent);border-radius:10px;padding:10px 14px;font-size:13px;color:var(--text-dim);margin-top:12px;}
.indoor-hint.show{display:block;}
.baustein-list{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:8px 0 24px;align-items:start;}
.baustein-item{border:1px solid var(--panel-border);border-radius:16px;padding:16px 18px;transition:border-color .15s ease, background .15s ease;}
.baustein-item:hover{border-color:var(--subpanel-border);}
.baustein-item.checked{border-color:var(--accent);background:rgba(90,143,196,0.1);}
.baustein-head{display:flex;align-items:center;gap:10px;cursor:pointer;flex-wrap:wrap;}
.baustein-head input[type="checkbox"]{width:18px;height:18px;accent-color:var(--accent);cursor:pointer;flex-shrink:0;}
.baustein-head span.title{font-weight:700;font-size:14.5px;color:var(--text);}
.baustein-head span.meta{font-size:12px;color:var(--text-dim);font-weight:500;}
.baustein-sum{display:none;margin-top:12px;padding-left:28px;}
.baustein-sum.show{display:block;}
.baustein-sum label{font-size:12.5px;color:var(--text-dim);display:block;margin-bottom:4px;}
.baustein-sum input{width:240px;max-width:100%;padding:9px 11px;border:1px solid var(--panel-border-strong);border-radius:8px;font-size:14px;font-family:inherit;background:rgba(255,255,255,0.03);color:var(--text);}
.config-submit{display:flex;flex-direction:column;align-items:flex-start;gap:10px;margin-top:8px;}
.config-note{font-size:12px;color:var(--text-dimmer);}
.config-submit button.btn-primary{border:none;cursor:pointer;font-family:inherit;}
.config-submit button.btn-secondary{cursor:pointer;font-family:inherit;}
.config-submit-buttons{display:flex;gap:12px;flex-wrap:wrap;}
/* Freiwillige Einwilligung in weitere Beratung (Wiederanrufserlaubnis).
   Bewusst NICHT vorangekreuzt – eine vorausgefüllte Einwilligung ist unwirksam. */
.consent-check{display:flex;align-items:flex-start;gap:10px;width:100%;margin:0 0 18px;font-size:13px;color:var(--text-dim);line-height:1.55;cursor:pointer;}
.consent-check input{margin-top:2px;width:17px;height:17px;accent-color:var(--accent);cursor:pointer;flex-shrink:0;}
/* Ruhige Vertrauenszeile direkt am Absende-Button – beantwortet die Frage
   "wer bekommt das eigentlich?" genau dort, wo sie aufkommt. */
.form-trust{display:flex;align-items:flex-start;gap:10px;width:100%;margin:18px 0 0;padding-top:16px;border-top:1px solid var(--panel-border);font-size:12.5px;color:var(--text-dimmer);line-height:1.55;}
.form-trust svg{flex-shrink:0;color:var(--accent);margin-top:1px;}
/* ===== Rechnen = Grün =====
   Alles, was zu einer Berechnung führt oder eine auslöst, ist grün: unverbindlich,
   sofort, ohne Kontaktdaten. Blau bleibt den Kontakt- und Abschlussaktionen
   vorbehalten. Dunkle Schrift auf dem hellen Grün ergibt 10:1 Kontrast.
   .btn-calc ist immer ein Rechner-Knopf und daher von Haus aus grün; für
   Verweise auf einen Rechner gibt es die Zusatzklasse .btn-green. */
.btn-calc{display:inline-flex;align-items:center;gap:10px;background:var(--accent-green);color:var(--accent-green-ink);padding:15px 28px;border-radius:10px;font-weight:700;font-size:14px;border:none;text-transform:uppercase;letter-spacing:0.6px;cursor:pointer;font-family:inherit;box-shadow:0 8px 20px rgba(13,26,43,0.32);transition:transform .15s ease, background .15s ease;}

.btn-primary.btn-green,
.btn-theme.btn-green,
.header-cta.btn-green,
.mobile-cta .mc-offer.btn-green{
  background:var(--accent-green);
  color:var(--accent-green-ink);
  box-shadow:0 8px 20px rgba(13,26,43,0.32);
}
.mobile-cta .mc-offer.btn-green{box-shadow:none;}

.btn-calc:hover,
.btn-primary.btn-green:hover,
.btn-theme.btn-green:hover,
.header-cta.btn-green:hover{
  background:#bcdfcb;
  color:var(--accent-green-ink);
  transform:translateY(-1px);
}
.btn-calc svg{flex-shrink:0;}

.price-result{margin-top:24px;background:var(--subpanel-bg);border:2px solid var(--accent-green);border-radius:20px;padding:28px;position:relative;overflow:hidden;max-width:none;width:100%;}
.price-result-badge{position:absolute;top:0;right:0;background:var(--accent-green);color:var(--accent-green-ink);font-size:11.5px;font-weight:800;text-transform:uppercase;letter-spacing:0.6px;padding:7px 18px;border-radius:0 0 0 16px;}
.price-result-old{color:var(--text-dim);font-size:14px;text-decoration:line-through;margin:4px 0 4px;}
.price-result-discount{display:inline-block;color:var(--accent-green-ink);background:var(--accent-green);font-weight:800;font-size:12.5px;text-transform:uppercase;letter-spacing:0.5px;padding:4px 12px;border-radius:14px;margin-bottom:12px;}
.price-result-final{font-size:36px;font-weight:900;color:var(--accent);line-height:1.1;}
.price-result-unit{font-size:13px;font-weight:600;color:var(--text-dim);text-transform:uppercase;margin-left:8px;}
.price-result-note{margin-top:14px;font-size:12px;color:var(--text-dimmer);line-height:1.55;}
/* Weist nach der Berechnung auf den naechsten Schritt hin. */
.price-result-next{margin:16px 0 0;font-size:14px;font-weight:600;color:var(--text);}

/* Handlungsaufforderung mitten im Text – fängt Leser an den Stellen ab, an denen
   sie sich ohnehin gerade entscheiden, statt sie bis zum Seitenende laufen zu lassen. */
.inline-cta{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;background:var(--subpanel-bg);border:1px solid var(--subpanel-border);border-radius:20px;padding:22px 26px;margin:28px 0 36px;}
/* Steht die Box am Ende eines Abschnitts, übernimmt der Abschnitt selbst den
   Abstand nach unten – sonst würde der Bereich höher als die Nachbarbereiche. */
.inline-cta:last-child{margin-bottom:0;}
.inline-cta p{margin:0;font-size:14px;color:var(--text-dim);max-width:62ch;line-height:1.55;}
.inline-cta strong{display:block;color:var(--text);font-size:16px;font-weight:700;margin-bottom:4px;}
.inline-cta-actions{display:flex;gap:12px;flex-wrap:wrap;flex-shrink:0;}
@media (max-width:700px){
  .inline-cta{flex-direction:column;align-items:stretch;padding:20px;}
  .inline-cta-actions{flex-direction:column;}
  .inline-cta-actions .btn-primary, .inline-cta-actions .btn-secondary{justify-content:center;text-align:center;}
}

/* ===== Team-Kreis im Hero der Startseite =====
   Neun runde Portraits in lockerer Anordnung. Grundprinzip: Die Kreise
   überlappen ausschließlich zwischen den Reihen, und die jeweils tiefere Reihe
   liegt oben. So wird immer nur der untere Rand eines Kreises verdeckt –
   die Gesichter im oberen Bereich bleiben frei. */
.team-cluster{position:relative;width:100%;max-width:440px;margin-left:auto;aspect-ratio:1 / 0.82;}
.team-cluster .tc{position:absolute;display:block;line-height:0;}
.team-cluster .tc img{
  width:100%;height:100%;border-radius:50%;object-fit:cover;object-position:center 35%;
  border:3px solid rgba(255,255,255,0.14);
  box-shadow:0 10px 26px rgba(0,0,0,0.45);
  background:var(--subpanel-bg);
}
/* Positionen bewusst unregelmäßig: unterschiedliche Höhen, Größen und Abstände,
   damit die Runde locker wirkt und nicht wie ein Raster. */
.team-cluster .tc-1{left:8%;top:0;width:23%;z-index:1;}
.team-cluster .tc-2{left:36%;top:5%;width:31%;z-index:1;}
.team-cluster .tc-3{left:72%;top:0;width:21%;z-index:1;}
.team-cluster .tc-4{left:0;top:23%;width:27%;z-index:2;}
.team-cluster .tc-5{left:27%;top:34%;width:22%;z-index:2;}
.team-cluster .tc-6{left:55%;top:24%;width:28%;z-index:2;}
.team-cluster .tc-7{left:81%;top:21%;width:19%;z-index:2;}
.team-cluster .tc-8{left:17%;top:54%;width:25%;z-index:3;}
.team-cluster .tc-9{left:46%;top:53%;width:30%;z-index:3;}

@media (max-width:900px){
  .team-cluster{margin:8px auto 0;max-width:360px;}
}
@media (max-width:420px){
  .team-cluster{max-width:300px;}
  .team-cluster .tc img{border-width:2px;}
}

/* Zwei Wege zum Angebot (Waldversicherung): Selbstabschluss vs. persönliches Angebot */
.weg-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:32px;}
.weg-card{display:flex;flex-direction:column;gap:12px;background:var(--subpanel-bg);border:1px solid var(--panel-border);border-radius:24px;padding:28px;}
.weg-card-primary{border-color:var(--subpanel-border);}
.weg-badge{align-self:flex-start;background:rgba(90,143,196,0.16);color:var(--accent);font-size:11.5px;font-weight:700;padding:5px 12px;border-radius:14px;text-transform:uppercase;letter-spacing:0.5px;}
.weg-card h3{margin:0;font-size:18px;font-weight:800;color:var(--text);}
.weg-card p{margin:0;font-size:14px;color:var(--text-dim);line-height:1.55;flex-grow:1;}
.weg-card .btn-primary, .weg-card .btn-secondary{align-self:flex-start;}

/* Live berechnete Gesamtfläche im Waldformular */
.wald-summe{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-top:4px;padding-top:16px;border-top:2px solid var(--subpanel-border);}
.wald-summe span{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:0.6px;color:var(--text-dim);}
.wald-summe strong{font-size:22px;font-weight:900;color:var(--accent);}
.wald-oder{margin:22px 0 16px;font-size:13px;font-weight:700;color:var(--text-dim);text-transform:uppercase;letter-spacing:0.8px;}
.wald-hinweis{margin:18px 0 0;font-size:13px;color:var(--text);background:rgba(90,143,196,0.12);border-left:3px solid var(--accent);border-radius:6px;padding:12px 14px;line-height:1.55;}
.wald-hinweis a{color:var(--accent);font-weight:700;white-space:nowrap;}
/* Baumarten ausgrauen, wenn stattdessen Mischwald angegeben wurde (und umgekehrt) */
.feld-inaktiv{opacity:0.45;}

@media (max-width:900px){
  .weg-grid{grid-template-columns:1fr;}
}

/* ===== FAQ ===== */
.faq-list{display:flex;flex-direction:column;gap:12px;}
.faq-item{background:var(--subpanel-bg);border:1px solid var(--panel-border);border-radius:14px;padding:0;overflow:hidden;}
.faq-item summary{cursor:pointer;padding:18px 22px;font-weight:700;font-size:14.5px;list-style:none;display:flex;justify-content:space-between;gap:16px;align-items:center;}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary::after{content:"+";font-size:20px;line-height:1;color:var(--accent);flex:none;}
.faq-item[open] summary::after{content:"–";}
.faq-item .faq-ans{padding:0 22px 20px;color:var(--text-dim);font-size:14px;}
.faq-item .faq-ans p{margin:0;}

/* ===== Preistabelle ===== */
.price-table-wrap{overflow-x:auto;border:1px solid var(--panel-border);border-radius:16px;background:var(--subpanel-bg);margin-bottom:24px;}
.price-table{border-collapse:collapse;width:100%;min-width:420px;font-size:14px;}
.price-table caption{text-align:left;padding:16px 20px;font-weight:700;color:var(--text);font-size:14.5px;}
.price-table th,.price-table td{padding:13px 20px;text-align:left;border-top:1px solid var(--panel-border);}
.price-table thead th{background:var(--subpanel-border);color:#fff;border-top:0;font-size:12.5px;text-transform:uppercase;letter-spacing:0.4px;}
.price-table td.num{font-weight:800;color:var(--accent);white-space:nowrap;}
.price-table tbody tr:nth-child(even){background:rgba(255,255,255,0.02);}

/* ===== Weitere Absicherungen (Cross-Links) ===== */
.more-links{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:16px;}
.more-links a{display:block;background:var(--subpanel-bg);border:1px solid var(--panel-border);border-radius:14px;padding:18px 20px;text-decoration:none;color:var(--text);font-weight:600;font-size:14.5px;transition:border-color .15s ease, box-shadow .15s ease, transform .15s ease;}
.more-links a:hover{border-color:var(--subpanel-border);box-shadow:0 16px 34px rgba(0,0,0,0.35);transform:translateY(-2px);}
.more-links a span{display:block;font-weight:400;color:var(--text-dim);font-size:13px;margin-top:4px;}

/* ===== Blog ===== */
.blog-hero{padding:56px 0;}
.post-grid{display:flex;flex-direction:column;gap:20px;padding:0 0 20px;}
.post-card{display:block;text-decoration:none;color:inherit;background:var(--subpanel-bg);border:1px solid var(--panel-border);border-radius:24px;padding:26px;transition:box-shadow .15s ease, transform .15s ease;}
.post-card:hover{box-shadow:0 16px 34px rgba(0,0,0,0.35);transform:translateY(-2px);border-color:var(--subpanel-border);}
.post-date{font-size:12px;font-weight:700;color:var(--accent);text-transform:uppercase;letter-spacing:0.6px;margin-bottom:8px;display:block;}
.post-card h2{margin:0 0 8px;font-size:19px;font-weight:800;color:var(--text);}
.post-card p{margin:0 0 12px;font-size:14px;color:var(--text-dim);}
.post-readmore{font-size:13.5px;font-weight:700;color:var(--accent);text-transform:uppercase;letter-spacing:0.4px;}

.article-hero{padding:56px 0 44px;}
.article-hero .back-link{display:inline-block;color:var(--text-dim);font-size:13px;text-decoration:none;margin-bottom:18px;}
.article-hero .back-link:hover{color:var(--text);}
.article-hero .post-date{color:var(--accent);}
.article-hero h1{font-size:32px;font-weight:900;margin:8px 0 0;letter-spacing:0.5px;text-transform:uppercase;}
.article-body{padding:0 0 64px;font-size:15.5px;color:var(--text-dim);}
.article-body h2{font-size:20px;font-weight:800;margin:36px 0 14px;letter-spacing:0.3px;text-transform:uppercase;color:var(--text);}
.article-body p{margin:0 0 16px;color:var(--text-dim);}
.article-body ul{margin:0 0 20px;padding-left:20px;}
.article-body li{margin-bottom:8px;color:var(--text-dim);}
.article-cta{background:var(--subpanel-bg);border:1px solid var(--panel-border);border-radius:24px;padding:28px;margin-top:36px;}
.article-cta h3{margin:0 0 8px;font-size:18px;font-weight:800;text-transform:uppercase;letter-spacing:0.4px;}
.article-cta p{margin:0 0 16px;color:var(--text-dim);font-size:14px;}

/* ===== Zusätzliche Responsive-Regeln (Themenseiten/Blog) ===== */
@media (max-width:900px){
  .problem-grid{grid-template-columns:minmax(0,1fr);}
  .basis-card{grid-template-columns:minmax(0,1fr);}
  .cov-grid{grid-template-columns:1fr 1fr;}
  .steps{grid-template-columns:1fr;gap:28px;}
  .adv-grid{grid-template-columns:1fr;}
  .target-grid{grid-template-columns:1fr;}
  .config-grid{grid-template-columns:1fr;}
  .foerder-grid{grid-template-columns:1fr 1fr;}
  .baustein-list{grid-template-columns:1fr;}
  .ansprechpartner-grid{grid-template-columns:1fr;}
  .ansprechpartner-grid .ansprechpartner-card{flex-direction:row;text-align:left;}
}
@media (max-width:560px){
  .cov-grid{grid-template-columns:1fr;}
  .ansprechpartner-card{flex-direction:column;text-align:center;padding:26px;}
  .ansprechpartner-grid{grid-template-columns:1fr;}
  .basis-facts{grid-template-columns:1fr;}
  .foerder-grid{grid-template-columns:1fr;}
}