/* ===== CONTACT – 1-op-1 met afbeelding (vierkant, plat) ===== */
:root{
  --ink:#1a1b1f;          /* hoofdtekst */
  --muted:#8f98a3;        /* eyebrow rechts */
  --label:#7f8892;        /* bovenlabels inputs */
  --border:#e9edf2;       /* rand kleur kaart/inputs */
  --placeholder:#b7bfca;  /* placeholder grijs */
  --blue:#2f4687;         /* knopkleur (plat) */
}

.contact{
  background:#fff;
  padding:72px 0 84px;
  font-family: Montserrat, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color:var(--ink);
}
.contact__container{ max-width:1120px; }

/* Linkerpaneel (platte kaart, vierkant) */
.cpanel{
  background:#fff;
  border:1px solid var(--border);
  border-radius:0;                 /* vierkant */
  padding:28px 30px 30px;
  box-shadow:none;                 /* geen schaduw */
}
.cpanel__title{
  margin:0 0 .6rem;
  font-weight:400;                 /* niet vet zoals voorbeeld */
  font-size:40px;                  /* groot kopje */
  line-height:1.2;
  color:var(--ink);
}
.cpanel__lead{
  margin:0 0 1.4rem;
  font-size:16px;
  line-height:28px;                /* 16/28 */
  color:var(--ink);
  opacity:.6;                      /* lichte dekking */
}

/* Labels en velden */
.c-label{
  display:inline-block;
  margin-bottom:.45rem;
  font-size:11px;
  letter-spacing:.12em;
  text-transform:uppercase;
  font-weight:700;
  color:var(--label);
}

/* Inputs: vierkant, platte rand, hoge breedte */
.c-input,
.c-textarea{
  width:100%;
  border:1px solid var(--border);
  border-radius:0;                 /* vierkant */
  background:#fff;
  color:#111827;
  font-size:15px;
  line-height:22px;
  padding:.8rem .95rem;
  transition:border-color .15s ease;
}
.c-input::placeholder,
.c-textarea::placeholder{ color:var(--placeholder); }
.c-input:focus,
.c-textarea:focus{
  outline:none;
  border-color:#cfd6e2;            /* subtiele focus */
  box-shadow:none;                  /* geen glow */
}
.c-textarea{ resize:vertical; }

/* Knop: plat blauw, uppercase, vierkant, full width */
.c-btn{
  display:inline-block;
  border:0;
  border-radius:0;                  /* vierkant */
  width:100%;
  padding:.95rem 1rem;
  background:var(--blue);
  color:#fff !important;
  text-transform:uppercase;
  letter-spacing:.14em;
  font-size:12px;
  font-weight:700;
  line-height:1;
  box-shadow:none;                  /* geen schaduw */
  text-decoration:none;
}
.c-btn:hover,
.c-btn:focus{
  filter:brightness(0.95);
  color:#fff !important;
}
.c-btn:active{ filter:brightness(0.9); }

/* Rechterkolom: plain tekst, geen kaart */
.cinfo{ padding-top:6px; }          /* uitlijnen met titel links */
.cinfo__group + .cinfo__group{ margin-top:28px; }
.cinfo__eyebrow{
  letter-spacing: 1px;
  text-transform: uppercase;
  margin-bottom: 10px;
  font-size: 12px;
  font-weight: 500;
  line-height: 20px;
}
.cinfo__text{
  opacity: .6;
  text-align: left;
  font-style: normal;
}
.cinfo a{ color:inherit; text-decoration:none; }
.cinfo a:hover{ text-decoration:underline; }

/* Responsief */
@media (max-width:992px){
  .contact{ padding:56px 0 70px; }
  .cpanel{ padding:24px; }
  .cpanel__title{ font-size:34px; }
}
@media (max-width:576px){
  .contact{ padding:44px 0 56px; }
  .cpanel__title{ font-size:28px; }
}
