/* Verwijsblok naar de 3D-woningkiezer, in de stijl van degoffaert.nl:
   rij in de accentkleur #af9982, Sofia Sans (erft van het thema), koppen 900, knoppen zoals .button-goffaert
   (18px / 500, padding 15px 22px, afgeschuinde hoek linksboven, schaduwrand onder). */
.gw-cta { background: #af9982; color: #fff; font-family: inherit; }
.gw-cta * { box-sizing: border-box; }
.gw-cta-inner { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: 40px 56px; align-items: center; max-width: 1300px; margin: 0 auto; padding: 64px 40px; }
.gw-cta-text { min-width: 0; }

/* Eyebrow zoals de h5-labels op de site ("Ontdek") */
.gw-cta .gw-cta-label { display: block; font-size: 20px; line-height: 30px; font-weight: 900; color: #323132; margin: 0 0 6px; }
.gw-cta .gw-cta-title { font-size: 42px; line-height: 54px; font-weight: 900; margin: 0 0 14px; color: #fff; letter-spacing: 0; text-wrap: balance; }
.gw-cta .gw-cta-copy { font-size: 20px; line-height: 34px; font-weight: 400; margin: 0 0 18px; color: #fff; max-width: 560px; }

/* Lijst met Salient-vinkjes (icomoon, zelfde icoon als de fancy-ul "standard_check" op de site) */
.gw-cta .gw-cta-points { list-style: none; margin: 0 0 30px; padding: 0; font-size: 18px; color: #fff; }
.gw-cta .gw-cta-points li { position: relative; margin: 0 0 5px; padding-left: 38px; line-height: 30px; }
.gw-cta .gw-cta-points li i { position: absolute; left: 0; top: 0; width: 20px; font-size: 16px; line-height: 30px; color: #323132; font-style: normal; }
.gw-cta .gw-cta-points li i::before { content: "\e915"; font-family: icomoon; }

/* Knoppen in de stijl van .button-goffaert */
.gw-cta-actions { display: flex; align-items: center; gap: 12px 14px; flex-wrap: wrap; }
.gw-cta a.gw-cta-btn {
  display: inline-block; box-sizing: border-box; text-align: center;
  font-family: inherit; font-size: 18px; font-weight: 500; line-height: 20px; letter-spacing: normal; text-transform: none; text-decoration: none;
  padding: 15px 22px; border: 0; border-radius: 0; box-shadow: inset 0 -3px 0 0 rgba(0, 0, 0, .1);
  clip-path: polygon(12px 0%, 100% 0%, 100% 100%, 0% 100%, 0% 12px);
  background: #323132; color: #fff; transition: opacity .2s;
}
.gw-cta a.gw-cta-btn.gw-cta-btn-light { background: #fff; color: #5c4f44; }
.gw-cta a.gw-cta-btn:hover { opacity: .85; }

/* Demo-animatie: zelfde achtergrondkleur als de rij, dus naadloos */
.gw-cta-media { position: relative; display: block; min-width: 0; text-decoration: none; }
.gw-cta .gw-cta-video { display: block; width: 100%; height: auto; aspect-ratio: 8 / 5; object-fit: cover; background: transparent;
  /* randen zacht laten overlopen in de rij, zodat er geen kader zichtbaar is */
  -webkit-mask-image: linear-gradient(to right, transparent 0, #000 14%, #000 86%, transparent 100%), linear-gradient(to bottom, transparent 0, #000 14%, #000 86%, transparent 100%);
  -webkit-mask-composite: source-in;
  mask-image: linear-gradient(to right, transparent 0, #000 14%, #000 86%, transparent 100%), linear-gradient(to bottom, transparent 0, #000 14%, #000 86%, transparent 100%);
  mask-composite: intersect; }
.gw-cta .gw-cta-hint { position: absolute; left: 0; bottom: 0; font-size: 14px; line-height: 20px; font-weight: 500; color: #fff; background: #323132; padding: 8px 14px; clip-path: polygon(8px 0%, 100% 0%, 100% 100%, 0% 100%, 0% 8px); }

@media (max-width: 999px) {
  .gw-cta-inner { grid-template-columns: 1fr; gap: 28px; padding: 48px 24px; }
  .gw-cta .gw-cta-title { font-size: 32px; line-height: 42px; }
  .gw-cta .gw-cta-copy { font-size: 18px; line-height: 30px; }
  .gw-cta .gw-cta-points { font-size: 16px; }
}

/* Salient-overrides: thema-typografie, kolom-padding en lijststijl binnen WPBakery neutraliseren */
.gw-cta .gw-cta-title { font-size: 42px !important; line-height: 54px !important; margin: 0 0 14px !important; color: #fff !important; }
.gw-cta p.gw-cta-copy { padding: 0 !important; color: #fff !important; }
.gw-cta ul.gw-cta-points { margin: 0 0 30px !important; padding: 0 !important; }
.gw-cta ul.gw-cta-points li { list-style: none !important; margin: 0 0 5px !important; padding: 0 0 0 38px !important; color: #fff !important; }
.gw-cta ul.gw-cta-points li i { font-size: 16px !important; line-height: 30px !important; color: #323132 !important; }
.gw-cta a.gw-cta-btn { color: #fff !important; }
.gw-cta a.gw-cta-btn.gw-cta-btn-light { color: #5c4f44 !important; }
@media (max-width: 999px) {
  .gw-cta .gw-cta-title { font-size: 32px !important; line-height: 42px !important; }
  .gw-cta ul.gw-cta-points li { line-height: 24px !important; margin-bottom: 10px !important; }
  .gw-cta ul.gw-cta-points li i { line-height: 24px !important; }
}