/* =============================================================================
   milano-home.css — la HOME del relanzamiento de Miami Import (v2)
   La carga sólo templates_jinja/v2/home.html, DESPUÉS de milano.css.
   Dueño: agente FRONT-HOME. Tokens --mx-* y mecánica de banners, carruseles,
   cinta y modal: milano.css (FRONT-SHELL). Acá va el ASPECTO de la home.

   Decisión fuerte: "El viaje MXP → EZE". La home es un pase de abordar a lo
   ancho: rótulos en mono, la etiqueta de equipaje, el bodegón sobre terrazo
   italiano, los arcos de la Galleria en el banner de llegadas, el pase de la
   casa en Amigos y el aterrizaje en EZE en el Showroom. El gusano
   (milano-motion.js) cose los bloques en zigzag.

   Reglas que no se rompen acá:
   · Ancho completo: cada bloque llena su franja; sólo el margen --mx-gutter.
   · 0 px de desborde horizontal a 390. Ningún tope de ancho de columna central.
   · Sin reglas forzadas, sin fondos fijos, sin modos de mezcla.
   · NUNCA `transition: transform` sobre lo que mueve el motor (los
     [data-surge], su <img> interna, los [data-parallax], [data-magnetico] y
     las .mx-card): el tween de GSAP y la transición CSS se pelean y queda
     gelatinoso. Por eso los botones magnéticos van envueltos y los zooms de
     hover van en otro elemento.
   · Capas: fondo del bloque < gusano (z 2) < contenido del bloque (z 3).

   Índice: 0 base · 1 bloque y cabecera · 2 vuelo (H1) · 3 banners ·
   4 Hombre/Mujer · 5 carruseles · 6 categorías · 7 Diesel · 8 cinta de
   marcas · 9 amigos y su video · 10 showroom · pantallas · 11 menos movimiento
   ============================================================================= */

/* ---------------------------------------------------------------- 0. base -- */
main:has(> [data-gusano]) { position: relative; }

.mh-sr {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0;
}
.mh-ico { width: 1.15em; height: 1.15em; flex: none; display: inline-block; vertical-align: -.2em; }

.mh-vuelo, .mh-banners, .mh-blq {
  --mh-pad: clamp(64px, 8vw, 136px);
  --mh-gap: clamp(12px, 1.4vw, 22px);
}
.mh-blq--noche a:focus-visible, .mh-banner--video a:focus-visible, .mh-dialogo :focus-visible { outline-color: var(--mx-papel); }

/* ------------------------------------------------- 1. bloque y cabecera -- */
.mh-blq {
  --mh-fondo: var(--mx-papel);
  position: relative;
  padding-block: var(--mh-pad);
  background: var(--mh-fondo);
  color: var(--mx-tinta);
}
.mh-blq--arena { --mh-fondo: var(--mx-arena); }
.mh-blq--noche { --mh-fondo: var(--mx-noche); color: var(--mx-papel); padding-block: 0; }
/* El contenido va por encima del gusano; el fondo del bloque, por debajo. */
.mh-blq__in { position: relative; z-index: 3; padding-inline: var(--mx-gutter); }
.mh-blq > .mx-rail, .mh-blq > .mx-cinta { z-index: 3; }
/* las mordidas del pase de abordar toman el color del bloque */
.mh-blq .mx-pase { --pase-fondo: var(--mh-fondo); }

.mh-cab {
  display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between;
  gap: 18px 32px; margin-bottom: clamp(26px, 3.2vw, 52px);
}
.mh-cab__txt { min-width: 0; max-width: 100%; }
.mh-cab__acc { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }

.mh-kicker {
  display: flex; align-items: center; gap: 12px;
  margin: 0 0 clamp(12px, 1.4vw, 20px);
  font: 500 12px/1.3 var(--f-mono); letter-spacing: .16em; text-transform: uppercase;
  color: var(--mx-gris); font-variant-numeric: tabular-nums;
}
.mh-kicker::before { content: ""; width: 28px; height: 1px; background: currentColor; opacity: .7; flex: none; }
.mh-kicker__avion { width: 18px; height: 18px; color: var(--mx-tinta); }

.mh-h2 {
  margin: 0;
  font-family: var(--f-sans); font-weight: 800;
  font-size: clamp(40px, 6.4vw, 112px); line-height: .92; letter-spacing: -.048em;
  text-wrap: balance; overflow-wrap: break-word;
}

.mh-vertodo {
  display: inline-flex; align-items: center; gap: 8px; padding: 12px 2px;
  font: 500 12px/1 var(--f-mono); letter-spacing: .14em; text-transform: uppercase;
  color: inherit; text-decoration: none; border-bottom: 1px solid currentColor; white-space: nowrap;
}
.mh-vertodo .mh-ico { transition: transform .45s var(--mx-ease); }
.mh-vertodo:hover .mh-ico { transform: translateX(4px); }

/* ------------------------------------------------------- 2. vuelo (H1) -- */
.mh-vuelo {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  gap: 8px 28px; padding: 11px var(--mx-gutter);
  background: var(--mx-papel); color: var(--mx-tinta);
  border-bottom: 1px solid var(--mx-linea);
}
.mh-vuelo__h1 {
  margin: 0; min-width: 0;
  font: 500 12px/1.45 var(--f-mono); letter-spacing: .14em; text-transform: uppercase;
}
.mh-vuelo__ruta {
  margin: 0; display: flex; align-items: center; gap: 10px; white-space: nowrap;
  font: 400 11px/1 var(--f-mono); letter-spacing: .14em; color: var(--mx-gris);
  font-variant-numeric: tabular-nums;
}
.mh-vuelo__cod { color: var(--mx-tinta); font-weight: 500; }
.mh-vuelo__linea {
  position: relative; display: inline-flex; align-items: center; justify-content: center;
  width: clamp(56px, 9vw, 168px); height: 16px;
}
.mh-vuelo__linea::before {
  content: ""; position: absolute; left: 0; right: 0; top: 50%;
  border-top: 1px dashed currentColor; opacity: .7;
}
.mh-vuelo__avion {
  position: relative; width: 14px; height: 14px; padding: 0 4px; box-sizing: content-box;
  color: var(--mx-tinta); background: var(--mx-papel);
}

/* ------------------------------------------------------------ 3. banners -- */
/* La mecánica (apilado, .is-activo/.is-entrando/.is-saliendo, cortina en
   diagonal, Ken Burns de [data-kenburns], barritas) es de milano.css §17.
   Acá: el alto, la composición de cada diapositiva y la entrada del texto. */
.mh-banners { --mh-alto: min(78svh, 760px); background: var(--mx-arena); color: var(--mx-tinta); }
.mh-banner {
  position: relative; overflow: hidden;
  height: var(--mh-alto); min-height: 540px;
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  background: var(--mx-arena);
}
.mh-banner--img-der > .mh-banner__media { order: 2; }

.mh-banner__media { position: relative; min-width: 0; min-height: 0; overflow: hidden; background: var(--mx-arena-2); }
.mh-banner__kb { position: absolute; inset: 0; overflow: hidden; }
/* El <picture> es más alto que su caja: el parallax del motor tiene de dónde correrse. */
.mh-banner__pic { position: absolute; inset: -7% 0; display: block; }
.mh-banner__img { display: block; width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: 50% 35%; }

.mh-banner__texto {
  position: relative; z-index: 2; min-width: 0;
  display: flex; flex-direction: column; justify-content: center; align-items: flex-start;
  gap: clamp(16px, 1.8vw, 26px);
  padding: clamp(32px, 5vw, 88px) clamp(28px, 6vw, 120px);
}
.mh-banner__pase { max-width: 100%; }
.mh-banner__titulo {
  margin: 0; max-width: 13.5ch;
  font: 700 clamp(36px, 4.5vw, 78px)/.98 var(--f-sans); letter-spacing: -.042em;
  text-wrap: balance; overflow-wrap: break-word;
}
.mh-banner__bajada {
  margin: 0; max-width: 38ch;
  font: 400 clamp(16px, 1.3vw, 20px)/1.5 var(--f-sans); color: var(--mx-tinta-2);
}
.mh-banner__cta { margin-top: 6px; }
/* El texto de la diapositiva que entra sube, escalonado, mientras corre la
   cortina. La 1ª sale del HTML sin .is-entrando: no anima al cargar. */
.mh-banner.is-entrando .mh-banner__texto > * { animation: mh-texto-sube .8s var(--mx-ease) both; }
.mh-banner.is-entrando .mh-banner__texto > :nth-child(1) { animation-delay: .14s; }
.mh-banner.is-entrando .mh-banner__texto > :nth-child(2) { animation-delay: .2s; }
.mh-banner.is-entrando .mh-banner__texto > :nth-child(3) { animation-delay: .26s; }
.mh-banner.is-entrando .mh-banner__texto > :nth-child(4) { animation-delay: .32s; }
@keyframes mh-texto-sube { from { opacity: 0; transform: translate3d(0, 22px, 0); } to { opacity: 1; transform: none; } }

/* B3 · video de viaje a todo el banner, con velo para leer el texto */
.mh-banner--video { grid-template-columns: minmax(0, 1fr); background: var(--mx-noche); color: var(--mx-papel); }
.mh-banner--video > .mh-banner__media { position: absolute; inset: 0; background: var(--mx-noche); }
.mh-banner__video { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; display: block; }
.mh-banner__velo {
  position: absolute; inset: 0;
  background: linear-gradient(90deg, rgba(21, 19, 17, .80) 0%, rgba(21, 19, 17, .56) 46%, rgba(21, 19, 17, .2) 100%);
}
.mh-banner--video .mh-banner__texto { max-width: min(820px, 64%); }
.mh-banner--video .mh-banner__bajada { color: rgba(250, 248, 244, .86); }

/* B2 · composición: tres prendas reales paradas bajo arcos de la Galleria */
.mh-comp { display: grid; place-items: center; padding: clamp(28px, 4vw, 64px) clamp(24px, 4vw, 72px); }
.mh-comp__fila {
  position: relative;
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: end;
  gap: clamp(12px, 2vw, 36px); width: 100%; max-width: 700px;
  margin: 0; padding: 0; list-style: none;
}
/* el piso donde se paran: pasa justo por la base de los arcos */
.mh-comp__fila::after {
  content: ""; position: absolute; left: -7%; right: -7%; bottom: 48px;
  border-top: 1px solid rgba(20, 18, 16, .2);
}
.mh-comp__pieza { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; min-width: 0; }
.mh-comp__arco {
  display: block; width: 100%; aspect-ratio: 3 / 4.4; overflow: hidden;
  border-radius: 999px 999px 14px 14px; background: var(--mx-blanco);
  box-shadow: 0 1px 0 rgba(20, 18, 16, .06), 0 26px 40px -26px rgba(20, 18, 16, .42);
}
.mh-comp__pieza:nth-child(2) .mh-comp__arco { aspect-ratio: 3 / 5; }
.mh-comp__img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform 1.1s var(--mx-ease); }
.mh-comp__arco:hover .mh-comp__img { transform: scale(1.04); }
.mh-comp__chip {
  box-sizing: border-box; height: 30px; margin-top: 18px; padding: 6px 12px; max-width: 100%;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  border: 1px solid var(--mx-linea); border-radius: 8px; background: var(--mx-papel);
  font: 500 13px/16px var(--f-sans); color: var(--mx-tinta);
}

/* B1 · la etiqueta de equipaje MXP a EZE colgando sobre la foto */
.mh-etiqueta {
  position: absolute; z-index: 2;
  right: clamp(16px, 3vw, 48px); bottom: clamp(18px, 7%, 64px);
  width: clamp(88px, 8vw, 118px); padding: 16px 10px 14px; box-sizing: border-box;
  display: flex; flex-direction: column; align-items: center; gap: 2px;
  background: var(--mx-papel); color: var(--mx-tinta); text-align: center;
  border: 1px solid rgba(20, 18, 16, .16); border-radius: 10px;
  box-shadow: 0 20px 34px -20px rgba(20, 18, 16, .5);
  transform: rotate(-6deg); transform-origin: 50% 0;
}
.mh-etiqueta::before {
  content: ""; position: absolute; left: calc(50% - 1px); bottom: calc(100% - 22px);
  width: 1.5px; height: 64px; background: rgba(20, 18, 16, .5);
  transform: rotate(22deg); transform-origin: 50% 100%;
}
.mh-etiqueta__ojal { width: 12px; height: 12px; border-radius: 50%; border: 1.5px solid rgba(20, 18, 16, .4); margin-bottom: 8px; background: var(--mx-arena); }
.mh-etiqueta__cod { font: 800 clamp(22px, 2.1vw, 30px)/1 var(--f-sans); letter-spacing: -.03em; }
.mh-etiqueta__a { font: 400 12px/1.5 var(--f-mono); color: var(--mx-gris); }
.mh-etiqueta__barra { width: 78%; height: 5px; margin-top: 10px; border-radius: 1px; background: var(--mx-tinta); }

/* navegación: pastilla de vidrio con flechas ‹ › y las barritas del shell */
.mh-banners__nav {
  position: absolute; z-index: 5; right: var(--mx-gutter); bottom: clamp(16px, 2.6vw, 32px);
  display: flex; align-items: center; gap: 4px; padding: 4px;
  border-radius: var(--mx-pill); border: 1px solid rgba(20, 18, 16, .08);
  background: rgba(250, 248, 244, .8); color: var(--mx-tinta);
  -webkit-backdrop-filter: blur(14px) saturate(1.2); backdrop-filter: blur(14px) saturate(1.2);
}
.mh-banners__flecha {
  width: 44px; height: 44px; border-radius: 50%;
  display: grid; place-items: center; color: inherit;
  transition: background-color .3s var(--mx-ease);
}
.mh-banners__flecha:hover { background: rgba(20, 18, 16, .08); }
.mh-banners__flecha .mx-ico { width: 18px; height: 18px; }
.mh-banners__puntos { display: flex; align-items: center; gap: 6px; padding-inline: 4px; }
.mh-banners .mh-banners__punto { width: clamp(28px, 3.2vw, 46px); height: 44px; }

/* ---------------------------------------------------- 4. Hombre / Mujer -- */
/* Terrazo veneciano en CSS: dos baldosas SVG de lascas IRREGULARES (4-5
   tonos tierra/gris sobre arena) de 330 y 517 px. Como los tamaños no se
   dividen, el dibujo recién se repite a los 15.510 px: a la vista no hay
   grilla. Las genera terrazo.py con semilla fija (mismo CSS cada vez que se
   corre; se entregó junto con el relanzamiento para poder rehacerlas). */
.mh-generos {
  --mh-terrazo-a: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='330' height='330' viewBox='0 0 330 330'%3E%3Cpath fill='%23f7f2e9' fill-opacity='0.95' d='M300 40L299 43L297 42L296 40L298 39Z'/%3E%3Cpath fill='%23958b82' fill-opacity='0.7' d='M258 322L256 325L252 322L250 320L255 316L259 317Z'/%3E%3Cpath fill='%23cbbca4' fill-opacity='0.85' d='M24 140L24 142L18 142L19 136L22 134L24 135Z'/%3E%3Cpath fill='%2376675a' fill-opacity='0.62' d='M144 204L141 210L138 204L138 200L143 202Z'/%3E%3Cpath fill='%23cbbca4' fill-opacity='0.85' d='M109 254L114 249L120 256L119 265L114 266L109 261Z'/%3E%3Cpath fill='%23958b82' fill-opacity='0.7' d='M270 203L281 209L275 214L271 219L264 213L263 209L267 201Z'/%3E%3Cpath fill='%23b19c80' fill-opacity='0.75' d='M34 206L36 207L34 211L30 214L28 211L27 209L31 203Z'/%3E%3Cpath fill='%23f7f2e9' fill-opacity='0.95' d='M22 199L16 200L16 193L20 191L22 194Z'/%3E%3Cpath fill='%23958b82' fill-opacity='0.7' d='M29 262L26 260L29 259L31 260L31 262Z'/%3E%3Cpath fill='%2376675a' fill-opacity='0.62' d='M278 49L276 48L278 45L279 44L281 46L282 48L280 49Z'/%3E%3Cpath fill='%23f7f2e9' fill-opacity='0.95' d='M290 43L290 47L287 49L283 48L283 43L289 39Z'/%3E%3Cpath fill='%2376675a' fill-opacity='0.62' d='M165 144L162 149L159 146L161 141Z'/%3E%3Cpath fill='%23cbbca4' fill-opacity='0.85' d='M306 175L304 169L310 168L312 174L309 176Z'/%3E%3Cpath fill='%23b19c80' fill-opacity='0.75' d='M305 125L307 128L305 133L302 130L301 129L302 124Z'/%3E%3Cpath fill='%23b19c80' fill-opacity='0.75' d='M126 245L124 242L126 241L127 243Z'/%3E%3Cpath fill='%23958b82' fill-opacity='0.7' d='M130 170L133 164L138 168L135 174Z'/%3E%3Cpath fill='%23cbbca4' fill-opacity='0.85' d='M103 233L103 229L105 229L106 231L106 233L104 234Z'/%3E%3Cpath fill='%23f7f2e9' fill-opacity='0.95' d='M4 240L6 239L7 240L8 240L8 243L6 243L4 243Z'/%3E%3Cpath fill='%23958b82' fill-opacity='0.7' d='M235 223L233 229L228 229L228 220L234 221Z'/%3E%3Cpath fill='%23cbbca4' fill-opacity='0.85' d='M32 125L27 128L23 126L28 119Z'/%3E%3Cpath fill='%23cbbca4' fill-opacity='0.85' d='M261 168L264 159L268 161L271 169Z'/%3E%3Cpath fill='%2376675a' fill-opacity='0.62' d='M22 245L17 247L11 241L9 231L20 234Z'/%3E%3Cpath fill='%2376675a' fill-opacity='0.62' d='M251 270L251 267L254 266L255 267L256 271L253 272Z'/%3E%3Cpath fill='%23f7f2e9' fill-opacity='0.95' d='M265 9L267 5L271 3L273 11L267 12Z'/%3E%3Cpath fill='%23f7f2e9' fill-opacity='0.95' d='M248 78L250 81L249 82L248 85L244 84L245 81L245 78Z'/%3E%3Cpath fill='%23958b82' fill-opacity='0.7' d='M68 159L66 164L62 157L62 155L69 153Z'/%3E%3Cpath fill='%23b19c80' fill-opacity='0.75' d='M294 286L291 283L293 279L298 278L299 282Z'/%3E%3Cpath fill='%2376675a' fill-opacity='0.62' d='M62 191L62 186L65 182L67 185L68 190Z'/%3E%3Cpath fill='%23f7f2e9' fill-opacity='0.95' d='M284 170L289 173L288 178L283 177L282 175Z'/%3E%3Cpath fill='%23f7f2e9' fill-opacity='0.95' d='M229 274L225 269L229 262L230 263L234 268L234 272Z'/%3E%3Cpath fill='%2376675a' fill-opacity='0.62' d='M181 286L180 283L182 281L184 281L185 284L183 287Z'/%3E%3Cpath fill='%23958b82' fill-opacity='0.7' d='M263 149L261 152L260 148L259 145L262 145L266 145L265 147Z'/%3E%3Cpath fill='%23958b82' fill-opacity='0.7' d='M325 284L323 289L323 291L318 289L316 287L319 284L322 284Z'/%3E%3Cpath fill='%23b19c80' fill-opacity='0.75' d='M26 203L19 210L16 204L13 200L22 195Z'/%3E%3Cpath fill='%23958b82' fill-opacity='0.7' d='M234 65L237 70L235 74L231 73L231 70Z'/%3E%3Cpath fill='%23cbbca4' fill-opacity='0.85' d='M251 101L253 101L255 106L252 107L249 108Z'/%3E%3Cpath fill='%23f7f2e9' fill-opacity='0.95' d='M121 288L131 288L133 296L135 300L127 301L121 296Z'/%3E%3Cpath fill='%2376675a' fill-opacity='0.62' d='M96 113L94 111L97 108L98 108L101 109L102 111L100 113Z'/%3E%3Cpath fill='%23b19c80' fill-opacity='0.75' d='M106 304L106 303L109 303L110 305L108 308Z'/%3E%3Cpath fill='%23958b82' fill-opacity='0.7' d='M46 193L44 196L39 195L39 190L40 185L45 187Z'/%3E%3Cpath fill='%23958b82' fill-opacity='0.7' d='M218 103L221 100L223 103L219 107Z'/%3E%3Cpath fill='%23958b82' fill-opacity='0.7' d='M49 151L49 145L53 143L63 141L65 147L57 155L53 153Z'/%3E%3Cpath fill='%23958b82' fill-opacity='0.7' d='M57 89L55 88L55 85L57 84L58 86L59 88L58 90Z'/%3E%3Cpath fill='%23b19c80' fill-opacity='0.75' d='M278 312L280 315L278 318L275 317L276 312Z'/%3E%3Cpath fill='%23cbbca4' fill-opacity='0.85' d='M259 315L258 317L256 318L255 317L256 312Z'/%3E%3Cpath fill='%23b19c80' fill-opacity='0.75' d='M295 137L297 135L300 137L301 139L300 141L297 142L298 140Z'/%3E%3Cpath fill='%23cbbca4' fill-opacity='0.85' d='M259 117L258 120L256 118L254 117L256 115L257 114L259 114Z'/%3E%3Cpath fill='%23958b82' fill-opacity='0.7' d='M114 172L116 169L119 173L118 176L115 178Z'/%3E%3Cpath fill='%23b19c80' fill-opacity='0.75' d='M280 92L282 95L278 97L276 98L275 93L276 92L279 89Z'/%3E%3Cpath fill='%23cbbca4' fill-opacity='0.85' d='M2 213L6 214L5 217L2 219L0 218Z'/%3E%3Cpath fill='%23cbbca4' fill-opacity='0.85' d='M332 213L336 214L335 217L332 219L330 218Z'/%3E%3Cpath fill='%23958b82' fill-opacity='0.7' d='M143 136L141 135L140 131L141 129L146 129L147 135Z'/%3E%3Cpath fill='%23cbbca4' fill-opacity='0.85' d='M27 39L26 43L23 44L21 41Z'/%3E%3Cpath fill='%2376675a' fill-opacity='0.62' d='M21 187L18 180L22 176L27 182Z'/%3E%3Cpath fill='%23f7f2e9' fill-opacity='0.95' d='M197 262L193 261L194 258L197 258Z'/%3E%3Cpath fill='%23958b82' fill-opacity='0.7' d='M306 223L312 225L309 232L307 235L303 230L301 225Z'/%3E%3Cpath fill='%23958b82' fill-opacity='0.7' d='M294 287L288 292L282 285L286 274L291 277Z'/%3E%3Cpath fill='%23958b82' fill-opacity='0.7' d='M96 -0L92 -2L94 -7L97 -5Z'/%3E%3Cpath fill='%23958b82' fill-opacity='0.7' d='M96 330L92 328L94 323L97 325Z'/%3E%3Cpath fill='%2376675a' fill-opacity='0.62' d='M4 -5L10 -2L7 1L3 3L-2 3L-3 -2L-1 -7Z'/%3E%3Cpath fill='%2376675a' fill-opacity='0.62' d='M4 325L10 328L7 331L3 333L-2 333L-3 328L-1 323Z'/%3E%3Cpath fill='%2376675a' fill-opacity='0.62' d='M334 -5L340 -2L337 1L333 3L328 3L327 -2L329 -7Z'/%3E%3Cpath fill='%2376675a' fill-opacity='0.62' d='M334 325L340 328L337 331L333 333L328 333L327 328L329 323Z'/%3E%3Cpath fill='%23b19c80' fill-opacity='0.75' d='M23 38L14 37L14 34L15 27L23 28L28 33Z'/%3E%3Cpath fill='%2376675a' fill-opacity='0.62' d='M-3 310L1 311L-0 316L-2 317L-3 314Z'/%3E%3Cpath fill='%2376675a' fill-opacity='0.62' d='M327 310L331 311L330 316L328 317L327 314Z'/%3E%3Cpath fill='%23f7f2e9' fill-opacity='0.95' d='M21 87L23 96L19 97L13 92L17 85Z'/%3E%3Cpath fill='%23958b82' fill-opacity='0.7' d='M249 93L246 96L244 99L241 93L245 91Z'/%3E%3Cpath fill='%23958b82' fill-opacity='0.7' d='M234 200L234 192L240 195L243 200L240 205L235 209Z'/%3E%3Cpath fill='%23cbbca4' fill-opacity='0.85' d='M207 316L209 318L209 321L206 322L204 321L203 316Z'/%3E%3Cpath fill='%2376675a' fill-opacity='0.62' d='M165 25L162 27L161 23L164 22Z'/%3E%3Cpath fill='%23cbbca4' fill-opacity='0.85' d='M308 178L309 178L309 182L306 183L304 182L305 178Z'/%3E%3Cpath fill='%23cbbca4' fill-opacity='0.85' d='M203 71L201 68L203 66L204 69Z'/%3E%3Cpath fill='%23b19c80' fill-opacity='0.75' d='M283 36L286 35L289 38L287 43L283 40Z'/%3E%3Cpath fill='%2376675a' fill-opacity='0.62' d='M257 164L260 163L265 164L262 170L260 173L254 171Z'/%3E%3Cpath fill='%23cbbca4' fill-opacity='0.85' d='M307 67L309 67L311 68L310 70L308 71L306 69Z'/%3E%3Cpath fill='%23cbbca4' fill-opacity='0.85' d='M80 221L81 219L84 219L84 223L80 225Z'/%3E%3Cpath fill='%23b19c80' fill-opacity='0.75' d='M136 98L138 98L137 102L133 103L133 98Z'/%3E%3Cpath fill='%23cbbca4' fill-opacity='0.85' d='M197 94L192 98L189 90L190 85L197 78L201 83L203 92Z'/%3E%3Cpath fill='%23b19c80' fill-opacity='0.75' d='M166 316L163 319L162 318L160 316L163 313L164 313Z'/%3E%3Cpath fill='%23f7f2e9' fill-opacity='0.95' d='M39 274L43 273L40 279L40 282L35 280L33 276L36 274Z'/%3E%3Cpath fill='%2376675a' fill-opacity='0.62' d='M282 128L283 132L278 138L272 138L274 130L279 124Z'/%3E%3Cpath fill='%2376675a' fill-opacity='0.62' d='M175 206L174 201L181 201L181 208L176 209Z'/%3E%3Cpath fill='%23cbbca4' fill-opacity='0.85' d='M-0 216L-2 210L4 209L4 216Z'/%3E%3Cpath fill='%23cbbca4' fill-opacity='0.85' d='M330 216L328 210L334 209L334 216Z'/%3E%3Cpath fill='%23b19c80' fill-opacity='0.75' d='M279 12L286 3L291 11L284 18Z'/%3E%3Cpath fill='%2376675a' fill-opacity='0.62' d='M62 282L56 279L58 274L62 274L67 279Z'/%3E%3Cpath fill='%23f7f2e9' fill-opacity='0.95' d='M223 199L219 197L220 193L226 192L226 197L226 201Z'/%3E%3Cpath fill='%23f7f2e9' fill-opacity='0.95' d='M170 150L179 152L174 163L173 169L162 166L159 152Z'/%3E%3Cpath fill='%23cbbca4' fill-opacity='0.85' d='M16 266L18 262L22 264L22 267L20 273L16 271Z'/%3E%3Cpath fill='%23cbbca4' fill-opacity='0.85' d='M177 109L179 108L180 110L182 111L179 113L177 111Z'/%3E%3Cpath fill='%2376675a' fill-opacity='0.62' d='M169 22L174 23L171 30L168 30L166 28L165 25L165 21Z'/%3E%3Cpath fill='%23958b82' fill-opacity='0.7' d='M73 185L74 187L75 190L73 191L71 190L69 188L71 186Z'/%3E%3Cpath fill='%23958b82' fill-opacity='0.7' d='M173 22L175 21L177 20L179 23L176 24Z'/%3E%3Cpath fill='%23cbbca4' fill-opacity='0.85' d='M26 120L31 120L30 125L27 126Z'/%3E%3Cpath fill='%2376675a' fill-opacity='0.62' d='M281 229L282 234L276 236L271 232L274 228L274 224L279 226Z'/%3E%3Cpath fill='%2376675a' fill-opacity='0.62' d='M45 3L48 5L47 7L45 10L42 7L39 4L44 4Z'/%3E%3Cpath fill='%2376675a' fill-opacity='0.62' d='M113 26L110 28L106 27L107 23L110 19L114 22Z'/%3E%3Cpath fill='%23f7f2e9' fill-opacity='0.95' d='M72 298L76 300L75 304L73 304L71 301Z'/%3E%3Cpath fill='%2376675a' fill-opacity='0.62' d='M161 167L158 165L161 161L163 162Z'/%3E%3Cpath fill='%2376675a' fill-opacity='0.62' d='M294 44L293 47L291 46L289 43L290 40L292 41L295 42Z'/%3E%3Cpath fill='%2376675a' fill-opacity='0.62' d='M105 242L105 236L112 231L117 237L115 239L112 247L109 244Z'/%3E%3Cpath fill='%2376675a' fill-opacity='0.62' d='M64 273L63 270L66 268L68 272Z'/%3E%3Cpath fill='%23958b82' fill-opacity='0.7' d='M120 301L119 296L122 294L124 294L125 297L125 300L122 303Z'/%3E%3Cpath fill='%23b19c80' fill-opacity='0.75' d='M81 66L77 61L86 59L88 66Z'/%3E%3Cpath fill='%23958b82' fill-opacity='0.7' d='M209 289L215 287L215 291L213 294L209 296L206 291Z'/%3E%3Cpath fill='%23b19c80' fill-opacity='0.75' d='M93 181L95 178L99 180L100 183L95 185L91 185Z'/%3E%3Cpath fill='%23f7f2e9' fill-opacity='0.95' d='M72 182L71 185L67 183L68 180Z'/%3E%3Cpath fill='%23cbbca4' fill-opacity='0.85' d='M65 115L70 111L75 121L73 126L67 124L60 122Z'/%3E%3Cpath fill='%23958b82' fill-opacity='0.7' d='M105 183L102 182L103 178L106 180Z'/%3E%3Cpath fill='%23b19c80' fill-opacity='0.75' d='M2 1L-1 -1L1 -3L3 -5L5 -5L7 -1L5 0Z'/%3E%3Cpath fill='%23b19c80' fill-opacity='0.75' d='M2 331L-1 329L1 327L3 325L5 325L7 329L5 330Z'/%3E%3Cpath fill='%23b19c80' fill-opacity='0.75' d='M332 1L329 -1L331 -3L333 -5L335 -5L337 -1L335 0Z'/%3E%3Cpath fill='%23b19c80' fill-opacity='0.75' d='M332 331L329 329L331 327L333 325L335 325L337 329L335 330Z'/%3E%3Cpath fill='%23958b82' fill-opacity='0.7' d='M61 99L62 102L58 105L56 105L54 102L57 97Z'/%3E%3Cpath fill='%2376675a' fill-opacity='0.62' d='M228 285L226 285L225 284L226 281L228 282Z'/%3E%3Cpath fill='%23f7f2e9' fill-opacity='0.95' d='M103 80L103 78L104 77L106 77L106 79L105 80Z'/%3E%3Cpath fill='%23cbbca4' fill-opacity='0.85' d='M28 253L26 255L22 247L24 244L29 243L33 249Z'/%3E%3Cpath fill='%23cbbca4' fill-opacity='0.85' d='M200 262L199 266L197 267L194 266L195 260L198 260Z'/%3E%3Cpath fill='%23cbbca4' fill-opacity='0.85' d='M183 292L184 294L183 298L180 299L178 295L176 291L180 290Z'/%3E%3Cpath fill='%2376675a' fill-opacity='0.62' d='M309 19L305 17L306 14L309 13L312 15L312 20Z'/%3E%3Cpath fill='%2376675a' fill-opacity='0.62' d='M66 12L69 17L72 23L65 24L63 20Z'/%3E%3Cpath fill='%23f7f2e9' fill-opacity='0.95' d='M170 300L171 301L172 304L171 306L169 305L167 303L168 300Z'/%3E%3Cpath fill='%23cbbca4' fill-opacity='0.85' d='M277 151L277 148L281 145L282 147L283 153L282 154L278 153Z'/%3E%3Cpath fill='%23f7f2e9' fill-opacity='0.95' d='M244 245L248 241L253 245L254 249L248 252Z'/%3E%3Cpath fill='%2376675a' fill-opacity='0.62' d='M318 11L320 14L318 18L315 17L312 16L313 13L315 10Z'/%3E%3Cpath fill='%23958b82' fill-opacity='0.7' d='M36 15L44 23L39 30L30 22Z'/%3E%3Cpath fill='%23cbbca4' fill-opacity='0.85' d='M90 193L92 199L90 200L82 198L82 193L88 192Z'/%3E%3Cpath fill='%23f7f2e9' fill-opacity='0.95' d='M240 73L236 71L238 70L241 68L241 70L242 73Z'/%3E%3Cpath fill='%23f7f2e9' fill-opacity='0.95' d='M-1 -1L-3 -0L-5 -5L-3 -10L0 -9L4 -6L3 -2Z'/%3E%3Cpath fill='%23f7f2e9' fill-opacity='0.95' d='M-1 329L-3 330L-5 325L-3 320L0 321L4 324L3 328Z'/%3E%3Cpath fill='%23f7f2e9' fill-opacity='0.95' d='M329 -1L327 -0L325 -5L327 -10L330 -9L334 -6L333 -2Z'/%3E%3Cpath fill='%23f7f2e9' fill-opacity='0.95' d='M329 329L327 330L325 325L327 320L330 321L334 324L333 328Z'/%3E%3Cpath fill='%23958b82' fill-opacity='0.7' d='M263 158L265 159L265 163L263 162L262 159Z'/%3E%3Cpath fill='%23958b82' fill-opacity='0.7' d='M205 93L208 97L201 98L199 94L201 89L203 88Z'/%3E%3Cpath fill='%23f7f2e9' fill-opacity='0.95' d='M30 116L31 117L29 120L26 120L26 118L26 114L29 113Z'/%3E%3Cpath fill='%23958b82' fill-opacity='0.7' d='M249 153L250 159L247 163L245 164L242 159L242 155L246 154Z'/%3E%3Cpath fill='%2376675a' fill-opacity='0.62' d='M173 298L172 295L176 290L180 296Z'/%3E%3Cpath fill='%234f4740' fill-opacity='0.55' d='M108 32L108 33L107 33L106 33L106 32L106 31L107 31Z'/%3E%3Cpath fill='%234f4740' fill-opacity='0.55' d='M290 118L289 118L289 116L288 115L290 115L291 116L291 116Z'/%3E%3Cpath fill='%234f4740' fill-opacity='0.55' d='M327 105L325 105L325 103L326 102L328 103Z'/%3E%3Cpath fill='%234f4740' fill-opacity='0.55' d='M184 318L186 319L185 321L183 321Z'/%3E%3Cpath fill='%234f4740' fill-opacity='0.55' d='M47 200L46 199L46 198L48 198L48 199Z'/%3E%3Cpath fill='%234f4740' fill-opacity='0.55' d='M277 275L276 274L277 274L277 274L277 274L277 275Z'/%3E%3Cpath fill='%234f4740' fill-opacity='0.55' d='M51 250L50 251L49 251L48 250L48 249L49 248L50 248Z'/%3E%3Cpath fill='%234f4740' fill-opacity='0.55' d='M173 26L174 26L174 27L174 28L173 28L173 27L172 27Z'/%3E%3Cpath fill='%234f4740' fill-opacity='0.55' d='M225 154L225 152L227 153L227 154Z'/%3E%3Cpath fill='%234f4740' fill-opacity='0.55' d='M54 66L55 66L55 68L54 68L53 67Z'/%3E%3Cpath fill='%234f4740' fill-opacity='0.55' d='M33 150L34 150L34 151L33 151L33 151L32 150Z'/%3E%3Cpath fill='%234f4740' fill-opacity='0.55' d='M29 296L30 294L31 295L31 296L30 298L29 297Z'/%3E%3Cpath fill='%234f4740' fill-opacity='0.55' d='M291 35L292 34L293 34L292 35Z'/%3E%3Cpath fill='%234f4740' fill-opacity='0.55' d='M162 124L163 125L162 126L162 125Z'/%3E%3Cpath fill='%234f4740' fill-opacity='0.55' d='M219 82L220 83L219 84L218 83Z'/%3E%3Cpath fill='%234f4740' fill-opacity='0.55' d='M203 328L203 329L203 329L203 328Z'/%3E%3Cpath fill='%234f4740' fill-opacity='0.55' d='M278 284L277 284L277 283L276 282L277 282L278 283Z'/%3E%3Cpath fill='%234f4740' fill-opacity='0.55' d='M315 320L314 321L313 320L313 318L314 319Z'/%3E%3Cpath fill='%234f4740' fill-opacity='0.55' d='M150 265L151 266L150 267L150 268L149 268L148 266L149 265Z'/%3E%3Cpath fill='%234f4740' fill-opacity='0.55' d='M181 170L182 170L182 171L182 171L181 171L181 171Z'/%3E%3Cpath fill='%234f4740' fill-opacity='0.55' d='M132 152L130 151L131 149L133 150Z'/%3E%3Cpath fill='%234f4740' fill-opacity='0.55' d='M159 116L160 115L160 114L161 116L162 117L161 118L159 118Z'/%3E%3Cpath fill='%234f4740' fill-opacity='0.55' d='M31 37L32 37L32 38L32 38L31 39L31 38L30 37Z'/%3E%3Cpath fill='%234f4740' fill-opacity='0.55' d='M235 44L237 45L236 47L235 47L234 46Z'/%3E%3Cpath fill='%234f4740' fill-opacity='0.55' d='M65 296L65 296L64 296L64 295L65 295Z'/%3E%3Cpath fill='%234f4740' fill-opacity='0.55' d='M145 53L144 54L144 53L143 52L144 52L145 52Z'/%3E%3Cpath fill='%234f4740' fill-opacity='0.55' d='M19 32L19 32L19 31L20 31L19 32Z'/%3E%3Cpath fill='%234f4740' fill-opacity='0.55' d='M24 95L23 95L23 94L23 94L24 94Z'/%3E%3Cpath fill='%234f4740' fill-opacity='0.55' d='M228 204L229 204L229 204L229 205L229 206L228 205L227 205Z'/%3E%3Cpath fill='%234f4740' fill-opacity='0.55' d='M217 247L220 247L220 248L219 249L217 248Z'/%3E%3Cpath fill='%234f4740' fill-opacity='0.55' d='M11 251L9 250L10 248L11 248L12 250Z'/%3E%3Cpath fill='%234f4740' fill-opacity='0.55' d='M303 296L304 297L303 298L302 298L302 297L302 296L303 296Z'/%3E%3Cpath fill='%234f4740' fill-opacity='0.55' d='M63 37L64 37L64 37L63 38L63 38L63 37L63 37Z'/%3E%3Cpath fill='%234f4740' fill-opacity='0.55' d='M28 29L27 28L28 27L29 26L29 27L30 28L28 29Z'/%3E%3C/svg%3E");
  --mh-terrazo-b: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='517' height='517' viewBox='0 0 517 517'%3E%3Cpath fill='%23d9ccb6' fill-opacity='0.8' d='M438 196L432 204L427 202L422 189L433 182L440 192Z'/%3E%3Cpath fill='%23d9ccb6' fill-opacity='0.8' d='M64 147L70 143L78 149L75 163L65 157Z'/%3E%3Cpath fill='%23f4eee3' fill-opacity='0.9' d='M54 39L66 42L66 53L70 57L59 59L51 55L50 51Z'/%3E%3Cpath fill='%23bfae94' fill-opacity='0.7' d='M73 -6L79 -13L87 -13L92 2L84 13L75 9Z'/%3E%3Cpath fill='%23bfae94' fill-opacity='0.7' d='M73 511L79 504L87 504L92 519L84 530L75 526Z'/%3E%3Cpath fill='%23a39a91' fill-opacity='0.6' d='M267 -3L272 5L266 18L258 13L250 11L248 -13L258 -9Z'/%3E%3Cpath fill='%23a39a91' fill-opacity='0.6' d='M267 514L272 522L266 535L258 530L250 528L248 504L258 508Z'/%3E%3Cpath fill='%23bfae94' fill-opacity='0.7' d='M180 17L174 27L171 23L164 17L169 8L170 1L180 11Z'/%3E%3Cpath fill='%23bfae94' fill-opacity='0.7' d='M180 534L174 544L171 540L164 534L169 525L170 518L180 528Z'/%3E%3Cpath fill='%23bfae94' fill-opacity='0.7' d='M295 324L307 325L309 340L307 348L293 339L292 331Z'/%3E%3Cpath fill='%23d9ccb6' fill-opacity='0.8' d='M181 436L187 445L180 465L173 459L161 453L161 440L170 432Z'/%3E%3Cpath fill='%23bfae94' fill-opacity='0.7' d='M332 415L349 425L341 440L331 450L319 441L319 424Z'/%3E%3Cpath fill='%23f4eee3' fill-opacity='0.9' d='M212 466L204 472L188 465L192 459L196 452L210 451Z'/%3E%3Cpath fill='%23f4eee3' fill-opacity='0.9' d='M334 383L325 392L314 385L315 371L325 372L333 376Z'/%3E%3Cpath fill='%23d9ccb6' fill-opacity='0.8' d='M334 119L344 120L351 128L348 139L337 133L333 130Z'/%3E%3Cpath fill='%23bfae94' fill-opacity='0.7' d='M185 122L196 127L181 135L174 127Z'/%3E%3Cpath fill='%23a39a91' fill-opacity='0.6' d='M215 81L219 72L222 70L229 79L226 86L221 92L216 87Z'/%3E%3Cpath fill='%23a39a91' fill-opacity='0.6' d='M319 213L334 214L332 236L320 230Z'/%3E%3Cpath fill='%23bfae94' fill-opacity='0.7' d='M178 353L164 346L176 336L185 336L195 342L199 353L185 365Z'/%3E%3Cpath fill='%23bfae94' fill-opacity='0.7' d='M489 162L491 158L503 151L513 165L505 172L492 178Z'/%3E%3Cpath fill='%23d9ccb6' fill-opacity='0.8' d='M365 323L363 308L374 297L382 294L390 315L396 325L372 331Z'/%3E%3Cpath fill='%23f4eee3' fill-opacity='0.9' d='M254 259L247 261L245 249L251 241L253 231L261 247L264 257Z'/%3E%3Cpath fill='%23d9ccb6' fill-opacity='0.8' d='M293 394L315 380L325 411L302 414Z'/%3E%3Cpath fill='%23bfae94' fill-opacity='0.7' d='M97 33L101 47L85 55L77 35Z'/%3E%3Cpath fill='%23a39a91' fill-opacity='0.6' d='M382 35L389 29L397 24L399 36L397 43L389 46Z'/%3E%3Cpath fill='%23a39a91' fill-opacity='0.6' d='M375 271L366 273L360 264L362 254L372 248L377 255L375 269Z'/%3E%3Cpath fill='%23f4eee3' fill-opacity='0.9' d='M485 317L486 326L481 330L470 337L466 324L461 317L476 314Z'/%3E%3Cpath fill='%23d9ccb6' fill-opacity='0.8' d='M14 35L13 38L6 43L-2 31L4 27L5 20L14 22Z'/%3E%3Cpath fill='%23d9ccb6' fill-opacity='0.8' d='M531 35L530 38L523 43L515 31L521 27L522 20L531 22Z'/%3E%3Cpath fill='%23d9ccb6' fill-opacity='0.8' d='M431 460L426 471L413 477L402 457L414 443L424 444Z'/%3E%3Cpath fill='%23a39a91' fill-opacity='0.6' d='M47 289L33 281L48 269L61 277Z'/%3E%3Cpath fill='%23f4eee3' fill-opacity='0.9' d='M317 244L307 258L298 259L290 246L309 234Z'/%3E%3Cpath fill='%23bfae94' fill-opacity='0.7' d='M246 126L229 124L236 111L249 110Z'/%3E%3Cpath fill='%23d9ccb6' fill-opacity='0.8' d='M23 377L37 386L22 393L7 391L14 372Z'/%3E%3C/svg%3E");
  padding-block: var(--mx-gutter) calc(var(--mh-pad) * .8);
}
.mh-generos__grilla { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--mh-gap); }
.mh-generos__grilla--1 { grid-template-columns: minmax(0, 1fr); }

.mh-genero {
  position: relative; display: block; height: clamp(460px, 46vw, 820px);
  border-radius: var(--mx-radio-lg); color: var(--mx-tinta); text-decoration: none;
}
.mh-genero:focus-visible { outline-offset: 4px; }
/* overflow:clip y no hidden: hidden lo vuelve contenedor de scroll y la
   animación atada al scroll de las prendas mediría contra él. */
.mh-genero__lienzo { position: absolute; inset: 0; overflow: clip; border-radius: inherit; background: #E9E1D2; }
.mh-genero__piso {
  position: absolute; left: 0; top: -8%; width: 100%; height: 116%; display: block;
  background-color: #E9E1D2;
  background-image: var(--mh-terrazo-a), var(--mh-terrazo-b);
  background-size: 330px 330px, 517px 517px;
  background-position: 0 0, 160px 90px;
}
.mh-genero--mujer .mh-genero__piso { background-position: 121px 207px, 38px 311px; }
/* luz cenital suave: el mármol más claro arriba a la izquierda */
.mh-genero__lienzo::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(130% 95% at 28% 18%, rgba(255, 255, 255, 0) 52%, rgba(74, 58, 42, .12) 100%);
}
.mh-genero__escena { position: absolute; inset: 0; }

/* Las prendas: fotos reales impresas con borde de papel, tiradas sobre el
   piso. Posición, ancho y giro por prenda; la palabra queda libre abajo a la
   izquierda. */
.mh-prenda {
  position: absolute; left: var(--x); top: var(--y); z-index: var(--z, 1);
  width: calc(var(--w) * var(--mh-k, 1));
  transform: rotate(var(--r));
  transition: transform .9s var(--mx-ease);
}
.mh-prenda__foto {
  display: block; padding: clamp(5px, .5vw, 8px); border-radius: 3px; background: #FBF9F4;
  box-shadow: 0 1px 1px rgba(20, 18, 16, .1), 0 16px 28px -14px rgba(20, 18, 16, .42);
}
.mh-prenda__foto img {
  display: block; width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover;
  border-radius: 1px; background: var(--mx-arena-2);
}
.mh-genero--hombre .mh-prenda:nth-child(1) { --x: 5%;  --y: 6%;  --w: 25%; --r: -8deg;  --z: 2; --rr: -26deg; }
.mh-genero--hombre .mh-prenda:nth-child(2) { --x: 29%; --y: 2%;  --w: 21%; --r: 5deg;   --z: 1; --rr: 22deg; }
.mh-genero--hombre .mh-prenda:nth-child(3) { --x: 50%; --y: 9%;  --w: 24%; --r: -3deg;  --z: 3; --rr: -18deg; }
.mh-genero--hombre .mh-prenda:nth-child(4) { --x: 74%; --y: 3%;  --w: 21%; --r: 10deg;  --z: 2; --rr: 28deg; }
.mh-genero--hombre .mh-prenda:nth-child(5) { --x: 66%; --y: 40%; --w: 26%; --r: 6deg;   --z: 4; --rr: 20deg; }
.mh-genero--hombre .mh-prenda:nth-child(6) { --x: 38%; --y: 34%; --w: 22%; --r: -11deg; --z: 5; --rr: -30deg; }
.mh-genero--mujer .mh-prenda:nth-child(1)  { --x: 70%; --y: 5%;  --w: 25%; --r: 7deg;   --z: 2; --rr: 24deg; }
.mh-genero--mujer .mh-prenda:nth-child(2)  { --x: 48%; --y: 2%;  --w: 21%; --r: -6deg;  --z: 1; --rr: -20deg; }
.mh-genero--mujer .mh-prenda:nth-child(3)  { --x: 24%; --y: 8%;  --w: 24%; --r: 4deg;   --z: 3; --rr: 26deg; }
.mh-genero--mujer .mh-prenda:nth-child(4)  { --x: 3%;  --y: 3%;  --w: 21%; --r: -10deg; --z: 2; --rr: -28deg; }
.mh-genero--mujer .mh-prenda:nth-child(5)  { --x: 62%; --y: 39%; --w: 26%; --r: -5deg;  --z: 4; --rr: -18deg; }
.mh-genero--mujer .mh-prenda:nth-child(6)  { --x: 37%; --y: 33%; --w: 22%; --r: 12deg;  --z: 5; --rr: 30deg; }
.mh-genero:hover .mh-prenda { transform: rotate(calc(var(--r) * 1.35)) translateY(-1.5%); }

.mh-genero__pie {
  position: absolute; z-index: 4; pointer-events: none;
  left: clamp(18px, 2.6vw, 44px); right: clamp(18px, 2.6vw, 44px); bottom: clamp(16px, 2.2vw, 36px);
  display: flex; align-items: center; gap: clamp(12px, 1.4vw, 22px);
}
.mh-genero__palabra { font: 800 clamp(56px, 9vw, 172px)/.8 var(--f-sans); letter-spacing: -.06em; padding-bottom: .04em; }
.mh-genero__ir {
  flex: none; width: clamp(52px, 4.8vw, 84px); height: clamp(52px, 4.8vw, 84px); border-radius: 50%;
  display: grid; place-items: center; background: var(--mx-tinta); color: var(--mx-papel);
  transition: transform .6s var(--mx-ease);
}
.mh-genero__ir .mh-ico { width: 42%; height: 42%; }
.mh-genero:hover .mh-genero__ir { transform: translateX(8px); }

/* Las prendas CAEN y se acomodan al entrar en pantalla, una atrás de la
   otra (atado al scroll, sin JS). Sin soporte: quedan quietas en su lugar. */
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    .mh-prenda__foto {
      animation: mh-caer both cubic-bezier(.16, 1, .3, 1);
      animation-timeline: view();
      animation-range: entry calc(4% + var(--i, 0) * 7%) cover calc(30% + var(--i, 0) * 4%);
    }
  }
}
@keyframes mh-caer {
  from { opacity: 0; transform: translate3d(0, -46%, 0) rotate(var(--rr, -24deg)) scale(1.32); }
  55% { opacity: 1; }
  to { opacity: 1; transform: none; }
}

/* -------------------------------------------------------- 5. carruseles -- */
/* .mx-rail / .mx-rail__pista / flechas flotantes: milano.css §15. La pista va
   a sangre (hija directa del bloque) y el margen lateral es su padding. */
.mh-rail .mx-rail__pista { padding-bottom: 18px; }
.mh-rail .mx-rail__pista:focus-visible { outline: 2px solid var(--mx-tinta); outline-offset: -4px; }

/* Off-White: la foto de la tienda de Milán abre el carrusel, a dos columnas */
.mx-rail__pista > .mh-apertura {
  flex-basis: calc((100% - (var(--mx-rail-n) - 1) * var(--mx-rail-gap)) / var(--mx-rail-n) * 2 + var(--mx-rail-gap));
}
.mh-apertura { display: flex; flex-direction: column; gap: 14px; color: var(--mx-tinta); text-decoration: none; }
.mh-apertura__foto {
  position: relative; flex: 1; min-height: 280px; overflow: hidden;
  border-radius: var(--mx-radio); background: var(--mx-arena-2);
}
.mh-apertura__foto img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 30%; }
.mh-apertura__pie { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 16px; }
.mh-apertura__cta {
  display: inline-flex; align-items: center; gap: 8px;
  font: 500 12px/1 var(--f-mono); letter-spacing: .14em; text-transform: uppercase;
}
.mh-apertura__cta .mh-ico { transition: transform .45s var(--mx-ease); }
.mh-apertura:hover .mh-apertura__cta .mh-ico { transform: translateX(4px); }

/* -------------------------------------------------------- 6. categorías -- */
.mh-cats__grilla {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--mh-gap);
  margin: 0; padding: 0; list-style: none;
}
.mh-cats__grilla--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.mh-cats__grilla--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.mh-cats__grilla--1 { grid-template-columns: minmax(0, 1fr); }
.mh-cat { min-width: 0; }
.mh-cat__link { display: block; color: inherit; text-decoration: none; }
.mh-cat__foto {
  position: relative; aspect-ratio: 4 / 5; overflow: hidden;
  border-radius: var(--mx-radio-lg); background: var(--mx-arena-2);
}
/* 12% más alta que su caja: el parallax inverso de "expandir" no deja ver bordes */
.mh-cat__img { position: absolute; left: 0; top: -6%; width: 100%; height: 112%; max-width: none; object-fit: cover; display: block; }
.mh-cat__muestra { position: absolute; left: 14px; bottom: 14px; z-index: 1; display: flex; }
.mh-cat__mini {
  width: 40px; height: 50px; object-fit: cover; display: block;
  border-radius: 6px; border: 2px solid var(--mx-papel); background: var(--mx-arena-2);
  box-shadow: 0 6px 14px -8px rgba(20, 18, 16, .5);
}
.mh-cat__mini + .mh-cat__mini { margin-left: -12px; }
.mh-cat__pie {
  display: flex; align-items: baseline; justify-content: space-between; gap: 12px;
  padding: 16px 2px 14px; border-bottom: 1px solid var(--mx-linea);
}
.mh-cat__nombre { margin: 0; min-width: 0; font: 700 clamp(18px, 1.8vw, 30px)/1.1 var(--f-sans); letter-spacing: -.025em; }
.mh-cat__cant {
  display: inline-flex; align-items: center; gap: 6px; white-space: nowrap;
  font: 500 12px/1 var(--f-mono); letter-spacing: .1em; text-transform: uppercase; color: var(--mx-gris);
  font-variant-numeric: tabular-nums;
}
.mh-cat__num { color: var(--mx-tinta); }
.mh-cat__cant .mh-ico { transition: transform .45s var(--mx-ease); }
.mh-cat__link:hover .mh-cat__cant .mh-ico { transform: translateX(4px); }
.mh-cat__link:hover .mh-cat__nombre { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .18em; }

/* ------------------------------------------------------------ 7. Diesel -- */
.mh-diesel { background: var(--mx-noche); }
.mh-diesel__banda { position: relative; z-index: 3; overflow: hidden; height: clamp(440px, 41.67vw, 900px); background: var(--mx-noche); }
.mh-diesel__pic { position: absolute; inset: 0; display: block; }
/* el zoom del motor se acerca a la placa, no al centro geométrico */
.mh-diesel__img {
  display: block; width: 100%; height: 100%; object-fit: cover;
  object-position: 46% 50%; transform-origin: 46% 50%;
}
.mh-diesel__centro {
  position: absolute; z-index: 2; left: 0; right: 0; bottom: clamp(24px, 7%, 72px);
  display: flex; justify-content: center; pointer-events: none;
}
.mh-diesel__btn { pointer-events: auto; }

/* ---------------------------------------------------- 8. cinta de marcas -- */
/* Movimiento, pausa con hover y arrastre: milano.css §16. Acá, la tarjeta. */
.mh-marcas { padding-bottom: calc(var(--mh-pad) * .85); }
.mh-cinta { --mx-cinta-gap: var(--mh-gap); padding-block: 4px 6px; }
/* también se frena con el foco del teclado o con el dedo apoyado */
.mh-cinta:focus-within .mx-cinta__pista,
.mh-cinta:active .mx-cinta__pista { animation-play-state: paused; }
.mh-cinta__item { width: clamp(220px, 19vw, 330px); }

.mh-marca {
  display: flex; flex-direction: column; height: 100%; overflow: hidden;
  border: 1px solid var(--mx-linea); border-radius: var(--mx-radio-lg);
  background: var(--mx-blanco); color: var(--mx-tinta); text-decoration: none;
  transition: border-color .35s var(--mx-ease);
}
.mh-marca:hover { border-color: rgba(20, 18, 16, .32); }
.mh-marca__foto { display: block; aspect-ratio: 1 / 1.05; padding: 12px; background: #F4F1EB; }
.mh-marca__foto img {
  display: block; width: 100%; height: 100%; object-fit: cover; border-radius: 12px;
  transition: transform 1s var(--mx-ease);
}
.mh-marca:hover .mh-marca__foto img { transform: scale(1.03); }
.mh-marca__pie { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; padding: 14px 16px 16px; }
.mh-marca__txt { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.mh-marca__nombre {
  font: 500 12px/1.2 var(--f-mono); letter-spacing: .14em; text-transform: uppercase;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.mh-marca__cant { font: 400 11px/1 var(--f-mono); letter-spacing: .08em; color: var(--mx-gris); font-variant-numeric: tabular-nums; }
.mh-marca__explorar {
  display: inline-flex; align-items: center; gap: 6px; white-space: nowrap;
  font: 500 11px/1 var(--f-mono); letter-spacing: .12em; text-transform: uppercase;
}
.mh-marca__explorar .mh-ico { transition: transform .45s var(--mx-ease); }
.mh-marca:hover .mh-marca__explorar .mh-ico { transform: translateX(4px); }

/* ------------------------------------------------ 9. amigos y su video -- */
.mh-amigos__uno {
  display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr) minmax(0, .78fr);
  align-items: center; gap: clamp(20px, 3vw, 56px);
}
.mh-amigos__texto { min-width: 0; }
.mh-amigos__nombre { margin: clamp(22px, 2.6vw, 40px) 0 8px; font: italic 400 clamp(34px, 3.6vw, 62px)/1 var(--f-serif); letter-spacing: -.01em; }
.mh-amigos__prenda { margin: 0; font: 400 clamp(16px, 1.3vw, 19px)/1.5 var(--f-sans); color: var(--mx-tinta-2); }
.mh-amigos__lleva {
  margin-right: 8px; font: 500 11px/1 var(--f-mono); letter-spacing: .16em; text-transform: uppercase;
  color: var(--mx-gris);
}
.mh-amigos__acc { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 22px; margin-top: clamp(22px, 2.4vw, 36px); }
.mh-amigos__video { min-width: 0; display: flex; justify-content: center; }
.mh-amigos__foto {
  position: relative; align-self: end; aspect-ratio: 4 / 5; overflow: hidden;
  border-radius: var(--mx-radio-lg); background: var(--mx-arena-2);
}
.mh-amigos__foto img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

.mh-amigo {
  position: relative; display: block; width: min(100%, calc(min(78svh, 740px) * 9 / 16));
  aspect-ratio: 9 / 16; overflow: hidden;
  border-radius: var(--mx-radio-lg); background: var(--mx-noche); color: var(--mx-tinta);
  text-decoration: none; box-shadow: 0 34px 60px -40px rgba(20, 18, 16, .6);
}
.mh-amigo__poster {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
  transition: transform 1.2s var(--mx-ease);
}
.mh-amigo:hover .mh-amigo__poster { transform: scale(1.03); }
.mh-amigo__play {
  position: absolute; inset: 0; margin: auto;
  width: clamp(64px, 5.4vw, 86px); height: clamp(64px, 5.4vw, 86px); border-radius: 50%;
  display: grid; place-items: center;
  background: rgba(250, 248, 244, .88); color: var(--mx-tinta);
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  transition: transform .5s var(--mx-ease), background-color .3s;
}
.mh-amigo__play .mh-ico { width: 38%; height: 38%; margin-left: 6%; }
.mh-amigo:hover .mh-amigo__play { transform: scale(1.08); background: var(--mx-papel); }
.mh-amigo__chip {
  position: absolute; left: 14px; bottom: 14px;
  display: inline-flex; align-items: center; gap: 7px; padding: 8px 12px;
  border-radius: var(--mx-pill); background: rgba(21, 19, 17, .58); color: var(--mx-papel);
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  font: 500 11px/1 var(--f-mono); letter-spacing: .12em; text-transform: uppercase;
}
.mh-amigo__chip-ico { width: 12px; height: 12px; }

/* el pase de abordar de la casa (un solo amigo y sin 2ª foto) */
.mh-amigos__boleto { align-self: end; min-width: 0; margin-bottom: clamp(0px, 4vw, 64px); }
.mh-boleto {
  position: relative;
  padding: 22px 22px 18px; border-radius: 18px;
  border: 1px solid var(--mx-linea); background: var(--mx-blanco); color: var(--mx-tinta);
  box-shadow: 0 26px 50px -32px rgba(20, 18, 16, .45);
  transform: rotate(2.5deg); font-family: var(--f-mono);
}
/* las mordidas del troquel, a la altura del corte punteado */
.mh-boleto::before, .mh-boleto::after {
  content: ""; position: absolute; top: 47px; width: 18px; height: 18px; border-radius: 50%;
  background: var(--mh-fondo);
}
.mh-boleto::before { left: -10px; }
.mh-boleto::after { right: -10px; }
.mh-boleto__cab {
  display: flex; justify-content: space-between; gap: 10px; height: 34px; box-sizing: border-box;
  border-bottom: 1px dashed rgba(20, 18, 16, .4);
  font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--mx-gris);
}
.mh-boleto__ruta {
  display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 18px 0 4px;
  font: 800 clamp(30px, 2.6vw, 44px)/1 var(--f-sans); letter-spacing: -.03em;
}
.mh-boleto__avion { width: 26px; height: 26px; color: var(--mx-gris); }
.mh-boleto__ciudades {
  display: flex; justify-content: space-between; margin: 0 0 16px;
  font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--mx-gris);
}
.mh-boleto__datos { display: grid; gap: 10px; margin: 0 0 18px; padding-top: 14px; border-top: 1px dashed rgba(20, 18, 16, .25); }
.mh-boleto__datos div { display: grid; grid-template-columns: 82px minmax(0, 1fr); gap: 12px; align-items: baseline; }
.mh-boleto__datos dt { font-size: 10.5px; letter-spacing: .16em; text-transform: uppercase; color: var(--mx-gris); }
.mh-boleto__datos dd { margin: 0; font: 500 13px/1.35 var(--f-sans); overflow-wrap: anywhere; }
.mh-boleto__barras {
  display: block; height: 40px; border-radius: 2px; opacity: .88;
  background: repeating-linear-gradient(90deg,
    var(--mx-tinta) 0 2px, transparent 2px 5px, var(--mx-tinta) 5px 6px, transparent 6px 9px,
    var(--mx-tinta) 9px 12px, transparent 12px 14px, var(--mx-tinta) 14px 15px, transparent 15px 19px);
}

/* dos o más amigos: carrusel de tarjetas 9:16 */
.mh-rail--amigos { --mx-rail-flecha-top: 44%; }
.mh-amigos__item .mh-amigo { width: 100%; }
.mh-amigos__item-nombre { margin: 14px 0 2px; font: 700 16px/1.25 var(--f-sans); letter-spacing: -.01em; }
.mh-amigos__item-prenda { margin: 0 0 4px; font: 400 14px/1.4 var(--f-sans); color: var(--mx-tinta-2); }
.mh-amigos__item .mh-vertodo { padding-block: 8px; }

/* el video en el modal propio del shell (.mx-modal--video, milano.css §19) */
.mh-dialogo::backdrop { background: rgba(15, 13, 11, .84); }
.mh-dialogo .mx-modal__cabeza { border-bottom-color: rgba(250, 248, 244, .12); }
.mh-dialogo__nombre { font: italic 400 26px/1.05 var(--f-serif); letter-spacing: -.01em; }
.mh-dialogo .mx-modal__cerrar:hover { background: rgba(250, 248, 244, .12); }
.mh-dialogo__cuerpo { display: flex; flex-direction: column; align-items: center; gap: 16px; }
.mh-dialogo .mx-modal__cuerpo > * + * { margin-top: 0; }
.mh-dialogo__video {
  display: block; width: auto; max-width: 100%; height: min(58svh, 720px); aspect-ratio: 9 / 16;
  border-radius: var(--mx-radio); background: #0b0a09; object-fit: contain;
}
.mh-dialogo__pie { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; width: 100%; }
.mh-dialogo__prenda { margin: 0; font: 400 15px/1.4 var(--f-sans); color: rgba(250, 248, 244, .82); }
.mh-dialogo .mh-amigos__lleva { color: rgba(250, 248, 244, .6); }
@media (min-width: 768px) {
  .mx-modal.mh-dialogo { width: min(480px, calc(100vw - 2 * var(--mx-gutter))); }
  .mh-dialogo__video { height: min(64svh, 720px); }
}

/* ---------------------------------------------------------- 10. showroom -- */
.mh-showroom { padding-block: 0; }
.mh-showroom__grilla {
  position: relative; z-index: 3;
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  min-height: clamp(560px, 56vw, 920px);
}
.mh-showroom--solo .mh-showroom__grilla { grid-template-columns: minmax(0, 1fr); min-height: 0; }
.mh-showroom__foto { position: relative; min-height: 100%; overflow: hidden; background: var(--mx-arena-2); }
.mh-showroom__foto img { position: absolute; left: 0; top: -6%; width: 100%; height: 112%; max-width: none; object-fit: cover; object-position: 50% 40%; display: block; }
.mh-showroom__texto {
  min-width: 0; display: flex; flex-direction: column; justify-content: center; align-items: flex-start;
  gap: clamp(16px, 1.8vw, 26px);
  padding: clamp(48px, 7vw, 140px) var(--mx-gutter) clamp(48px, 7vw, 140px) clamp(28px, 6vw, 128px);
}
.mh-showroom__h2 {
  display: flex; align-items: center; gap: 12px; margin: 0;
  font: 500 12px/1 var(--f-mono); letter-spacing: .28em; text-transform: uppercase;
}
.mh-showroom__h2::before { content: ""; width: 28px; height: 1px; background: currentColor; }
.mh-showroom__marca { margin: 0; font: 400 clamp(60px, 8.6vw, 168px)/.88 var(--f-serif); letter-spacing: -.025em; }
.mh-showroom__lineas {
  width: min(100%, 460px); margin: 6px 0 0; padding: 0; list-style: none;
  font: 400 clamp(17px, 1.4vw, 21px)/1.4 var(--f-sans); color: var(--mx-tinta-2);
}
.mh-showroom__lineas li { padding: 14px 0; border-top: 1px solid var(--mx-linea); }
.mh-showroom__lineas li:last-child { border-bottom: 1px solid var(--mx-linea); }
.mh-showroom__acc { margin-top: 6px; }
.mh-showroom__eze {
  display: flex; flex-wrap: wrap; gap: 10px; margin: clamp(10px, 2vw, 28px) 0 0;
  font: 400 11px/1 var(--f-mono); letter-spacing: .16em; text-transform: uppercase; color: var(--mx-gris);
  font-variant-numeric: tabular-nums;
}
.mh-showroom__eze span:first-child { color: var(--mx-tinta); font-weight: 500; }
.mh-showroom__fin { padding-left: 10px; border-left: 1px solid var(--mx-linea); }


/* ------------------------------------------------------------ pantallas -- */
@media (max-width: 1099px) {
  .mh-amigos__uno { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .mh-amigos__texto { grid-column: 1 / -1; }
}
@media (max-width: 767px) {
  .mh-vuelo { padding-block: 9px; }
  .mh-vuelo__h1 { font-size: 11px; letter-spacing: .1em; }
  .mh-vuelo__ruta { display: none; }

  /* banners: foto arriba, texto abajo; el de video, texto sobre el video */
  .mh-banners { --mh-alto: 86svh; }
  .mh-banner { min-height: 600px; grid-template-columns: minmax(0, 1fr); grid-template-rows: 50% 50%; }
  .mh-banner--img-der > .mh-banner__media { order: 0; }
  .mh-banner__texto { justify-content: flex-start; gap: 12px; padding: 22px var(--mx-gutter) 20px; }
  .mh-banner__titulo { font-size: clamp(27px, 7.6vw, 34px); max-width: none; }
  .mh-banner__bajada { font-size: 15px; }
  .mh-banner__cta { margin-top: 2px; }
  /* la foto vertical ocupa la diapositiva entera; el texto va abajo sobre
     un velo arena (sólo para leer, mismo color del fondo) */
  .mh-banner--imagen { grid-template-rows: minmax(0, 1fr); }
  .mh-banner--imagen > .mh-banner__media { position: absolute; inset: 0; }
  .mh-banner--imagen > .mh-banner__media::after {
    content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
    background: linear-gradient(180deg, rgba(236, 229, 216, 0) 26%, rgba(236, 229, 216, .9) 50%, var(--mx-arena) 64%);
  }
  .mh-banner--imagen .mh-banner__texto { justify-content: flex-end; padding-bottom: 26px; }
  .mh-banner--imagen .mh-etiqueta { top: 18px; bottom: auto; left: 16px; right: auto; transform: rotate(-8deg); }
  .mh-banner--video { grid-template-rows: minmax(0, 1fr); }
  .mh-banner--video .mh-banner__texto { justify-content: flex-end; max-width: none; padding-bottom: 28px; }
  .mh-banner__velo { background: linear-gradient(180deg, rgba(21, 19, 17, .2) 0%, rgba(21, 19, 17, .5) 45%, rgba(21, 19, 17, .88) 100%); }
  .mh-comp { padding: 18px var(--mx-gutter) 12px; }
  .mh-comp__fila { gap: 10px; }
  .mh-comp__fila::after { bottom: 40px; }
  .mh-comp__chip { height: 26px; margin-top: 14px; padding: 5px 8px; font-size: 11px; line-height: 14px; }
  .mh-etiqueta { width: 74px; padding: 12px 6px 10px; bottom: 14px; right: 14px; }
  .mh-etiqueta__cod { font-size: 19px; }
  .mh-etiqueta__a { font-size: 10px; }
  .mh-etiqueta__ojal { width: 9px; height: 9px; margin-bottom: 5px; }
  .mh-etiqueta::before { height: 44px; }
  .mh-banners__nav { top: 12px; bottom: auto; right: 12px; }
  .mh-banners__flecha { width: 38px; height: 38px; }
  .mh-banners .mh-banners__punto { width: 26px; height: 38px; }

  /* Hombre / Mujer apilados, prendas más grandes, palabra a la medida */
  .mh-generos__grilla { grid-template-columns: minmax(0, 1fr); }
  .mh-genero { height: auto; aspect-ratio: 4 / 4.9; --mh-k: 1.32; }
  .mh-genero__palabra { font-size: min(17vw, 92px); }

  .mh-apertura__foto { min-height: 0; aspect-ratio: 4 / 5; flex: none; }

  .mh-cats__grilla, .mh-cats__grilla--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mh-cat__pie { flex-direction: column; align-items: flex-start; gap: 6px; padding-top: 12px; }
  .mh-cat__muestra { left: 10px; bottom: 10px; }
  .mh-cat__mini { width: 30px; height: 38px; }

  .mh-diesel__banda { height: auto; aspect-ratio: 4 / 5; }

  .mh-amigos__uno { grid-template-columns: minmax(0, 1fr); }
  .mh-amigos__video { justify-content: flex-start; }
  .mh-amigo { width: min(100%, calc(74svh * 9 / 16)); }
  .mh-amigos__boleto { margin: 8px 6px 0; }
  .mh-boleto { transform: rotate(1.5deg); }

  .mh-showroom__grilla { grid-template-columns: minmax(0, 1fr); min-height: 0; }
  .mh-showroom__foto { min-height: 0; aspect-ratio: 4 / 5; }
  .mh-showroom__texto { padding: 44px var(--mx-gutter) 56px; }
}

/* ------------------------------------------------- 11. menos movimiento -- */
/* milano.css ya baja animaciones y transiciones a 0.01ms y apaga la cinta y
   la cortina; acá sólo lo propio de la home. */
@media (prefers-reduced-motion: reduce) {
  .mh-banner.is-entrando .mh-banner__texto > * { animation: none; }
  .mh-prenda, .mh-genero:hover .mh-prenda { transition: none; transform: rotate(var(--r)); }
  .mh-genero:hover .mh-genero__ir, .mh-amigo:hover .mh-amigo__play { transform: none; }
}

/* ==========================================================================
   Banner «Milán»: las fotos que eligió Diego (Galleria, Montenapoleone con el
   Porsche, el Duomo, la tienda Off-White) se funden cada 4 s con un acercamiento
   lento. CSS puro: cada foto tiene el mismo ciclo (n × 4 s) corrido por su
   animation-delay negativo; la 1ª arranca visible (es el LCP).
   ========================================================================== */
.mh-gal { position: relative; overflow: hidden; background: var(--mx-tinta); }
.mh-gal__foto {
  position: absolute; inset: 0; margin: 0;
  animation: mh-gal-4 16s linear infinite both;
}
.mh-gal__foto:first-child { opacity: 1; }
.mh-gal__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.mh-gal__lugar {
  position: absolute; left: clamp(14px, 1.6vw, 26px); bottom: clamp(14px, 1.6vw, 26px); z-index: 2;
  display: inline-flex; align-items: center; gap: 10px; padding: 8px 14px 8px 12px;
  font: 500 11px/1 var(--f-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--mx-papel);
  background: rgba(20, 18, 16, .42); border: 1px solid rgba(250, 248, 244, .28); border-radius: 999px;
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
}
.mh-gal__lugar span { opacity: .62; }
@keyframes mh-gal-4 {
  0%   { opacity: 1; transform: scale(1); }
  25%  { opacity: 1; }
  31%  { opacity: 0; transform: scale(1.07); }
  93%  { opacity: 0; transform: scale(1); }
  100% { opacity: 1; transform: scale(1); }
}
@media (prefers-reduced-motion: reduce) {
  .mh-gal__foto { animation: none; opacity: 0; }
  .mh-gal__foto:first-child { opacity: 1; }
}