/*
Theme Name: Impreza Child
Template: Impreza
Version: 1.0
Author:	UpSolution
Theme URI: http://impreza.us-themes.com/
Author URI: http://us-themes.com/
*/

/*Add your own styles here:*/

.tree-overlay{
  background-size: cover;
  background-position: 100% 0%;
  background-repeat: repeat;
  background-color: var(--color-content-primary);
  background-image: url(/wp-content/uploads/2025/09/AdobeStock_288222154.webp);
}
.tree-overlay .l-section-overlay{
  background-image: url(images/trees.webp)!important;
  background-size: contain !important;
  background-position: top right !important;
  background-repeat: no-repeat !important;
}
.copos-overlay .l-section-overlay{
  background-image: url(images/copos-bg.svg)!important;
  background-size: contain !important;
  background-position: top !important;
  background-repeat: no-repeat !important;
}
.copos-overlay .l-section-overlay:before{
  content: '';
  background: linear-gradient(180deg, transparent 50%, #ffffff 100%);
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
}

/* Contenedor con borde animado */
.border-animation{
  position: relative;
  border-radius: 14px;
  overflow: visible;
}

/* Capa donde van las luces */
.border-animation .lights{
  position: absolute;
  inset: 20px;                   /* separación desde el borde */
  border-radius: inherit;
  pointer-events: none;
  z-index: 2;
}

/* Puntito base */
.border-animation .light{
  position: absolute;
  width: 6px;                    /* diámetro */
  height: 6px;
  border-radius: 50%;
  background: #8B7EC8;           /* color base */
  box-shadow: 0 0 3px rgba(139,126,200,.7);
  transition: background .25s, box-shadow .25s, transform .25s;
}

/* Encendido */
.border-animation .light.on{
  background: #FFFFFF; 
  box-shadow: 0 0 6px rgba(254,171,2,.9), 0 0 12px rgba(254,171,2,.6);
  transform: scale(1.15);
}
.programma-links .w-vwrapper{
    transition: all 0.2s ease-in-out;
}
.programma-links .w-vwrapper:hover{
    transform: scale(1.05) translate(0%, 0%);
}
.programma-links .w-vwrapper .w-image:not(.m-image) img{
  object-fit: contain!important;
}

.programma-links .m-image{
  position: relative;
  overflow: hidden;
  border-radius: 18px;
}
.programma-links .m-image .w-image-h{ position: relative; }

.programma-links .m-image img{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 1;  /* la onda irá encima */
}

/* Onda doble: bordes altos, centro bajo (ancha) */
.programma-links .m-image .w-image-h::after{
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: -1px;
  height: 30px;                 /* altura máxima visible */
  z-index: 2;
  pointer-events: none;
  background-repeat: no-repeat;
  background-position: bottom center;
  background-size: 100% 100%;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 480 40' preserveAspectRatio='none'%3E%3Cpath d='M0 6 C 100 2 140 40 240 35 C 340 40 380 2 480 6 L480 40 L0 40 Z' fill='%23ffffff'/%3E%3C/svg%3E");
}

.programma-links .wpb_column:nth-child(1){margin-top: 0px;}
.programma-links .wpb_column:nth-child(2){margin-top: -20px;}
.programma-links .wpb_column:nth-child(3){margin-top: -40px;}
.programma-links .wpb_column:nth-child(4){margin-top: 0px;}
.programma-links .wpb_column:nth-child(5){margin-top: -20px;}

.programma-links .owl-carousel:not(.center_item) .owl-stage{
  padding: 70px 30px 30px 30px !important;
}
@media(min-width: 1382px){
  .programma-links .owl-carousel:not(.center_item) .owl-stage .owl-item:nth-child(1){transform: translateY(0px);}
  .programma-links .owl-carousel:not(.center_item) .owl-stage .owl-item:nth-child(2){transform: translateY(-20px);}
  .programma-links .owl-carousel:not(.center_item) .owl-stage .owl-item:nth-child(3){transform: translateY(-40px);}
  .programma-links .owl-carousel:not(.center_item) .owl-stage .owl-item:nth-child(4){transform: translateY(0px);}
  .programma-links .owl-carousel:not(.center_item) .owl-stage .owl-item:nth-child(5){transform: translateY(-20px);}
}
.activities-carousel .owl-stage .owl-item .post_image{
  transition: transform 0.3s ease;
}
.activities-carousel .owl-stage .owl-item:nth-child(odd) .post_image {
  transform: rotate(2.5deg);
}
.activities-carousel .owl-stage .owl-item:nth-child(even) .post_image {
  transform: rotate(-2.5deg);
}
.activities-carousel .owl-stage .owl-item:hover .post_image {
  transform: rotate(0deg) scale(1.05);
}

.overons-grid .w-grid-list .w-grid-item .post_image{
  transition: transform 0.3s ease;
}
.overons-grid .w-grid-list .w-grid-item:nth-child(even) .post_image {
  transform: rotate(2.5deg);
} 
.overons-grid .w-grid-list .w-grid-item:nth-child(odd) .post_image {
  transform: rotate(-2.5deg);
}
.overons-grid .w-grid-list .w-grid-item:hover .post_image {
  transform: rotate(0deg) scale(1.05);
}

.red-borders-overlay .l-section-overlay{
  background-image: url("images/border-lampjes_trim.svg"), url("images/border-lampjes_trim.svg")!important;
  background-repeat: repeat-x, repeat-x!important;
  background-position: top, bottom!important;          
  background-size: auto 30px, auto 30px!important;    
}

.border-red-top .l-section-overlay{
  background-image: url("images/border-lampjes_trim.svg")!important;
  background-repeat: repeat-x!important;
  background-position: top!important;
  background-size: auto 30px!important;
}

.c-menu-toggle .w-popup-trigger{
  background-color: #FFFFFF;
  color: var(--color-content-primary);
  width: 74px;
  height: 74px;
  margin-right: -1.5rem;
}
.c-menu-toggle .w-popup-trigger i{
  font-size: 30px;
}
.c-menu-toggle .w-popup-trigger:hover{ 
  color: #C88E3E;
}
.banner-simple-page .l-section-overlay{
  background-image: url(images/page-banner-lights-new.png)!important;
  background-position: 50% -10% !important;
  background-size: 50% auto!important;
  background-repeat: no-repeat!important;
}
.banner-simple-page .l-section-overlay::before{
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background-image: url(images/trees-banner-page.webp);
  background-position: 50% 96%;
  background-size: 80%;
  background-repeat: no-repeat;
}
.banner-simple-page .l-section-overlay::after{
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background-image: url(images/page-banner-overlay.svg);
  background-position: bottom;
  background-size: auto;
  background-repeat: repeat-x;
}
.programma-tabs .w-vwrapper{
  padding: 30px 20px 20px 20px !important;
}
.programma-tabs .w-vwrapper:hover,
.programma-tabs .w-vwrapper.active{
  background-color: #C88E3E!important;
}
.programma-tabs .w-vwrapper:hover h6.w-text,
.programma-tabs .w-vwrapper.active h6.w-text{
  color: #FFFFFF!important;
}
.programma-tabs .w-vwrapper:hover svg path,
.programma-tabs .w-vwrapper.active svg path{
  fill: #FFFFFF!important;
}

@media(min-width:768px){
  .programma-tabs-default .w-tabs-list{
    display: none;
  }
}

.informatie-tabs .w-tabs-item{
  background-color: #FFFFFF;
  padding: 16px !important;
  border-radius: 10px !important;
  letter-spacing: 0.05em;
}
.informatie-tabs .w-tabs-item.active,
.informatie-tabs .w-tabs-item:hover{
  background-color: var(--color-content-primary)!important;
  color: #FFFFFF!important;
}

.informatie-form br{
  display: none;
}
.informatie-form p{
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
.informatie-form .wpcf7-form-control-wrap{
  margin-top: 0px;
}
.informatie-form .wpcf7-form-control-wrap:not([data-name="you-message"]){
  width: calc((100% - 20px) / 3);
}
.informatie-form .wpcf7-form-control-wrap[data-name="you-message"]{
  width: 100%;
}
.informatie-form .wpcf7-submit{
  width: 100%;
}

.faqs .w-tabs-section-header{
  padding-top: 10px;
  padding-bottom: 10px;
  padding-left: 10px!important;
  padding-right: 10px!important;
  color: #FFFFFF;
  background-color: var(--color-content-primary);
  border-radius: 10px;
}
.faqs .w-tabs-section-header .w-tabs-section-control{
  color: #FFFFFF;
}
.faqs .w-tabs-section-header .w-tabs-section-title{
  color: #FFFFFF;
  line-height: 1;
}
.faqs .w-tabs-section-header:hover{
  background-color: #F3B85B!important;
}
.faqs .w-tabs-section-header.active{
  background-color: var(--color-content-primary)!important;
  border-radius: 10px 10px 0px 0px;
}
.faqs .w-tabs-section-content{
  background-color: var(--color-content-primary)!important;
  color: #FFFFFF!important;
  padding: 0px 10px 10px 10px !important;
  border-radius: 0px 0px 10px 10px!important;
  font-size: 16px!important;
}
.faqs .w-tabs-section{
  margin-bottom: 5px;
}
.home-banner .l-section-overlay:before{
  content: '';
  background-image: url(images/home-banner-trees.webp);
  background-position: -20% 101%;
  background-repeat: no-repeat;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-size: 35%;
}
.home-banner .l-section-overlay:after {
  content: '';
  background-image: url(images/trees.webp);
  background-position: 120% 101%;
  background-repeat: no-repeat;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-size: 35%;
}


.banner-simple-page h1.w-text {
  font-size: clamp(3rem, 10vw, 122px)!important;
}

.owl-nav .owl-prev{
      background-image: url(images/prev.svg) !important;
      background-size: cover !important;
      background-repeat: no-repeat !important;
      color: transparent;
      height: 40px!important;
      width: 40px!important;
}
.owl-nav .owl-next{
      background-image: url(images/next.svg) !important;
      background-size: cover !important;
      background-repeat: no-repeat !important;
      color: transparent;
      height: 40px!important;
      width: 40px!important;
  }

@media(max-width: 1260px){
  .c-menu-toggle .w-popup-trigger{
    margin-right: -1.5rem;
  }
}
@media(max-width: 1199px){
  .tree-overlay .l-section-overlay {
    background-image: url(images/trees.webp) !important;
    background-size: 40vh !important;
    background-position: bottom right !important;
    background-repeat: no-repeat !important;
  }
  .tree-overlay {
    background-size: cover;
    background-position: 100% 0%;
    background-repeat: no-repeat;
    background-color: var(--color-content-primary);
    background-image: url(/wp-content/uploads/2025/09/AdobeStock_288222154.webp);
  }
}
@media(max-width: 1199px) and (min-width: 768px){
  .programma-tabs{
    --columns-gap: 1rem!important;
  }
  .programma-tabs .w-vwrapper {
    padding: 10px 10px 10px 10px !important;
  }
  .programma-tabs h6.w-text{
    font-size: 15px;
  }
  .programma-tabs h5.w-text{
    font-size: 19px;
  }
}
@media(max-width: 899px){
  .c-menu-toggle .w-popup-trigger{
    margin-right: -1rem;
  }
  .banner-simple-page .l-section-overlay::before{
    background-size: 126%;
  }
}
@media(max-width: 767px){
  .c-menu-toggle .w-popup-trigger{
    margin-right: -1rem;
  }
  .w-hwrapper.us_custom_fe279556{
    max-width: 260px!important;
  }
  .w-hwrapper.us_custom_fe279556 .us_custom_722dab2c {
    width: 22px !important;
  }
  .programma-tabs{
    display: none!important;
  }
  .programma-tabs-default .w-tabs-section{
    margin-bottom: 1px;
  }
  .programma-tabs-default .w-tabs-section-header{
    background-color: var(--color-content-primary);
    color: #FFFFFF !important;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-radius: 10px;
    line-height: 1;

    padding: 10px 20px;
    border-radius: 20px;
  }
  .programma-tabs-default .w-tabs-section-header .w-tabs-section-title{
    color: #FFFFFF!important;
    font-size: 27px!important;
  }
  .programma-tabs-default .w-tabs-section-content{
    padding-left: 0px;
    padding-right: 0px;
  }
  .informatie-tabs .w-tabs-section-header{
    padding: 10px 20px;
    background-color: var(--color-content-primary);
    color: #FFFFFF !important;
    border-radius: 20px;
  }
  .informatie-tabs .w-tabs-section-header .w-tabs-section-title{
    color: #FFFFFF;
    line-height: 1;
  }
  .informatie-tabs > .w-tabs-section-content{
    padding-left: 0px!important;
    padding-right: 0px!important;
  }
  .c-menu-toggle .w-popup-trigger {
    width: 50px;
    height: 50px;
  }
}
@media (max-width: 600px) {
  .w-popup-wrap[style*="--popup-padding"] .w-popup-box-content {
    padding: 0px!important;
  }
  #menu-main-menu li{
    margin-bottom: 0px!important;
  }
  .informatie-tabs .us_custom_eed4fe6c {
    padding: 10px !important;
  }
  .informatie-form .wpcf7-form-control-wrap:not([data-name="you-message"]) {
    width: 100%;
  }
  .banner-simple-page .l-section-overlay::before{
    background-position: 50% 100%;
  }
}


/* Contexto */
.home-banner { position: relative; overflow: visible; }

/* Tus pseudo-elementos ya existentes.
   Importante: consumen variables CSS que animaremos con GSAP. */
.home-banner .l-section-overlay:before,
.home-banner .l-section-overlay:after{
  content: "";
  position: absolute; /* asume que ya lo tienes */
  will-change: transform;
  pointer-events: none;
  transform: translateX(0%); /* fallback */
}

/* LEFT: usa --before-x (−25% → 0% → −25%) */
.home-banner .l-section-overlay:before{
  transform: translateX(var(--before-x, 0%));
}

/* RIGHT: usa --after-x ( 25% → 0% →  25%) */
.home-banner .l-section-overlay:after{
  transform: translateX(var(--after-x, 0%));
}

/* Respeto a reduce motion */
@media (prefers-reduced-motion: reduce){
  .home-banner .l-section-overlay:before,
  .home-banner .l-section-overlay:after{
    transition: none;
  }
}


/* Los contenedores recortan el exceso para que se note el zoom */
/*
.home-banner .l-section-video,
.home-banner .l-section-img{
  position: relative;
  overflow: hidden;
}*/

/* Medios internos típicos */
.home-banner .l-section-video video,
.home-banner .l-section-video iframe,
.home-banner .l-section-img img{
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform-origin: center center;
  will-change: transform;
}

/* Si usas background-image en vez de <img>/<video> */
.home-banner .l-section-video.bg,
.home-banner .l-section-img.bg{
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100%;
  will-change: background-size;
}

.us_custom_05f5b465{
  width: 100%!important;
}
.us_custom_05f5b465 svg{
  width: 100%!important;
  height: auto!important;
}

@media(max-width: 1599px){
  .banner-simple-page .l-section-overlay{
    background-position: 50% 0% !important;
  }
}
@media(max-width: 1399px){
  .banner-simple-page .l-section-overlay{
    background-position: 50% 10% !important;
  }
}
@media(max-width: 899px){
  .banner-simple-page .l-section-overlay{
    background-position: 50% 15% !important;
  }
}
@media(max-width: 767px){
      .banner-simple-page .l-section-overlay {
        background-position: 50% 0% !important;
        background-size: contain !important;
    }
}
@media(max-width: 499px){
      .banner-simple-page .l-section-overlay {
        background-position: 50% 14% !important;
    }
}

/*LOGO HOME BANNER*/
@media(max-width:3000px) and (min-width: 2400px){
  .home-banner .us_custom_fe2cb32b,
  .home-banner .us_custom_0b4bfa56{
    max-width: 40% !important;
  }
}
@media(max-width: 499px){
  .home-banner .us_custom_fe2cb32b,
  .home-banner .us_custom_0b4bfa56{
    max-width: 70% !important;
  }
}

.ticket-box{
  background-color: #FFFFFF;
  padding: 10px;
  border-radius: 10px;
  box-shadow: 0px 7px 10px rgba(34, 5, 95, 0.3);
}
.ticket-box .ticket-box-title{
  position: absolute;
}
.ticket-box .ticket-box-title h4,
.ticket-box .ticket-box-title h5{
  margin-bottom: 0px;
  color: #FFFFFF!important;
}
.ticket-box .ticket-box-btn{
  background-color: #EBEDFF;
  padding: 20px 42px;
  border-radius: 10px;
}
/*
.ticket-box .ticket-box-btn:hover{
  background-color: #22055F;
  color: #FFFFFF!important;
}*/
.ticket-box p{
  font-size: 14px;
}

.ticket-box .w-btn{
  border-radius: 10px!important;
  font-size: 31px!important;
  color: #FFFFFF!important;
}
.ticket-box .w-btn:hover{
  background-color: #22055F!important;
  color: #FFFFFF!important;
}
.ticket-box .w-btn:hover .w-btn-label{
  color: #FFFFFF!important;
}

@media(max-width: 899px){
  .ticket-boxes {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
  }
  .ticket-boxes .ticket-box:nth-child(1){order: 2;}
  .ticket-boxes .ticket-box:nth-child(2){order: 1;}
  .ticket-boxes .ticket-box:nth-child(3){order: 3;}
}

.utrechtsspektakel-landing  .l-section-h,
.utrechtsspektakel-landing  .l-section-h .g-cols{
  min-height: 100vh;
}
.utrechtsspektakel-landing .col-zomer{

}
.utrechtsspektakel-landing .col-winter{

}