/* =========================================================
   Oscar Encinas — Tenor
   Tokens extraídos de Figma: "Oscar Encinas - WEB - Nealia"
   ========================================================= */

/* ---------- Tipografía autoalojada ---------- */
@font-face{
  font-family:"Manrope";
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src:url("../fonts/manrope-latin-400-normal.woff2") format("woff2"),
      url("../fonts/manrope-latin-400-normal.woff") format("woff");
}
@font-face{
  font-family:"Manrope";
  font-style:normal;
  font-weight:700;
  font-display:swap;
  src:url("../fonts/manrope-latin-700-normal.woff2") format("woff2"),
      url("../fonts/manrope-latin-700-normal.woff") format("woff");
}

:root{
  /* Color */
  --white:#FFFFFF;
  --grey-200:#E9ECEF;
  --grey-300:#DEE2E6;
  --grey-500:#ADB5BD;
  --grey-600:#6C757D;
  --grey-900:#212529;
  --red-400:#B93C3C;
  --black:#0A0A0A;
  --red-50:#F6E7E7;
  --red-500:#A70B0B;
  --red-600:#980A0A;
  --red-900:#460505;
  --yellow-50:#FFF9E6;
  --yellow-100:#FFEBB0;
  --surface:rgba(255,255,255,.1);

  /* Tipografía */
  --font-sans:"Manrope","Segoe UI",Helvetica,Arial,sans-serif;
  --font-serif:"Times New Roman",Times,serif;

  --fs-xs:12px;   --lh-xs:1.4;
  --fs-sm:14px;   --lh-sm:1.4;
  --fs-base:16px; --lh-base:1.4;
  --fs-lg:18px;   --lh-lg:1.4;
  --fs-xl:20px;   --lh-xl:1.4;
  --fs-2xl:24px;  --lh-2xl:1.3;
  --fs-3xl:32px;  --lh-3xl:1.2;

  /* Radios */
  --r-sm:4px;
  --r-md:8px;
  --r-pill:24px;

  /* Layout */
  --gutter:80px;
  --max:1440px;
}

*,*::before,*::after{box-sizing:border-box}

html{scroll-behavior:smooth}

body{
  margin:0;
  background:var(--black);
  color:var(--white);
  font-family:var(--font-sans);
  font-size:var(--fs-base);
  line-height:var(--lh-base);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

img{max-width:100%;display:block}
h1,h2,h3,p,figure,blockquote,ul{margin:0}
ul{list-style:none;padding:0}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}

:focus-visible{outline:2px solid var(--yellow-100);outline-offset:3px}

.skip-link{
  position:absolute;left:-9999px;top:0;z-index:100;
  background:var(--yellow-100);color:var(--black);padding:12px 16px;border-radius:0 0 var(--r-sm) 0;
}
.skip-link:focus{left:0}

/* ---------- Utilidades de layout ---------- */
.seccion{
  width:100%;
  max-width:var(--max);
  margin-inline:auto;
  padding-inline:var(--gutter);
}

/* =========================================================
   MENU
   ========================================================= */
.menu{
  position:absolute;top:0;left:0;right:0;z-index:20;
  height:94px;
  display:flex;align-items:center;justify-content:space-between;gap:24px;
  max-width:var(--max);margin-inline:auto;
  padding:24px var(--gutter);
  background:linear-gradient(180deg,rgba(10,10,10,.85) 0%,rgba(10,10,10,0) 100%);
}
.menu__logo{
  font-family:var(--font-serif);
  font-size:var(--fs-3xl);
  line-height:1.1;
  letter-spacing:.32px;
}
.menu__nav{display:flex;align-items:center;gap:24px}
.menu__list{display:flex;align-items:center;gap:16px}
.menu__list a{
  display:flex;align-items:center;height:44px;padding:0 8px;
  font-size:var(--fs-xl);line-height:var(--lh-xl);
}
.menu__list a:hover{color:var(--yellow-100)}
.menu__list a.es-actual{font-weight:700;box-shadow:inset 0 -2px 0 0 var(--white)}
.menu-movil a.es-actual{color:var(--yellow-50)}
.menu__sep{width:1px;height:16px;background:var(--white);opacity:.6}
.menu__lang{
  display:flex;align-items:center;justify-content:center;gap:4px;
  height:44px;min-width:64px;padding:0 8px;
  font-size:var(--fs-base);
}
.menu__burger{display:none;width:44px;height:44px;padding:0}

/* Menú móvil */
.menu-movil{
  position:fixed;inset:0;z-index:40;
  background:var(--black);
  display:flex;flex-direction:column;align-items:flex-start;gap:8px;
  padding:16px;
}
.menu-movil[hidden]{display:none}
.menu-movil__cerrar{align-self:flex-end;width:44px;height:44px;padding:0}
.menu-movil nav{width:100%;margin-top:8px}
.menu-movil li a{
  display:flex;align-items:center;
  min-height:56px;
  font-family:var(--font-serif);
  font-size:var(--fs-3xl);
}

/* =========================================================
   HERO
   ========================================================= */
.hero{
  position:relative;
  height:740px;
  max-width:var(--max);margin-inline:auto;
  overflow:hidden;
}
.hero__img{
  position:absolute;inset:0;
  width:100%;height:100%;
  object-fit:cover;object-position:center 20%;
}
.hero::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(0,0,0,0) 60%,var(--black) 100%);
}
.hero__texto{
  position:absolute;z-index:2;
  left:var(--gutter);
  top:50%;transform:translateY(-50%);
  display:flex;flex-direction:column;gap:16px;
}
.hero__titulo{
  font-family:var(--font-serif);
  font-weight:400;
  font-size:80px;line-height:1.1;letter-spacing:.8px;
}
.hero__rol{
  color:var(--grey-200);
  font-size:var(--fs-2xl);line-height:var(--lh-2xl);
}

/* =========================================================
   CITA
   ========================================================= */
.cita{
  display:flex;align-items:center;gap:48px;
  max-width:var(--max);margin-inline:auto;
  padding:64px var(--gutter);
}
.cita__foto{
  flex:0 0 400px;
  height:539px;
  border-radius:var(--r-sm);
  overflow:hidden;
}
.cita__foto img{width:100%;height:100%;object-fit:cover}
.cita__texto{
  flex:1 1 auto;min-width:0;
  text-align:center;
  font-size:var(--fs-3xl);
  line-height:var(--lh-base);
}

/* =========================================================
   BLOQUE DE TEXTO (título + párrafo + enlace)
   ========================================================= */
.bloque-texto{
  flex:0 0 405px;
  display:flex;flex-direction:column;justify-content:space-between;gap:24px;
  align-self:stretch;
}
.bloque-texto__cabecera{display:flex;flex-direction:column;gap:24px}
.bloque-texto h2{
  font-family:var(--font-serif);
  font-weight:700;
  font-size:40px;line-height:1.2;
}
.bloque-texto p{font-size:var(--fs-base);line-height:var(--lh-base)}

.enlace{
  display:inline-flex;align-items:center;gap:4px;
  height:40px;padding:4px 0;
  font-size:var(--fs-base);
  width:max-content;
}
.enlace span{border-bottom:1px solid transparent;padding:2px 0;transition:border-color .15s}
.enlace:hover span{border-bottom-color:var(--white)}
.enlace--movil{display:none}
.enlace--centrado{margin-inline:auto}

/* =========================================================
   PANEL (caja translúcida)
   ========================================================= */
.panel{
  flex:1 1 auto;min-width:0;
  background:var(--surface);
  border-radius:var(--r-sm);
  padding:24px;
}
.panel--galeria{
  display:flex;align-items:center;gap:48px;
  border-radius:var(--r-md);
  padding:40px;
}

/* =========================================================
   CARRUSELES
   ========================================================= */
.carrusel{min-width:0}
.carrusel__pista{display:grid}
.carrusel__pie{display:none}
.flechas{display:flex;align-items:center}
.flecha{
  display:flex;align-items:center;justify-content:center;
  width:40px;height:40px;
}
.flecha[disabled]{opacity:.35;cursor:default}

/* =========================================================
   SECCIÓN PREMIOS
   ========================================================= */
.seccion--premios{
  display:flex;align-items:center;gap:32px;
  padding-block:24px;
}
.pista--premios{
  grid-template-columns:repeat(3,1fr);
  gap:16px;
}

.card-premio{
  background:var(--white);
  color:var(--black);
  border-radius:var(--r-sm);
  padding:16px;
  min-height:200px;
  display:flex;flex-direction:column;justify-content:space-between;gap:16px;
  overflow:hidden;
}
.card-premio__top{display:flex;flex-direction:column;gap:12px}
.card-premio__fila{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}
.card-premio__icono{flex:0 0 40px;width:40px;height:40px}
.card-premio__nombres{display:flex;flex-direction:column;gap:8px}
.card-premio__nombres h3{font-size:var(--fs-lg);line-height:var(--lh-lg);font-weight:700}
.card-premio__nombres p{font-size:var(--fs-sm);line-height:var(--lh-sm)}
.card-premio__lugar{
  display:flex;align-items:center;gap:8px;
  font-size:var(--fs-sm);line-height:var(--lh-sm);
}
.card-premio__lugar img{flex:0 0 20px;width:20px;height:20px}

.chip{
  display:inline-flex;align-items:center;justify-content:center;
  align-self:flex-start;flex:0 0 auto;
  padding:4px 12px;
  border-radius:var(--r-pill);
  background:var(--red-50);
  white-space:nowrap;
}
.chip--premio{
  border:.5px solid var(--red-500);
  color:var(--red-500);
  font-size:var(--fs-xs);line-height:var(--lh-xs);
}
.chip--fecha{
  border:.5px solid var(--red-600);
  color:var(--red-600);
  font-size:var(--fs-sm);line-height:var(--lh-sm);font-weight:700;
}

/* =========================================================
   SECCIÓN REPERTORIO
   ========================================================= */
.seccion--repertorio{
  display:flex;align-items:flex-start;gap:64px;
  padding-block:64px;
}
.carrusel--repertorio{flex:1 1 auto}
.pista--repertorio{
  grid-template-columns:repeat(3,1fr);
  gap:16px;
}
.card-repertorio{
  background:var(--surface);
  border-radius:var(--r-sm);
  padding:24px;
  min-height:104px;
  display:flex;flex-direction:column;gap:8px;
}
.card-repertorio h3{font-size:var(--fs-xl);line-height:var(--lh-xl);font-weight:700}
.card-repertorio p{font-size:var(--fs-sm);line-height:var(--lh-sm)}

/* =========================================================
   SECCIÓN GALERÍA
   ========================================================= */
.seccion--galeria{padding-block:24px}
.bloque-texto--galeria{flex:0 0 380px}
.carrusel--galeria{flex:1 1 auto}
.pista--galeria{
  grid-template-columns:repeat(3,1fr);
  gap:8px;
  border-radius:var(--r-sm);
  overflow:hidden;
}
.pista--galeria figure{aspect-ratio:2/3}
.pista--galeria img{width:100%;height:100%;object-fit:cover}

/* =========================================================
   SECCIÓN ACTUACIONES
   ========================================================= */
.seccion--actuaciones{
  display:flex;align-items:stretch;gap:142px;
  padding-top:40px;padding-bottom:64px;
}
.card-actuacion{
  flex:0 1 733px;
  display:flex;
  border-radius:var(--r-sm);
  overflow:hidden;
  background:var(--white);
  color:var(--black);
}
.card-actuacion__foto{flex:0 0 240px;height:240px;overflow:hidden}
.card-actuacion__foto img{width:100%;height:100%;object-fit:cover}
.card-actuacion__cuerpo{
  flex:1 1 auto;min-width:0;
  display:flex;flex-direction:column;gap:16px;
  padding:16px 24px;
}
.card-actuacion__detalle{
  flex:1 1 auto;
  display:flex;flex-direction:column;justify-content:space-between;gap:16px;
}
.card-actuacion__detalle h3{font-size:var(--fs-3xl);line-height:var(--lh-3xl);font-weight:700;margin-bottom:12px}
.card-actuacion__sede{font-size:var(--fs-lg);line-height:var(--lh-lg)}
.card-actuacion__lugar{
  display:flex;align-items:center;gap:8px;
  font-size:var(--fs-sm);line-height:var(--lh-sm);
}
.card-actuacion__lugar img{flex:0 0 20px;width:20px;height:20px}

/* =========================================================
   FOOTER
   ========================================================= */
.pie{
  background:var(--grey-900);
  padding:40px var(--gutter) 24px;
  max-width:var(--max);margin-inline:auto;
  display:flex;flex-direction:column;gap:40px;
}
.pie__superior{display:flex;align-items:flex-start;justify-content:space-between;gap:40px}
.pie__logo{
  font-family:var(--font-serif);
  font-size:80px;line-height:1.05;
  color:var(--yellow-50);
}
.pie__cols{
  flex:0 1 843px;
  display:flex;align-items:flex-start;justify-content:space-between;gap:24px;
}
.pie__nav a{
  display:flex;align-items:center;height:44px;padding:0 8px;
  font-size:var(--fs-base);
}
.pie__nav a:hover,.pie__contacto a:hover,.pie__legales a:hover{color:var(--yellow-100)}
.pie__contacto a{
  display:flex;align-items:center;gap:8px;height:44px;padding:8px;
  font-size:var(--fs-base);
}
.pie__contacto img{flex:0 0 24px;width:24px;height:24px}
.pie__inferior{border-top:1px solid var(--grey-500);padding-top:8px}
.pie__legales{
  display:flex;flex-wrap:wrap;justify-content:flex-end;gap:16px;
}
.pie__legales a{
  display:flex;align-items:center;height:44px;padding:0 8px;
  font-size:var(--fs-sm);
}

/* =========================================================
   PÁGINAS INTERIORES
   ========================================================= */

/* Cabecera de página */
.cabecera{
  position:relative;
  height:200px;
  max-width:var(--max);margin-inline:auto;
  overflow:hidden;
}
.cabecera img{
  position:absolute;inset:0;
  width:100%;height:100%;
  object-fit:cover;object-position:center 30%;
}
.cabecera::after{
  content:"";position:absolute;inset:0;
  background:
    linear-gradient(90deg,rgba(0,0,0,.2) 0%,rgba(0,0,0,.2) 100%),
    linear-gradient(180deg,rgba(0,0,0,0) 0%,var(--black) 100%);
}

/* Migas de pan */
.migas{
  display:flex;flex-wrap:wrap;align-items:center;gap:4px;
  max-width:var(--max);margin-inline:auto;
  padding:16px var(--gutter);
  color:var(--grey-500);
  font-size:var(--fs-sm);line-height:var(--lh-sm);
}
.migas a{display:inline-flex;align-items:center;gap:4px;border-bottom:1px solid var(--grey-500)}
.migas a:hover{color:var(--white);border-bottom-color:var(--white)}
.migas img{display:block}
.migas__sep{flex:0 0 12px;width:12px;height:12px}

/* Bloque de página */
.pagina{
  max-width:var(--max);margin-inline:auto;
  padding:32px var(--gutter) 48px;
}
.titulo-pagina{
  font-family:var(--font-serif);
  font-weight:700;
  font-size:48px;line-height:1.2;
}
.titulo-seccion{
  font-family:var(--font-serif);
  font-weight:700;
  font-size:40px;line-height:1.2;
}

/* Botón */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  min-width:88px;height:40px;padding:8px 16px;
  background:var(--red-500);
  border-radius:var(--r-sm);
  font-size:var(--fs-base);line-height:var(--lh-base);
  color:var(--white);
  width:max-content;
  transition:background-color .15s;
}
.btn:hover{background:var(--red-600)}
.btn img{flex:0 0 16px;width:16px;height:16px}

/* =========================================================
   MI HISTORIA
   ========================================================= */
.historia{display:flex;align-items:flex-start;gap:196px}
.historia__texto{flex:0 0 460px;display:flex;flex-direction:column;gap:40px}
.historia__texto .prosa p+p{margin-top:16px}
.historia__foto{
  flex:0 1 515px;
  border-radius:var(--r-sm);
  overflow:hidden;
  align-self:flex-start;
}
.historia__foto img{width:100%;height:auto;display:block}

.panel--premios{
  background:var(--surface);
  border-radius:var(--r-md);
  padding:48px;
  display:flex;flex-direction:column;gap:32px;
}
.rejilla-premios{
  display:flex;flex-wrap:wrap;gap:20px;
}
.rejilla-premios .card-premio{flex:0 0 280px;width:280px}

/* =========================================================
   REPERTORIO
   ========================================================= */
.rejilla-repertorio{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:16px;
}
.bloque-lista{display:flex;flex-direction:column;gap:32px}
.pagina--repertorio{display:flex;flex-direction:column;gap:64px;padding-bottom:64px}

/* =========================================================
   AGENDA
   ========================================================= */
.rejilla-agenda{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:32px;
}
.card-actuacion--l{flex:1 1 auto}
.card-actuacion--l .card-actuacion__foto{flex:0 0 220px;height:220px}
.card-actuacion--l .card-actuacion__detalle h3{
  font-size:var(--fs-2xl);line-height:var(--lh-2xl);margin-bottom:8px;
}
.card-actuacion--l .card-actuacion__sede{font-size:var(--fs-base)}

/* =========================================================
   MEDIA
   ========================================================= */
.pagina--media{display:flex;flex-direction:column;align-items:center;gap:40px}
.media__cabecera{
  display:flex;align-items:flex-end;justify-content:space-between;gap:24px;
  width:100%;
}
.dropdown{
  display:flex;align-items:center;justify-content:space-between;gap:8px;
  width:140px;height:40px;
  padding:8px 12px 8px 16px;
  background:var(--grey-900);
  border:.25px solid var(--white);
  border-radius:var(--r-sm);
  font-size:var(--fs-base);
}
.dropdown img{flex:0 0 16px;width:16px;height:16px}

.rejilla-media{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
  width:100%;
}
.foto-media{
  position:relative;
  display:block;
  width:100%;
  padding:0;border:0;
  aspect-ratio:416/320;
  overflow:hidden;
  cursor:zoom-in;
  background:var(--grey-900);
}
.foto-media img{
  width:100%;height:100%;
  object-fit:cover;
  transition:transform .3s ease;
}
.foto-media:hover img{transform:scale(1.04)}

.paginador{display:flex;align-items:center;justify-content:center;gap:8px}
.paginador__nums{display:flex;align-items:center;gap:4px}
.paginador button,.paginador a{
  display:flex;align-items:center;justify-content:center;
  min-width:32px;height:40px;padding:8px;
  border-radius:var(--r-sm);
  font-size:var(--fs-base);
}
.paginador .es-actual{
  background:var(--yellow-50);
  color:var(--black);
  font-weight:700;
}
.paginador__flecha{width:24px;min-width:24px;height:24px;padding:0}

/* Lightbox */
.lightbox{
  position:fixed;inset:0;z-index:50;
  display:flex;align-items:center;justify-content:center;gap:40px;
  padding:120px;
  background:rgba(0,0,0,.9);
}
.lightbox[hidden]{display:none}
.lightbox__img{
  max-width:calc(100% - 200px);max-height:100%;
  width:auto;height:auto;
  object-fit:contain;
}
.lightbox__nav{
  flex:0 0 40px;
  display:flex;align-items:center;justify-content:center;
  width:40px;height:40px;
  background:var(--black);
  border-radius:50%;
}
.lightbox__cerrar{
  position:absolute;top:24px;right:20px;
  width:44px;height:44px;
}

/* =========================================================
   CONTACTO
   ========================================================= */
.contacto{display:flex;align-items:flex-start;gap:141px}
.contacto__col{flex:0 0 515px;display:flex;flex-direction:column;gap:40px}
.contacto__foto{
  flex:0 1 624px;
  border-radius:var(--r-sm);
  overflow:hidden;
  align-self:flex-start;
}
.contacto__foto img{width:100%;height:auto;display:block}

.formulario{display:flex;flex-direction:column;gap:24px}
.formulario__fila{display:flex;gap:24px}
.campo{flex:1 1 0;min-width:0;display:flex;flex-direction:column;gap:12px}
.campo label{
  display:flex;align-items:center;gap:4px;
  font-size:var(--fs-base);font-weight:700;
}
.campo .req{color:var(--red-400)}
.campo input,.campo textarea{
  width:100%;
  padding:8px 16px;
  background:var(--grey-900);
  border:.25px solid var(--white);
  border-radius:var(--r-sm);
  color:var(--white);
  font:inherit;
}
.campo input{height:44px}
.campo textarea{height:120px;padding:12px 16px;resize:vertical}
.campo ::placeholder{color:var(--grey-300);opacity:1}
.campo input:focus,.campo textarea:focus{border-color:var(--yellow-100);outline:none}

.panel--contacto{
  background:var(--surface);
  border-radius:var(--r-md);
  padding:48px;
  display:flex;align-items:flex-start;justify-content:space-between;gap:48px;
}
.panel--contacto .contacto__imagen{
  flex:0 1 467px;
  border-radius:var(--r-sm);
  overflow:hidden;
}
.panel--contacto .contacto__imagen img{width:100%;height:100%;object-fit:cover;display:block}
.contacto__redes{flex:0 1 656px;display:flex;flex-direction:column;gap:32px}
.rejilla-redes{display:flex;flex-wrap:wrap;gap:16px}
.card-red{
  flex:0 1 320px;
  display:flex;flex-direction:column;justify-content:center;gap:16px;
  padding:16px 20px;
  background:rgba(255,255,255,.2);
  border:1px solid var(--grey-600);
  border-radius:var(--r-sm);
  transition:border-color .15s;
}
.card-red:hover{border-color:var(--yellow-100)}
.card-red__tipo{display:flex;align-items:center;gap:8px;font-size:var(--fs-base)}
.card-red__tipo img{flex:0 0 24px;width:24px;height:24px}
.card-red__valor{font-size:var(--fs-lg);line-height:var(--lh-lg);font-weight:700;word-break:break-word}

/* =========================================================
   TABLET  (≤1200px) — se mantiene la retícula de escritorio
   ========================================================= */
@media (max-width:1200px){
  :root{--gutter:40px}
  .hero__titulo{font-size:64px}
  .pie__logo{font-size:64px}
  .bloque-texto{flex:0 0 340px}
  .bloque-texto h2{font-size:34px}
  .seccion--actuaciones{gap:48px}
  .cita{gap:32px}
  .cita__foto{flex:0 0 300px;height:420px}
  .cita__texto{font-size:var(--fs-2xl)}
  .panel--galeria{gap:32px;padding:32px}
  .bloque-texto--galeria{flex:0 0 300px}
  .pie__cols{flex-wrap:wrap;gap:16px 32px;justify-content:flex-start}

  .historia{gap:48px}
  .historia__texto{flex:0 1 460px}
  .panel--premios{padding:32px}
  .rejilla-repertorio{grid-template-columns:repeat(3,1fr)}
  .rejilla-agenda{grid-template-columns:1fr}
  .rejilla-media{grid-template-columns:repeat(2,1fr)}
  .contacto{gap:48px}
  .contacto__col{flex:1 1 420px}
  .panel--contacto{flex-wrap:wrap;padding:32px;gap:32px}
  .contacto__redes{flex:1 1 100%}
  .lightbox{padding:64px 24px}
  .lightbox__img{max-width:calc(100% - 160px)}
}

/* =========================================================
   MÓVIL  (≤900px) — retícula del frame "Home mbl" (375px)
   ========================================================= */
@media (max-width:900px){
  :root{--gutter:16px}

  /* Menú */
  .menu{
    height:80px;
    padding:16px var(--gutter) 16px 20px;
    background:linear-gradient(180deg,var(--black) 0%,rgba(0,0,0,0) 100%);
  }
  .menu__logo{font-size:var(--fs-2xl);letter-spacing:.24px}
  .menu__nav{display:none}
  .menu__burger{display:block}

  /* Hero */
  .hero{height:600px}
  .hero::after{background:linear-gradient(180deg,rgba(0,0,0,0) 50%,var(--black) 100%)}
  .hero__texto{
    left:25px;right:25px;
    top:auto;bottom:24px;transform:none;
    gap:8px;
  }
  .hero__titulo{font-size:64px;letter-spacing:0}
  .hero__rol{font-size:var(--fs-xl);line-height:var(--lh-xl)}

  /* Cita */
  .cita{
    flex-direction:column;align-items:center;gap:32px;
    padding:24px var(--gutter);
  }
  .cita__foto{flex:0 0 auto;width:100%;height:auto;aspect-ratio:343/462}
  .cita__texto{font-size:var(--fs-2xl);line-height:var(--lh-base)}

  /* Bloques de texto */
  .bloque-texto{flex:0 0 auto;width:100%;gap:32px}
  .bloque-texto__cabecera{gap:16px}
  .bloque-texto h2{font-size:var(--fs-3xl);line-height:1.3;letter-spacing:.32px}
  .enlace--desktop{display:none}
  .enlace--movil{display:inline-flex}
  .enlace span{border-bottom-color:var(--white)}

  /* Carruseles: una página por pantalla, scroll con snap */
  .carrusel__pista{
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    scrollbar-width:none;
    -ms-overflow-style:none;
  }
  .carrusel__pista::-webkit-scrollbar{display:none}
  .carrusel__pie{
    display:flex;align-items:center;justify-content:space-between;gap:16px;
    margin-top:8px;
  }

  /* Premios */
  .seccion--premios{flex-direction:column;align-items:stretch;gap:32px;padding-block:24px}
  .panel{padding:16px 16px 8px}
  .pista--premios{
    grid-auto-flow:column;
    grid-auto-columns:100%;
    grid-template-columns:none;
  }
  .card-premio{scroll-snap-align:start;min-height:0;gap:16px}

  /* Repertorio: 3 páginas de 2 tarjetas */
  .seccion--repertorio{flex-direction:column-reverse;align-items:stretch;gap:32px;padding-block:24px}
  .pista--repertorio{
    grid-template-columns:repeat(3,100%);
    grid-template-rows:repeat(2,auto);
    grid-auto-flow:row;
    gap:8px 16px;
  }
  .card-repertorio{
    scroll-snap-align:start;
    min-height:0;
    padding:16px 24px;
  }
  .card-repertorio h3{font-size:var(--fs-lg);line-height:var(--lh-lg)}

  /* Galería */
  .seccion--galeria{padding-block:24px}
  .panel--galeria{
    flex-direction:column;align-items:stretch;gap:32px;
    padding:40px 24px 24px;
  }
  .bloque-texto--galeria{flex:0 0 auto}
  .pista--galeria{
    grid-auto-flow:column;
    grid-auto-columns:100%;
    grid-template-columns:none;
    gap:8px;
    overflow:auto hidden;
  }
  .pista--galeria figure{scroll-snap-align:start;aspect-ratio:295/443}

  /* Actuaciones */
  .seccion--actuaciones{
    flex-direction:column;align-items:stretch;gap:32px;
    padding-block:32px;
  }
  .card-actuacion{flex:0 0 auto;flex-direction:column}
  .card-actuacion__foto{flex:0 0 auto;width:100%;height:220px}
  .card-actuacion__cuerpo{gap:32px;padding:16px}
  .card-actuacion__detalle{gap:16px}
  .card-actuacion__detalle h3{font-size:var(--fs-2xl);line-height:var(--lh-2xl)}
  .card-actuacion__sede{font-size:var(--fs-base)}

  /* Footer */
  .pie{padding:32px var(--gutter) 24px;gap:32px}
  .pie__superior{flex-direction:column;gap:24px}
  .pie__logo{font-size:64px;line-height:1}
  .pie__cols{flex:0 0 auto;width:100%;flex-wrap:wrap;gap:0 0}
  .pie__nav{flex:0 0 50%}
  .pie__contacto{flex:0 0 100%}
  .pie__contacto a{font-size:var(--fs-sm)}
  .pie__legales{justify-content:flex-start}

  /* ---- Páginas interiores en móvil ---- */
  .cabecera{height:140px}
  .migas{padding:16px var(--gutter)}
  .pagina{padding:24px var(--gutter) 32px}
  .titulo-pagina{font-size:40px}
  .titulo-seccion{font-size:var(--fs-3xl);line-height:1.3;letter-spacing:.32px}

  .historia{flex-direction:column;gap:24px}
  .historia__texto{flex:0 0 auto;width:100%;gap:24px;order:2}
  .historia__foto{flex:0 0 auto;width:100%;order:1}
  .btn{width:100%;max-width:none}

  .panel--premios{padding:24px 16px;gap:24px}
  .rejilla-premios{flex-direction:column;gap:16px}
  .rejilla-premios .card-premio{flex:0 0 auto;width:100%}

  .pagina--repertorio{gap:32px;padding-bottom:32px}
  .rejilla-repertorio{grid-template-columns:1fr;gap:8px}
  .bloque-lista{gap:16px}

  .rejilla-agenda{grid-template-columns:1fr;gap:16px}
  .card-actuacion--l{flex-direction:column}
  .card-actuacion--l .card-actuacion__foto{flex:0 0 auto;width:100%;height:220px}

  .pagina--media{gap:24px}
  .media__cabecera{align-items:center}
  .rejilla-media{grid-template-columns:1fr}
  .foto-media{aspect-ratio:343/264}

  .contacto{flex-direction:column;gap:24px}
  .contacto__col{flex:0 0 auto;width:100%;gap:24px}
  .contacto__foto{flex:0 0 auto;width:100%}
  .formulario__fila{flex-direction:column;gap:24px}

  .panel--contacto{flex-direction:column;padding:24px 16px;gap:24px}
  .panel--contacto .contacto__imagen{flex:0 0 auto;width:100%}
  .contacto__redes{flex:0 0 auto;width:100%;gap:24px}
  .rejilla-redes{flex-direction:column}
  .card-red{flex:0 0 auto;width:100%}

  .lightbox{flex-wrap:wrap;padding:64px 16px 24px;gap:16px}
  .lightbox__img{order:-1;flex:0 0 100%;max-width:100%}
  .lightbox__cerrar{right:8px;top:8px}
}

@media (max-width:400px){
  .hero__titulo,.pie__logo{font-size:56px}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
}