/* V96 · Correcciones de responsive. Va el último para ganar a las capas anteriores.
   No cambia el diseño: solo arregla lo que se cortaba, se solapaba o quedaba inalcanzable. */

/* ── Red de seguridad: nada provoca scroll horizontal, sin romper el menú fijo ── */
@supports (overflow:clip){
  html,body{overflow-x:clip;}
}

/* ── Menú superior ─────────────────────────────────────────────────────────────
   Estaba centrado dentro de una tira con scroll: cuando no cabía, los primeros
   enlaces quedaban fuera por la izquierda y no se podía llegar a ellos. */
@media(max-width:1240px){
  .links{
    flex-wrap:nowrap !important;
    justify-content:flex-start !important;
    min-width:0 !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    scrollbar-width:none;
    -webkit-overflow-scrolling:touch;
  }
  .links::-webkit-scrollbar{display:none;}
  .links a{flex:0 0 auto !important;}
  /* centrado cuando cabe; pegado al inicio (y por tanto alcanzable) cuando no */
  .links > :first-child{margin-left:auto !important;}
  .links > :last-child{margin-right:auto !important;}
}
/* Entre 901 y 1240 px el menú partía en dos filas dejando un enlace suelto. */
@media(min-width:901px) and (max-width:1240px){
  .links{gap:clamp(7px,.95vw,12px) !important;}
  .links a{font-size:clamp(7.6px,.78vw,9px) !important;letter-spacing:.09em !important;}
}

/* ── Manifiesto: el antetítulo se cortaba por la derecha en móvil ── */
@media(max-width:560px){
  #manifiesto .manifesto-kicker{gap:8px !important;}
  #manifiesto .manifesto-kicker-line{flex:0 0 14px !important;width:14px !important;}
  #manifiesto .manifesto-kicker .eyebrow{
    white-space:normal !important;
    min-width:0;
    text-align:center;
    line-height:1.75 !important;
    letter-spacing:.16em !important;
  }
}

/* ── Tres pilares: el número quedaba asomando detrás de la foto en móvil
      (en escritorio ya quedaba tapado por completo) ── */
#diferencia .atelier-pillar .pillar-num{visibility:hidden;}

/* ── Historia del legado: una palabra larga (p. ej. «AUJOURD’HUI») ensanchaba
      la tarjeta y sacaba todo el bloque de la pantalla ── */
#historia-legado .legacy-grid > *{min-width:0;}
#historia-legado .legacy-card{min-width:0;}
#historia-legado .legacy-card p,
#historia-legado .legacy-card h3{overflow-wrap:break-word;}
#historia-legado .legacy-year.roman{white-space:nowrap;}
html[lang="fr"] #historia-legado .legacy-year.roman{
  font-size:clamp(1.55rem,2.3vw,2.15rem);
  line-height:1.15;
  letter-spacing:0;
  white-space:nowrap;
}
@media(max-width:1100px){
  html[lang="fr"] #historia-legado .legacy-year.roman{font-size:clamp(1.9rem,4.1vw,2.6rem);}
}
@media(max-width:700px){
  html[lang="fr"] #historia-legado .legacy-year.roman{font-size:clamp(1.7rem,8.2vw,2.7rem);}
}

/* En inglés «TODAY» rozaba el borde de la tarjeta con cuatro columnas estrechas */
@media(min-width:1101px){
  html[lang="en"] #historia-legado .legacy-year.roman{font-size:clamp(3.1rem,4.55vw,4.3rem);}
}

/* ── Proceso ───────────────────────────────────────────────────────────────────
   En una columna las flechas caían encima del texto, y las pestañas iban en una
   tira de ancho fijo que cortaba los nombres largos y escondía las últimas. */
@media(max-width:900px){
  /* la foto ocupa su caja sin franjas vacías (las imágenes son 16:9) */
  #proceso .pane-photo{
    width:100% !important;
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    aspect-ratio:16 / 9 !important;
  }
  #proceso .pane p{padding-bottom:64px !important;}
  #proceso .pane ul{padding-bottom:64px !important;}

  #proceso .process-tabs{
    display:flex !important;
    flex-wrap:wrap !important;
    overflow:visible !important;
    scroll-snap-type:none !important;
  }
  #proceso .process-btn{
    flex:1 1 22% !important;
    width:auto !important;
    min-width:0 !important;
    white-space:nowrap !important;
    text-align:center !important;
    border-bottom:1px solid rgba(129,90,52,.10) !important;
  }
}
@media(max-width:600px){
  #proceso .process-btn{
    flex:1 1 30% !important;
    padding:13px 6px !important;
    font-size:clamp(9.5px,2.55vw,11px) !important;
    letter-spacing:.07em !important;
  }
}
@media(max-width:480px){
  #proceso .process-btn{
    flex:1 1 45% !important;
    font-size:clamp(9.5px,3vw,11.5px) !important;
  }
}

/* ── Maison del Autor: pie del carrusel ── */
#personalizacion .personal-carousel-count{white-space:nowrap;}
@media(max-width:760px){
  #personalizacion .personal-carousel-kicker{min-width:0;}
  #personalizacion .personal-carousel-dots{grid-column:1 / -1;flex-wrap:wrap;row-gap:8px;}
}
@media(max-width:400px){
  #personalizacion .personal-carousel-dots{gap:7px !important;}
}
@media(max-width:350px){
  #personalizacion .personal-carousel-dots{gap:4px !important;}
}

/* ── Accesibilidad y robustez: quien pide menos movimiento ve el contenido ya ── */
@media(prefers-reduced-motion:reduce){
  .reveal{opacity:1 !important;filter:none !important;transform:none !important;}
}