/* =========================================================================
   FIBER ART — hoja de estilos única
   fuentes · tokens · base · layout · cabecera · hero · secciones editoriales
   · la obra (índice, colecciones, composiciones, riel) · casa · trayectoria
   · contacto · pie · movimiento · responsive
   ========================================================================= */

/* ── Fuentes ─────────────────────────────────────────────────────────── */
@font-face{font-family:'Libre Baskerville';font-style:normal;font-weight:400;font-display:swap;
  src:url('/assets/fonts/baskerville-400-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Libre Baskerville';font-style:normal;font-weight:400;font-display:swap;
  src:url('/assets/fonts/baskerville-400-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Libre Baskerville';font-style:italic;font-weight:400;font-display:swap;
  src:url('/assets/fonts/baskerville-400i-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Libre Baskerville';font-style:italic;font-weight:400;font-display:swap;
  src:url('/assets/fonts/baskerville-400i-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}

@font-face{font-family:'Carlito';font-style:normal;font-weight:400;font-display:swap;
  src:url('/assets/fonts/carlito-400-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Carlito';font-style:normal;font-weight:400;font-display:swap;
  src:url('/assets/fonts/carlito-400-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Carlito';font-style:normal;font-weight:700;font-display:swap;
  src:url('/assets/fonts/carlito-700-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Carlito';font-style:normal;font-weight:700;font-display:swap;
  src:url('/assets/fonts/carlito-700-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}

/* ── Tokens de marca ─────────────────────────────────────────────────── */
:root{
  --crema:#FFF3E8;
  --crema-hondo:#F7E7D5;
  --tinta:#1A1A1A;
  --carbon:#3A3632;
  --terracota:#8A3B1E;
  --ocre:#B5701F;
  --arena:#C98A5E;
  --oliva:#7C7A55;
  --n-80:#4A4038;
  --n-70:#5A4E40;
  --n-60:#6A5D4E;
  --n-40:#8A7C6B;
  --n-30:#9A8C7B;
  --linea:#E4D5C2;
  /* variantes sobre fondo oscuro: mismos tonos del manual, aclarados
     lo justo para cumplir WCAG 2.2 AA en textos pequeños */
  --n-claro:#C9B9A6;
  --arena-claro:#DBA179;

  --serif:'Libre Baskerville',Georgia,'Times New Roman',serif;
  --sans:'Carlito',Calibri,system-ui,-apple-system,'Segoe UI',sans-serif;

  --wrap:1320px;
  --pad-x:clamp(1.25rem,5vw,4.5rem);
  --pad-y:clamp(4.5rem,11vw,9rem);
  --alto-cabecera:4.75rem;
  --alto-indice:3.4rem;

  --transicion:cubic-bezier(.22,.61,.36,1);
  --lento:cubic-bezier(.16,.84,.44,1);
}

/* ── Base ────────────────────────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box}
html{
  -webkit-text-size-adjust:100%;
  scroll-behavior:smooth;
  scroll-padding-top:calc(var(--alto-cabecera) + var(--alto-indice) + .5rem);
}
body{
  margin:0;
  background:var(--crema);
  color:var(--tinta);
  font-family:var(--sans);
  font-size:clamp(1rem,.96rem + .2vw,1.075rem);
  line-height:1.75;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
/* `clip` no crea contexto de scroll: mantiene funcionando position:sticky */
@supports (overflow-x:clip){ body{overflow-x:clip} }

img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3{margin:0;font-weight:400;text-wrap:balance}
p{margin:0}
ul,ol,dl,dd{margin:0;padding:0}
li{list-style:none}
button{font:inherit;color:inherit}
cite{font-style:italic}

:focus-visible{outline:2px solid var(--terracota);outline-offset:3px;border-radius:1px}
.section--contacto :focus-visible,.site-footer :focus-visible,.casa :focus-visible{outline-color:var(--arena-claro)}
::selection{background:var(--arena);color:var(--tinta)}

.skip-link{
  position:absolute;left:1rem;top:-100%;z-index:200;
  background:var(--tinta);color:var(--crema);
  padding:.75rem 1.25rem;font-size:.85rem;letter-spacing:.06em;
  transition:top .2s ease;
}
.skip-link:focus{top:1rem}
.oculto{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}

/* ── Layout ──────────────────────────────────────────────────────────── */
.wrap{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:var(--pad-x)}
.section{padding-block:var(--pad-y);position:relative}
.section--autora,.section--experiencia{background:var(--crema-hondo)}

.grid-editorial{display:grid;gap:clamp(2.75rem,6vw,5.5rem);align-items:center}
@media (min-width:900px){
  .grid-editorial{grid-template-columns:minmax(0,1fr) minmax(0,1.02fr)}
  .grid-editorial--reverse{grid-template-columns:minmax(0,.92fr) minmax(0,1fr)}
}

/* ── Tipografía editorial ────────────────────────────────────────────── */
.eyebrow{
  font-size:.72rem;font-weight:700;letter-spacing:.22em;text-transform:uppercase;
  color:var(--terracota);margin-bottom:1.4rem;
}
.eyebrow--claro{color:var(--arena-claro)}

.h-display{
  font-family:var(--serif);
  font-size:clamp(1.9rem,1.4rem + 2.1vw,3rem);
  line-height:1.16;letter-spacing:-.012em;
  margin-bottom:1.75rem;
}
.h-coleccion{
  font-family:var(--serif);
  font-size:clamp(1.45rem,1.2rem + 1.15vw,2.05rem);
  line-height:1.25;letter-spacing:-.008em;
  margin-bottom:.9rem;
}

.prose{max-width:38em;color:var(--n-80)}
.prose p+p{margin-top:1.15em}
.prose--capital>p:first-of-type::first-letter{
  float:left;font-family:var(--serif);color:var(--terracota);
  font-size:3.35em;line-height:.8;padding:.08em .14em 0 0;
}

.section-head{max-width:46em;margin-bottom:clamp(2.5rem,6vw,4rem)}
.section-head__lead{max-width:34em;color:var(--n-70);margin-top:.4rem}

.atributos{
  display:flex;flex-wrap:wrap;gap:.55rem .95rem;margin-top:2.5rem;
  font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--n-60);
}
.atributos li{border:1px solid var(--linea);padding:.5rem .9rem;background:rgba(255,255,255,.35)}

.fichas{margin-top:2.5rem;border-top:1px solid var(--linea)}
.fichas>div{padding-block:.9rem;border-bottom:1px solid var(--linea)}
@media (min-width:560px){.fichas>div{display:grid;grid-template-columns:8rem 1fr;gap:1.25rem;align-items:baseline}}
.fichas dt{font-size:.7rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--n-40)}
.fichas dd{color:var(--n-80);font-size:.95rem}

.cita{margin:2.75rem 0 0;padding-left:1.65rem;border-left:1px solid var(--arena);max-width:32em}
.cita p{
  font-family:var(--serif);font-style:italic;
  font-size:clamp(1.05rem,1rem + .45vw,1.25rem);line-height:1.6;color:var(--n-80);
}
.cita p::before{content:'«'}
.cita p::after{content:'»'}
.cita footer{margin-top:1rem;font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;color:var(--n-60)}
.cita cite{font-style:normal}
.cita--clara{border-left-color:var(--arena-claro)}
.cita--clara p{color:rgba(255,243,232,.94)}
.cita--clara footer{color:var(--n-claro)}

/* ── Botones y enlaces ───────────────────────────────────────────────── */
.acciones{margin-top:2.5rem}
.btn{
  display:inline-flex;align-items:center;justify-content:center;
  padding:1rem 2.1rem;
  font-size:.76rem;letter-spacing:.18em;text-transform:uppercase;
  text-decoration:none;border:1px solid currentColor;background:transparent;cursor:pointer;
  transition:background-color .45s var(--transicion),color .45s var(--transicion),border-color .45s var(--transicion);
}
.btn--solido{background:var(--terracota);border-color:var(--terracota);color:var(--crema)}
.btn--solido:hover{background:var(--tinta);border-color:var(--tinta)}
.btn--ghost{color:var(--crema);border-color:rgba(255,243,232,.55)}
.btn--ghost:hover{background:var(--crema);border-color:var(--crema);color:var(--tinta)}
.btn--claro{color:var(--crema);border-color:rgba(255,243,232,.45)}
.btn--claro:hover{background:var(--crema);border-color:var(--crema);color:var(--carbon)}
.btn--ancho{width:100%}

.enlace-sutil{
  position:relative;display:inline-block;text-decoration:none;
  font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--terracota);
  padding-bottom:.3rem;
}
.enlace-sutil::after{
  content:'';position:absolute;left:0;right:0;bottom:0;height:1px;
  background:currentColor;opacity:.4;transition:opacity .4s ease;
}
.enlace-sutil:hover::after{opacity:1}

/* ── Cabecera ────────────────────────────────────────────────────────── */
.site-header{
  position:fixed;inset:0 0 auto;z-index:100;
  background:rgba(255,243,232,.94);
  border-bottom:1px solid var(--linea);
  transform:translateY(-100%);
  transition:transform .5s var(--transicion);
}
@supports (backdrop-filter:blur(8px)){
  .site-header{background:rgba(255,243,232,.84);backdrop-filter:blur(12px)}
}
.site-header.is-visible{transform:none}
.site-header__inner{
  max-width:var(--wrap);margin-inline:auto;padding-inline:var(--pad-x);
  min-height:var(--alto-cabecera);
  display:flex;align-items:center;justify-content:space-between;gap:2rem;
}
.site-header__logo{display:block;flex:0 0 auto}
.site-header__logo img{height:2rem;width:auto}

.progreso{position:absolute;left:0;right:0;bottom:-1px;height:1px;background:transparent}
.progreso span{
  display:block;height:100%;background:var(--terracota);
  transform:scaleX(var(--avance,0));transform-origin:0 50%;
}

.nav__list{display:flex;gap:clamp(.9rem,1.9vw,1.75rem)}
.nav__list a{
  position:relative;display:inline-block;padding:.35rem 0;
  font-size:.72rem;letter-spacing:.13em;text-transform:uppercase;
  color:var(--n-70);text-decoration:none;transition:color .35s ease;
}
.nav__list a::after{
  content:'';position:absolute;left:0;right:100%;bottom:0;height:1px;
  background:var(--terracota);transition:right .45s var(--transicion);
}
.nav__list a:hover,.nav__list a.is-active{color:var(--terracota)}
.nav__list a:hover::after,.nav__list a.is-active::after{right:0}

.nav-toggle{
  display:none;align-items:center;gap:.6rem;
  background:none;border:0;padding:.5rem 0;cursor:pointer;
  font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;color:var(--n-70);
}
.nav-toggle__bars{display:inline-flex;flex-direction:column;gap:.35rem;width:1.35rem}
.nav-toggle__bars span{display:block;height:1px;background:currentColor;transition:transform .4s var(--transicion)}
.nav-toggle[aria-expanded="true"] .nav-toggle__bars span:first-child{transform:translateY(.18rem) rotate(45deg)}
.nav-toggle[aria-expanded="true"] .nav-toggle__bars span:last-child{transform:translateY(-.18rem) rotate(-45deg)}

/* ── Hero ────────────────────────────────────────────────────────────── */
.hero{
  position:relative;isolation:isolate;
  min-height:100svh;display:flex;align-items:flex-end;
  background:var(--carbon);
  padding:calc(var(--alto-cabecera) + 2rem) 0 clamp(4rem,9vh,6.5rem);
  overflow:hidden;
}
.hero__media{position:absolute;inset:-8% 0;z-index:-2;will-change:transform}
.hero__media picture{display:block;width:100%;height:100%}
.hero__media img{width:100%;height:100%;object-fit:cover;object-position:center center}
.hero::after{
  content:'';position:absolute;inset:0;z-index:-1;
  background:linear-gradient(105deg,rgba(20,18,16,.86) 0%,rgba(20,18,16,.66) 42%,rgba(20,18,16,.34) 100%);
}
.hero__content{
  width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:var(--pad-x);
  color:var(--crema);
}
.hero__titulo{margin:0 0 clamp(1.75rem,4vw,2.75rem)}
.hero__logo{width:clamp(9.5rem,17vw,14rem);height:auto}
.hero__subtitle{font-size:.76rem;letter-spacing:.28em;text-transform:uppercase;color:var(--arena-claro);margin-bottom:1.5rem}
.hero__text{
  font-family:var(--serif);
  font-size:clamp(1.1rem,1rem + .75vw,1.55rem);
  line-height:1.55;max-width:22em;color:rgba(255,243,232,.94);
  margin-bottom:clamp(2.25rem,4vw,3rem);
}
.hero__cue{position:absolute;left:50%;bottom:1.75rem;translate:-50% 0;width:1px;height:3.25rem;overflow:hidden}
.hero__cue span{
  display:block;width:1px;height:100%;
  background:linear-gradient(to bottom,transparent,rgba(255,243,232,.75));
  animation:deslizar 2.8s var(--transicion) infinite;
}
@keyframes deslizar{0%{transform:translateY(-100%)}55%,100%{transform:translateY(100%)}}

/* ── Figuras: marco con acercamiento discreto ────────────────────────── */
figure{margin:0}
figcaption{margin-top:.95rem;font-size:.73rem;letter-spacing:.09em;color:var(--n-60);line-height:1.5}
.marco{overflow:hidden;background:var(--crema-hondo)}
.marco img{width:100%;transition:transform 1.4s var(--lento)}
@media (hover:hover){
  .plate:hover .marco img,.col-media:hover .marco img{transform:scale(1.035)}
}

/* ── La obra · índice pegajoso ───────────────────────────────────────── */
.indice-wrap{
  position:sticky;top:var(--alto-cabecera);z-index:60;
  background:rgba(255,243,232,.94);
  border-block:1px solid var(--linea);
  margin-bottom:clamp(2rem,5vw,3.5rem);
}
@supports (backdrop-filter:blur(8px)){
  .indice-wrap{background:rgba(255,243,232,.86);backdrop-filter:blur(12px)}
}
.indice{display:flex;min-height:var(--alto-indice);align-items:center}
.indice__lista{
  display:flex;gap:clamp(1.1rem,3vw,2.75rem);
  min-width:0;overflow-x:auto;scrollbar-width:none;
  -webkit-overflow-scrolling:touch;
}
.indice__lista::-webkit-scrollbar{display:none}
.indice__lista a{
  display:inline-block;white-space:nowrap;padding:.5rem 0;
  font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--n-40);text-decoration:none;transition:color .4s ease;
}
.indice__lista a span{
  font-family:var(--serif);margin-right:.5rem;color:var(--arena);
  transition:color .4s ease;
}
.indice__lista a:hover{color:var(--n-70)}
.indice__lista a.is-active{color:var(--terracota)}
.indice__lista a.is-active span{color:var(--terracota)}

/* ── La obra · colecciones ───────────────────────────────────────────── */
.coleccion{padding-block:clamp(3rem,7vw,6rem)}
.coleccion+.coleccion{border-top:1px solid var(--linea)}
/* minmax(0,…) en todas las pistas: sin esto, el riel horizontal fuerza el
   ancho mínimo de su columna y revienta la retícula */
.coleccion__grid{display:grid;gap:clamp(2rem,4vw,4rem);grid-template-columns:minmax(0,1fr)}
.coleccion__grid>*{min-width:0}
@media (min-width:1000px){
  .coleccion__grid{grid-template-columns:minmax(0,20rem) minmax(0,1fr);align-items:start}
  .coleccion__head{
    position:sticky;
    top:calc(var(--alto-cabecera) + var(--alto-indice) + 2.5rem);
  }
}
.coleccion__num{font-family:var(--serif);font-size:.95rem;letter-spacing:.2em;color:var(--terracota);margin-bottom:.85rem}
.coleccion__texto{max-width:34em;color:var(--n-70)}
.coleccion__meta{
  margin-top:1.5rem;padding-top:1.25rem;border-top:1px solid var(--linea);
  font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--n-40);
}
.coleccion__pista{margin-top:1rem;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--arena)}
@media (min-width:1000px){.coleccion__pista{display:none}}

/* composiciones: cada colección rompe la retícula de otra manera */
.obras{display:grid;gap:clamp(1.5rem,3vw,2.5rem);grid-template-columns:minmax(0,1fr)}
.obras>*{min-width:0}

/* I · escalonada */
@media (min-width:1000px){
  .obras--escalonado{grid-template-columns:repeat(12,minmax(0,1fr));align-items:start}
  .obras--escalonado>*:nth-child(1){grid-column:1/8}
  .obras--escalonado>*:nth-child(2){grid-column:9/13;margin-top:22%}
  .obras--escalonado>*:nth-child(3){grid-column:1/6;margin-top:-6%}
  .obras--escalonado>*:nth-child(4){grid-column:6/13;margin-top:14%}
}

/* II · columna con anchos y alineaciones alternas */
@media (min-width:1000px){
  .obras--columna{gap:clamp(2.5rem,5vw,4.5rem)}
  .obras--columna>*:nth-child(1){width:52%}
  .obras--columna>*:nth-child(2){width:74%;margin-left:auto}
  .obras--columna>*:nth-child(3){width:46%;margin-left:12%}
  .obras--columna>*:nth-child(4){width:62%;margin-left:auto}
}
@media (min-width:600px) and (max-width:999px){
  .obras--columna>*:nth-child(odd){width:80%}
  .obras--columna>*:nth-child(even){width:80%;margin-left:auto}
}

/* IV · mosaico */
@media (min-width:700px){
  .obras--mosaico{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .obras--mosaico>*:nth-child(1){grid-column:1/-1}
  .obras--mosaico>*:nth-child(3),.obras--mosaico>*:nth-child(5){margin-top:clamp(1.5rem,4vw,3rem)}
}

/* V · desfase */
@media (min-width:1000px){
  .obras--desfase{grid-template-columns:repeat(12,minmax(0,1fr));align-items:start}
  .obras--desfase>*:nth-child(1){grid-column:1/7}
  .obras--desfase>*:nth-child(2){grid-column:8/13;margin-top:26%}
  .obras--desfase>*:nth-child(3){grid-column:3/10;margin-top:-4%}
}

/* composición intermedia para tablet: dos columnas en vez de una pila larga */
@media (min-width:700px) and (max-width:999px){
  .obras--escalonado,.obras--desfase{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .obras--escalonado>*:nth-child(2),.obras--escalonado>*:nth-child(4){margin-top:12%}
  .obras--desfase>*:nth-child(1){grid-column:1/-1;max-width:64%}
  .obras--desfase>*:nth-child(3){margin-top:10%}
}

/* III · riel horizontal */
.riel-wrap{margin-right:calc(-1 * var(--pad-x));min-width:0}
.riel{
  display:flex;gap:clamp(1rem,2.2vw,1.75rem);
  overflow-x:auto;overscroll-behavior-x:contain;
  scroll-snap-type:x mandatory;
  padding:0 var(--pad-x) 1.5rem 0;
  scrollbar-width:thin;scrollbar-color:var(--linea) transparent;
}
.riel::-webkit-scrollbar{height:2px}
.riel::-webkit-scrollbar-thumb{background:var(--linea)}
.riel>li{flex:0 0 clamp(15rem,26vw,21rem);scroll-snap-align:start}
.riel:focus-visible{outline:2px solid var(--terracota);outline-offset:6px}

/* ── Banda a sangre ──────────────────────────────────────────────────── */
.banda{position:relative;overflow:hidden;margin-top:clamp(3.5rem,8vw,6rem)}
.banda img{
  width:100%;height:clamp(340px,56vh,600px);object-fit:cover;
  transform:translate3d(0,var(--py,0px),0) scale(1.14);
}
.banda figcaption{margin-top:1rem}

/* ── Nota de cierre de la obra ───────────────────────────────────────── */
.nota{
  margin-top:clamp(3rem,7vw,5rem);
  padding-top:clamp(2rem,4vw,3rem);
  border-top:1px solid var(--linea);
  display:grid;gap:1.75rem;
}
@media (min-width:860px){
  .nota{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:clamp(2rem,5vw,4rem);align-items:end}
}
.nota__texto{max-width:44em;font-family:var(--serif);font-size:clamp(1.05rem,1rem + .4vw,1.2rem);line-height:1.6;color:var(--n-80)}
.nota__texto strong{font-weight:400;font-style:italic}
.nota__acciones{display:flex;flex-wrap:wrap;gap:1rem 2rem}

/* ── Casa Fiber Art ──────────────────────────────────────────────────── */
.casa{
  position:relative;isolation:isolate;overflow:hidden;
  background:var(--carbon);color:var(--crema);
  padding-block:clamp(6rem,15vw,11rem);
}
.casa__media{position:absolute;inset:-10% 0;z-index:-2;will-change:transform}
.casa__media img{width:100%;height:100%;object-fit:cover;object-position:center 38%}
.casa::after{
  content:'';position:absolute;inset:0;z-index:-1;
  background:linear-gradient(100deg,rgba(18,16,14,.93) 0%,rgba(18,16,14,.86) 46%,rgba(18,16,14,.66) 100%);
}
.casa__content{max-width:46rem}
.casa .h-display{color:var(--crema)}
.casa .prose{color:rgba(255,243,232,.86)}

/* ── Trayectoria ─────────────────────────────────────────────────────── */
.hitos{margin-top:2.75rem;border-top:1px solid var(--linea)}
.hito{padding-block:1.5rem;border-bottom:1px solid var(--linea)}
@media (min-width:640px){
  .hito{display:grid;grid-template-columns:11rem 1fr;gap:1.5rem;align-items:baseline}
}
.hito dt{font-size:.72rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--terracota)}
.hito dd{color:var(--n-80);margin-top:.5rem}
@media (min-width:640px){.hito dd{margin-top:0}}

.prensa{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1rem,2vw,1.5rem);align-items:start;max-width:34rem}
.prensa img{border:1px solid rgba(26,26,26,.08)}
.prensa__pie{grid-column:1/-1;margin-top:.4rem;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--n-60)}

/* ── Contacto ────────────────────────────────────────────────────────── */
.section--contacto{background:var(--carbon);color:var(--crema)}
.section--contacto .h-display{color:var(--crema)}
.section--contacto .prose{color:rgba(255,243,232,.82)}
.grid-contacto{display:grid;gap:clamp(3rem,6vw,5rem)}
@media (min-width:900px){.grid-contacto{grid-template-columns:minmax(0,1fr) minmax(0,.95fr)}}

.datos{margin-top:3rem;border-top:1px solid rgba(255,243,232,.16)}
.datos li{
  display:flex;flex-wrap:wrap;gap:.35rem 1.25rem;
  padding-block:.95rem;border-bottom:1px solid rgba(255,243,232,.16);
  font-size:.95rem;color:rgba(255,243,232,.9);
}
.datos span{flex:0 0 7rem;font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--n-claro)}
.datos a{text-decoration:none;border-bottom:1px solid rgba(255,243,232,.3);transition:border-color .35s ease,color .35s ease}
.datos a:hover{color:var(--arena-claro);border-color:var(--arena-claro)}

/* ── Formulario ──────────────────────────────────────────────────────── */
.formulario{display:grid;gap:1.75rem}
.campo{display:grid;gap:.6rem}
.campo label{font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--n-claro)}
.campo input,.campo textarea{
  font:inherit;color:var(--crema);background:transparent;
  border:0;border-bottom:1px solid rgba(255,243,232,.28);
  padding:.65rem 0;border-radius:0;transition:border-color .35s ease;
}
.campo textarea{resize:vertical;min-height:7rem;line-height:1.7}
.campo input:hover,.campo textarea:hover{border-bottom-color:rgba(255,243,232,.5)}
.campo input:focus,.campo textarea:focus{outline:0;border-bottom-color:var(--arena-claro)}
.campo input:focus-visible,.campo textarea:focus-visible{outline:2px solid var(--arena-claro);outline-offset:4px}

/* ── Pie ─────────────────────────────────────────────────────────────── */
.site-footer{
  background:var(--carbon);color:rgba(255,243,232,.72);
  border-top:1px solid rgba(255,243,232,.14);
  padding-block:clamp(3.5rem,7vw,5rem);
}
.site-footer__inner{display:grid;justify-items:center;text-align:center;gap:1.5rem}
.site-footer__logo{width:clamp(7rem,11vw,9rem);height:auto}
.site-footer__tag{font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;color:var(--n-claro)}
.site-footer__nav{display:flex;flex-wrap:wrap;justify-content:center;gap:.9rem 1.75rem;margin-top:.5rem}
.site-footer__nav a{
  font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;
  text-decoration:none;color:rgba(255,243,232,.75);transition:color .35s ease;
}
.site-footer__nav a:hover{color:var(--arena-claro)}
.site-footer__legal{display:grid;gap:.35rem;margin-top:1.25rem;font-size:.72rem;letter-spacing:.1em;color:var(--n-claro)}

/* ── Movimiento ──────────────────────────────────────────────────────── */
.js .reveal{opacity:0;transform:translateY(18px);transition:opacity 1s ease,transform 1s var(--lento)}
.js .reveal.is-visible{opacity:1;transform:none}
/* entradas escalonadas dentro de un mismo grupo */
.js .obras>.reveal:nth-child(2),.js .prensa.reveal{transition-delay:90ms}
.js .obras>.reveal:nth-child(3){transition-delay:180ms}
.js .obras>.reveal:nth-child(4){transition-delay:270ms}
.js .obras>.reveal:nth-child(5){transition-delay:360ms}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}
  .js .reveal{opacity:1;transform:none}
  .hero__cue span{animation:none;background:rgba(255,243,232,.45)}
  .banda img{transform:scale(1.14)}
  .marco img{transition:none}
  .riel{scroll-snap-type:none}
}

/* ── Navegación móvil ────────────────────────────────────────────────── */
@media (max-width:999px){
  .nav-toggle{display:inline-flex}
  .nav{
    position:fixed;inset:var(--alto-cabecera) 0 auto;
    background:var(--crema);border-bottom:1px solid var(--linea);
    padding:clamp(1.5rem,6vw,3rem) var(--pad-x) clamp(2rem,7vw,3.5rem);
    transform:translateY(-140%);
    transition:transform .55s var(--transicion),visibility .55s;
    visibility:hidden;
  }
  .nav.is-open{transform:none;visibility:visible}
  .nav__list{flex-direction:column;gap:.35rem}
  .nav__list a{
    font-family:var(--serif);font-size:1.15rem;letter-spacing:.01em;text-transform:none;
    padding:.7rem 0;color:var(--tinta);
  }
  .nav__list a::after{display:none}
}

/* ── Ajustes finos móvil ─────────────────────────────────────────────── */
@media (max-width:699px){
  .obras--columna>*:nth-child(even){margin-left:auto}
  .obras--columna>*:nth-child(odd){width:88%}
  .obras--columna>*:nth-child(even){width:88%}
  .riel>li{flex-basis:clamp(13rem,68vw,17rem)}
  .prensa{max-width:26rem}
  .btn{width:100%}
  .acciones .btn{width:auto;min-width:min(100%,17rem)}
  .prose--capital>p:first-of-type::first-letter{font-size:2.9em}
}