/* Kontakt-spezifische Styles */
.contact-page .contact-intro .content,
.contact-page .contact-methods .content,
.contact-page .map .content {
  padding: 1rem;
}

section {
    margin-bottom: 1rem;
}

/* Kontaktliste */
.contacts-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .75rem;
}
.contacts-list li {
  display: flex;
  align-items: center;
  gap: .75rem;
  background: #fff;
  padding: .6rem .75rem;
  border-radius: 8px;
  box-shadow: 0 1px 6px rgba(16,24,40,0.03);
}
.contacts-list .icon { color: var(--blue-1); display:inline-flex; align-items:center; justify-content:center; width:28px; height:28px; flex:0 0 28px }
.contacts-list a { color: var(--blue-1); text-decoration: none; font-weight:600; margin-left:.25rem; }

/* Map consent box (sichtbar, solange Karte nicht geladen ist) */
.map-consent {
  background: var(--block-bg);
  border-radius: 10px;
  padding: 1rem;
  margin-top: 0.75rem;
  display: block;
  box-shadow: 0 2px 10px rgba(16,24,40,0.04);
}
.map-consent p { margin: .4rem 0; color: #1f2937; }
.map-consent .consent-actions { display:flex; gap:.6rem; justify-content:center; margin-top:.6rem; }

/* Map container (hier wird das iframe eingefügt) */
.map-container {
  margin-top: 1rem;
  width: 100%;
  height: 0;
  overflow: hidden;
  border-radius: 10px;
  background: #e5e7eb;
  transition: height .32s ease, opacity .24s ease;
  opacity: 0;
}

/* Wenn iframe eingefügt wird, wird .visible gesetzt */
.map-container.visible { height: 400px; opacity: 1; }

/* kleine Geräte: niedrigere Höhe */
@media (max-width:400px){
  .map-container.visible { height: 280px; }
}

/* Buttons */
.btn { padding:.5rem .9rem; border-radius:6px; background:var(--blue-2); color:#fff; border:0; cursor:pointer; }
.btn.outline { background:transparent; border:1px solid rgba(0,0,0,0.08); color:var(--blue-1); }

/* kleine opt. Feinheit: wenn Karte geladen, verstecke consent-box */
.map-consent.hidden { display: none; }