/* Individuelle CSS-Regeln für kontakt.html */
.h1{font-size:clamp(40px,5.2vw,64px)}
.lead{font-size:clamp(18px,1.6vw,21px);color:#4A5058;max-width:620px}
.card{background:#FFFFFF;border-radius:16px;padding:32px;box-sizing:border-box}
.num{font-family:"Raleway",sans-serif;font-weight:700;font-size:44px;line-height:1;color:#B8A596}

/* Stabile Spalten: Consent-Platzhalter und geladener Calendly-Kalender
   bleiben unabhängig von ihrer Inhaltshöhe/-breite an derselben Stelle. */
.va .contact-layout {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 56px;
  align-items: start;
}
.va .contact-layout > .contact-details,
.va .contact-layout > .embed {
  min-width: 0;
  width: 100%;
}
.va .contact-layout .embed iframe {
  max-width: 100%;
}
@media (max-width: 900px) {
  .va .contact-layout {
    grid-template-columns: minmax(0, 1fr);
    gap: 32px;
  }
}

/* Calendly-Vorschau: Die sichtbare Buchungskarte soll auf breiten
   Bildschirmen eher auf Höhe der unteren Kontaktkarten stehen.
   Das iFrame bleibt vollständig hoch, damit Folgeschritte nicht abgeschnitten werden.
   Der Abstand gilt sowohl vor als auch nach der Cookie-Freigabe. */
@media (min-width: 901px) {
  .va .contact-layout > .embed {
    margin-top: clamp(120px, 23vw, 300px);
  }
}
@media (max-width: 900px) {
  .va .contact-layout > .embed {
    margin-top: 0;
  }
}

/* Kompakter Einwilligungsplatzhalter auf der Kontaktseite.
   Nur der Platzhalter wird verkleinert – das Calendly-iframe bleibt vollständig. */
.va .contact-layout > .embed:not([data-loaded]) {
  min-height: 0;
  padding: 26px 28px;
  justify-content: flex-start;
}
.va .contact-layout > .embed:not([data-loaded]) .embed__gate {
  gap: 10px;
}
.va .contact-layout > .embed:not([data-loaded]) .embed__gate > * {
  margin-top: 0;
  margin-bottom: 0;
}
.va .contact-layout > .embed:not([data-loaded]) .embed__title {
  font-size: clamp(21px, 2.1vw, 24px);
  line-height: 1.3;
}
.va .contact-layout > .embed:not([data-loaded]) .small {
  font-size: 13px;
}
@media (max-width: 780px) {
  .va .contact-layout > .embed:not([data-loaded]) {
    min-height: 0;
    padding: 22px 20px;
  }
}

/* Kontaktbereich kompakter: weniger Leerraum bis zum Folgeabschnitt.
   Inline-padding des HTML gezielt überschreiben. */
@media (min-width: 901px) {
  .va section.contact-layout {
    padding-bottom: 36px !important;
  }
  /* Kalender behält genügend Platz für die eingebettete Terminbuchung. */
  .va .contact-layout > .embed iframe {
    height: 600px;
  }
}
@media (max-width: 900px) {
  .va section.contact-layout {
    padding-bottom: 40px !important;
  }
}