/* Botón de Contacto */

.li-contact a {
  background-color: var(--primary-color);
  padding: 0.5rem 2rem !important;
  color: white !important;
  border-radius: 1rem;
}

.li-contact a:hover {
  background-color: var(--secondary-color);
}

/* SVG Botones */
.cta,
.cta-glass {
    display: inline-flex !important;
    align-items: center;
    gap: 1rem;
    white-space: nowrap;
}

.cta::after,
.cta-glass::after {
    content: "\ea1f"; /* tabler: arrow-right */
    font-family: "tabler-icons";
	font-weight: 900;
	

    width: 30px;
    height: 30px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    transition: transform 300ms ease;
}

.cta:hover::after,
.cta-glass:hover::after {
    transform: translateX(4px);
}

/* Hero Bullets & Hero Buttons */
.hero .swiper-pagination {
    text-align: left !important;
    left: 0 !important;
    right: auto !important;
    width: 100% !important;
    margin-left: 0;
    padding-inline: max(4rem, calc((100% - var(--screen, 1400px)) / 2));
    box-sizing: border-box;
    margin-top: -2rem;
}
.hero .swiper-pagination .swiper-pagination-bullet:first-child {
    margin-left: 0 !important;
}
@media (max-width: 767px) {
    .hero .swiper-pagination {
        padding-inline: 1rem;
    }
    .hero:has(.swiper-slide-active > .elementor-element-9d1f2b5) .swiper-pagination {
        padding-inline: 2rem;
    }
}
.hero .swiper-pagination-bullet {
    width: 45px !important;
	border-radius: 0;
	height: 3px !important;
}
.hero .swiper-pagination-bullet-active {
	width: 55px !important;
}
.hero .elementor-button {
  background-color: rgba(30, 30, 30, 0.02) !important;
  backdrop-filter: blur(10px) !important;
}

/* Botón Cart Original */
.moderncart-floating-cart-button {
  display: none !important;
}

.woocommerce-message .button {
	display: none !important;
}

/* ==== CookieBot ==== */
/* Branding on the banner */
a#CybotCookiebotDialogPoweredbyCybot,
div#CybotCookiebotDialogPoweredByText {
  display: none !important;
}

/* Branding on the Privacy trigger */
#CookiebotWidget .CookiebotWidget-body .CookiebotWidget-main-logo {
    display: none !important;
}

/* ===== INICIO ePrilux ===== */

/* ===== Botón .cta estilo ePrilux (como el del hero) Eprilux ===== */
.cta {
  display: inline-flex !important;
  align-items: center;
  gap: 10px;
  position: relative;
  overflow: hidden;
  isolation: isolate;                 /* clave para que el texto quede por encima del relleno */
  background: #ffffff !important;
  color: #06163d !important;
  font-family: "Montserrat", sans-serif !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  letter-spacing: 0.1em;
  text-transform: uppercase;
 padding: 15px 30px !important;
  border: 0 !important;
  border-left: 3px solid #FDCF63 !important;
  border-radius: 2px !important;
  box-shadow: 0 4px 20px rgba(0,0,0,0.25);
  cursor: pointer;
  transition: color .35s, box-shadow .35s;
}

/* relleno navy que entra al pasar el ratón */
.cta::before {
  content: "";
  position: absolute;
  inset: 0;
  background: #06163d;
  transform: translateX(-102%);
  transition: transform .35s cubic-bezier(.4,0,.2,1);
  z-index: -1;
}
.cta:hover::before { transform: translateX(0); }
.cta:hover {
  color: #ffffff !important;
  box-shadow: 0 6px 28px rgba(0,0,0,.35);
}

.cta::after {
  content: "";
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: #FDCF63 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2306163d' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'/%3E%3Cpolyline points='12 5 19 12 12 19'/%3E%3C/svg%3E") no-repeat center / 13px;
  transition: transform .25s;
}
.cta:hover::after { transform: translateX(3px); }
.slide-cta-ghost {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: transparent;
    color: rgba(255, 255, 255, 0.9);
    font-family: var(--f);
    font-size: 11.5px;
    font-weight: 600;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    padding: 15px 24px;
    border-radius: var(--r);
    border: 1.5px solid rgba(255, 255, 255, 0.4);
    transition: background 0.25s, border-color 0.25s;
    backdrop-filter: blur(4px);
}

.cta-alt {
  display: inline-flex !important;
  align-items: center;
  gap: 8px;
  background: transparent !important;
  color: rgba(255,255,255,0.9) !important;
  font-family: "Montserrat", sans-serif !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  border: 1.5px solid rgba(255,255,255,0.4) !important;
  border-radius: 2px !important;
  backdrop-filter: blur(4px);
  transition: background .3s ease, border-color .3s ease, color .3s ease;
  cursor: pointer;
}
.cta-alt:hover {
  background: rgba(255,255,255,0.12) !important;
  border-color: rgba(255,255,255,0.75) !important;
  color: #ffffff !important;
}

/* ===== FIN Botón .cta estilo ePrilux (como el del hero) Eprilux ===== */




/* Rótulo .tag-line y títulos .hero-h1 / .hero-h2: desde el 26/10/2026 son clases globales de Elementor con sus
   propiedades (scripts/institucionales-a-propiedades.php). */

.elementor .elementor-counter-number-wrapper .elementor-counter-number-prefix {
  color: #06163d !important;
  font-weight: 300 !important;
  font-size: 0.75em;
}

 

/* ===== FIN Eprilux ===== */


/* MAIN MENU - RESPONSIVE */
/*
 * Menú Elementor siempre horizontal y desplazable con el dedo.
 */
.main-menu {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}

/* Los envoltorios de Elementor no deben limitar el ancho del menú */
.main-menu .elementor-widget-container {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}

/* Este es el contenedor que realiza el desplazamiento */
.main-menu .elementor-nav-menu--main,
.main-menu .elementor-nav-menu__container {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;

  overflow-x: auto !important;
  overflow-y: hidden !important;

  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain;
}

/* Ocultar la barra de desplazamiento */
.main-menu .elementor-nav-menu--main::-webkit-scrollbar {
  display: none;
}

/* El UL real debe ocupar todo el ancho necesario */
.main-menu ul.elementor-nav-menu {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  justify-content: flex-start !important;
  align-items: center !important;

  width: max-content !important;
  min-width: max-content !important;

  margin: 0 !important;
  padding: 0 !important;
  white-space: nowrap !important;
}

/* Cada opción conserva su ancho y nunca baja de línea */
.main-menu ul.elementor-nav-menu > li {
  display: block !important;
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: max-content !important;
}

/* Texto de cada enlace en una sola línea */
.main-menu ul.elementor-nav-menu > li > a {
  display: flex !important;
  width: auto !important;
  min-width: max-content !important;
  white-space: nowrap !important;
}

/*
 * Respaldo por si main-menu está asignada directamente al UL.
 */
ul.main-menu {
  display: flex !important;
  flex-flow: row nowrap !important;
  justify-content: flex-start !important;

  width: 100% !important;
  max-width: 100% !important;

  overflow-x: auto !important;
  overflow-y: hidden !important;

  white-space: nowrap !important;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}

ul.main-menu::-webkit-scrollbar {
  display: none;
}

ul.main-menu > li {
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: max-content !important;
}

/* Oculta el segundo menú responsive generado por Elementor */
.main-menu .elementor-nav-menu--dropdown,
.main-menu .elementor-menu-toggle {
  display: none !important;
}

.responsive-container {
    --width: 100%;

    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;

    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;

    overflow-x: auto !important;
    overflow-y: hidden !important;

    contain: inline-size;
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}

.responsive-container::-webkit-scrollbar {
    display: none;
}

/* Contenedor intermedio generado por Elementor */
.responsive-container > .e-con-inner {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    justify-content: flex-start !important;

    width: auto !important;
    max-width: none !important;
    min-width: 100% !important;

    gap: 16px;
}

/* Los elementos mantienen su tamaño y generan el scroll interno */
.responsive-container > *:not(.e-con-inner),
.responsive-container > .e-con-inner > * {
    flex: 0 0 auto !important;
    min-width: max-content;
}


	
selector .epx-sum{list-style:none;margin:0;padding:0;max-width:460px;border-top:1px solid #E9E4DB;font-family:'Montserrat',sans-serif}
selector .epx-sum li{display:flex;align-items:baseline;gap:14px;padding:14px 0;border-bottom:1px solid #E9E4DB}
selector .epx-sum em{font-style:normal;font-size:11.5px;font-weight:700;color:#B8862F;width:20px;flex-shrink:0}
selector .epx-sum strong{font-size:14.5px;font-weight:600;color:#06163D;flex:1}
selector .epx-sum span{font-size:12.5px;color:#9A9287;white-space:nowrap}



.badge-nuevo, .onsale { background:#16244A !important; color:#E9B44C !important; border-radius:0; }
/* ===== Slider Categorías (widget 240ba25 / loop 658) ===== */

/* --- Flechas: pequeñas, grises, arriba a la derecha --- */
.elementor-element-240ba25 .elementor-swiper-button-prev,
.elementor-element-240ba25 .elementor-swiper-button-next{
    width:34px !important; height:34px !important;
    background:#fff !important;
    border:1px solid #e6e9ef !important;
    border-radius:0 !important;
    color:#9aa3b2 !important;
    top:-54px !important; bottom:auto !important;
    transform:none !important; margin:0 !important;
    display:flex; align-items:center; justify-content:center;
    transition:all .2s ease; z-index:5;
}
.elementor-element-240ba25 .elementor-swiper-button-prev{ left:auto !important; right:44px !important; }
.elementor-element-240ba25 .elementor-swiper-button-next{ right:6px !important; left:auto !important; }
.elementor-element-240ba25 .elementor-swiper-button-prev:hover,
.elementor-element-240ba25 .elementor-swiper-button-next:hover{
    background:#06163d !important; color:#fff !important; border-color:#06163d !important;
}
.elementor-element-240ba25 .elementor-swiper-button svg{ width:11px; height:11px; fill:currentColor; }

/* --- Rayitas (dashes) --- */
.elementor-element-240ba25 .swiper-pagination-bullet{
    width:26px !important; height:3px !important;
    border-radius:0 !important;
    background:#d4d8de !important; opacity:1 !important;
    margin:0 5px !important;
    transition:background .25s ease, width .25s ease;
}
.elementor-element-240ba25 .swiper-pagination-bullet-active{
    background:#06163d !important; width:40px !important;
}

/* --- Hueco para las flechas: "Ver todas" a la izquierda --- */
.elementor-element-63a50cb{ margin-right:110px !important; }

/* --- Card: recorte del zoom (sin borde) --- */
.elementor-658 a.e-con{ overflow:hidden; }

/* --- Sombra delicada en el contenedor exterior --- */
.elementor-658 .e-loop-item{ transition:box-shadow .25s ease; }
.elementor-658 .e-loop-item:hover{ box-shadow:0 14px 30px -20px rgba(6,22,61,.5); }

/* --- Zoom lento de la imagen --- */
.elementor-658 img.img-product{ display:block; transition:transform .6s ease; }
.elementor-658 .e-loop-item:hover img.img-product{ transform:scale(1.05); }

/* --- Responsive: en móvil/tablet ocultar flechas y quitar el margen --- */
@media(max-width:1024px){
    .elementor-element-63a50cb{ margin-right:0 !important; }
    .elementor-element-240ba25 .elementor-swiper-button-prev,
    .elementor-element-240ba25 .elementor-swiper-button-next{ display:none !important; }
}

/* --- Card categorías: recorte del zoom --- */
.elementor-element-240ba25 a.e-con{ overflow:hidden; }

/* --- Sombra delicada + zoom (CORREGIDO) --- */
.elementor-element-240ba25 .e-loop-item{ transition:box-shadow .25s ease; }
.elementor-element-240ba25 .e-loop-item:hover{ box-shadow:0 14px 30px -20px rgba(6,22,61,.5); }
.elementor-element-240ba25 img.img-product{ display:block; transition:transform .6s ease; }
.elementor-element-240ba25 .e-loop-item:hover img.img-product{ transform:scale(1.05); }

/* ===== Sliders de PRODUCTO (clase .prod-carousel) ===== */

/* ===== Rayitas en TODOS los loop carousels (sin añadir clases) ===== */
.elementor-widget-loop-carousel .swiper-pagination-bullet{
    width:26px !important; height:3px !important;
    border-radius:0 !important;
    background:#d4d8de !important; opacity:1 !important;
    margin:0 5px !important;
    transition:background .25s ease, width .25s ease;
}
.elementor-widget-loop-carousel .swiper-pagination-bullet-active{
    background:#06163d !important; width:40px !important;
}

/* ===== Hover cards de PRODUCTO (loop 532) — sin clases extra ===== */
.elementor-532 a.e-image-link-base{ overflow:hidden; display:block; }
.elementor-532 img.img-product{ display:block; transition:transform .6s ease; }
.elementor-532{ transition:box-shadow .25s ease; }
.elementor-532:hover{ box-shadow:0 16px 34px -22px rgba(6,22,61,.55); }
.elementor-532:hover img.img-product{ transform:scale(1.05); }
 

/* ============================================================
   ePrilux — Estilos páginas legales (menú lateral + artículo)
   Pegar UNA sola vez en: Elementor > Ajustes del sitio > CSS personalizado
   ============================================================ */
 

.epx-legal{
  --navy:#06163d;--blue:#23a7d6;--honey-cta:#FDCF63;--light:#f7f7f5;
  --border:#e4e6e9;--muted:#8a909e;--f:'Montserrat',sans-serif;--r:2px;
  font-family:var(--f);color:var(--navy);line-height:1.6;font-size:14px;
  max-width:var(--screen, 1400px);margin:0 auto;-webkit-font-smoothing:antialiased;
}
.epx-legal *,.epx-legal *::before,.epx-legal *::after{box-sizing:border-box}
.epx-legal a{color:inherit;text-decoration:none}
.epx-legal ul{list-style:none;margin:0;padding:0}
.epx-legal .grid{display:grid;grid-template-columns:264px 1fr;gap:52px;align-items:start}

/* --- menú lateral (diseño original) --- */
.epx-legal .toc{position:sticky;top:96px}
.epx-legal .toc .eyebrow{font-size:10.5px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--honey-cta);display:block;margin-bottom:16px}
.epx-legal .toc .eyebrow:before{display:none}
.epx-legal .toc ul{border-left:2px solid var(--border)}
.epx-legal .toc .toc-grp{font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);padding:16px 16px 6px;margin-left:-2px}
.epx-legal .toc li:first-child.toc-grp{padding-top:2px}
.epx-legal .toc li a{display:block;padding:9px 16px;font-size:13px;font-weight:500;color:#46505f;border-left:2px solid transparent;margin-left:-2px;transition:all .15s;line-height:1.35}
.epx-legal .toc li a:hover{color:var(--blue);border-left-color:var(--blue)}
.epx-legal .toc li a.active{color:var(--navy);font-weight:700;border-left-color:var(--honey-cta);background:var(--light)}
.epx-legal .toc .help{margin-top:24px;padding:16px;background:var(--light);border:1px solid var(--border);border-radius:var(--r)}
.epx-legal .toc .help h4{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin-bottom:8px}
.epx-legal .toc .help p{font-size:12px;color:#46505f;line-height:1.55;margin:0 0 4px}
.epx-legal .toc .help a{color:var(--blue);font-weight:600}

/* --- artículo --- */
.epx-legal article{max-width:820px}
.epx-legal article .eyebrow{display:none}
.epx-legal h1{font-weight:300;font-size:clamp(2rem,4vw,2.9rem);line-height:1.1;letter-spacing:-.8px;margin:16px 0 10px;color:var(--navy)}
.epx-legal h1 b{font-weight:700}
.epx-legal .updated{font-size:12.5px;color:var(--muted);font-weight:500;margin-bottom:14px}
.epx-legal .intro{font-size:16px;color:#46505f;line-height:1.75;margin-bottom:8px}
.epx-legal h2{font-weight:700;font-size:1.35rem;letter-spacing:-.3px;color:var(--navy);margin:38px 0 12px;padding-top:8px}
.epx-legal h3{font-weight:700;font-size:1.02rem;color:var(--navy);margin:24px 0 8px}
.epx-legal p{font-size:14.5px;color:#46505f;line-height:1.75;margin:0 0 14px}
.epx-legal p b,.epx-legal li b{color:var(--navy);font-weight:600}
.epx-legal a.inline{color:var(--blue);font-weight:600}
.epx-legal a.inline:hover{text-decoration:underline}
.epx-legal ul.bul{margin:0 0 16px;padding-left:0}
.epx-legal ul.bul li{position:relative;padding-left:22px;font-size:14.5px;color:#46505f;line-height:1.7;margin-bottom:9px}
.epx-legal ul.bul li:before{content:"";position:absolute;left:2px;top:9px;width:7px;height:7px;background:var(--blue);border-radius:var(--r)}
.epx-legal .data{border:1px solid var(--border);border-radius:var(--r);overflow:hidden;margin:6px 0 20px}
.epx-legal .data div{display:grid;grid-template-columns:210px 1fr;border-top:1px solid var(--border)}
.epx-legal .data div:first-child{border-top:0}
.epx-legal .data dt{background:var(--light);padding:12px 16px;font-weight:600;color:var(--navy);font-size:13.5px}
.epx-legal .data dd{padding:12px 16px;font-size:13.5px;color:#46505f}
.epx-legal .callout{border:1px solid var(--border);border-left:3px solid var(--blue);background:var(--light);border-radius:var(--r);padding:16px 18px;margin:6px 0 20px}
.epx-legal .callout p{margin:0;font-size:13.5px}
.epx-legal .callout.warn{border-left-color:var(--honey-cta)}
.epx-legal table.tbl{width:100%;border-collapse:collapse;margin:6px 0 22px;font-size:13px;border:1px solid var(--border);border-radius:var(--r);overflow:hidden}
.epx-legal table.tbl th{background:var(--navy);color:#fff;text-align:left;padding:11px 14px;font-weight:600;font-size:12px;letter-spacing:.02em}
.epx-legal table.tbl td{padding:10px 14px;border-top:1px solid var(--border);color:#46505f;vertical-align:top}
.epx-legal table.tbl tr:nth-child(even) td{background:var(--light)}
.epx-legal .send-box{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:14px 0 6px}
.epx-legal .send-block{border:1px solid var(--border);border-radius:var(--r);padding:16px 18px;background:var(--light)}
.epx-legal .send-block h4{font-size:12.5px;font-weight:700;color:var(--navy);display:flex;align-items:center;gap:8px;margin:0 0 6px}
.epx-legal .send-block h4 i{color:var(--blue)}
.epx-legal .send-block p{font-size:12.5px;color:#46505f;line-height:1.55;margin:0}
.epx-legal .send-block a{color:var(--blue);font-weight:600}
.epx-legal .btn-legal{display:inline-flex;align-items:center;gap:10px;background:var(--honey-cta);color:var(--navy);font-family:var(--f);font-size:12.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;padding:15px 28px;border:none;border-radius:var(--r);cursor:pointer;transition:background .2s;text-decoration:none}
.epx-legal .btn-legal:hover{background:#cf9818}
.epx-legal .btn-legal i{font-size:17px}
.epx-legal .cta-block{margin:6px 0 18px}
.epx-legal .toc .toc-grp{color:#23a7d6}
@media(max-width:860px){
  .epx-legal .grid{grid-template-columns:1fr;gap:24px}
  .epx-legal .toc{position:static}
  /* 3/11/2026 (revisión de Karen: «en el móvil se ve fatal el menú»): antes eran 14 etiquetas con borde que ocupaban
     830 px al final de la página. Ahora un botón «Información legal» plegado (lo pone 9206) que abre la lista, una
     página por línea, con el grupo encima y la actual marcada. */
  .epx-legal .toc{margin-top:8px;border-top:1px solid var(--border)}
  .epx-legal .toc.con-boton .eyebrow{display:none}
  .epx-legal .toc .toc-abrir{display:flex;align-items:center;justify-content:space-between;width:100%;padding:16px 0;border:0;border-bottom:1px solid var(--border);border-radius:0;background:none;color:var(--navy);font:600 13px/1.4 var(--f);letter-spacing:.02em;cursor:pointer}
  .epx-legal .toc .toc-abrir::after{content:"";width:8px;height:8px;margin-right:4px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-3px);transition:transform .2s}
  .epx-legal .toc.is-abierto .toc-abrir::after{transform:rotate(-135deg) translateY(-2px)}
  .epx-legal .toc.con-boton:not(.is-abierto) ul,.epx-legal .toc.con-boton:not(.is-abierto) .help{display:none}
  .epx-legal .toc ul{display:block;border-left:0;padding-top:4px}
  .epx-legal .toc .toc-grp{padding:14px 0 4px;margin:0;font-size:10px}
  .epx-legal .toc li a{padding:10px 0;margin:0;border:0;border-bottom:1px solid var(--border);font-size:13px;font-weight:400;line-height:1.35}
  .epx-legal .toc li a:hover{border-left:0}
  .epx-legal .toc li a.active{background:none;border-bottom-color:var(--honey-cta);font-weight:600}
  .epx-legal .toc .help{margin-top:20px}
}
@media(min-width:861px){.epx-legal .toc .toc-abrir{display:none}}
@media(max-width:640px){
  .epx-legal .data div{grid-template-columns:1fr}
  .epx-legal .data dt{border-bottom:1px solid var(--border)}
  .epx-legal .send-box{grid-template-columns:1fr}
}



/* ==========================================================================
   ePrilux · Bloque "Capas de luz"  —  estilos
   ========================================================================== */

.epx-capas{--navy:#06163D;--blue:#1E88C7;--gold:#B8862F;--honey:#FDCF63;--bone:#FAF8F4;--line:#E9E4DB;--mute:#9A9287;
  font-family:'Montserrat',system-ui,sans-serif;color:var(--navy);padding:88px 0} /* sin relleno lateral: ya va dentro del contenedor de 1.400, al ancho de los productos (28/10) */
.epx-capas *{box-sizing:border-box}
.epx-capas__in{max-width:calc(var(--screen, 1400px) + 40px);margin:0 auto}
.epx-capas__hd{max-width:640px;margin-bottom:38px}
.epx-capas__ey{font-size:10.5px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--gold)}
.epx-capas h2{font-size:34px;font-weight:300;letter-spacing:-.02em;margin:14px 0 12px;line-height:1.15;text-wrap:pretty}
.epx-capas h2 strong{font-weight:700}
.epx-capas__lead{font-size:15px;line-height:1.8;color:#5F6470;margin:0}

.epx-capas__box{display:grid;grid-template-columns:1.35fr 1fr;border:1px solid var(--line)}
.epx-capas__fig{position:relative;min-height:480px;overflow:hidden}
.epx-capas__fig img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.epx-capas__fig::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(5,15,42,.12) 0%,rgba(5,15,42,.42) 100%)}

.epx-dot{position:absolute;z-index:2;width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-family:inherit;font-size:15px;font-weight:700;cursor:pointer;transition:all .2s;transform:translate(-50%,-50%);
  background:rgba(255,255,255,.92);color:var(--navy);border:2px solid rgba(255,255,255,.6);box-shadow:0 4px 14px rgba(5,15,42,.35)}
.epx-dot:hover{transform:translate(-50%,-50%) scale(1.08)}
.epx-dot[aria-pressed="true"]{width:44px;height:44px;background:var(--honey);border-color:#fff;box-shadow:0 0 0 8px rgba(253,207,99,.28)}

.epx-panel{background:var(--bone);padding:42px 40px;display:flex;flex-direction:column}
.epx-panel__num{display:flex;align-items:center;justify-content:center;width:46px;height:46px;background:var(--navy);color:var(--honey);font-size:19px;font-weight:700}
.epx-panel h3{font-size:26px;font-weight:700;letter-spacing:-.015em;margin:22px 0 10px;line-height:1.2}
.epx-panel p{font-size:14.5px;line-height:1.8;color:#5F6470;margin:0 0 24px}
.epx-panel__kpi{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);margin-bottom:26px}
.epx-panel__kpi div{background:#fff;padding:16px 18px}
.epx-panel__kpi span{display:block;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--mute)}
.epx-panel__kpi b{display:block;font-size:14px;font-weight:700;margin-top:6px}
.epx-panel__cta{display:inline-flex;align-items:center;gap:9px;background:var(--blue);color:#fff;font-size:13.5px;font-weight:700;padding:16px 26px;width:fit-content;margin-top:auto;text-decoration:none}
.epx-panel__cta:hover{background:#166FA5;color:#fff}

/* Modo edición (?epxpos=1) */
.epx-capas.is-editing .epx-dot{cursor:grab;outline:2px dashed var(--blue);touch-action:none}
.epx-capas.is-editing .epx-dot:active{cursor:grabbing}
.epx-pos-readout{position:fixed;left:16px;bottom:16px;z-index:99999;background:#06163D;color:#fff;
  font:13px/1.7 ui-monospace,SFMono-Regular,Menlo,monospace;padding:14px 16px;border-radius:10px;
  box-shadow:0 10px 30px rgba(0,0,0,.35);max-width:320px}
.epx-pos-readout b{color:#FDCF63}
.epx-pos-readout button{margin-top:10px;background:#1E88C7;color:#fff;border:0;border-radius:6px;
  padding:8px 14px;font:inherit;font-weight:700;cursor:pointer}

/* Responsive */
@media(max-width:1024px){.epx-capas__box{grid-template-columns:1fr}.epx-capas__fig{min-height:360px}}
@media(max-width:767px){
  .epx-capas{padding:52px 0}
  .epx-capas h2{font-size:26px}
  .epx-capas__fig{min-height:280px}
  .epx-dot{width:32px;height:32px;font-size:13px}
  .epx-dot[aria-pressed="true"]{width:38px;height:38px;box-shadow:0 0 0 6px rgba(253,207,99,.28)}
  .epx-panel{padding:28px 22px}
  .epx-panel h3{font-size:21px}
}