/* Contactpagina. Waarden 1:1 uit contact.dc.html. */

/* ---------- Contactgegevens ---------- */
.p-ct-info { background: var(--wm-cream); color: var(--wm-navy); padding: clamp(40px, 5vw, 70px) 0 clamp(50px, 6vw, 90px); }
.p-ct-info__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: clamp(26px, 3.4vw, 56px); align-items: start; }
.p-ct-info__col { display: flex; flex-direction: column; gap: 14px; }

/* Infokaart (icoon + twee regels) */
.p-ct-card {
  display: flex; align-items: center; gap: 18px; background: #fff; border-radius: 24px; padding: 22px 26px;
  box-shadow: 0 12px 30px rgba(2,67,94,.12);
}
.p-ct-card--link { color: var(--wm-navy); transition: transform .3s var(--wm-ease), box-shadow .3s ease, background .3s ease; }
.p-ct-card--link:hover { transform: translateX(8px); background: var(--wm-navy); color: #fff; box-shadow: 0 22px 44px rgba(2,67,94,.26); }
.p-ct-card__text { display: block; }
.p-ct-card__s { display: block; margin-top: 4px; font-size: 18px; font-weight: 600; }
.p-ct-card__s--dim { opacity: .82; }
.p-ct-card__s--body { color: var(--wm-text-body); }

/* Kaart */
.p-ct-map { border-radius: 26px; overflow: hidden; box-shadow: 0 16px 40px rgba(2,67,94,.18); margin-top: 4px; }
.p-ct-map iframe { display: block; width: 100%; height: clamp(260px, 32vw, 340px); border: 0; }

/* Routelink */
.p-ct-route {
  display: inline-flex; align-items: center; gap: 12px; font-size: 19px; font-weight: 800; color: var(--wm-navy);
  border-bottom: 2px solid rgba(2,67,94,.35); padding-bottom: 4px; width: fit-content;
  transition: gap .25s ease, border-color .25s ease;
}
.p-ct-route:hover { gap: 18px; border-color: var(--wm-navy); }

/* ---------- Formulierblok ---------- */
.p-ct-form.formbox { padding: clamp(26px, 3vw, 42px); box-shadow: 0 24px 54px rgba(2,67,94,.28); }
.p-ct-form__title { margin: 0; font-size: clamp(26px, 3.2vw, 40px); line-height: 1.07; font-weight: 800; letter-spacing: -.02em; }

/* Quicklinks onder het formulier */
.p-ct-quick { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px; margin-top: 28px; }
.p-ct-quick__link {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  background: rgba(255,255,255,.1); color: #fff; border-radius: 18px; padding: 18px 22px; font-size: 18px; font-weight: 800;
  transition: background .25s ease, transform .25s ease;
}
.p-ct-quick__link:hover { background: rgba(255,255,255,.2); transform: translateY(-4px); }
.p-ct-quick__arrow { color: var(--wm-sand); }