/* Startseite ohne Elementor (seit 06.11.2026): Hüllen der Abschnitte, die vorher Elementor gestellt hat.
   Inhalte/Bausteine: /vb/start-bausteine.css (automatisch aus altem CSS) und die Block-Dateien (objekte, stadtkarte, …). */
/* Grundgrößen wie das alte Theme (Astra: 93,75 % = 15px, Handy 13,7px) – die Bausteine sind darauf abgestimmt */
html:has(body.vbs-startseite){font-size:93.75%}
body.vbs-startseite{font-size:15px;line-height:1.65;color:#6b6b6b}
.vbs-start{padding:0!important}
.vbs-start > section{max-width:none;margin-left:0;margin-right:0}
.vbs-leist > *,.vbs-themen > *,.vbs-reg > *,.vbs-ablauf > *{max-width:1140px;margin-left:auto;margin-right:auto}
.vbs-start h1,.vbs-start h2,.vbs-start h3,.vbs-start h4{font-family:Raleway,sans-serif}
.vbs-kontakt > *,.vbs-anfahrt > *{max-width:1120px;margin-left:auto;margin-right:auto}

/* 4 Fotos über dem Startbereich */
.vbs-gal{padding:70px 10px 0}
/* Startbereich (petrol) */
.vbs-hero{position:relative;margin-top:100px;padding:30px 0;background:linear-gradient(135deg,#2a93a1 0,#0d6475 100%);overflow:hidden}
.vbs-hero-in{max-width:1140px;margin:0 auto;display:grid;grid-template-columns:60% 40%;align-items:center;position:relative;z-index:1}
.vbs-hero-text{padding:10px}
.vbs-hero-bild{padding:10px;text-align:right;background:radial-gradient(circle at 50% 72%,rgba(255,255,255,.2),transparent 60%)}
.vbs-hero .vb-hero-eyebrow{display:block;margin:0 0 26px;color:#eaf6f8}
.vbs-hero h1.vbs-titel{margin:0 0 20px;font-size:33px;line-height:1.15;font-weight:800;color:#fff}
.vbs-hero .vbs-text{margin:0 0 14px;color:#fff}
.vbs-hero .vbs-text p{margin:0 0 24px;text-align:justify;color:#fff}
.vbs-hero .vbs-text a{color:#fff;font-weight:700;text-decoration:underline}
.vbs-hero .vb-badges2{margin:0 0 20px}
.vbs-hero .vb-team-pills{margin:22px 0 20px}
.vbs-hero .vb-siegel-unten{margin:38px 0 20px}
.vbs-hero-bild img.wp-image-75967{display:inline-block;width:384px;max-width:100%;height:auto;border-radius:16px;box-shadow:0 16px 40px rgba(0,0,0,.22)}
.vbs-hero .vb-hero-video,.vbs-hero .vb-teambtn-desk{display:none!important}
.vbs-hero .vb-teambtn-mob{display:block!important}

/* Bewertung (hell) */
.vbs-bew{max-width:none!important;margin-top:20px!important;background:#eef6f8;padding:46px 0 120px}
.vbs-bew > *{max-width:1120px;margin-left:auto;margin-right:auto}
.vbs-bew h2.vbs-titel{margin:0 auto 20px;font-size:30px;line-height:1.3;font-weight:700;color:#007E91;text-align:center}
.vbs-bew .vb-home-badges{max-width:1040px;margin:0 auto 40px}

/* Leistungen, Themen */
.vbs-leist{padding:20px 0 0}
.vbs-themen{padding:20px 10px 0}
.vbs-themen h2.vbs-titel{margin:0 0 20px;font-size:35px;line-height:1.3;font-weight:600;color:#007E91;text-align:center}
.vbs-posts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
.vbs-post{display:flex;flex-direction:column;background:#fff;border-radius:18px;overflow:hidden;box-shadow:0 6px 22px rgba(0,40,50,.08);border:1px solid #edf1f2;text-decoration:none;transition:transform .2s,box-shadow .2s}
.vbs-post:hover{transform:translateY(-3px);box-shadow:0 14px 34px rgba(0,40,50,.14)}
.vbs-post-bild{display:block;aspect-ratio:16/10;overflow:hidden}
.vbs-post-bild img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .5s}
.vbs-post:hover .vbs-post-bild img{transform:scale(1.04)}
.vbs-post-text{flex:1;display:flex;flex-direction:column;gap:8px;padding:18px 20px 20px}
.vbs-post-datum{font-size:.78rem;font-weight:600;color:#6b7780}
.vbs-post-titel{font-size:1.05rem;line-height:1.45;font-weight:800;color:#1f2a30}
.vbs-post-mehr{margin-top:auto;font-size:.88rem;font-weight:800;color:#007E91}
.vbs-post-mehr::after{content:" →"}
.vbs-reg{padding:20px 10px 0}

/* Ablauf (petrol) */
.vbs-ablauf{margin-top:20px;background:#007E91;padding:20px 10px 10px}

/* Kontakt + Anfahrt (helles Türkis) */
.vbs-kontakt,.vbs-anfahrt{background:#c5e7e6;padding:20px 10px}
.vbs-kontakt{margin-top:20px}
.vbs-kontakt-grid{display:grid;grid-template-columns:minmax(0,558fr) minmax(0,530fr);gap:32px;margin-top:26px!important}
.vbs-kontakt-karte{padding:34px 30px;border-radius:20px;background:linear-gradient(160deg,#007E91,#005f6e);box-shadow:0 16px 40px rgba(0,126,145,.22)}
.vbs-formkarte{background:#fff;border-radius:20px;padding:32px;box-shadow:0 12px 34px rgba(0,0,0,.05)}
.vbs-formtitel{margin:0 0 18px;font-size:17px;font-weight:600;line-height:1.45;color:#1f2a30}
.vbs-ds{margin:16px 0 0;font-size:.78rem;line-height:1.5;color:#6b7780}
.vbs-ds a{color:#007E91}
.vbs-anfahrt{padding-top:10px;padding-bottom:40px}
.vbs-anfahrt .vbs-titel{margin:0 0 20px;font-size:30px;line-height:1.3;font-weight:400;color:#007E91;text-align:center}
.vbs-start + .vbs-fuss{margin-top:0}

@media (max-width:1024px){.vbs-posts{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:880px){
  .vbs-gal{display:none}
  .vbs-hero{margin-top:0;background:#fff;padding:0}
  .vbs-hero-in{grid-template-columns:minmax(0,1fr)}
  .vbs-hero-bild{display:none}
  html:has(body.vbs-startseite){font-size:85.5%}
  body.vbs-startseite{font-size:13.68px;line-height:1.65}
  .vbs-hero-text{text-align:center}
  .vbs-hero .vb-hero-eyebrow{color:#007E91}
  .vbs-hero h1.vbs-titel{font-size:30px;color:#007E91;text-align:center}
  .vbs-hero .vbs-text,.vbs-hero .vbs-text p{color:#2b2b2b}
  .vbs-hero .vbs-text a{color:#007E91}
  .vbs-kontakt-karte{padding:28px 22px}
  .vbs-bew{padding-left:10px;padding-right:10px}
  .vbs-kontakt-grid{grid-template-columns:minmax(0,1fr)}
  .vbs-formkarte{padding:22px}
}
@media (max-width:640px){.vbs-posts{grid-template-columns:minmax(0,1fr)}.vbs-anfahrt .vbs-titel{font-size:24px}.vbs-themen h2.vbs-titel{font-size:26px}}
