/* Ishiku Lemu · video-popup.css — ventana del video y botón de play con ondas.
   Movido desde módulos Code del Inicio (2026-10-04). */
/*Video Popup*/
body:not(.et-fb) .dl-popup-wrapper {
  position: fixed;
  z-index: 990;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  transition: all 0.5s cubic-bezier(0.14, 0.06, 0.41, 1.39);
  opacity: 0;
  visibility: hidden;
}

body:not(.et-fb) .dl-popup-wrapper.popup-is-visible {
  opacity: 1;
  visibility: visible;
}

.dl-popup-inside {
  height: 100%;
}

body.dl-noscroll {
  overflow: hidden;
}

.dl-popup-section {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.dl-popup-section .et_pb_row {
  margin-top: 0;
  margin-bottom: 0;
}

@media (min-width: 600px) and (max-width: 782px) {
  body:not(.et-fb).admin-bar .dl-popup-wrapper {
    top: 46px;
  }
}

@media (min-width: 783px) {
  body:not(.et-fb).admin-bar .dl-popup-wrapper {
    top: 32px;
  }
}

.et_builder_inner_content.popup-is-visible {
  z-index: 99999;
}

.popup-close {
  cursor: pointer;
}

.dl-popup-wrapper.popup-is-visible .et_pb_row:not(.popup-close) {
  animation: scale-in 0.5s cubic-bezier(0.14, 0.06, 0.41, 1.39) both;
  animation-delay: 0.5s;
}

@keyframes scale-in {
  0% {
    transform: scale(0.3);
    opacity: 0;
  }

  100% {
    transform: scale(1);
    opacity: 1;
  }
}

.popup-close .et_pb_icon_wrap .et-pb-icon {
  background: var(--cc-acento-texto); /* blanco sobre #557320 = 5,7:1 (antes #7fa42f, 2,6:1) */
  color: #fff;
  width: 50px;
  height: 50px;
  line-height: 50px;
  font-size: 32px;
  border-radius: 50%;
}

@media only screen and (max-width: 767px) {
  .popup-close .et_pb_icon_wrap .et-pb-icon {
    width: 35px;
    height: 35px;
    line-height: 35px;
  }
}





 /* Optional Hover Effect for Button */
  .play-button:hover {
    background-color: var(--cc-superficie) !important;
    border-color: var(--cc-acento) !important;
  }
  /* Styling the button */
  .play-button {
    position: relative;
    display: inline-block;
    margin: auto;
    font-size: 26px !important;
    width: 90px;
    height: 90px;
    line-height: 90px;
    text-align: center;
    /* Botón claro del brandbook: crema con ícono #101a10 (contraste alto, paleta cerrada).
       Sin el pulso infinito de antes: el brandbook descarta animaciones llamativas. */
    background-color: #f5f3ea !important;
    color: #101a10 !important;
    border: 1px solid var(--cc-salvia) !important;
    border-radius: 50%;
cursor: pointer;
    transition: background-color 0.3s ease, border-color 0.3s ease;
  }

  /* Ripple Effect */
  @-webkit-keyframes ripple {
    0% {
      box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.2), 
                  0 0 0 5px rgba(255, 255, 255, 0.2), 
                  0 0 0 20px rgba(255, 255, 255, 0.2),
                  0 0 0 35px rgba(255, 255, 255, 0.2);
    }
    100% {
      box-shadow: 0 0 0 5px rgba(255, 255, 255, 0.2), 
                  0 0 0 20px rgba(255, 255, 255, 0.2),
                  0 0 0 35px rgba(255, 255, 255, 0.2),
                  0 0 0 45px rgba(255, 255, 255, 0);
    }
  }

  @keyframes ripple {
    0% {
      box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.2), 
                  0 0 0 5px rgba(255, 255, 255, 0.2), 
                  0 0 0 20px rgba(255, 255, 255, 0.2),
                  0 0 0 35px rgba(255, 255, 255, 0.2);
    }
    100% {
      box-shadow: 0 0 0 5px rgba(255, 255, 255, 0.2), 
                  0 0 0 20px rgba(255, 255, 255, 0.2),
                  0 0 0 35px rgba(255, 255, 255, 0.2),
                  0 0 0 45px rgba(255, 255, 255, 0);
    }
  }

/* Sin pulso infinito para quien pide menos movimiento (WCAG 2.3.3). */
@media (prefers-reduced-motion: reduce) {
  .play-button {
    -webkit-animation: none;
    animation: none;
  }
}

/* Ícono de play (pseudo-elemento de Divi, blanco por defecto) en #101a10 sobre crema. */
.play-button::before,
.play-button::after {
  color: #101a10 !important;
}