/* ==========================================================================
   AVL Editorial Duo — LOCKED (v9)
   - Evita que otros CSS sobreescriban variables (usa !important en custom props)
   - Fondo negro fijo (solo se revela contenido)
   - CTA se mueve por variables (aunque el reveal meta inline "transform:none")
   - Mobile: título dorado + más grande, layout estable
   ========================================================================== */

section.home-editorial-duo {
  background: #000 !important;
  position: relative !important;
  overflow: hidden !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

section.home-editorial-duo::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background: var(--avl-bg, #000) !important;
  opacity: 1 !important;
  transform: none !important;
  pointer-events: none !important;
  z-index: 0 !important;
}

/* --- Grid base (desktop & mobile) --- */
section.home-editorial-duo .home-editorial-duo__grid {
  position: relative !important;
  z-index: 1 !important;
}

section.home-editorial-duo .home-editorial-duo__media {
  position: relative !important;
}

section.home-editorial-duo .home-editorial-duo__collage {
  position: relative !important;
  width: var(--avl-cw, 760px) !important;
  height: var(--avl-ch, 782px) !important;
  max-width: 100% !important;
}

section.home-editorial-duo .home-editorial-duo__imgwrap {
  position: absolute !important;
  overflow: hidden !important;
  background: transparent !important;
}

section.home-editorial-duo .home-editorial-duo__img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  display: block !important;
}

/* Desktop positioning via vars */
@media (min-width: 992px) {
  section.home-editorial-duo {
    padding-top: max(0px, var(--avl-pad-y, 34px)) !important;
    padding-bottom: max(0px, var(--avl-pad-y, 34px)) !important;
  }

  section.home-editorial-duo .home-editorial-duo__grid {
    display: grid !important;
    grid-template-columns: 1.35fr .65fr !important;
    align-items: start !important;
    gap: 22px !important;
  }

  section.home-editorial-duo .home-editorial-duo__content {
    position: absolute !important;
    inset: 0 !important;
    z-index: 80 !important;
    pointer-events: none !important;
  }

  section.home-editorial-duo .home-editorial-duo__title {
    color: var(--avl-title-color, #efbf13) !important;
    font-weight: 900 !important;
    letter-spacing: var(--avl-title-ls, .08em) !important;
    text-transform: uppercase !important;
    font-size: var(--avl-title-size, clamp(40px, 5.2vw, 92px)) !important;
    line-height: .92 !important;
    white-space: nowrap !important;
    max-width: none !important;
    display: inline-block !important;
    transform: translate(var(--avl-title-x, 0px), var(--avl-title-y, 0px)) !important;
  }

  section.home-editorial-duo .home-editorial-duo__text {
    max-width: var(--avl-text-maxw, 420px) !important;
    transform: translate(var(--avl-text-x, 0px), var(--avl-text-y, 0px)) !important;
  }

  section.home-editorial-duo .home-editorial-duo__cta {
    transform: translate(var(--avl-cta-x, 0px), var(--avl-cta-y, 0px)) !important;
    color: #fff !important;
    text-decoration: none !important;
    border-bottom: 1px solid rgba(255,255,255,.55) !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
    pointer-events: auto !important;
    z-index: 90 !important;
    position: relative !important;
  }

  section.home-editorial-duo .home-editorial-duo__imgwrap--primary {
    left: var(--avl-i1-x, 0px) !important;
    top: var(--avl-i1-y, 0px) !important;
    width: var(--avl-i1-w, 60%) !important;
    height: var(--avl-i1-h, 50%) !important;
    z-index: var(--avl-i1-z, 1) !important;
  }
  section.home-editorial-duo .home-editorial-duo__imgwrap--secondary {
    left: var(--avl-i2-x, 60%) !important;
    top: var(--avl-i2-y, 0px) !important;
    width: var(--avl-i2-w, 40%) !important;
    height: var(--avl-i2-h, 50%) !important;
    z-index: var(--avl-i2-z, 2) !important;
  }
  section.home-editorial-duo .home-editorial-duo__imgwrap--tertiary {
    left: var(--avl-i3-x, 60%) !important;
    top: var(--avl-i3-y, 50%) !important;
    width: var(--avl-i3-w, 40%) !important;
    height: var(--avl-i3-h, 50%) !important;
    z-index: var(--avl-i3-z, 3) !important;
  }
}

/* Mobile layout (stack) */
@media (max-width: 991px) {
  section.home-editorial-duo {
    padding-top: 24px !important;
    padding-bottom: 24px !important;
  }

  section.home-editorial-duo .home-editorial-duo__grid {
    display: block !important;
  }

  /* collage */
  section.home-editorial-duo .home-editorial-duo__collage {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 1 / 0.78 !important;
  }

  section.home-editorial-duo .home-editorial-duo__imgwrap {
    position: absolute !important;
    inset: auto !important;
  }

  /* 2-up top row */
  section.home-editorial-duo .home-editorial-duo__imgwrap--primary {
    left: 0 !important;
    top: 0 !important;
    width: 50% !important;
    height: 100% !important;
    transform: translate(var(--avl-m-i1-x, 0px), var(--avl-m-i1-y, 0px)) !important;
  }
  section.home-editorial-duo .home-editorial-duo__imgwrap--secondary {
    left: 50% !important;
    top: 0 !important;
    width: 50% !important;
    height: 100% !important;
    transform: translate(var(--avl-m-i2-x, 0px), var(--avl-m-i2-y, 0px)) !important;
  }

  /* tertiary optional (para test) */
  section.home-editorial-duo .home-editorial-duo__imgwrap--tertiary {
    display: var(--avl-m-i3-display, none) !important;
    left: 0 !important;
    top: 0 !important;
    width: 100% !important;
    height: 100% !important;
    transform: translate(var(--avl-m-i3-x, 0px), var(--avl-m-i3-y, 0px)) !important;
  }

  section.home-editorial-duo .home-editorial-duo__content {
    margin-top: var(--avl-m-content-mt, 0px) !important;
    margin-bottom: var(--avl-m-content-mb, 0px) !important;
  }

  section.home-editorial-duo .home-editorial-duo__title {
    color: var(--avl-m-title-color, #efbf13) !important;
    font-size: var(--avl-m-title-size, clamp(30px, 8.2vw, 44px)) !important;
    letter-spacing: var(--avl-m-title-ls, -0.03em) !important;
    transform: translate(var(--avl-m-title-x, 0px), var(--avl-m-title-y, 0px)) !important;
    white-space: normal !important;
    max-width: 92vw !important;
    line-height: .94 !important;
  }

  section.home-editorial-duo .home-editorial-duo__text {
    transform: translate(var(--avl-m-text-x, 0px), var(--avl-m-text-y, 0px)) !important;
  }

  section.home-editorial-duo .home-editorial-duo__cta {
    transform: translate(var(--avl-m-cta-x, 0px), var(--avl-m-cta-y, 0px)) !important;
    color: #fff !important;
    border-bottom: 1px solid rgba(255,255,255,.55) !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
  }
}

/* =======================
   LOCK: variables per store
   (si algo cambia en otro CSS, esto prevalece)
   ======================= */

@media (min-width: 992px) {
  section.home-editorial-duo[data-store="home-editorial-duo-1"],
  section.home-editorial-duo[data-store="home-editorial-duo-2"],
  section.home-editorial-duo[data-store="home-editorial-duo-3"],
  section.home-editorial-duo[data-store="home-editorial-duo-4"] {
  --avl-text-x: 608px !important;
  --avl-text-y: 60px !important;
  --avl-text-maxw: 420px !important;
  --avl-title-x: 605px !important;
  --avl-title-y: 55px !important;
  --avl-title-size: clamp(40px, 5.2vw, 92px) !important;
  --avl-title-ls: -0.03em !important;
  --avl-cta-x: 610px !important;
  --avl-cta-y: 70px !important;
  --avl-cw: 760px !important;
  --avl-ch: 782px !important;
  --avl-pad-y: 34px !important;
  --avl-i1-x: -260px !important;
  --avl-i1-y: 0px !important;
  --avl-i1-w: 550.8px !important;
  --avl-i1-h: 535.5px !important;
  --avl-i2-x: -20px !important;
  --avl-i2-y: 40px !important;
  --avl-i2-w: 786.24px !important;
  --avl-i2-h: 393.12px !important;
  --avl-i3-x: -120px !important;
  --avl-i3-y: 430px !important;
  --avl-i3-w: 702px !important;
  --avl-i3-h: 351px !important;
  }
}

@media (max-width: 991px) {
  section.home-editorial-duo[data-store="home-editorial-duo-1"],
  section.home-editorial-duo[data-store="home-editorial-duo-2"],
  section.home-editorial-duo[data-store="home-editorial-duo-3"],
  section.home-editorial-duo[data-store="home-editorial-duo-4"] {
  --avl-m-content-mt: -36px !important;
  --avl-m-content-mb: 12px !important;
  --avl-m-title-x: 0px !important;
  --avl-m-title-y: 20px !important;
  --avl-m-title-size: clamp(30px, 8.2vw, 44px) !important;
  --avl-m-title-ls: -0.03em !important;
  --avl-m-title-color: #efbf13 !important;
  --avl-m-text-x: 0px !important;
  --avl-m-text-y: 3px !important;
  --avl-m-cta-x: 0px !important;
  --avl-m-cta-y: 20px !important;
  --avl-m-i1-x: 0px !important;
  --avl-m-i1-y: 0px !important;
  --avl-m-i1-w: auto !important;
  --avl-m-i1-h: auto !important;
  --avl-m-i2-x: 0px !important;
  --avl-m-i2-y: 0px !important;
  --avl-m-i2-w: auto !important;
  --avl-m-i2-h: auto !important;
  --avl-m-i3-x: 0px !important;
  --avl-m-i3-y: 0px !important;
  --avl-m-i3-w: auto !important;
  --avl-m-i3-h: auto !important;
  --avl-m-i3-display: block !important;
  }
}

/* Desktop: mover 3 imágenes juntas (grupo) */
@media (min-width: 992px){
  section.home-editorial-duo[data-store^="home-editorial-duo-"] .home-editorial-duo__collage{
    transform: translate(var(--avl-g-img-x, 0px), var(--avl-g-img-y, 0px)) scale(var(--avl-g-img-s, 1)) !important;
    transform-origin: top left !important;
  }
}

/* ==========================================================================
   AVL Editorial Duo — DESKTOP FIXED VALUES (PUNTO 0)
   Aplicado a home-editorial-duo-1..4 (según dump de consola)
   ========================================================================== */
@media (min-width: 992px){
  section.home-editorial-duo[data-store="home-editorial-duo-1"],
  section.home-editorial-duo[data-store="home-editorial-duo-2"],
  section.home-editorial-duo[data-store="home-editorial-duo-3"],
  section.home-editorial-duo[data-store="home-editorial-duo-4"]{
    --avl-g-img-x: 184px !important;
    --avl-g-img-y: 0px !important;
    --avl-g-img-s: 1 !important;

    --avl-title-x: 755px !important;
    --avl-title-y: 295px !important;
    --avl-title-size: 92px !important;
    --avl-title-ls: -0.03em !important;

    --avl-text-x: 759px !important;
    --avl-text-y: 240px !important;

    --avl-cta-x: 759px !important;
    --avl-cta-y: 250px !important;
  }
}

/* ==========================================================================
   AVL Editorial Duo — SAFE COLOR + BG LOCK (v13)
   - Fix texto negro sin romper layout (evita "todo blanco/gigante")
   - NO fuerza color sobre todo __content (solo __text y links)
   ========================================================================== */
section.home-editorial-duo[data-store^="home-editorial-duo-"]{
  --avl-sst-loaded: "v13" !important;
  background-color:#000 !important;
}
/* Texto: blanco (solo bloque de texto) */
section.home-editorial-duo[data-store^="home-editorial-duo-"] .home-editorial-duo__text,
section.home-editorial-duo[data-store^="home-editorial-duo-"] .home-editorial-duo__text *{
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
  text-decoration-color:#fff !important;
}
/* Links dentro del texto: blanco */
section.home-editorial-duo[data-store^="home-editorial-duo-"] .home-editorial-duo__text a,
section.home-editorial-duo[data-store^="home-editorial-duo-"] .home-editorial-duo__text a:link,
section.home-editorial-duo[data-store^="home-editorial-duo-"] .home-editorial-duo__text a:visited{
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
  text-decoration-color:#fff !important;
}
/* Título dorado */
section.home-editorial-duo[data-store^="home-editorial-duo-"] .home-editorial-duo__title{
  color: var(--avl-title-color, #efbf13) !important;
  -webkit-text-fill-color: var(--avl-title-color, #efbf13) !important;
}
@media (max-width: 991px){
  section.home-editorial-duo[data-store^="home-editorial-duo-"] .home-editorial-duo__title{
    color: var(--avl-m-title-color, #efbf13) !important;
    -webkit-text-fill-color: var(--avl-m-title-color, #efbf13) !important;
  }
}
/* CTA blanco */
section.home-editorial-duo[data-store^="home-editorial-duo-"] .home-editorial-duo__cta,
section.home-editorial-duo[data-store^="home-editorial-duo-"] .home-editorial-duo__cta:link,
section.home-editorial-duo[data-store^="home-editorial-duo-"] .home-editorial-duo__cta:visited{
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
  text-decoration-color:#fff !important;
}

/* Mobile behavior v13: ocultar IMG2, mantener IMG3, y permitir translate+scale independiente */
@media (max-width: 991px){
  section.home-editorial-duo[data-store^="home-editorial-duo-"] .home-editorial-duo__imgwrap--secondary{
    display:none !important;
  }
  section.home-editorial-duo[data-store^="home-editorial-duo-"] .home-editorial-duo__imgwrap--tertiary{
    display: var(--avl-m-i3-display, block) !important;
  }
  section.home-editorial-duo[data-store^="home-editorial-duo-"] .home-editorial-duo__imgwrap--primary{
    transform: translate(var(--avl-m-i1-x, 0px), var(--avl-m-i1-y, 0px)) scale(var(--avl-m-i1-s, 1)) !important;
    transform-origin: top left !important;
  }
  section.home-editorial-duo[data-store^="home-editorial-duo-"] .home-editorial-duo__imgwrap--tertiary{
    transform: translate(var(--avl-m-i3-x, 0px), var(--avl-m-i3-y, 0px)) scale(var(--avl-m-i3-s, 1)) !important;
    transform-origin: top left !important;
  }
}

/* ==========================================================================
   AVL Editorial Duo — DESKTOP FIXED VALUES (PUNTO 0) v13
   ========================================================================== */
@media (min-width: 992px){
  section.home-editorial-duo[data-store="home-editorial-duo-1"],
  section.home-editorial-duo[data-store="home-editorial-duo-2"],
  section.home-editorial-duo[data-store="home-editorial-duo-3"],
  section.home-editorial-duo[data-store="home-editorial-duo-4"]{
    --avl-g-img-x: 184px !important;
    --avl-g-img-y: 0px !important;
    --avl-g-img-s: 1 !important;

    --avl-title-x: 755px !important;
    --avl-title-y: 295px !important;
    --avl-title-size: 92px !important;
    --avl-title-ls: -0.03em !important;

    --avl-text-x: 759px !important;
    --avl-text-y: 240px !important;

    --avl-cta-x: 759px !important;
    --avl-cta-y: 250px !important;
  }
}

/* ==========================================================================
   AVL Editorial Duo — MOBILE FIXED VALUES (PUNTO 0) v13
   ========================================================================== */
@media (max-width: 991px){
  section.home-editorial-duo[data-store="home-editorial-duo-1"],
  section.home-editorial-duo[data-store="home-editorial-duo-2"],
  section.home-editorial-duo[data-store="home-editorial-duo-3"],
  section.home-editorial-duo[data-store="home-editorial-duo-4"]{
    --avl-m-i1-x: -20px !important;
    --avl-m-i1-y: -20px !important;
    --avl-m-i1-s: 1.9500000000000008 !important;

    --avl-m-i3-x: -5px !important;
    --avl-m-i3-y: 380px !important;
    --avl-m-i3-s: 1.08 !important;
    --avl-m-i3-display: block !important;

    --avl-m-content-mt: 364px !important;
    --avl-m-content-mb: 22px !important;

    --avl-m-title-x: -5px !important;
    --avl-m-title-y: 20px !important;
    --avl-m-title-size: 44px !important;

    --avl-m-text-x: -5px !important;
    --avl-m-text-y: 3px !important;

    --avl-m-cta-x: -5px !important;
    --avl-m-cta-y: 20px !important;
  }
}

/* ==========================================================================
   AVL Editorial Duo — REVEAL v2 (v15)
   Objetivo: estilo tipo landonorris (suave) + orden/direcciones pedidas
   - Fondo negro SIEMPRE visible (no se revela)
   - Reveal por ITEM (no por sección): no dispara todo junto
   - Usa 'translate' (no 'transform') para no romper positioning/scale
   ========================================================================== */

/* 1) Fondo: no animar nunca */
section.home-editorial-duo[data-store^="home-editorial-duo-"]{
  opacity: 1 !important;
  transform: none !important;
  translate: 0 0 !important;
  background-color:#000 !important;
}
section.home-editorial-duo[data-store^="home-editorial-duo-"]::before{
  opacity: 1 !important;
  transform: none !important;
  translate: 0 0 !important;
  transition: none !important;
}

/* 2) Item reveal (solo cuando JS activa la sección) */
section.home-editorial-duo.avl-ed-reveal-v2 [data-avl-ed-item="1"]{
  opacity: 0 !important;
  will-change: opacity, translate;
  transition:
    opacity 920ms cubic-bezier(.2,.8,.2,1),
    translate 920ms cubic-bezier(.2,.8,.2,1) !important;
}

/* Estado final */
section.home-editorial-duo.avl-ed-reveal-v2 [data-avl-ed-item="1"].avl-ed-in{
  opacity: 1 !important;
  translate: 0 0 !important;
}

/* Distancias suaves (no "de toda la izquierda a toda la derecha") */
@media (min-width: 992px){
  /* Orden desktop:
     img1 (izq) -> img2 (der) -> title (der) -> text+cta (abajo) -> img3 (izq)
  */
  section.home-editorial-duo.avl-ed-reveal-v2 [data-avl-ed-role="img1"]{ translate: -26px 0 !important; transition-delay: 0ms !important; }
  section.home-editorial-duo.avl-ed-reveal-v2 [data-avl-ed-role="img2"]{ translate:  26px 0 !important; transition-delay: 140ms !important; }
  section.home-editorial-duo.avl-ed-reveal-v2 [data-avl-ed-role="title"]{translate:  20px 0 !important; transition-delay: 260ms !important; }
  section.home-editorial-duo.avl-ed-reveal-v2 [data-avl-ed-role="text"]{ translate:   0 18px !important; transition-delay: 400ms !important; }
  section.home-editorial-duo.avl-ed-reveal-v2 [data-avl-ed-role="cta"]{  translate:   0 18px !important; transition-delay: 520ms !important; }
  section.home-editorial-duo.avl-ed-reveal-v2 [data-avl-ed-role="img3"]{ translate: -26px 0 !important; transition-delay: 660ms !important; }
}
@media (max-width: 991px){
  /* Orden mobile:
     img1 (izq) -> img3 (der) -> title (abajo) -> text+cta (abajo)
  */
  section.home-editorial-duo.avl-ed-reveal-v2 [data-avl-ed-role="img1"]{ translate: -22px 0 !important; transition-delay: 0ms !important; }
  section.home-editorial-duo.avl-ed-reveal-v2 [data-avl-ed-role="img3"]{ translate:  22px 0 !important; transition-delay: 180ms !important; }
  section.home-editorial-duo.avl-ed-reveal-v2 [data-avl-ed-role="title"]{translate:   0 16px !important; transition-delay: 360ms !important; }
  section.home-editorial-duo.avl-ed-reveal-v2 [data-avl-ed-role="text"]{ translate:   0 16px !important; transition-delay: 520ms !important; }
  section.home-editorial-duo.avl-ed-reveal-v2 [data-avl-ed-role="cta"]{  translate:   0 16px !important; transition-delay: 620ms !important; }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  section.home-editorial-duo.avl-ed-reveal-v2 [data-avl-ed-item="1"]{
    transition: none !important;
    opacity: 1 !important;
    translate: 0 0 !important;
  }
}

section.home-editorial-duo[data-store^="home-editorial-duo-"]{--avl-sst-loaded:"v15" !important;}

/* ==========================================================================
   AVL Editorial Duo — REVEAL v2 TUNED (v17)
   - Opacidad más lenta (fade más “largo”)
   - Movimiento suave (translate) un poco más rápido que el fade
   - NO tocar transform de title/text/cta (para no mover posiciones)
   - Evitar doble reveal: anula SOLO animation del theme en estos nodos
   ========================================================================== */

section.home-editorial-duo[data-store^="home-editorial-duo-"]{--avl-sst-loaded:"v17" !important;}

/* Fade más lento que el movimiento */
section.home-editorial-duo.avl-ed-reveal-v2 [data-avl-ed-item="1"]{
  transition:
    opacity 1500ms cubic-bezier(.16,1,.3,1),
    translate 1100ms cubic-bezier(.16,1,.3,1) !important;
}

/* Quitar animaciones del theme (sin tocar transform) */
section.home-editorial-duo.avl-ed-reveal-v2 [data-avl-ed-item="1"]{
  animation: none !important;
}

/* Movimiento más corto (micro) para que sea sutil */
@media (min-width: 992px){
  section.home-editorial-duo.avl-ed-reveal-v2 [data-avl-ed-role="img1"]{ translate: -18px 0 !important; transition-delay: 0ms !important; }
  section.home-editorial-duo.avl-ed-reveal-v2 [data-avl-ed-role="img2"]{ translate:  18px 0 !important; transition-delay: 180ms !important; }
  section.home-editorial-duo.avl-ed-reveal-v2 [data-avl-ed-role="title"]{translate:  14px 0 !important; transition-delay: 360ms !important; }
  section.home-editorial-duo.avl-ed-reveal-v2 [data-avl-ed-role="text"]{ translate:   0 14px !important; transition-delay: 560ms !important; }
  section.home-editorial-duo.avl-ed-reveal-v2 [data-avl-ed-role="cta"]{  translate:   0 14px !important; transition-delay: 700ms !important; }
  section.home-editorial-duo.avl-ed-reveal-v2 [data-avl-ed-role="img3"]{ translate: -18px 0 !important; transition-delay: 880ms !important; }
}
@media (max-width: 991px){
  section.home-editorial-duo.avl-ed-reveal-v2 [data-avl-ed-role="img1"]{ translate: -16px 0 !important; transition-delay: 0ms !important; }
  section.home-editorial-duo.avl-ed-reveal-v2 [data-avl-ed-role="img3"]{ translate:  16px 0 !important; transition-delay: 220ms !important; }
  section.home-editorial-duo.avl-ed-reveal-v2 [data-avl-ed-role="title"]{translate:   0 12px !important; transition-delay: 440ms !important; }
  section.home-editorial-duo.avl-ed-reveal-v2 [data-avl-ed-role="text"]{ translate:   0 12px !important; transition-delay: 640ms !important; }
  section.home-editorial-duo.avl-ed-reveal-v2 [data-avl-ed-role="cta"]{  translate:   0 12px !important; transition-delay: 760ms !important; }
}
