/* Parche seguro para que el acordeón no genere scroll lateral */
html, body { overflow-x: hidden; }

.elementor-widget-accordion .elementor-tab-content,
.elementor-widget-toggle .elementor-tab-content {
  overflow-x: hidden;
}

.elementor-widget-accordion .elementor-tab-content * {
  max-width: 100% !important;
  box-sizing: border-box;
}

.elementor-widget-accordion .elementor-tab-content img,
.elementor-widget-accordion .elementor-tab-content iframe,
.elementor-widget-accordion .elementor-tab-content table {
  width: 100% !important;
  height: auto;
  display: block;
}

.elementor-widget-accordion .elementor-tab-content p,
.elementor-widget-accordion .elementor-tab-content a,
.elementor-widget-accordion .elementor-tab-content span,
.elementor-widget-accordion .elementor-tab-content li {
  word-break: break-word;
  overflow-wrap: anywhere;
}

/* Si algún bloque usa 100vw dentro del acordeón, forzalo a 100% */
.elementor-widget-accordion .elementor-tab-content [style*="100vw"] {
  width: 100% !important;
}

:root { --acc-close-strip: 28px; }  /* alto de la franja invisible para cerrar */

/* El item necesita contexto para posicionar el título fuera del flujo */
#acc-disclaimer .elementor-accordion .elementor-accordion-item{
  position: relative;
}

/* Ocultar visualmente el título cuando el item está ABIERTO.
   Lo sacamos del flujo (absolute), lo hacemos invisible pero clickeable. */
#acc-disclaimer .elementor-accordion .elementor-tab-title.elementor-active,
#acc-disclaimer .elementor-accordion .elementor-accordion-item.elementor-active > .elementor-tab-title{
  position: absolute !important;
  top: 0; left: 0; right: 0;
  height: var(--acc-close-strip);
  opacity: 0;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  z-index: 2;
  pointer-events: auto; /* permite tocar esa franja para cerrar */
}

/* Que el contenido no quede “cortado”: sin desplazamientos extra */
#acc-disclaimer .elementor-accordion .elementor-accordion-item.elementor-active > .elementor-tab-content{
  margin-top: 0 !important;
  padding-top: 0.25rem; /* pequeño respiro opcional */
  border-top: 0 !important;
}

/* Por si el título tiene icono que aún empuja */
#acc-disclaimer .elementor-accordion .elementor-tab-title.elementor-active .elementor-accordion-icon{
  display: none !important;
}

/* (Opcional) en móvil hacer la franja un poco menor */
@media (max-width: 767px){
  :root { --acc-close-strip: 22px; }
}
/* Carruseles con imágenes horizontales proporcionales */
.elementor-image-carousel img {
  width: 100%;
  height: auto;            /* deja que la imagen defina su alto */
  aspect-ratio: 4 / 3;     /* relación horizontal */
  object-fit: cover;
  border-radius: 6px;
  transition: transform 0.3s ease;
}

/* Hover sutil */
@media (hover:hover) {
  .elementor-image-carousel img:hover {
    transform: scale(1.03);
  }
}

/* Mobile: mantiene proporción pero reduce tamaño */
@media (max-width: 767px) {
  .elementor-image-carousel img {
    aspect-ratio: 3 / 2;
  }
}
/* ===== POPUP TDL: estilo limpio y sin afectar el sitio ===== */
.wpdevart-popup-box .wpdevart-popup-box-content{
  box-sizing:border-box;
  max-width: 800px !important;
  padding:0 !important;          /* padding lo maneja .tdl-text */
  background:#fff !important;
  border-radius:16px !important;
  box-shadow:0 12px 40px rgba(0,0,0,.25) !important;
  overflow:hidden;
  font-family: Helvetica, Arial, sans-serif;
  color:#222;
}

/* Botón cerrar */
.wpdevart-popup-box .wpdevart-popup-box-close{
  background:transparent !important;
  color:#000 !important;
  font-size:20px !important;
  right:16px !important; top:12px !important;
}

/* Layout del contenido del popup */
.tdl-popup{ display:block; }
@media (min-width:768px){
  .tdl-popup{ display:grid; grid-template-columns:320px 1fr; align-items:start; }
}

/* Foto (se oculta en mobile) */
.tdl-photo{ display:none; }
@media (min-width:768px){
  .tdl-photo{ display:block; }
  .tdl-photo img{ width:100%; height:auto; aspect-ratio:3/4; object-fit:cover; }
}

/* Texto */
.tdl-text{ padding:32px; }
.tdl-name{ font-weight:700; font-size:30px; line-height:1.2; margin:0 0 6px; }
.tdl-role{ font-weight:600; font-size:14px; color:#7a7a7a; margin:0 0 18px; }
.tdl-bio{ font-size:16px; line-height:1.7; }
.tdl-bio p{ margin:0 0 14px; }

/* Mobile */
@media (max-width:767px){
  .tdl-name{ font-size:22px; }
  .tdl-text{ padding:24px 20px; }
}
/* ============================================
   POPUPS – ESTILO GLOBAL (Popup Maker)
   ============================================ */

/* --- CONTENEDOR PRINCIPAL --- */
.pum-overlay .pum-container {
    max-width: 720px !important;   /* ancho elegante desktop */
    width: 90% !important;         /* responsive */
    padding: 24px 28px !important;
    box-sizing: border-box;
    font-family: inherit !important;   /* usa la tipografía del sitio */
}

/* --- CONTENIDO INTERNO EN UNA COLUMNA --- */
.pum-overlay .pum-container .pum-content {
    max-width: 640px;
    margin: 0 auto;
}

/* --- TITULOS --- */
.pum-overlay .pum-container h1,
.pum-overlay .pum-container h2,
.pum-overlay .pum-title {
    text-align: left;
    text-transform: uppercase;
    line-height: 1.2;
    margin: 0 0 0.75em;
    font-family: inherit !important;
}

/* --- PÁRRAFOS (DESKTOP) --- */
.pum-overlay .pum-container p {
    text-align: left !important;
    text-indent: 0;
    line-height: 1.5 !important;   /* interlineado limpio */
    margin: 0 0 0.9em;
    font-size: 16px;               /* desktop size */
    font-family: inherit !important;
}

/* --- IMÁGENES --- */
.pum-overlay .pum-container .pum-content img {
    display: block;
    width: 100% !important;        /* mismo ancho que el texto */
    height: auto !important;
    margin: 16px 0;
}

/* ============================================
   TABLET — 768px a 1024px
   ============================================ */
@media (min-width: 768px) and (max-width: 1024px) {

    .pum-overlay .pum-container {
        padding: 20px !important;
    }

    .pum-overlay .pum-container p {
        font-size: 14px !important;
        line-height: 1.45 !important;
    }
}

/* ============================================
   MOBILE — hasta 767px
   ============================================ */
@media (max-width: 767px) {

    .pum-overlay .pum-container {
        padding: 16px !important;
    }

    .pum-overlay .pum-container .pum-content {
        max-width: 100%;
    }

    .pum-overlay .pum-container p {
        font-size: 11px !important;    /* como pediste */
        line-height: 1.4 !important;   /* más compacto */
    }

    .pum-overlay .pum-container h1,
    .pum-overlay .pum-container h2,
    .pum-overlay .pum-title {
        font-size: 18px !important;
        line-height: 1.2;
    }
}
/* ===== IMAGEN FULL WIDTH (sin márgenes) ===== */

/* Quitar el max-width interno SOLO para imágenes */
.pum-overlay .pum-container .pum-content img {
    width: calc(100% + 56px) !important; /* expande más allá del padding */
    margin-left: -28px !important;       /* compensa padding del contenedor */
    margin-right: -28px !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    border-radius: 0 !important;         /* sin bordes redondeados */
}

/* Ajuste para tablet */
@media (min-width: 768px) and (max-width: 1024px) {
    .pum-overlay .pum-container .pum-content img {
        width: calc(100% + 40px) !important;
        margin-left: -20px !important;
        margin-right: -20px !important;
    }
}

/* Ajuste para mobile */
@media (max-width: 767px) {
    .pum-overlay .pum-container .pum-content img {
        width: calc(100% + 32px) !important;
        margin-left: -16px !important;
        margin-right: -16px !important;
    }
}
