/* =============================================================
   CREANS + GROUP — hoja de estilos
   Identidad según MANUAL_MARCA_CREANS+ (2022):
   negro y blanco principales, gris #B2B2B2 y naranjo #FE5000
   secundarios. Sin esquinas redondeadas, sin sombras.
   1 Tokens · 2 Reset · 3 Utilidades · 4 Marca · 5 Componentes
   6 Secciones · 7 Ficha · 8 Efectos · 9 Responsive
   ============================================================= */

/* ---------------- 1 TOKENS ---------------- */
:root{
  --blanco:  #FFFFFF;
  --negro:   #000000;
  --gris:    #B2B2B2;          /* gris de marca — reglas y detalles */
  --naranjo: #FE5000;          /* Pantone Orange 021 C */

  --tinta:   #000000;
  --tinta-2: #1A1A1A;
  --tinta-3: #6B6B6B;          /* texto secundario legible sobre blanco */
  --velo:    #F4F4F4;

  --linea:        rgba(0,0,0,.14);
  --linea-suave:  rgba(0,0,0,.07);
  --linea-fuerte: rgba(0,0,0,.42);

  --display: "Archivo","Helvetica Neue",Helvetica,Arial,sans-serif;
  --texto:   "Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --mono:    "IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace;

  --gut:  clamp(18px,4.4vw,64px);
  --rule: 1px;
  --cab:  66px;

  --ease:  cubic-bezier(.16,1,.3,1);
  --ease2: cubic-bezier(.25,.46,.45,.94);
}

/* ---------------- 2 RESET ---------------- */
*,*::before,*::after{ box-sizing:border-box; margin:0; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; scroll-padding-top:calc(var(--cab) + 10px); }
body{
  background:var(--blanco); color:var(--tinta);
  font-family:var(--texto); font-size:16px; font-weight:300; line-height:1.6;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  overflow-x:clip; overscroll-behavior-y:none;
}
img,svg,video{ display:block; max-width:100%; }
img{ height:auto; background:var(--velo); }
button{ font:inherit; color:inherit; cursor:pointer; border:0; background:none; padding:0; }
a{ color:inherit; text-decoration:none; }
p{ text-wrap:pretty; }
ul,ol{ list-style:none; padding:0; }
h1,h2,h3,h4{ font-family:var(--display); font-weight:600; line-height:1.02; letter-spacing:-.03em; text-wrap:balance; }
::selection{ background:var(--naranjo); color:var(--blanco); }
:focus-visible{ outline:2px solid var(--naranjo); outline-offset:3px; }
*{ border-radius:0 !important; box-shadow:none !important; }

/* ---------------- 3 UTILIDADES ---------------- */
.salto{
  position:fixed; top:-120px; left:16px; z-index:9999;
  background:var(--negro); color:var(--blanco);
  padding:.7rem 1.1rem; font-family:var(--mono); font-size:12px;
}
.salto:focus{ top:16px; }

.meta,.sec-num,.sec-tag,.filtro,.tarjeta-num,.tarjeta-info,.franja,
.pie-grid,.pie-legal,.ficha-num,.nota,.campo label,.lista-idx-cab,
.dato dt,.splash-meta,.unidad-num,.cifra dd,figcaption,.credito{
  font-family:var(--mono); font-weight:400; font-size:11px;
  letter-spacing:.13em; text-transform:uppercase; line-height:1.5;
}

/* ---------------- 4 MARCA ---------------- */
/* Construcción del logotipo según manual: concepto / signo + / concepto,
   con distancia (x) a cada lado del signo. */
.marca{ display:inline-flex; align-items:baseline; font-family:var(--display); letter-spacing:-.01em; white-space:nowrap; }
.marca .mas{ font-weight:300; padding:0 .34em; }
.marca .w1{ font-weight:600; }
.marca .w2{ font-weight:400; }

/* ---------------- 5 COMPONENTES ---------------- */
.splash{
  position:fixed; inset:0; z-index:1000; background:var(--negro); color:var(--blanco);
  display:grid; place-items:center;
}
.splash-inner{ text-align:center; }
.splash .marca{ font-size:clamp(30px,6.4vw,64px); }
.splash .mas{ color:var(--naranjo); }
.splash-meta{ display:block; margin-top:1rem; color:rgba(255,255,255,.48); }
.splash-bar{ position:absolute; left:0; right:0; bottom:0; height:2px; background:rgba(255,255,255,.16); }
.splash-bar i{ display:block; height:100%; width:0; background:var(--naranjo); animation:barra 1.35s var(--ease2) forwards; }
@keyframes barra{ to{ width:100% } }
.splash.fuera{ opacity:0; visibility:hidden; transition:opacity .55s var(--ease),visibility .55s; }

.reglas{ position:fixed; inset:0; z-index:1; pointer-events:none; display:none; padding:0 var(--gut); grid-template-columns:repeat(6,1fr); }
.reglas i{ border-left:var(--rule) solid var(--linea-suave); }

.riel{ position:fixed; top:0; left:0; right:0; height:2px; z-index:120; pointer-events:none; }
.riel i{ display:block; height:100%; width:0; background:var(--naranjo); }

.cabecera{
  position:fixed; top:0; left:0; right:0; z-index:140; height:var(--cab);
  display:flex; align-items:center; justify-content:space-between; padding:0 var(--gut);
  background:rgba(255,255,255,.9); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
  border-bottom:var(--rule) solid transparent;
  transition:border-color .4s var(--ease);
}
.cabecera.pegada{ border-bottom-color:var(--linea); }
.cabecera .marca{ font-size:17px; }
.cabecera .mas{ color:var(--naranjo); }

.nav{ display:none; align-items:center; gap:2rem; }
.nav a{ position:relative; font-family:var(--mono); font-size:11px; letter-spacing:.13em; text-transform:uppercase; padding:.35rem 0; }
.nav a::after{ content:""; position:absolute; left:0; bottom:0; height:1px; width:0; background:var(--negro); transition:width .4s var(--ease); }
.nav a:hover::after,.nav a.activo::after{ width:100%; }
.nav a.activo{ color:var(--naranjo); }
.nav a.activo::after{ background:var(--naranjo); }
.nav .cta{ border:var(--rule) solid var(--negro); padding:.5rem .9rem; }
.nav .cta::after{ display:none; }
.nav .cta:hover{ background:var(--negro); color:var(--blanco); }

.hamb{ display:flex; flex-direction:column; gap:5px; width:26px; padding:8px 0; }
.hamb i{ display:block; height:1.5px; width:100%; background:var(--negro); transition:transform .35s var(--ease); }
.hamb[aria-expanded="true"] i:nth-child(1){ transform:translateY(3.25px) rotate(45deg); }
.hamb[aria-expanded="true"] i:nth-child(2){ transform:translateY(-3.25px) rotate(-45deg); }

.nav-movil[hidden]{ display:none !important; }
.nav-movil{
  position:fixed; inset:var(--cab) 0 0; z-index:135; background:var(--blanco);
  display:flex; flex-direction:column; justify-content:center; padding:0 var(--gut) 12vh;
  border-top:var(--rule) solid var(--linea);
}
.nav-movil > a{
  font-family:var(--display); font-weight:500; letter-spacing:-.03em;
  font-size:clamp(30px,8.6vw,48px); line-height:1.28;
  border-bottom:var(--rule) solid var(--linea); padding:.3em 0;
}
.nav-movil > a:active{ color:var(--naranjo); }
.nav-movil-pie{ margin-top:2.2rem; display:flex; flex-direction:column; gap:.4rem;
  font-family:var(--mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--tinta-3); }

.btn{
  display:inline-flex; align-items:center; justify-content:center;
  font-family:var(--mono); font-size:11px; letter-spacing:.15em; text-transform:uppercase;
  padding:1rem 1.7rem; border:var(--rule) solid var(--negro);
  transition:background .32s var(--ease), color .32s var(--ease), border-color .32s var(--ease);
}
.btn-solido{ background:var(--negro); color:var(--blanco); }
.btn-solido:hover{ background:var(--naranjo); border-color:var(--naranjo); }
.btn-linea:hover{ background:var(--negro); color:var(--blanco); }
.btn-bloque{ width:100%; }

/* ---------------- 6 SECCIONES ---------------- */
.seccion{ position:relative; z-index:2; padding:clamp(56px,7vw,110px) var(--gut); border-top:var(--rule) solid var(--linea); }
.seccion-cab{ display:flex; align-items:baseline; gap:1.1rem; padding-bottom:clamp(24px,3vw,44px); color:var(--tinta-3); }
.sec-num{ color:var(--naranjo); }
.sec-tag{ color:var(--tinta); }

/* HERO */
.hero{ position:relative; z-index:2; padding:calc(var(--cab) + clamp(26px,5vw,54px)) var(--gut) 0;
  min-height:100svh; display:flex; flex-direction:column; justify-content:space-between; }
.hero-grid{ display:grid; gap:clamp(28px,5vw,58px); padding-bottom:clamp(30px,4vw,50px); }
.hero-titulo{ margin:clamp(16px,2.4vw,26px) 0 0; }
.hero-linea{
  display:block; font-size:clamp(36px,7vw,94px); font-weight:600; letter-spacing:-.045em; line-height:.94;
  border-bottom:var(--rule) solid var(--linea); padding-bottom:.06em; margin-bottom:.06em;
}
.hero-linea--acento{ color:var(--naranjo); border-bottom-color:var(--naranjo); }
.hero-bajada{ max-width:48ch; margin-top:clamp(18px,2.4vw,28px); font-size:clamp(15px,1.5vw,18px); color:var(--tinta-2); }
.hero-acciones{ display:flex; flex-wrap:wrap; gap:.7rem; margin-top:clamp(20px,2.4vw,30px); }
.hero-fig{ position:relative; }
.hero-fig-marco{ overflow:hidden; border:var(--rule) solid var(--negro); aspect-ratio:4/3; }
.hero-fig-marco img{ width:100%; height:100%; object-fit:cover; will-change:transform; }
.hero-fig figcaption{ margin-top:.7rem; color:var(--tinta-3); }
.franja{ display:flex; flex-wrap:wrap; gap:.9rem 1.8rem; padding:1.05rem 0; color:var(--tinta-3); border-top:var(--rule) solid var(--linea); }
.hero-scroll{ display:none; margin-left:auto; align-items:center; gap:.6rem; color:var(--tinta); }
.hero-scroll i{ display:block; width:1px; height:14px; background:var(--naranjo); animation:tic 1.9s var(--ease2) infinite; }
@keyframes tic{ 0%,100%{ transform:translateY(0); opacity:1 } 50%{ transform:translateY(6px); opacity:.3 } }

/* ESTUDIO / MANIFIESTO */
.manif-grid{ display:grid; gap:clamp(28px,4.5vw,64px); }
.declaracion{ font-family:var(--display); font-weight:500; letter-spacing:-.035em; line-height:1.04;
  font-size:clamp(25px,4.2vw,54px); max-width:21ch; }
.declaracion em{ font-style:normal; color:var(--naranjo); }
.manif-cuerpo{ display:grid; gap:1.15rem; max-width:62ch; }
.manif-cuerpo p{ font-size:clamp(15px,1.35vw,17px); color:var(--tinta-2); }

/* MARQUESINA */
.marquesina{ overflow:hidden; white-space:nowrap; border-top:var(--rule) solid var(--linea);
  border-bottom:var(--rule) solid var(--linea); padding:1rem 0; position:relative; z-index:2; background:var(--blanco); }
.marquesina-pista{ display:inline-flex; align-items:center; will-change:transform; animation:desfile 38s linear infinite; }
.marquesina-pista span{ padding:0 1.5rem; font-family:var(--mono); font-size:12px; letter-spacing:.2em; text-transform:uppercase; }
.marquesina-pista i{ color:var(--naranjo); font-style:normal; }
@keyframes desfile{ from{ transform:translateX(0) } to{ transform:translateX(-50%) } }

/* GRILLA DE OBRA */
.filtros{ display:flex; flex-wrap:wrap; gap:0; border-top:var(--rule) solid var(--linea); margin-bottom:clamp(24px,3.5vw,44px); }
.filtro{ padding:.9rem 1.1rem; border-bottom:var(--rule) solid var(--linea); border-right:var(--rule) solid var(--linea);
  color:var(--tinta-3); transition:background .3s var(--ease), color .3s var(--ease); }
.filtro sup{ font-size:8px; margin-left:.35em; opacity:.6; }
.filtro:hover{ color:var(--tinta); background:var(--velo); }
.filtro.activo{ background:var(--negro); color:var(--blanco); border-right-color:var(--negro); }

.obra{ display:grid; gap:clamp(26px,3.2vw,46px); }
.tarjeta{ position:relative; }
.tarjeta-hit{ position:absolute; inset:0; z-index:3; }
.tarjeta-media{ overflow:hidden; border:var(--rule) solid var(--negro); background:var(--velo); }
.tarjeta--ancha .tarjeta-media{ aspect-ratio:4/3; }
.tarjeta--alta  .tarjeta-media{ aspect-ratio:3/4; }
.tarjeta-media img{ width:100%; height:100%; object-fit:cover; transform:scale(1.001);
  transition:transform .95s var(--ease), filter .6s var(--ease); }
.tarjeta:hover .tarjeta-media img{ transform:scale(1.05); }
.tarjeta-meta{ display:grid; grid-template-columns:auto 1fr; gap:.2rem .9rem; align-items:baseline; padding-top:.8rem; }
.tarjeta-num{ color:var(--naranjo); grid-row:span 2; }
.tarjeta-nombre{ font-family:var(--display); font-weight:500; letter-spacing:-.025em;
  font-size:clamp(18px,2.1vw,28px); line-height:1.12; transition:color .3s var(--ease); }
.tarjeta:hover .tarjeta-nombre{ color:var(--naranjo); }
.tarjeta-info{ color:var(--tinta-3); }
.tarjeta-info i{ font-style:normal; color:var(--naranjo); padding:0 .5em; }
.tarjeta.oculta{ display:none; }
.obra-vacia{ font-family:var(--mono); font-size:12px; color:var(--tinta-3); text-transform:uppercase; letter-spacing:.13em; }

.credito{ font-family:var(--texto) !important; font-weight:300; color:var(--tinta-3);
  border-left:2px solid var(--naranjo); padding:.1rem 0 .1rem 1rem;
  max-width:70ch; margin-bottom:clamp(24px,3vw,38px); text-transform:none; letter-spacing:0;
  font-size:14px; line-height:1.65; }

/* CIFRAS */
.cifras{ display:grid; gap:0; border-top:var(--rule) solid var(--linea); }
.cifra{ padding:1.4rem clamp(16px,2.4vw,36px) 1.4rem 0; border-bottom:var(--rule) solid var(--linea); }
.cifra dt{ font-family:var(--display); font-weight:600; font-size:clamp(40px,7vw,96px);
  letter-spacing:-.05em; line-height:.9; font-variant-numeric:tabular-nums; }
.cifra dd{ color:var(--tinta-3); margin-top:.6rem; }

/* ÍNDICE CRONOLÓGICO */
.idx{ border-top:var(--rule) solid var(--linea); }
.idx-anio{ display:grid; gap:.2rem 1.6rem; padding:clamp(16px,2vw,24px) 0; border-bottom:var(--rule) solid var(--linea); }
.idx-anio > h3{ font-family:var(--mono); font-weight:400; font-size:13px; letter-spacing:.14em; color:var(--naranjo); }
.idx-anio ul{ display:grid; gap:.28rem; }
.idx-anio li{ font-size:14px; color:var(--tinta-2); }
.idx-anio li b{ font-weight:400; color:var(--tinta); }
.idx-anio li span{ font-family:var(--mono); font-size:10px; letter-spacing:.1em; text-transform:uppercase; color:var(--gris); padding-left:.6em; }

/* UNIDADES / ÁREAS */
.unidades{ display:grid; gap:0; border-top:var(--rule) solid var(--linea); }
.unidad{ display:grid; gap:.5rem 1.6rem; padding:clamp(22px,2.8vw,38px) 0;
  border-bottom:var(--rule) solid var(--linea); transition:padding-left .5s var(--ease), background .5s var(--ease); }
.unidad:hover{ padding-left:clamp(10px,1.6vw,26px); background:var(--velo); }
.unidad-num{ color:var(--naranjo); }
.unidad-titulo{ font-family:var(--display); font-weight:500; letter-spacing:-.03em; font-size:clamp(22px,3.2vw,42px); line-height:1.06; }
.unidad-titulo .mas{ font-weight:300; padding:0 .3em; color:var(--naranjo); }
.unidad-texto{ color:var(--tinta-2); max-width:58ch; font-size:15px; }
.unidad-servicios{ margin-top:.7rem; display:flex; flex-wrap:wrap; gap:.35rem .55rem; }
.unidad-servicios li{ font-family:var(--mono); font-size:10px; letter-spacing:.1em; text-transform:uppercase;
  color:var(--tinta-3); border:var(--rule) solid var(--linea); padding:.3rem .55rem; }

.tipologias{ margin-top:clamp(32px,4vw,56px); display:grid; gap:1rem; }
.tipologias ul{ display:flex; flex-wrap:wrap; gap:0; border-top:var(--rule) solid var(--linea); border-left:var(--rule) solid var(--linea); }
.tipologias li{ flex:1 1 150px; padding:1rem 1.1rem; border-bottom:var(--rule) solid var(--linea);
  border-right:var(--rule) solid var(--linea); font-family:var(--mono); font-size:11px; letter-spacing:.13em;
  text-transform:uppercase; transition:background .3s var(--ease), color .3s var(--ease); }
.tipologias li:hover{ background:var(--negro); color:var(--blanco); }

/* CONTACTO */
.contacto-grid{ display:grid; gap:clamp(34px,5vw,72px); }
.contacto-titulo{ font-family:var(--display); font-weight:500; letter-spacing:-.035em; line-height:1.04; font-size:clamp(28px,4.8vw,62px); }
.contacto-mail{ display:inline-block; margin-top:1.5rem; font-family:var(--display); font-weight:400;
  letter-spacing:-.03em; font-size:clamp(19px,2.5vw,31px); border-bottom:2px solid var(--linea-fuerte);
  padding-bottom:.08em; transition:color .3s var(--ease), border-color .3s var(--ease); overflow-wrap:anywhere; }
.contacto-mail:hover{ color:var(--naranjo); border-color:var(--naranjo); }
.dato{ margin-top:clamp(28px,4vw,50px); display:grid; gap:0; border-top:var(--rule) solid var(--linea); }
.dato > div{ display:grid; gap:.35rem; padding:1rem 0; border-bottom:var(--rule) solid var(--linea); }
.dato dt{ color:var(--tinta-3); }
.dato dd{ font-size:15px; color:var(--tinta-2); }
.dato dd a{ border-bottom:1px solid var(--linea-fuerte); margin-right:1.1rem; transition:color .3s var(--ease), border-color .3s; }
.dato dd a:hover{ color:var(--naranjo); border-color:var(--naranjo); }

.formulario{ display:grid; gap:1.15rem; align-content:start; }
.campo{ display:grid; gap:.5rem; }
.campo label{ color:var(--tinta-3); }
.campo input,.campo textarea{ font-family:var(--texto); font-size:16px; font-weight:300; color:var(--tinta);
  background:transparent; border:0; border-bottom:var(--rule) solid var(--linea-fuerte); padding:.6rem 0; width:100%;
  transition:border-color .3s var(--ease); }
.campo input:focus,.campo textarea:focus{ outline:none; border-bottom-color:var(--naranjo); }
.campo textarea{ resize:vertical; min-height:96px; }
.campo.malo input,.campo.malo textarea{ border-bottom-color:#B3261E; }
.nota{ font-size:10px; letter-spacing:.1em; color:var(--tinta-3); }
.nota.ok{ color:var(--naranjo); }
.nota.error{ color:#B3261E; }

/* PIE */
.pie{ position:relative; z-index:2; border-top:var(--rule) solid var(--negro);
  padding:clamp(32px,4vw,54px) var(--gut) clamp(22px,3vw,34px); }
.pie-grid{ display:grid; gap:.8rem clamp(18px,2.4vw,40px); color:var(--tinta-3); }
.pie-marca{ color:var(--tinta); font-family:var(--display) !important; font-size:15px; text-transform:none; letter-spacing:-.01em; }
.pie-marca .mas{ color:var(--naranjo); font-weight:300; padding:0 .3em; }
.pie-grid a:hover{ color:var(--naranjo); }
.pie-legal{ margin-top:clamp(24px,3vw,42px); padding-top:1.1rem; border-top:var(--rule) solid var(--linea);
  display:grid; gap:.4rem; font-size:10px; letter-spacing:.1em; color:var(--tinta-3); }

/* ---------------- 7 FICHA DE PROYECTO ---------------- */
.ficha{ position:fixed; inset:0; z-index:200; }
.ficha-velo{ position:absolute; inset:0; background:rgba(0,0,0,.62); opacity:0; transition:opacity .45s var(--ease); }
.ficha-panel{
  position:absolute; top:0; right:0; bottom:0; width:min(760px,100%); background:var(--blanco);
  border-left:var(--rule) solid var(--negro); overflow-y:auto; overscroll-behavior:contain;
  padding:clamp(20px,3.2vw,44px); transform:translateX(100%); transition:transform .55s var(--ease);
}
.ficha.abierta .ficha-velo{ opacity:1; }
.ficha.abierta .ficha-panel{ transform:translateX(0); }
.ficha-cerrar{ position:sticky; top:0; margin-left:auto; display:flex; align-items:center; gap:.6rem;
  font-family:var(--mono); font-size:11px; letter-spacing:.13em; text-transform:uppercase;
  background:var(--blanco); padding:.4rem 0 .9rem; z-index:2; }
.ficha-cerrar:hover{ color:var(--naranjo); }
.ficha-cab{ border-top:var(--rule) solid var(--linea); padding-top:1.2rem; }
.ficha-num{ color:var(--naranjo); }
.ficha-nombre{ font-family:var(--display); font-weight:600; letter-spacing:-.035em;
  font-size:clamp(26px,4.2vw,48px); line-height:1.02; margin:.5rem 0 .8rem; }
.ficha-resumen{ color:var(--tinta-2); max-width:48ch; font-size:clamp(15px,1.5vw,17px); }
.ficha-galeria{ margin:clamp(22px,3vw,34px) 0; display:grid; gap:10px; }
.ficha-galeria figure{ border:var(--rule) solid var(--negro); overflow:hidden; }
.ficha-galeria img{ width:100%; }
.ficha-cuerpo{ display:grid; gap:clamp(22px,3vw,36px); }
.ficha-texto p{ color:var(--tinta-2); margin-bottom:1rem; font-size:15px; }
.ficha-datos{ border-top:var(--rule) solid var(--linea); }
.ficha-datos > div{ display:grid; grid-template-columns:1fr 1.4fr; gap:1rem; padding:.8rem 0; border-bottom:var(--rule) solid var(--linea); }
.ficha-datos dt{ font-family:var(--mono); font-size:10px; letter-spacing:.12em; text-transform:uppercase; color:var(--tinta-3); }
.ficha-datos dd{ font-size:14px; color:var(--tinta-2); }
body.bloqueado{ overflow:hidden; }
body.bloqueado .cabecera{ opacity:0; pointer-events:none; transition:opacity .3s var(--ease); }

/* ---------------- 8 EFECTOS ---------------- */
.rev{ opacity:0; transform:translateY(16px);
  transition:opacity .8s var(--ease) var(--d,0s), transform .8s var(--ease) var(--d,0s); }
.rev.dentro{ opacity:1; transform:none; }
.no-js .rev{ opacity:1 !important; transform:none !important; }
html:not(.listo) .rev{ transition-delay:0s; }

/* ---------------- 9 RESPONSIVE ---------------- */
@media (min-width:720px){
  .hero-grid{ grid-template-columns:1fr; }
  .cifras{ grid-template-columns:repeat(2,1fr); }
  .obra{ grid-template-columns:repeat(2,1fr); }
  .tarjeta--destacada{ grid-column:span 2; }
  .tarjeta--destacada .tarjeta-media{ aspect-ratio:16/9; }
  .pie-grid{ grid-template-columns:repeat(2,1fr); }
  .pie-legal{ grid-template-columns:1fr auto; }
  .pie-legal span:last-child{ text-align:right; }
  .unidad{ grid-template-columns:auto minmax(0,1fr) minmax(0,1.35fr); align-items:start; }
  .contacto-grid{ grid-template-columns:1.1fr .9fr; }
  .idx-anio{ grid-template-columns:90px minmax(0,1fr); }
  .idx-anio ul{ grid-template-columns:repeat(2,1fr); gap:.28rem 1.6rem; }
  .ficha-galeria{ grid-template-columns:1fr 1fr; }
  .ficha-galeria figure:first-child{ grid-column:span 2; }
}
@media (min-width:960px){
  :root{ --cab:76px; }
  .reglas{ display:grid; }
  .nav{ display:flex; }
  .hamb{ display:none; }
  .nav-movil{ display:none !important; }
  .hero-scroll{ display:flex; }
  /* La grilla del hero coincide con las 6 reglas estructurales del fondo:
     el borde de la imagen cae exactamente sobre la quinta línea. */
  .hero-grid{ grid-template-columns:repeat(6,1fr); column-gap:0; align-items:end; }
  .hero-grid > :first-child{ grid-column:1 / span 4; padding-right:var(--gut); }
  .hero-fig{ grid-column:5 / span 2; }
  .hero-fig-marco{ aspect-ratio:3/4; }
  .manif-grid{ grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr); align-items:start; }
  .obra{ grid-template-columns:repeat(3,1fr); }
  .tarjeta--ancha{ grid-column:span 2; }
  .tarjeta--alta{ grid-column:span 1; }
  .tarjeta--destacada{ grid-column:span 3; }
  .tarjeta--destacada .tarjeta-media{ aspect-ratio:2.35/1; }
  .cifras{ grid-template-columns:repeat(4,1fr); }
  .pie-grid{ grid-template-columns:repeat(4,1fr); }
  .idx-anio ul{ grid-template-columns:repeat(3,1fr); }
}
@media (min-width:1280px){ .obra{ gap:46px 40px; } }

@media (prefers-reduced-motion:reduce){
  .marquesina-pista{ animation:none; }
  .hero-scroll i{ animation:none; }
  html{ scroll-behavior:auto; }
}