/* =========================================================
   NUNKY — MEDIA ADAPTIVE V3
   2026-09-17
   Regla de diseño: el contenedor se adapta a la proporción intrínseca
   de la infografía. La imagen NO se recorta ni se fuerza a una caja.
   Este archivo usa nombre nuevo para evitar caché de versiones previas.
========================================================= */

/* La imagen informativa conserva siempre su proporción real. */
main img.media-contain-img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  aspect-ratio: auto !important;
  object-fit: contain !important;
  object-position: center center !important;
  position: relative !important;
  inset: auto !important;
  padding: 0 !important;
  margin: 0 !important;
  transform: none !important;
}

/*
  Marcos que contienen directamente una infografía.
  Se excluyen tarjetas de contenido/logos cuya caja tiene otra función.
  :has() permite que la regla siga funcionando aunque cambie el nombre
  específico del componente.
*/
main :is(div, figure, a):has(> img.media-contain-img):not(.company-ecosystem-light-frame):not(.scx-highlight):not(.scx-compare) {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  aspect-ratio: auto !important;
  align-self: start !important;
  justify-self: stretch !important;
}

/* Marcos editoriales principales: la imagen es la que da la altura. */:where(body:has(main:not(.product-page))) main :is(
  .nunky-editorial-image,
  .nunky-wide-image,
  .nunky-panorama-media,
  .family-human-visual,
  .services-human-visual,
  .consulting-hero-image-wrap,
  .inner-hero-media-card,
  .showcase-image-stage,
  .scx-infographic-slot,
  .scx-image-frame,
  .scx-learning-visual,
  .smart-visual-card,
  .methodology-blueprint-visual,
  .strategy-image-slot,
  .factory-image-slot,
  .factory-hero-video-card,
  .factory-manifest-image,
  .factory-line-visual-card,
  .station-image-slot,
  .mode-image-slot,
  .production-main-image,
  .pillar-full-image,
  .pillar-page-image,
  .company-mv-image,
  .company-world-equation,
  .company-ecosystem-light-frame,
  .hero-video-card,
  .ecosistema-svg-link,
  .hero-concept-visual,
  .organizational-evolution-banner,
  .smart-company-equation,
  .detail-hero-media,
  .smart-explanation-image
){
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  aspect-ratio: auto !important;
  align-self: start !important;
}

/* Eliminar el patrón antiguo: imagen absoluta dentro de marco fijo. */
main :is(
  .strategy-image-slot,
  .factory-image-slot,
  .factory-hero-video-card,
  .station-image-slot,
  .mode-image-slot,
  .production-main-image,
  .pillar-full-image,
  .pillar-page-image
) > img.media-contain-img {
  position: relative !important;
  inset: auto !important;
  width: 100% !important;
  height: auto !important;
}

/* Las etiquetas pueden permanecer superpuestas sin definir la altura. */
.strategy-image-label,
.factory-image-label {
  pointer-events: none;
}

/* Quitar zoom de hover: en una infografía provoca recorte visual. */:where(body:has(main:not(.product-page))) main :is(
  .strategy-image-slot,
  .factory-image-slot,
  .station-image-slot,
  .mode-image-slot,
  .nunky-editorial-image,
  .nunky-wide-image,
  .family-human-visual,
  .smart-visual-card
):hover > img.media-contain-img{
  transform: none !important;
}

/* Tarjetas de catálogo: la tarjeta conserva texto; solo la imagen es natural. */
.product-family-card > img.media-contain-img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  aspect-ratio: auto !important;
  object-fit: contain !important;
}

/* Logos: no se convierten en infografías de altura libre. */
.ecosystem-logo-card > img.media-contain-img {
  object-fit: contain !important;
  position: static !important;
}

/* Responsive: jamás reintroducir cajas 4:3 / 16:10 para infografías. */
@media (max-width: 1100px) {:where(body:has(main:not(.product-page))) main :is(
    .nunky-editorial-image,
    .nunky-wide-image,
    .nunky-panorama-media,
    .family-human-visual,
    .services-human-visual,
    .consulting-hero-image-wrap,
    .detail-hero-media,
    .strategy-image-slot,
    .factory-image-slot,
    .station-image-slot,
    .mode-image-slot,
    .pillar-full-image,
    .pillar-page-image
  ){
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    aspect-ratio: auto !important;
  }
}

/* =========================================================
   FOOTER — mantener la versión completa aprobada
========================================================= */
.footer-grid-premium,
.footer-content {
  grid-template-columns: minmax(190px,1.18fr) repeat(4,minmax(130px,.82fr));
  gap: clamp(22px, 2.5vw, 38px);
}
.footer-section--legal a { font-weight: 650; }
.footer-section--legal .footer-ethical-link { color:#075985; font-weight:800; }
.footer-legal { justify-content:flex-start; }
.footer-legal .footer-cookie-settings,
.footer-legal a { font-size:.82rem; }
@media (max-width:1120px){
  .footer-grid-premium,.footer-content{grid-template-columns:repeat(3,minmax(0,1fr));}
  .footer-brand{grid-column:1/-1;}
}
@media (max-width:760px){
  .footer-grid-premium,.footer-content{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 22px;}
  .footer-brand{grid-column:1/-1;}
  .footer-legal{justify-content:flex-start;}
}
@media (max-width:520px){
  .footer-grid-premium,.footer-content{grid-template-columns:1fr;}
  .footer-brand{grid-column:auto;}
  .footer-legal{align-items:flex-start;flex-direction:column;gap:.8rem;}
  .footer-legal a::after{display:none!important;}
}