/* ======================================================================
   DIFUSOR V129 · TARJETAS FULL-BLEED + HEADER ESPEJO
   - Imágenes de Servicios, Difusor e Infraestructura llenan toda la tarjeta
   - Sin franjas/bordes negros tipo cine
   - Movimiento visual común, suave y amplio
   - Logo permanece en su posición; navegación se desplaza a la derecha
   - Hover de header conserva elevación/crecimiento y suma brillo espejo
   ====================================================================== */

/* ---------------------------------------------------------------
   1. HEADER · cluster de navegación a la derecha
   --------------------------------------------------------------- */
@media (min-width:1001px){
  .nav .navin{
    gap:18px!important;
  }
  .nav .menu{
    margin-left:auto!important;
    gap:27px!important;
  }
  .nav .navin > .cta{
    margin-left:12px!important;
  }
}

/* Brillo espejo sobre las letras del menú sin cambiar la base aprobada. */
@keyframes v129TextMirror{
  0%{background-position:145% 50%}
  100%{background-position:-45% 50%}
}
@media (hover:hover) and (min-width:1001px){
  .nav .menu a[data-nav]:hover,
  .nav .menu a[data-nav]:focus-visible{
    color:transparent!important;
    -webkit-text-fill-color:transparent!important;
    background-image:linear-gradient(105deg,#fff 0%,#fff 36%,#d8e2e7 43%,#ffffff 49%,#f5fbff 53%,#d6e1e6 59%,#fff 66%,#fff 100%)!important;
    background-size:240% 100%!important;
    -webkit-background-clip:text!important;
    background-clip:text!important;
    animation:v129TextMirror .72s ease-out 1!important;
  }

  /* CTA: el brillo recorre solo el texto mediante el span. */
  .nav .navin > .cta .v129-nav-label{
    display:inline-block;
    color:inherit;
    -webkit-text-fill-color:currentColor;
  }
  .nav .navin > .cta:hover .v129-nav-label,
  .nav .navin > .cta:focus-visible .v129-nav-label{
    color:transparent!important;
    -webkit-text-fill-color:transparent!important;
    background-image:linear-gradient(105deg,#fff 0%,#fff 35%,#d7e1e6 43%,#fff 50%,#f5fbff 54%,#d5e0e5 61%,#fff 68%,#fff 100%)!important;
    background-size:240% 100%!important;
    -webkit-background-clip:text!important;
    background-clip:text!important;
    animation:v129TextMirror .72s ease-out 1!important;
  }

  /* Logo: barrido de brillo recortado por la propia silueta PNG. */
  .nav .logo-wrap::after{
    content:""!important;
    position:absolute!important;
    inset:8px 12px!important;
    width:auto!important;
    height:auto!important;
    transform:none!important;
    background:linear-gradient(105deg,transparent 0%,transparent 35%,rgba(255,255,255,.12) 42%,rgba(255,255,255,.92) 50%,rgba(255,255,255,.18) 58%,transparent 66%,transparent 100%)!important;
    background-size:250% 100%!important;
    background-position:145% 50%!important;
    -webkit-mask:url("../media/1792a400e7c39bfb8074.png") center/contain no-repeat!important;
    mask:url("../media/1792a400e7c39bfb8074.png") center/contain no-repeat!important;
    opacity:0!important;
    pointer-events:none!important;
    z-index:3!important;
  }
  .nav .logo-wrap:hover::after,
  .nav .logo-wrap:focus-visible::after{
    opacity:1!important;
    animation:v129TextMirror .76s ease-out 1!important;
  }
}

/* ---------------------------------------------------------------
   2. TARJETAS · imagen full-bleed, sin look letterbox/cine
   --------------------------------------------------------------- */
body.v73-home #servicios .service,
body.v73-home #nosotros .milestone,
body.v73-home #infraestructura .tech-item{
  overflow:hidden!important;
  background-size:cover!important;
  background-repeat:no-repeat!important;
  border-color:rgba(255,255,255,.12)!important;
  box-shadow:0 16px 34px rgba(3,13,19,.13)!important;
  transition:
    transform .42s cubic-bezier(.22,.61,.36,1),
    box-shadow .42s ease,
    border-color .42s ease,
    background-position 1.25s cubic-bezier(.22,.61,.36,1),
    background-size 1.25s cubic-bezier(.22,.61,.36,1)!important;
}

/* Servicios: imagen ocupa toda la tarjeta y paneo común. */
body.v73-home #servicios .service{
  background-position:50% 50%!important;
}
body.v73-home #servicios .service:hover,
body.v73-home #servicios .service:focus-visible{
  transform:translateY(-5px) scale(1.012)!important;
  background-position:57% 44%!important;
  background-size:cover!important;
  box-shadow:0 24px 52px rgba(3,13,19,.20)!important;
  border-color:rgba(155,218,242,.30)!important;
}

/* Difusor: mantener encuadres aprobados, pero siempre cover. */
body.v73-home #nosotros .milestone-origin{background-position:50% 44%!important}
body.v73-home #nosotros .milestone-story[data-story="reinvention"]{background-position:52% 46%!important}
body.v73-home #nosotros .milestone-story[data-story="music"]{background-position:58% 38%!important}
body.v73-home #nosotros .milestone-story[data-story="today"]{background-position:50% 48%!important}

body.v73-home #nosotros .milestone:hover,
body.v73-home #nosotros .milestone:focus-visible{
  transform:translateY(-5px) scale(1.012)!important;
  box-shadow:0 24px 52px rgba(3,13,19,.20)!important;
  border-color:rgba(155,218,242,.30)!important;
  background-size:cover!important;
}
body.v73-home #nosotros .milestone-origin:hover,
body.v73-home #nosotros .milestone-origin:focus-visible{background-position:56% 39%!important}
body.v73-home #nosotros .milestone-story[data-story="reinvention"]:hover,
body.v73-home #nosotros .milestone-story[data-story="reinvention"]:focus-visible{background-position:46% 41%!important}
body.v73-home #nosotros .milestone-story[data-story="music"]:hover,
body.v73-home #nosotros .milestone-story[data-story="music"]:focus-visible{background-position:51% 33%!important}
body.v73-home #nosotros .milestone-story[data-story="today"]:hover,
body.v73-home #nosotros .milestone-story[data-story="today"]:focus-visible{background-position:57% 42%!important}

/* Infraestructura: elimina el zoom 130/136% histórico y llena la tarjeta con cover. */
body.v73-home #infraestructura .tech-item{
  background-size:cover!important;
  background-position:50% 50%!important;
}
body.v73-home #infraestructura .tech-item:hover,
body.v73-home #infraestructura .tech-item:focus-visible{
  transform:translateY(-5px) scale(1.012)!important;
  background-size:cover!important;
  background-position:57% 44%!important;
  box-shadow:0 24px 52px rgba(3,13,19,.22)!important;
  border-color:rgba(155,218,242,.30)!important;
}

/* La capa de lectura continúa dentro de la imagen, sin crear un marco negro. */
body.v73-home #nosotros .milestone-copy,
body.v73-home #infraestructura .tech-copy{
  border-color:rgba(255,255,255,.11)!important;
  box-shadow:0 10px 28px rgba(0,0,0,.12)!important;
}

@media (max-width:1000px){
  body.v73-home #servicios .service,
  body.v73-home #nosotros .milestone,
  body.v73-home #infraestructura .tech-item{
    background-size:cover!important;
  }
}

@media (prefers-reduced-motion:reduce){
  .nav .menu a[data-nav],
  .nav .navin > .cta .v129-nav-label,
  .nav .logo-wrap::after,
  body.v73-home #servicios .service,
  body.v73-home #nosotros .milestone,
  body.v73-home #infraestructura .tech-item{
    animation:none!important;
    transition:none!important;
  }
}
