/* Fraula · propuesta de web (AutomatIA, nov-2026)
   Elemento propio: la mancha de fresa de su logo. Se abre en la precarga, la fresa se dibuja a pluma y la firma se escribe;
   más abajo, la fresa estallada de su foto tiñe la página de rojo y da paso a los menús. Dani y Roseta: sus dos medias caras se juntan. */

@font-face { font-family: 'Ibarra Real Nova'; font-style: normal; font-weight: 400 700; font-display: swap; src: url(../fonts/ibarra-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: 'Ibarra Real Nova'; font-style: normal; font-weight: 400 700; font-display: swap; src: url(../fonts/ibarra-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Libre Franklin'; font-style: normal; font-weight: 300 700; font-display: swap; src: url(../fonts/franklin-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 Franklin'; font-style: normal; font-weight: 300 700; font-display: swap; src: url(../fonts/franklin-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }

:root {
  --papel: #f5efe8;
  --papel-2: #ece2d7;
  --tinta: #3b2423;          /* el marrón de su firma */
  --tinta-2: rgba(59, 36, 35, .68);
  --fresa: #b5304f;          /* el rojo de su mancha, un punto más hondo para que el texto crema se lea */
  --fresa-honda: #9f2443;
  --rosa: #e4b6b6;
  --noche: #151112;
  --crema: #f5efe8;
  --crema-2: rgba(245, 239, 232, .72);
  --serif: 'Ibarra Real Nova', Georgia, 'Times New Roman', serif;
  --sans: 'Libre Franklin', 'Helvetica Neue', Arial, sans-serif;
  --nav: 68px;
  --lado: clamp(20px, 5vw, 72px);
  --ease: cubic-bezier(.22, 1, .36, 1);
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scrollbar-gutter: stable; }
html, body { overflow-x: clip; }
body { margin: 0; background: var(--papel); color: var(--tinta); font-family: var(--serif); font-size: 1.125rem; line-height: 1.55; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
img, svg { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
h1, h2, h3, p, ul, ol, dl, dd, figure, blockquote { margin: 0; padding: 0; }
ul, ol { list-style: none; }
h2 { text-wrap: balance; font-weight: 500; font-size: clamp(2.4rem, 5.2vw, 4.6rem); line-height: 1.02; letter-spacing: -.01em; }
:focus-visible { outline: 2px solid var(--fresa); outline-offset: 3px; }

/* ---------- botones (acabado de Almo: cuadrados, filete de 1 px, mayúsculas espaciadas) ---------- */
.boton { display: inline-flex; align-items: center; justify-content: center; padding: 1.05em 2.2em; border: 1px solid var(--tinta); background: var(--tinta); color: var(--papel);
  font-family: var(--sans); font-weight: 600; font-size: .76rem; letter-spacing: .16em; text-transform: uppercase; line-height: 1; white-space: nowrap;
  transition: background .5s ease, color .5s ease, border-color .5s ease; }
.boton:hover { background: transparent; color: var(--tinta); }
.boton--claro { background: transparent; border-color: rgba(245, 239, 232, .75); color: var(--crema); }
.boton--claro:hover { background: var(--crema); border-color: var(--crema); color: var(--fresa-honda); }
.enlace { position: relative; display: inline-block; padding-bottom: 4px; font-family: var(--sans); font-size: .95rem; }
.enlace::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: currentColor; transform-origin: right; transition: transform .7s var(--ease); }
.enlace:hover::after { transform: scaleX(0); }

/* ---------- sellos (MICHELIN y Guía Repsol 2026), en em: escalan con el bloque del logo ---------- */
.sellos { display: flex; align-items: center; justify-content: center; gap: 1.1em; margin-top: 1.4em; }
.sellos .sello { height: 4.3em; width: auto; overflow: visible; }
.sellos .sello--repsol-1sol { height: 4.9em; }
.sellos__raya { width: 1px; height: 3.6em; background: currentColor; opacity: .22; }
.sello__flor, .sello__sol, .sello__letras { transform-box: fill-box; transform-origin: 50% 50%; }


/* ---------- el logo (mancha + fresa + firma) ---------- */
.firma-bloque { --fw: 340px; --grosor: 10; width: var(--fw); font-size: calc(var(--fw) / 27); color: var(--tinta); }
.sprite { position: absolute; }
.logo--portada, .fresa-trazo { display: block; }
.michelin__marca, .repsol__texto, .sello--michelin-estrella { shape-rendering: geometricPrecision; }
.logo { width: 100%; height: auto; aspect-ratio: 400 / 380; overflow: visible; }

/* ---------- precarga ---------- */
.entrada { display: none; }
.anima:not(.vuelta) .entrada { position: fixed; inset: 0; z-index: 200; display: flex; align-items: center; justify-content: center; }
.entrada__fondo { position: absolute; inset: 0; background: var(--papel); }
.entrada__firma { position: relative; --fw: min(440px, 66vw, 46vh); }
.entrada .capa, .entrada .gota, .entrada .fresa-resto { transform-box: fill-box; transform-origin: 50% 50%; }
.intro .entrada .capa, .intro .entrada .gota, .intro .entrada .fresa-resto, .intro .entrada .sello__flor, .intro .entrada .sello__sol, .intro .entrada .sello__letras, .intro .entrada .sellos__raya { opacity: 0; }
.entrada .pluma { stroke-dasharray: 1 1; stroke-dashoffset: 1; }
.intro body { overflow: hidden; }
.anima.intro .nav, .anima.intro .portada__firma, .anima.intro .portada__pie, .anima.intro .portada__fotos { opacity: 0; }

/* ---------- nav: siempre a la vista, con Reservar ---------- */
.nav { position: fixed; top: 0; left: 0; right: 0; z-index: 100; height: var(--nav); display: flex; align-items: center; gap: 2rem; padding: 0 var(--lado);
  background: var(--papel); border-bottom: 1px solid rgba(59, 36, 35, .1); }
.nav__logo { flex: none; color: var(--tinta); --grosor: 34; }
.nav__logo svg { height: 46px; width: auto; aspect-ratio: 900 / 280; }
.nav__enlaces { display: flex; gap: clamp(1rem, 2.2vw, 2.2rem); margin-left: auto; font-family: var(--sans); font-size: .92rem; }
.nav__enlaces a { position: relative; padding: 6px 0; }
.nav__enlaces a::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: var(--fresa); transform: scaleX(0); transform-origin: left; transition: transform .5s var(--ease); }
.nav__enlaces a:hover::after { transform: scaleX(1); }
.nav__acciones { display: flex; align-items: center; gap: .8rem; }
.nav__reservar { padding: .95em 1.7em; }
.nav__abrir { display: none; width: 44px; height: 44px; border: 0; background: none; padding: 0; cursor: pointer; position: relative; color: var(--tinta); }
.nav__abrir span { position: absolute; left: 11px; right: 11px; height: 1.5px; background: currentColor; transition: transform .4s var(--ease); }
.nav__abrir span:first-child { top: 18px; } .nav__abrir span:last-child { top: 25px; }
.nav--abierta .nav__abrir span:first-child { transform: translateY(3.5px) rotate(45deg); }
.nav--abierta .nav__abrir span:last-child { transform: translateY(-3.5px) rotate(-45deg); }
.menu-movil { display: none; }

/* ---------- portada ---------- */
.portada { position: relative; min-height: 100svh; display: grid; grid-template-columns: 42% 58%; padding-top: var(--nav); background: var(--papel); }
.portada__lado { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2.4rem; padding: 4vh var(--lado) 6vh; text-align: center; }
.portada__firma { --fw: min(370px, 28vw, 44vh); font-weight: 400; }
.portada__pie { display: flex; flex-direction: column; align-items: center; gap: 1.3rem; }
.portada__frase { font-size: clamp(1.15rem, 1.5vw, 1.4rem); max-width: 20em; line-height: 1.4; text-wrap: balance; }
.portada__dir { font-family: var(--sans); font-size: .85rem; color: var(--tinta-2); }
.portada__fotos { position: relative; overflow: hidden; background: var(--noche); }
.portada__fotos img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity 1.6s ease; }
.portada__fotos img[data-activa] { opacity: 1; }

/* ---------- fraula = fresa: la fresa estalla y su mancha tiñe la página ---------- */
.fresa { position: relative; z-index: 2; background: #efedf1; overflow: clip; }
.fresa__foto { position: relative; height: 100svh; min-height: 560px; overflow: hidden; }
.fresa__foto img { width: 100%; height: 100%; object-fit: cover; object-position: 72% 30%; }
.fresa__texto { position: absolute; left: var(--lado); bottom: 24vh; max-width: 30rem; z-index: 2; }
.fresa__palabra { font-size: clamp(4rem, 11vw, 10rem); line-height: .8; font-weight: 500; letter-spacing: -.02em; color: var(--fresa); }
.fresa__def { margin-top: 1.4rem; font-size: clamp(1.15rem, 1.5vw, 1.35rem); line-height: 1.45; }
.fresa__calle { margin-top: .8rem; font-family: var(--sans); font-size: .9rem; color: var(--tinta-2); }
.fresa__mancha { position: absolute; z-index: 3; left: 0; top: 0; width: 44vmax; aspect-ratio: 400 / 300; pointer-events: none; color: var(--fresa); transform-origin: 47.25% 56.67%; transform: scale(0); }
.fresa__mancha svg { width: 100%; height: 100%; fill: currentColor; }
.anima .fresa__mancha { will-change: transform; }

/* ---------- menús (sobre el rojo de la mancha) ---------- */
.menus__borde { position: absolute; left: 50%; top: 0; width: max(76vw, 640px); aspect-ratio: 400 / 300; margin-left: calc(max(76vw, 640px) / -2); margin-top: calc(max(76vw, 640px) * -.425);
  color: var(--fresa); pointer-events: none; transform-origin: 47.25% 56.67%; }
.menus__borde svg { width: 100%; height: 100%; fill: currentColor; }
.menus { --crema-2: rgba(245, 239, 232, .9); position: relative; z-index: 3; background: var(--fresa); color: var(--crema); padding: clamp(5rem, 12vh, 9rem) var(--lado) clamp(4rem, 10vh, 7rem); }
.menus__cabeza { text-align: center; max-width: 40rem; margin: 0 auto; }
.menus__cabeza p { margin-top: 1.2rem; font-size: clamp(1.1rem, 1.4vw, 1.3rem); color: var(--crema-2); }
.menus__lista { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(1.5rem, 3vw, 3.5rem); margin: clamp(3rem, 7vh, 5rem) auto 0; max-width: 1280px; }
.menu { display: flex; flex-direction: column; align-items: center; text-align: center; }
.menu__foto { width: 100%; aspect-ratio: 4 / 5; --tapa: var(--fresa); }
.menu__foto img { width: 100%; height: 100%; object-fit: cover; }
.menu__nombre { margin-top: 1.6rem; font-weight: 400; width: 100%; }
.menu__script { --grosor: 10; width: 100%; height: clamp(3.4rem, 5.2vw, 4.6rem); fill: var(--crema); }
.menu__origen { margin-top: .9rem; font-size: 1rem; line-height: 1.45; color: var(--crema-2); max-width: 22em; }
.menu__que { margin-top: .9rem; font-size: 1.15rem; }
.menu__pases { display: flex; flex-wrap: wrap; justify-content: center; margin-top: .7rem; font-family: var(--sans); font-size: .88rem; color: var(--crema-2); }
.menu__pases li + li::before { content: "·"; margin: 0 .55em; }
.menu__nota { margin-top: .4rem; font-family: var(--sans); font-size: .8rem; color: var(--crema-2); }
.menu__precio { margin: 1.1rem 0 1.4rem; font-size: clamp(2.4rem, 3.4vw, 3rem); line-height: 1; }
.menus__notas { display: flex; flex-wrap: wrap; justify-content: center; gap: .4rem 0; margin: clamp(3rem, 6vh, 4.5rem) auto 0; max-width: 60rem; font-family: var(--sans); font-size: .85rem; color: var(--crema-2); text-align: center; }
.menus__notas li + li::before { content: "·"; margin: 0 .8em; }
.agenda { max-width: 60rem; margin: 2.6rem auto 0; border-top: 1px solid rgba(245, 239, 232, .3); }
.agenda li { display: grid; grid-template-columns: 15rem 1fr auto; gap: 1rem; align-items: baseline; padding: 1.05rem 0; border-bottom: 1px solid rgba(245, 239, 232, .3); }
.agenda__cuando { font-family: var(--sans); font-size: .9rem; }
.agenda__que { font-size: 1.15rem; }
.agenda a { font-family: var(--sans); font-size: .76rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; border-bottom: 1px solid currentColor; padding-bottom: 2px; }
.agenda li[hidden] { display: none; }

/* ---------- la temporada: tira de platos que pasa de lado ---------- */
.temporada { background: var(--noche); color: var(--crema); }
.temporada__fijo { min-height: 100svh; display: flex; flex-direction: column; justify-content: center; gap: clamp(2rem, 5vh, 3.5rem); padding: calc(var(--nav) + 4vh) 0 6vh; overflow: hidden; }
.temporada h2 { padding: 0 var(--lado); max-width: 14em; font-size: clamp(2.2rem, 4.4vw, 4rem); }
.temporada__tira { display: flex; gap: clamp(1rem, 2vw, 2rem); padding: 0 var(--lado); width: max-content; will-change: transform; }
.plato { width: clamp(220px, 21vw, 340px); flex: none; }
.plato__foto { aspect-ratio: 4 / 5; overflow: hidden; background: #241d1e; }
.plato__foto img { width: 100%; height: 100%; object-fit: cover; }
.plato figcaption { margin-top: .8rem; font-size: 1rem; line-height: 1.35; color: var(--crema-2); max-width: 18em; }

/* ---------- Dani y Roseta: las dos medias caras se juntan ---------- */
.nosotros { background: var(--noche); color: var(--crema); padding: clamp(5rem, 12vh, 8rem) var(--lado); overflow: hidden; }
.nosotros__titulo { font-weight: 400; display: flex; justify-content: center; }
.nosotros__script { width: min(560px, 86vw); height: clamp(4rem, 7vw, 6.2rem); fill: var(--crema); }
.cara { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: clamp(1.5rem, 4vw, 4rem); max-width: 1180px; margin: clamp(2.5rem, 6vh, 4rem) auto 0; }
.cara__mitades { display: flex; }
.cara__mitad { width: min(22vw, 300px); aspect-ratio: 900 / 1761; overflow: hidden; }
.cara__mitad img { width: 100%; height: 100%; object-fit: cover; }
.ruta { display: flex; flex-direction: column; align-items: center; gap: .3rem; }
.ruta__paso { display: flex; align-items: center; gap: .6rem; }
.ruta__ciudad { height: 2.5rem; width: auto; fill: var(--crema); --grosor: 34; }
.ruta__x { width: 1.1rem; height: 1.1rem; flex: none; }
.ruta__x path, .ruta__flecha path { fill: none; stroke: var(--fresa); stroke-width: 2.2; stroke-linecap: round; }
.ruta__flecha svg { width: 1.8rem; height: 2.1rem; }
.ruta__flecha path { stroke: var(--crema-2); stroke-width: 1.6; }
.ruta--roseta .ruta__flecha svg { transform: scaleX(-1); }
.nosotros__texto { max-width: 36rem; margin: clamp(3rem, 7vh, 4.5rem) auto 0; text-align: center; }
.nosotros__lema { font-size: clamp(1.8rem, 3vw, 2.6rem); line-height: 1.15; margin-bottom: 1.4rem; }
.nosotros__texto p + p { margin-top: 1rem; color: var(--crema-2); }
.nosotros__retratos { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(1rem, 3vw, 2.5rem); max-width: 880px; margin: clamp(3rem, 7vh, 4.5rem) auto 0; }
.nosotros__retratos figure { --tapa: var(--noche); }
.nosotros__retratos img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; }
.nosotros__retratos figcaption { margin-top: .8rem; font-family: var(--sans); font-size: .9rem; color: var(--crema-2); text-align: center; }

/* ---------- la sala ---------- */
.sala { padding: clamp(5rem, 12vh, 8rem) var(--lado); }
.sala__cabeza { display: flex; justify-content: space-between; align-items: end; gap: 2rem; max-width: 1280px; margin: 0 auto; }
.sala__cabeza p { font-size: clamp(1.1rem, 1.4vw, 1.3rem); color: var(--tinta-2); }
.sala__mosaico { display: grid; grid-template-columns: 2fr 1fr; grid-template-rows: 1fr 1fr; gap: clamp(.8rem, 1.6vw, 1.4rem); max-width: 1280px; margin: clamp(2.5rem, 6vh, 4rem) auto 0; }
.sala figure { --tapa: var(--papel); }
.sala img { width: 100%; height: 100%; object-fit: cover; }
.sala__barra { grid-row: 1 / 3; display: flex; flex-direction: column; }
.sala__barra img { flex: 1; min-height: 0; }
.sala__barra figcaption { padding-top: .9rem; font-size: 1.05rem; background: var(--papel); }
.sala__circulo, .sala__cuadros { aspect-ratio: 4 / 5; }

/* ---------- regala ---------- */
.regala { display: grid; grid-template-columns: 55% 45%; background: var(--papel-2); }
.regala__foto { --tapa: var(--papel-2); min-height: 70vh; }
.regala__foto img { width: 100%; height: 100%; object-fit: cover; }
.regala__texto { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 1.2rem; padding: clamp(3rem, 8vh, 6rem) var(--lado); }
.regala__lema { font-size: clamp(1.4rem, 2vw, 1.8rem); line-height: 1.25; }
.regala__texto p:not(.regala__lema) { color: var(--tinta-2); max-width: 26em; }
.regala .boton { margin-top: .6rem; }

/* ---------- prensa ---------- */
.prensa { padding: clamp(5rem, 12vh, 8rem) var(--lado); max-width: 1280px; margin: 0 auto; }
.prensa__cita { margin-top: 2.2rem; max-width: 46rem; }
.prensa__cita p { font-size: clamp(1.35rem, 2.2vw, 1.9rem); line-height: 1.3; }
.prensa__cita footer { margin-top: .9rem; font-family: var(--sans); font-size: .88rem; color: var(--tinta-2); }
.prensa__lista { display: grid; grid-template-columns: 1fr 1fr; gap: 0 clamp(2rem, 5vw, 5rem); margin-top: clamp(2.5rem, 6vh, 4rem); border-top: 1px solid rgba(59, 36, 35, .15); }
.prensa__lista li { display: flex; flex-direction: column; gap: .3rem; padding: 1.1rem 0; border-bottom: 1px solid rgba(59, 36, 35, .15); }
.prensa__medio { font-family: var(--sans); font-size: .82rem; color: var(--tinta-2); }
.prensa__titular { font-size: 1.12rem; line-height: 1.35; }

/* ---------- visítanos ---------- */
.visitanos { display: grid; grid-template-columns: 40% 60%; background: var(--noche); color: var(--crema); }
.visitanos__foto { --tapa: var(--noche); min-height: 80vh; }
.visitanos__foto img { width: 100%; height: 100%; object-fit: cover; }
.visitanos__cuerpo { display: flex; flex-direction: column; justify-content: center; gap: 2.2rem; padding: clamp(4rem, 10vh, 7rem) var(--lado); }
.visitanos__datos { display: grid; grid-template-columns: repeat(3, auto); gap: 1.5rem 2.6rem; justify-content: start; }
.visitanos__datos dt { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.visitanos__datos dd { font-size: 1.15rem; line-height: 1.4; }
.visitanos__datos a { border-bottom: 1px solid rgba(245, 239, 232, .3); }
.visitanos__reglas { font-family: var(--sans); font-size: .9rem; color: var(--crema-2); max-width: 38rem; }
.visitanos__reglas li { padding: .55rem 0; border-top: 1px solid rgba(245, 239, 232, .14); }
.visitanos__botones { display: flex; align-items: center; gap: 2rem; flex-wrap: wrap; }

/* ---------- pie ---------- */
.pie { background: #0e0b0c; color: var(--crema); padding: 4.5rem var(--lado) 3rem; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 1.2rem; font-family: var(--sans); font-size: .85rem; }
.pie__logo { --grosor: 18; width: 150px; aspect-ratio: 400 / 380; height: auto; color: var(--crema); overflow: visible; }
.pie .sellos { font-size: 10px; margin-top: .2rem; }
.pie { --michelin: var(--crema); --repsol: var(--crema); }
.pie__redes a, .pie__legal a { border-bottom: 1px solid rgba(245, 239, 232, .25); }
.pie__legal, .pie__copy { color: var(--crema-2); }

/* ---------- botón de subir ---------- */
.to-top { position: fixed; right: 18px; bottom: 18px; z-index: 90; width: 46px; height: 46px; border-radius: 50%; border: 1px solid rgba(59, 36, 35, .18); background: var(--papel); color: var(--tinta); display: grid; place-items: center; cursor: pointer;
  opacity: 0; visibility: hidden; transform: translate3d(0, 10px, 0); transition: opacity .4s ease, visibility .4s, transform .4s var(--ease); }
.to-top.is-visible { opacity: 1; visibility: visible; transform: none; }

/* ---------- fotos que se despliegan al bajar (una tapa del color del fondo se retira; --t de 0 a 1 con el scroll) ---------- */
.anima .desp, .vuelta .desp { position: relative; overflow: hidden; }
.anima .desp::after { content: ""; position: absolute; inset: 0; z-index: 1; background: var(--tapa, var(--papel)); transform: translate3d(0, calc(var(--t, 0) * -101%), 0); pointer-events: none; }
.anima .desp img { transform: scale(calc(1.14 - .14 * var(--t, 0))); }
.anima .desp--lista::after { display: none; }

/* ---------- tablet y móvil ---------- */
@media (max-width: 1100px) {
  .nav__enlaces { display: none; }
  .nav__abrir { display: block; }
  .nav { gap: 1rem; }
  .nav__acciones { margin-left: auto; }
  .menu-movil { display: flex; flex-direction: column; position: fixed; top: var(--nav); left: 0; right: 0; height: calc(100dvh - var(--nav)); padding: 2rem var(--lado) 3rem; gap: .2rem; background: var(--papel);
    opacity: 0; visibility: hidden; transform: translate3d(0, -8px, 0); transition: opacity .35s ease, visibility .35s, transform .35s var(--ease); overflow-y: auto; }
  .menu-movil a { font-size: 1.9rem; padding: .45rem 0; border-bottom: 1px solid rgba(59, 36, 35, .1); }
  .menu-movil__datos { margin-top: auto; padding-top: 2rem; font-family: var(--sans); font-size: .9rem; color: var(--tinta-2); }
  .nav--abierta .menu-movil { opacity: 1; visibility: visible; transform: none; }
}
@media (max-width: 960px) {
  :root { --nav: 60px; }
  .nav__logo svg { height: 36px; }
  .nav__reservar { padding: .9em 1.3em; font-size: .7rem; }
  .portada { grid-template-columns: 1fr; grid-template-rows: auto 58svh; min-height: 0; }
  .portada__lado { padding: 2.2rem var(--lado) 2.2rem; gap: 1.4rem; }
  .portada__firma { --fw: min(220px, 56vw, 30svh); }
  .portada__dir { display: none; }
  .portada__pie { gap: 1.1rem; }
  .fresa { background: var(--papel); }
  .fresa__foto { height: auto; min-height: 0; aspect-ratio: 4 / 3; }
  .fresa__foto img { object-position: 76% 30%; }
  .fresa__texto { position: relative; left: auto; bottom: auto; padding: 2.2rem var(--lado) 5.5rem; max-width: none; }
  .menus__lista { grid-template-columns: 1fr; max-width: 460px; gap: 4rem; }
  .menu__foto { aspect-ratio: 4 / 3; }
  .menus__borde { width: 118vw; margin-left: -59vw; margin-top: -40vw; }
  .agenda li { grid-template-columns: 1fr auto; }
  .agenda__cuando { grid-column: 1 / -1; }
  .temporada__fijo { min-height: 0; padding: 5rem 0 3rem; }
  .nosotros { padding-top: 3.5rem; }
  .temporada__tira { width: auto; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; -webkit-overflow-scrolling: touch; padding-bottom: .2rem; will-change: auto; }
  .temporada__tira::-webkit-scrollbar { display: none; }
  .plato { width: 68vw; scroll-snap-align: center; }
  .cara { grid-template-columns: 1fr 1fr; grid-template-areas: "mitades mitades" "dani roseta"; gap: 2.4rem 1rem; }
  .cara__mitades { grid-area: mitades; justify-content: center; }
  .cara__mitad { width: 41vw; }
  .ruta--dani { grid-area: dani; } .ruta--roseta { grid-area: roseta; }
  .ruta__ciudad { height: 1.9rem; }
  .sala__cabeza { flex-direction: column; align-items: start; gap: .8rem; }
  .sala__mosaico { grid-template-columns: 1fr 1fr; grid-template-rows: auto; }
  .sala__barra { grid-row: auto; grid-column: 1 / -1; }
  .sala__barra img { aspect-ratio: 4 / 5; flex: none; }
  .regala { grid-template-columns: 1fr; }
  .regala__foto { min-height: 0; aspect-ratio: 1400 / 990; }
  .prensa__lista { grid-template-columns: 1fr; }
  .visitanos { grid-template-columns: 1fr; }
  .visitanos__foto { min-height: 0; aspect-ratio: 4 / 3; }
  .visitanos__datos { grid-template-columns: 1fr 1fr; }
  .visitanos__datos > div:first-child { grid-column: 1 / -1; }
}
@media (max-width: 420px) {
  .nav__logo svg { height: 30px; }
  .nav__reservar { padding: .85em 1.05em; letter-spacing: .12em; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; }
}