/* TROPHUB81 V47 · ajustes exclusivos de portada y tipografía del menú.
   CSS progresivo: preserva la versión anterior si JS está deshabilitado. */

/* Recuperar la tipografía sobria del menú del resto de páginas. */
body.th31-home .mi-header.is-home .mi-desktop-nav a,
body.th31-home .mi-header.is-home .mi-mobile-menu a {
  font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", Arial, sans-serif !important;
  font-weight: 540 !important;
  letter-spacing: .005em !important;
}
body.th31-home .mi-header.is-home .mi-desktop-nav a {font-size: 14px !important;}

/* Conservar el alto V46, pero quitar el panel fotográfico limitado al 74 %.
   Una copia de la MISMA toma llena el fondo; la toma íntegra se superpone
   sin bordes rectos. Ni se recorta el coche ni se manipula el WebP original. */
body.th30-home.th31-home.th33-home .mi-v16-hero-visual.th30-hero-stage {
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background: #101213 !important;
  overflow: hidden !important;
  isolation: isolate;
}
body.th30-home.th31-home.th33-home .mi-v16-hero-visual img.th32-hero-ambient,
body.th30-home.th31-home.th33-home .mi-v16-hero-slide.is-active .mi-v16-hero-visual img.th32-hero-ambient {
  display:block !important;
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center !important;
  opacity:1 !important;
  filter:blur(9px) brightness(.63) saturate(.87) !important;
  transform:scale(1.055) !important;
  z-index:0 !important;
}
body.th30-home.th31-home.th33-home .mi-v16-hero-visual img.th30-hero-original,
body.th30-home.th31-home.th33-home .mi-v16-hero-slide.is-active .mi-v16-hero-visual img.th30-hero-original,
body.th30-home.th31-home.th33-home .mi-v16-hero-slide.is-editorial .mi-v16-hero-visual img.th30-hero-original,
body.th30-home.th31-home.th33-home .th33-hero-portrait .mi-v16-hero-visual img.th30-hero-original,
body.th30-home.th31-home.th33-home .th33-hero-panorama .mi-v16-hero-visual img.th30-hero-original {
  position:absolute !important;
  inset:0 !important;
  top:0 !important;
  right:0 !important;
  bottom:0 !important;
  left:0 !important;
  width:100% !important;
  height:100% !important;
  max-width:none !important;
  object-fit:contain !important;
  object-position:center center !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  filter:brightness(1.035) contrast(1.015) saturate(1.035) !important;
  transform:none !important;
  z-index:1 !important;
  /* La máscara elimina la línea de unión sobre el fondo completo. */
  -webkit-mask-image:linear-gradient(90deg, transparent 0%, rgba(0,0,0,.14) 12%, rgba(0,0,0,.78) 29%, #000 42%, #000 84%, rgba(0,0,0,.78) 93%, rgba(0,0,0,.2) 100%) !important;
  mask-image:linear-gradient(90deg, transparent 0%, rgba(0,0,0,.14) 12%, rgba(0,0,0,.78) 29%, #000 42%, #000 84%, rgba(0,0,0,.78) 93%, rgba(0,0,0,.2) 100%) !important;
}
body.th30-home.th31-home.th33-home .mi-v16-hero-visual:after {
  background:none !important;
  pointer-events:none !important;
}
body.th30-home.th31-home.th33-home .mi-v16-hero-shade {
  background:
    linear-gradient(90deg,rgba(7,8,9,.85) 0%,rgba(7,8,9,.67) 18%,rgba(7,8,9,.38) 40%,rgba(7,8,9,.11) 70%,rgba(7,8,9,.04) 100%),
    linear-gradient(0deg,rgba(7,8,9,.65),transparent 35%) !important;
}

/* Portada grande, con foto completa y legibilidad real en celular. */
@media (max-width:760px){
  body.th30-home.th31-home.th33-home .mi-v16-hero-visual img.th30-hero-original,
  body.th30-home.th31-home.th33-home .mi-v16-hero-slide.is-active .mi-v16-hero-visual img.th30-hero-original,
  body.th30-home.th31-home.th33-home .th33-hero-portrait .mi-v16-hero-visual img.th30-hero-original {
    inset:4% 0 auto 0 !important;
    top:4% !important;
    bottom:auto !important;
    width:100% !important;
    height:58% !important;
    object-fit:contain !important;
    -webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,.98) 0%,#000 78%,rgba(0,0,0,.25) 100%) !important;
    mask-image:linear-gradient(180deg,rgba(0,0,0,.98) 0%,#000 78%,rgba(0,0,0,.25) 100%) !important;
  }
  body.th30-home.th31-home.th33-home .mi-v16-hero-shade{
    background:
      linear-gradient(0deg,rgba(7,8,9,.98) 0%,rgba(7,8,9,.91) 14%,rgba(7,8,9,.69) 30%,rgba(7,8,9,.13) 62%,rgba(7,8,9,.12) 100%) !important;
  }
}

/* Transición editorial: la siguiente escena se revela como una hoja que se
   despliega, con borde de luz muy tenue y relieve. Las flechas y los enlaces
   conservan la lógica existente; no hay WebGL ni dependencias externas. */
body.th30-home.th31-home.th33-home .mi-v16-hero.th47-ready .mi-v15-hero-slide {
  opacity:1 !important;
  visibility:visible !important;
  transition:none !important;
  z-index:0;
  pointer-events:none !important;
}
body.th30-home.th31-home.th33-home .mi-v16-hero.th47-ready .mi-v15-hero-slide.th47-leaving {z-index:1;}
body.th30-home.th31-home.th33-home .mi-v16-hero.th47-ready .mi-v15-hero-slide.is-active {z-index:2;pointer-events:auto !important;}
body.th30-home.th31-home.th33-home .mi-v16-hero.th47-ready .mi-v15-hero-slide.th47-entering {
  animation:th47-page-in 990ms cubic-bezier(.19,.76,.18,1) both;
  will-change:clip-path,transform;
}
body.th30-home.th31-home.th33-home .mi-v16-hero.th47-ready[data-th47-direction="prev"] .mi-v15-hero-slide.th47-entering {
  animation-name:th47-page-in-reverse;
}
/* El borde de la hoja acompaña la apertura, nunca queda estático. */
body.th30-home.th31-home.th33-home .mi-v16-hero.th47-ready .mi-v15-hero-slide.th47-entering::after {
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  height:100%;
  width:min(19vw,260px);
  z-index:6;
  pointer-events:none;
  opacity:0;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.11) 33%,rgba(12,15,17,.22) 58%,transparent);
  animation:th47-fold-light 990ms cubic-bezier(.19,.76,.18,1) both;
}
body.th30-home.th31-home.th33-home .mi-v16-hero.th47-ready[data-th47-direction="prev"] .mi-v15-hero-slide.th47-entering::after {
  animation-name:th47-fold-light-reverse;
}
body.th30-home.th31-home.th33-home .mi-v16-hero.th47-ready .mi-v15-hero-slide.th47-entering :is(.mi-v16-unit-info,.mi-v16-hero-actions) {
  animation:th47-copy-in 690ms 195ms cubic-bezier(.16,1,.3,1) both;
}
@keyframes th47-page-in{
  0%{clip-path:polygon(100% 0,100% 0,100% 100%,100% 100%);transform:translate3d(20px,0,0) scale(1.018)}
  55%{clip-path:polygon(46% 0,100% 0,100% 100%,34% 100%)}
  100%{clip-path:polygon(0 0,100% 0,100% 100%,0 100%);transform:translate3d(0,0,0) scale(1)}
}
@keyframes th47-page-in-reverse{
  0%{clip-path:polygon(0 0,0 0,0 100%,0 100%);transform:translate3d(-20px,0,0) scale(1.018)}
  55%{clip-path:polygon(0 0,66% 0,54% 100%,0 100%)}
  100%{clip-path:polygon(0 0,100% 0,100% 100%,0 100%);transform:translate3d(0,0,0) scale(1)}
}
@keyframes th47-fold-light{
  0%{opacity:0;transform:translate3d(100vw,0,0)}
  38%{opacity:.45}
  90%{opacity:.1}
  100%{opacity:0;transform:translate3d(-16vw,0,0)}
}
@keyframes th47-fold-light-reverse{
  0%{opacity:0;transform:translate3d(-20vw,0,0)}
  38%{opacity:.45}
  90%{opacity:.1}
  100%{opacity:0;transform:translate3d(100vw,0,0)}
}
@keyframes th47-copy-in{
  0%{opacity:0;transform:translate3d(0,16px,0)}
  100%{opacity:1;transform:translate3d(0,0,0)}
}

@media (max-width:760px){
  body.th30-home.th31-home.th33-home .mi-v16-hero.th47-ready .mi-v15-hero-slide.th47-entering,
  body.th30-home.th31-home.th33-home .mi-v16-hero.th47-ready[data-th47-direction="prev"] .mi-v15-hero-slide.th47-entering {
    animation-duration:700ms;
  }
  body.th30-home.th31-home.th33-home .mi-v16-hero.th47-ready .mi-v15-hero-slide.th47-entering::after {display:none;}
}
@media (prefers-reduced-motion:reduce){
  body.th30-home.th31-home.th33-home .mi-v16-hero.th47-ready .mi-v15-hero-slide.th47-entering,
  body.th30-home.th31-home.th33-home .mi-v16-hero.th47-ready .mi-v15-hero-slide.th47-entering::after,
  body.th30-home.th31-home.th33-home .mi-v16-hero.th47-ready .mi-v15-hero-slide.th47-entering :is(.mi-v16-unit-info,.mi-v16-hero-actions){
    animation:none !important;
    transform:none !important;
    clip-path:none !important;
  }
}
