/* ==========================================================================
   VANDENBOORN AUTOMOTIVE - brug tussen de Elementor-homepage en cl-home.css.
   De secties van de Elementor-home dragen de Carlink-klassen (cl-hero, cl-cars,
   cl-quote, cl-bar, cl-small-info, cl-large-info, cl-cta, cl-footer), zodat
   cl-home.css 1:1 geldt. Hieronder alleen wat Elementor-containers anders doen
   dan de oude <section>/<div>-opbouw. Laadt na cl-home.css.
   ========================================================================== */

/* Binnencontainer = .cl-container (Bootstrap-breekpunten). */
.e-con.cl-elementor-container{width:100%;max-width:100%;margin-left:auto;margin-right:auto;position:relative}
@media (min-width:576px){.e-con.cl-elementor-container{max-width:540px}}
@media (min-width:768px){.e-con.cl-elementor-container{max-width:720px}}
@media (min-width:992px){.e-con.cl-elementor-container{max-width:960px}}
@media (min-width:1200px){.e-con.cl-elementor-container{max-width:1140px}}
@media (min-width:1400px){.e-con.cl-elementor-container{max-width:1320px}}

/* Kolomoffset zoals .cl-offset-md-1 (alleen vanaf tablet-landschap). */
@media (min-width:768px){.e-con.cl-offset-md-1{margin-left:8.3333%}}

/* Hero: zoekveld staat in de normale flow (in het template stond hij absoluut). */
.cl-home .cl-home-search--inline{position:static;transform:none;width:100%;padding:0}
.cl-home .cl-hero .e-con-inner,.cl-home .cl-hero>.e-con-inner{min-height:0}
.cl-home .cl-hero .cl-home-search--inline .cl-sf-input{font-size:2rem}
@media (max-width:768px){.cl-home .cl-hero .cl-home-search--inline .cl-sf-input{font-size:1.4rem}}

/* Secties: padding staat in Elementor (bewerkbaar) en hier als vangnet met de Carlink-maten.
   Overlay van de quote- en 13-jaar-sectie komt uit cl-home.css (multiply), de hero via Elementor. */
.cl-home .e-con.cl-quote,.cl-home .e-con.cl-large-info{background-blend-mode:multiply}
.cl-home .e-con.cl-cars{padding-top:8rem;padding-bottom:8rem}
.cl-home .e-con.cl-quote{padding-top:25vh;padding-bottom:25vh}
.cl-home .e-con.cl-small-info{padding-top:8rem;padding-bottom:8rem}
.cl-home .e-con.cl-large-info{padding-top:6rem;padding-bottom:6rem}
.cl-home .e-con.cl-cta{padding-top:7rem;padding-bottom:7rem}
.cl-home .e-con.cl-bar{min-height:5vh;max-height:5vh;padding:0}
@media (max-width:768px){
  .cl-home .e-con.cl-cars,.cl-home .e-con.cl-small-info,.cl-home .e-con.cl-large-info,.cl-home .e-con.cl-cta{padding-top:4rem;padding-bottom:4rem}
  .cl-home .e-con.cl-quote{padding-top:10vh;padding-bottom:10vh}
}

/* Divider: zelfde maat als de <hr> uit het template. */
.cl-home .cl-large-info .elementor-widget-divider{width:100%}

/* Footer: Elementor-kolommen gedragen zich als .cl-col-md-3; tekstblokken erven de Carlink-footerregels. */
.cl-footer .elementor-widget-text-editor p:last-child{margin-bottom:0}
.cl-footer .cl-with-bullets{padding-left:0}
.cl-sub-footer .cl-container::before{top:-16px}
@media (max-width:767.98px){
  .cl-sub-footer .elementor-widget.cl-copy,.cl-sub-footer .elementor-widget.cl-legal{width:100% !important;text-align:center}
  .cl-sub-footer .elementor-widget.cl-legal .elementor-widget-container{text-align:center}
  .cl-sub-footer .elementor-widget.cl-copy{order:2;margin-top:.25rem}
}

/* Elementor-canvas: body is flex-kolom (cl-home.css), de footer blijft onderaan. */
.cl-home .elementor-4063{display:flex;flex-direction:column;flex:1 0 auto;width:100%}
.cl-home .elementor-4063>.e-con.cl-footer{margin-top:auto}

/* CTA-foto (Defender): exact vierkant, vult de kolom, nooit vervormd, zelfde radius als de rest. */
.cl-cta .cl-cta__image .elementor-widget-container,.cl-cta .cl-cta__photo .elementor-widget-container{display:block;width:100%}
.cl-cta .cl-cta__photo img{width:100% !important;height:auto !important;aspect-ratio:1/1;object-fit:cover;object-position:center;border-radius:10px;display:block}
.cl-cta .cl-row{align-items:center}
@media (max-width:767.98px){.cl-cta .cl-cta__photo img{max-width:480px;margin:0 auto}}