/* Estilos propios de la web (fuera del bundle de Vite). Compartidos por / y /nuestra-historia/. */
/* Page background: rosa empolvado + two very soft off-canvas tints (rose top-right,
   wine bottom-left) so it reads as an atmosphere, not a flat fill. Painted on <html>
   so it stays put on scroll with no background-attachment jank; <body> goes transparent.
   --color-surface: rosa empolvado sólido para la nav fija (antes crema). */
:root{--color-surface:#f0cdd8;--color-surface-alt:#e8bccb}
html{
  background-color:#f0cdd8;
  background-image:
    radial-gradient(72% 55% at 100% 0%, color-mix(in oklab, var(--rose-400) 26%, transparent), transparent 68%),
    radial-gradient(68% 52% at 0% 100%, color-mix(in oklab, var(--rose-700) 18%, transparent), transparent 66%);
  background-repeat:no-repeat;
}
body{background:transparent}
/* a touch more of the existing paper grain now that flat areas show through cards */
.hero__grain{opacity:.05}

/* Hero secondary CTA: proper frosted glass instead of the near-solid pale pill.
   Fallback (no backdrop-filter) swaps to a dark tint so white text stays legible. */
.btn-ghost-light{
  background:color-mix(in oklab, var(--white) 13%, transparent);
  border:1px solid color-mix(in oklab, var(--white) 48%, transparent);
  color:var(--white);
  text-shadow:0 1px 3px color-mix(in oklab, var(--ink-900) 45%, transparent);
  box-shadow:0 10px 28px -12px color-mix(in oklab, var(--ink-900) 65%, transparent),
             inset 0 1px 0 color-mix(in oklab, var(--white) 28%, transparent);
  -webkit-backdrop-filter:blur(12px) saturate(1.5);
  backdrop-filter:blur(12px) saturate(1.5);
}
.btn-ghost-light:hover{
  background:color-mix(in oklab, var(--white) 22%, transparent);
  border-color:color-mix(in oklab, var(--white) 68%, transparent);
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .btn-ghost-light{background:color-mix(in oklab, var(--ink-900) 55%, transparent)}
}

/* Nav "Reservar mesa": dark frosted glass instead of solid ink.
   Scoped to the nav so the dialog / review btn-dark buttons stay solid. */
.nav .btn-dark{
  background:color-mix(in oklab, var(--ink-900) 64%, transparent);
  color:var(--cream-50);
  border:1px solid color-mix(in oklab, var(--white) 14%, transparent);
  text-shadow:0 1px 2px color-mix(in oklab, #000 40%, transparent);
  box-shadow:0 8px 22px -12px color-mix(in oklab, var(--ink-900) 70%, transparent);
  -webkit-backdrop-filter:blur(10px) saturate(1.3);
  backdrop-filter:blur(10px) saturate(1.3);
}
.nav .btn-dark:hover{
  background:color-mix(in oklab, var(--ink-900) 80%, transparent);
  border-color:color-mix(in oklab, var(--white) 22%, transparent);
  translate:0 -1px;
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .nav .btn-dark{background:color-mix(in oklab, var(--ink-900) 88%, transparent)}
}

/* Carta: category cards + allergen chips as translucent warm glass,
   so they read against the page instead of solid white slabs. */
.cat-card{
  background:color-mix(in oklab, var(--white) 42%, transparent);
  -webkit-backdrop-filter:blur(8px);
  backdrop-filter:blur(8px);
}
.cat-card[aria-current=true]{
  background:color-mix(in oklab, var(--rose-50) 72%, transparent);
}
.chip{
  background:color-mix(in oklab, var(--white) 38%, transparent);
  -webkit-backdrop-filter:blur(6px);
  backdrop-filter:blur(6px);
}
.chip[aria-pressed=true]{
  background:color-mix(in oklab, var(--rose-100) 80%, transparent);
}
/* Dish rows: same translucent warm tint (no blur — many rows, and the page
   behind is near-flat, so blur would only cost paint work). */
.item-card{
  background:color-mix(in oklab, var(--white) 42%, transparent);
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .cat-card{background:color-mix(in oklab, var(--white) 78%, var(--color-surface))}
  .chip{background:color-mix(in oklab, var(--white) 70%, var(--color-surface))}
}

/* Floating "Reservar" (FAB): rose-tinted glass. Stays clearly the primary
   action but picks up whatever it floats over (dark brunch / light carta). */
.fab{
  background:color-mix(in oklab, var(--rose-600) 75%, transparent);
  border:1px solid color-mix(in oklab, var(--white) 26%, transparent);
  text-shadow:0 1px 2px color-mix(in oklab, #000 35%, transparent);
  box-shadow:0 16px 34px -14px color-mix(in oklab, var(--rose-700) 78%, transparent),
             0 3px 10px color-mix(in oklab, var(--ink-900) 22%, transparent);
  -webkit-backdrop-filter:blur(12px) saturate(1.6);
  backdrop-filter:blur(12px) saturate(1.6);
}
.fab:hover{
  background:color-mix(in oklab, var(--rose-600) 88%, transparent);
  translate:0 -2px;
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .fab{background:var(--color-accent)}
}

/* "Déjanos tu reseña": was a tall full-bleed pink band with a tiny centred
   column. Now a compact rose card that sits inside the page margins, laid
   out as a horizontal strip on desktop, with an oversized quote glyph. */
.review-strip{padding-block:clamp(2.5rem,6vw,4rem)}
.review-card{
  position:relative;
  overflow:hidden;
  display:flex;
  align-items:center;
  gap:clamp(1.25rem,4vw,3rem);
  text-align:left;
  padding:clamp(1.6rem,3.5vw,2.4rem) clamp(1.6rem,4vw,3rem);
  border-radius:var(--radius-l);
  background:linear-gradient(120deg, var(--rose-100) 0%, var(--rose-50) 55%, color-mix(in oklab, var(--rose-50) 60%, var(--white)) 100%);
  border:1px solid color-mix(in oklab, var(--rose-300) 60%, transparent);
  box-shadow:0 24px 55px -28px color-mix(in oklab, var(--rose-700) 50%, transparent);
}
.review-card__quote{
  position:absolute;
  top:-.34em; left:-.04em;
  font-family:var(--font-display);
  font-size:clamp(6rem,13vw,10rem);
  line-height:1;
  color:color-mix(in oklab, var(--rose-300) 40%, transparent);
  pointer-events:none;
}
.review-card__text{position:relative;flex:1;min-width:0}
.review-card .review-strip__stars{margin:0 0 .5rem}
.review-card__copy{color:var(--color-ink-muted);max-width:46ch;margin:0}
.review-card .btn{flex-shrink:0}
@media (max-width:640px){
  .review-card{flex-direction:column;text-align:center;align-items:center;gap:1.1rem}
  .review-card .review-strip__stars{margin-inline:auto}
  .review-card__copy{margin-inline:auto}
}

/* Full-page fixed grain (.hero__grain) uses mix-blend-mode, which forces the
   browser to recomposite it against whatever scrolls underneath. Without its
   own layer this ghosts/flickers on scroll, especially across a high-contrast
   seam like hero (light) -> brunch (dark). Promoting it fixes the scroll jank. */
.hero__grain{will-change:opacity;transform:translateZ(0)}
.hero__media img{will-change:transform}

/* ================= PORTADA ================= */

/* Hero: tagline + firma debajo del título */
.hero__tagline{font-family:var(--font-display);font-style:italic;font-weight:400;color:var(--white);font-size:clamp(1.6rem,3.6vw,2.6rem);line-height:1.1;letter-spacing:-.01em;margin-top:-.4rem}
.hero__copy{display:grid;gap:.7rem;max-width:44ch}
.hero__copy .hero__lede{max-width:none}
.hero__sign{display:flex;align-items:center;gap:.7rem;font-family:var(--font-accent);font-weight:700;font-size:.95rem;letter-spacing:.14em;text-transform:uppercase;color:var(--brass-300)}
.hero__sign:before{content:"";inline-size:22px;block-size:1.5px;background:currentColor}

/* Producto · De la mañana a la tarde: mosaico de fotos con el título encima */
.moments__grid{display:grid;grid-template-columns:repeat(6,1fr);gap:clamp(.8rem,1.6vw,1.2rem)}
.moment{position:relative;isolation:isolate;display:block;border-radius:var(--radius-l);overflow:hidden;background:var(--ink-900);border:0;box-shadow:var(--shadow-soft);text-decoration:none;color:#fff;transition:translate var(--dur-base) var(--ease-out),box-shadow var(--dur-base) var(--ease-out)}
.moment:hover{translate:0 -4px;box-shadow:var(--shadow-lift)}
.moment__img{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;display:block;transition:scale 700ms var(--ease-out)}
.moment:hover .moment__img{scale:1.05}
.moment:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(to top,color-mix(in oklab,var(--ink-900) 88%,transparent) 0%,color-mix(in oklab,var(--ink-900) 45%,transparent) 38%,transparent 70%)}
.moment__body{position:absolute;inset:auto 0 0 0;padding:clamp(1rem,2vw,1.5rem);display:grid;gap:.2rem;align-content:end}
.moment__num{font-family:var(--font-accent);font-weight:700;font-size:.7rem;letter-spacing:.14em;color:var(--rose-300)}
.moment__title{font-family:var(--font-display);font-weight:600;font-size:clamp(1.7rem,2.6vw,2.3rem);line-height:1.02;color:#fff}
.moment__text{color:color-mix(in oklab,var(--cream-50) 88%,transparent);font-size:.95rem;line-height:1.35}
.moment--desayunos,.moment--brunch{grid-column:span 3;aspect-ratio:16/10}
.moment--cocina,.moment--cafe,.moment--dulce{grid-column:span 2;aspect-ratio:4/5}
.moment--desayunos .moment__img{object-position:30% 30%}
.moment--brunch .moment__img{object-position:50% 78%}
.moment--cafe .moment__img{object-position:55% 29%;scale:1.8;transform-origin:55% 29%}
.moment--cafe:hover .moment__img{scale:1.88}
@media (max-width:760px){
  .moments__grid{grid-template-columns:repeat(2,1fr)}
  .moment--desayunos,.moment--brunch,.moment--dulce{grid-column:span 2;aspect-ratio:16/10}
  .moment--cocina,.moment--cafe{grid-column:span 1;aspect-ratio:4/5}
  .moment--cocina .moment__title,.moment--cafe .moment__title{font-size:1.45rem}
  .moment--cocina .moment__text,.moment--cafe .moment__text{font-size:.85rem}
}

/* Brunch · Aquí se come diferente */
.brunch-feature{position:relative;overflow:hidden}
.brunch-feature:before{content:"";position:absolute;inset:0;background:radial-gradient(120% 140% at 100% -10%, color-mix(in oklab, var(--rose-700) 45%, transparent) 0%, transparent 55%);pointer-events:none}
.brunch-feature .container{position:relative}
.brunch-feature.section-pad{padding-block:clamp(3.5rem,7vw,6rem)}
.brunch-feature__grid{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(2rem,5vw,4.5rem);align-items:center}
.brunch-feature__badge-row{display:flex;align-items:center;gap:.7rem;margin-bottom:.9rem;flex-wrap:wrap}
.brunch-feature__title{font-size:clamp(2.8rem,6.4vw,5rem);line-height:.98;letter-spacing:-.025em;color:#fff;margin-top:.5rem}
.brunch-feature__title em{font-style:italic;color:var(--rose-300)}
.versus{display:grid;grid-template-columns:auto 1fr;gap:.9rem;align-items:stretch;margin-top:1.6rem;max-width:34rem}
.versus__old,.versus__new{display:grid;gap:.3rem;align-content:center;padding:1rem 1.2rem;border-radius:var(--radius-m)}
.versus__old{border:1px dashed color-mix(in oklab,var(--cream-50) 28%,transparent);color:var(--color-on-dark-muted)}
.versus__new{background:var(--rose-600);color:#fff;box-shadow:0 18px 36px -18px color-mix(in oklab,var(--ink-900) 80%,transparent)}
.versus__label{font-size:.66rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;opacity:.8}
.versus__line{font-family:var(--font-display);font-size:clamp(1.1rem,2vw,1.4rem);line-height:1.15}
.versus__old s{text-decoration-thickness:2px;text-decoration-color:var(--rose-400)}
.versus__old i{font-style:normal;opacity:.6}
.versus__note{font-size:.88rem;opacity:.92}
@media (max-width:520px){.versus{grid-template-columns:1fr}}
.brunch-feature__sub{font-family:var(--font-display);font-style:italic;font-size:clamp(1.15rem,2vw,1.4rem);color:var(--cream-50);margin-top:.9rem}
.brunch-feature__lede{color:var(--color-on-dark-muted);max-width:46ch;font-size:1rem;line-height:1.6;margin-top:1.4rem}
.brunch-feature__lede strong{color:var(--cream-50);font-weight:600}
.brunch-feature__quote{margin:1.6rem 0 0;padding-left:1.1rem;border-left:2px solid var(--rose-400);font-family:var(--font-display);font-size:clamp(1.15rem,2vw,1.35rem);line-height:1.4;color:var(--cream-50)}
.brunch-feature__quote em{color:var(--rose-300)}
.brunch-feature__photo{position:relative}
.brunch-feature__photo img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:var(--radius-l);box-shadow:var(--shadow-soft);display:block}
.brunch-feature__stamp{position:absolute;left:-1.2rem;bottom:1.4rem;display:grid;gap:.15rem;padding:.9rem 1.2rem;border-radius:var(--radius-m);background:var(--rose-600);color:var(--white);box-shadow:0 18px 36px -14px color-mix(in oklab,var(--ink-900) 80%,transparent);rotate:-3deg}
.brunch-feature__stamp span:first-child{font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;font-weight:700;opacity:.85}
.brunch-feature__stamp span:last-child{font-family:var(--font-accent);font-weight:800;font-size:1.7rem;line-height:1}

.brunch-menu{margin-top:clamp(2.2rem,5vw,3.5rem);display:grid;grid-template-columns:.9fr 1.1fr;border:1px solid color-mix(in oklab,var(--cream-50) 16%,transparent);border-radius:var(--radius-l);background:color-mix(in oklab,var(--cream-50) 5%,transparent);overflow:hidden}
.brunch-menu__col{padding:clamp(1.4rem,3vw,2.2rem)}
.brunch-menu__col + .brunch-menu__col{border-left:1px dashed color-mix(in oklab,var(--cream-50) 22%,transparent)}
.brunch-menu__label{font-family:var(--font-body);font-weight:700;font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--brass-300);margin-bottom:1rem}
.brunch-menu__name{font-family:var(--font-display);font-size:1.5rem;color:#fff;line-height:1.1;margin-bottom:1.1rem}
.brunch-menu__name em{color:var(--rose-300)}
.brunch-menu__includes{list-style:none;margin:0;padding:0;display:grid;gap:.7rem}
.brunch-menu__includes li{display:flex;gap:.75rem;align-items:baseline;color:var(--cream-50);font-size:.95rem}
.brunch-menu__includes li:before{content:"";flex-shrink:0;inline-size:7px;block-size:7px;border-radius:50%;background:var(--rose-400);translate:0 -2px}
.brunch-menu__includes li.is-main{font-weight:600}
.brunch-menu__includes li.is-main:before{background:var(--brass-300)}
.brunch-menu__price{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-top:1.4rem;padding-top:1.1rem;border-top:1px solid color-mix(in oklab,var(--cream-50) 14%,transparent)}
.brunch-menu__when{font-size:.85rem;color:var(--color-on-dark-muted)}
.brunch-menu__when strong{display:block;color:var(--cream-50);font-weight:600}
.brunch-menu__amount{font-family:var(--font-accent);font-weight:800;font-size:2rem;color:var(--brass-300);line-height:1}
.brunch-dishes{list-style:none;margin:0;padding:0;counter-reset:dish}
.brunch-dishes li{counter-increment:dish;display:flex;align-items:baseline;gap:1rem;padding:.8rem 0;border-top:1px solid color-mix(in oklab,var(--cream-50) 12%,transparent);font-family:var(--font-display);font-size:clamp(1.15rem,2vw,1.4rem);color:#fff;line-height:1.2}
.brunch-dishes li:first-child{border-top:0;padding-top:0}
.brunch-dishes li:before{content:counter(dish,decimal-leading-zero);font-family:var(--font-accent);font-weight:700;font-size:.72rem;letter-spacing:.1em;color:var(--rose-300);flex-shrink:0;inline-size:1.6rem}
.brunch-feature__foot{margin-top:clamp(1.8rem,4vw,2.6rem);display:flex;align-items:center;justify-content:space-between;gap:1.2rem 2rem;flex-wrap:wrap}
.brunch-feature__closing{font-family:var(--font-display);font-style:italic;font-size:clamp(1.4rem,3vw,2rem);color:var(--rose-300)}
.brunch-feature__weekend{font-size:.85rem;color:var(--color-on-dark-muted);margin-top:1.2rem}
.brunch-feature__weekend strong{color:var(--cream-50);font-weight:600}
@media (max-width:900px){
  .brunch-feature__grid{grid-template-columns:1fr}
  .brunch-feature__photo{max-width:560px}
  .brunch-feature__photo img{aspect-ratio:4/3.4}
  .brunch-feature__stamp{left:auto;right:1rem;bottom:-1rem}
  .brunch-menu{grid-template-columns:1fr}
  .brunch-menu__col + .brunch-menu__col{border-left:0;border-top:1px dashed color-mix(in oklab,var(--cream-50) 22%,transparent)}
}

/* Bloque 3 · No somos solo un sitio para comer */
.happen__grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(2rem,6vw,5rem);align-items:start}
.happen__intro{position:sticky;top:6.5rem;display:grid;gap:1rem}
.happen__lead{font-family:var(--font-display);font-style:italic;font-size:clamp(1.3rem,2.4vw,1.7rem);color:var(--rose-700);line-height:1.25}
.happen__list{list-style:none;margin:0;padding:0}
.happen__list li{display:flex;align-items:baseline;gap:1.1rem;padding:clamp(1rem,2.2vw,1.45rem) 0;border-top:1px solid var(--color-line);font-family:var(--font-display);font-size:clamp(1.5rem,3.4vw,2.4rem);line-height:1.1;letter-spacing:-.01em}
.happen__list li:last-child{border-bottom:1px solid var(--color-line)}
.happen__list li span{font-family:var(--font-accent);font-weight:700;font-size:.72rem;letter-spacing:.12em;color:var(--rose-600);flex-shrink:0;inline-size:1.8rem;translate:0 -.35em}
.happen__list li.is-last{font-style:italic;color:var(--rose-700)}
@media (max-width:860px){
  .happen__grid{grid-template-columns:1fr}
  .happen__intro{position:static}
}

/* Bloque 4 · Casi 40 años */
.legacy{position:relative;overflow:hidden;isolation:isolate;background:var(--ink-900)}
.legacy__bg{position:absolute;inset:0;z-index:-2}
.legacy__bg img{width:100%;height:100%;object-fit:cover;object-position:50% 40%}
.legacy:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(100deg,color-mix(in oklab,var(--ink-900) 96%,transparent) 0%,color-mix(in oklab,var(--ink-900) 88%,transparent) 50%,color-mix(in oklab,var(--ink-900) 66%,transparent) 100%)}
.legacy__grid{display:grid;grid-template-columns:auto 1fr;gap:clamp(2rem,6vw,5rem);align-items:center}
.legacy__years{font-family:var(--font-display);font-weight:600;line-height:.85;letter-spacing:-.03em;color:transparent;-webkit-text-stroke:1.5px var(--rose-300);font-size:clamp(4.5rem,13vw,10rem)}
.legacy__years span{display:block;color:var(--rose-300);-webkit-text-stroke:0;font-size:.4em;font-style:italic;font-weight:400;letter-spacing:-.01em;margin-top:.35em}
.legacy__text{display:grid;gap:1rem;max-width:52ch}
.legacy__text p{color:var(--color-on-dark-muted);font-size:1.05rem;line-height:1.65}
.legacy__text p strong{color:var(--cream-50);font-weight:600}
.legacy__timeline{grid-column:1/-1;list-style:none;margin:clamp(1rem,3vw,2rem) 0 0;padding:1.4rem 0 0;display:grid;grid-template-columns:repeat(6,1fr);gap:1rem;border-top:1px solid color-mix(in oklab,var(--cream-50) 18%,transparent)}
.legacy__timeline li{display:grid;gap:.2rem;align-content:start;position:relative}
.legacy__timeline li:before{content:"";position:absolute;top:-1.4rem;translate:0 -50%;left:0;inline-size:9px;block-size:9px;border-radius:50%;background:var(--rose-400);box-shadow:0 0 0 4px color-mix(in oklab,var(--rose-400) 25%,transparent)}
.legacy__timeline strong{font-weight:600;font-size:.92rem;color:var(--cream-50);line-height:1.25}
.legacy__timeline b{font-family:var(--font-accent);font-weight:800;font-size:1.15rem;color:var(--brass-300)}
.legacy__timeline small{font-size:.8rem;color:var(--color-on-dark-muted);line-height:1.35}
.legacy__timeline li:last-child b{color:var(--rose-300)}
.legacy .btn{justify-self:start;margin-top:.4rem}
.legacy__close{grid-column:1/-1;display:grid;justify-items:center;text-align:center;gap:1.4rem;margin-top:clamp(1.5rem,4vw,3rem);padding-top:clamp(2rem,5vw,3.5rem);border-top:1px solid color-mix(in oklab,var(--cream-50) 18%,transparent)}
.legacy__closing{font-family:var(--font-display);font-weight:500;font-size:clamp(1.9rem,4.6vw,3.4rem);line-height:1.1;letter-spacing:-.015em;color:#fff;max-width:22ch}
.legacy__closing em{color:var(--rose-300)}
.legacy__actions{display:flex;gap:.9rem;flex-wrap:wrap;justify-content:center}
@media (max-width:860px){
  .legacy__grid{grid-template-columns:1fr}
  .legacy__timeline{grid-template-columns:repeat(3,1fr);row-gap:1.4rem;padding-top:1.2rem}
  .legacy__timeline li:before{display:none}
}

/* ================= NUESTRA HISTORIA ================= */
.page-hero{position:relative;isolation:isolate;overflow:clip;min-block-size:min(78dvh,760px);display:flex;align-items:flex-end}
.page-hero .hero__content{padding-block:clamp(6rem,14vh,9rem) clamp(2.5rem,7vh,4.5rem)}
.page-hero__title{font-family:var(--font-display);font-weight:600;color:var(--white);font-size:clamp(2.6rem,7vw,5.6rem);line-height:.98;letter-spacing:-.02em;max-width:16ch}
.page-hero__title em{display:block;font-style:italic;font-weight:400;color:var(--rose-300)}

.story-intro{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(2rem,6vw,5rem);align-items:start}
.story-intro__lead{font-family:var(--font-display);font-size:clamp(1.7rem,3.4vw,2.6rem);line-height:1.12;letter-spacing:-.01em}
.story-intro__lead em{color:var(--rose-700)}
.prose{display:grid;gap:1.1rem;font-size:1.06rem;line-height:1.7;color:var(--color-ink-muted);max-width:60ch}
.prose strong{color:var(--color-ink);font-weight:600}
@media (max-width:860px){.story-intro{grid-template-columns:1fr}}

.timeline{list-style:none;margin:0 auto;padding:0;position:relative;max-width:900px}
.timeline:before{content:"";position:absolute;top:.6rem;bottom:.6rem;left:calc(7.5rem - 1px);width:2px;background:linear-gradient(var(--rose-300),var(--brass-500))}
.timeline__item{display:grid;grid-template-columns:7.5rem 1fr;gap:0 2.4rem;padding-bottom:clamp(1.8rem,4vw,2.8rem);position:relative}
.timeline__item:last-child{padding-bottom:0}
.timeline__item:after{content:"";position:absolute;left:calc(7.5rem - 7px);top:.55rem;inline-size:14px;block-size:14px;box-sizing:border-box;border-radius:50%;background:var(--color-surface);border:3px solid var(--rose-600)}
.timeline__year{font-family:var(--font-display);font-weight:600;font-size:clamp(1.8rem,3.6vw,2.5rem);line-height:1;color:var(--rose-700);text-align:right;padding-right:1.4rem}
.timeline__body{display:grid;gap:.45rem;padding-top:.15rem}
.timeline__title{font-family:var(--font-display);font-size:1.4rem;line-height:1.15}
.timeline__body p{color:var(--color-ink-muted);line-height:1.65}
.timeline__item--pause .timeline__year{font-style:italic;font-weight:400;font-size:1.25rem;color:var(--ink-500);padding-top:.4rem}
.timeline__item--pause:after{border-color:var(--ink-300)}
.timeline__item--now .timeline__title{color:var(--rose-700)}
.timeline__item--now:after{background:var(--rose-600);box-shadow:0 0 0 6px color-mix(in oklab,var(--rose-400) 30%,transparent)}
@media (max-width:620px){
  .timeline:before{left:6px}
  .timeline__item{grid-template-columns:1fr;padding-left:2.2rem}
  .timeline__item:after{left:0;top:.35rem}
  .timeline__year{text-align:left;padding:0 0 .4rem}
  .timeline__item--pause .timeline__year{padding-top:0}
}

.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;text-align:center}
.stats__item{display:grid;gap:.35rem;align-content:center;padding:1.6rem 1rem;border-radius:var(--radius-l);border:1px solid color-mix(in oklab,var(--cream-50) 16%,transparent);background:color-mix(in oklab,var(--cream-50) 5%,transparent)}
.stats__num{font-family:var(--font-display);font-weight:600;font-size:clamp(2.6rem,6vw,4rem);line-height:1;color:var(--rose-300)}
.stats__label{color:var(--color-on-dark-muted);font-size:.95rem;line-height:1.4}
.stats-outro{margin-top:clamp(2rem,5vw,3rem);text-align:center;font-family:var(--font-display);font-style:italic;font-size:clamp(1.8rem,4vw,2.8rem);color:var(--cream-50)}
@media (max-width:700px){.stats{grid-template-columns:1fr}}

.different{display:grid;justify-items:center;text-align:center;gap:1.2rem}
.different .different__lines{max-width:none;color:var(--color-ink);font-family:var(--font-display);font-size:clamp(1.8rem,4.4vw,3.2rem);line-height:1.1;letter-spacing:-.015em}
.different .different__lines em{display:block;color:var(--rose-700)}
.different p{max-width:56ch;color:var(--color-ink-muted);font-size:1.06rem;line-height:1.7}
.different .different__close{font-family:var(--font-display);font-style:italic;font-size:1.5rem;color:var(--color-ink)}

.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,6vw,5rem);align-items:center}
.split--reverse .split__media{order:2}
.split__media img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:var(--radius-l);box-shadow:var(--shadow-soft)}
.split__text{display:grid;gap:1rem}
.pull{font-family:var(--font-display);font-size:clamp(1.35rem,2.6vw,1.8rem);line-height:1.25;color:var(--rose-700);padding-left:1rem;border-left:2px solid var(--rose-400)}
.likes{display:flex;flex-wrap:wrap;gap:.5rem;margin:.3rem 0}
.likes span{padding:.45em .95em;border-radius:var(--radius-pill);background:color-mix(in oklab,var(--rose-100) 80%,transparent);border:1px solid color-mix(in oklab,var(--rose-300) 55%,transparent);color:var(--rose-800);font-size:.85rem;font-weight:600}
@media (max-width:860px){
  .split{grid-template-columns:1fr}
  .split--reverse .split__media{order:0}
  .split__media img{aspect-ratio:4/3}
}

.finale{text-align:center;display:grid;justify-items:center;gap:1.6rem}
.finale__line{font-family:var(--font-display);font-weight:500;font-size:clamp(2rem,5vw,3.6rem);line-height:1.08;letter-spacing:-.015em;color:#fff;max-width:20ch}
.finale__line em{color:var(--rose-300)}
.finale__actions{display:flex;gap:.9rem;flex-wrap:wrap;justify-content:center}
.nav__links a[aria-current=page]{color:var(--color-ink)}
.nav__links a[aria-current=page]:after{transform:scaleX(1)}

/* Tarjetas de sección como selector de carta */
button.moment{font:inherit;text-align:left;padding:0;cursor:pointer;width:100%}
.moment__title{display:block}
.moment__cta{display:inline-flex;align-items:center;gap:.4rem;margin-top:.45rem;font-family:var(--font-body);font-weight:700;font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--rose-300)}
.moment__cta:after{content:"↓";transition:translate var(--dur-base) var(--ease-out)}
a.moment .moment__cta:after{content:"→"}
.moment:hover .moment__cta:after{translate:0 2px}
a.moment:hover .moment__cta:after{translate:2px 0}
.moment[aria-expanded=true]{box-shadow:0 0 0 3px var(--rose-400),var(--shadow-lift)}
.moment[aria-expanded=true] .moment__cta{color:#fff}
.moment[aria-expanded=true] .moment__cta:after{content:"↑"}
.moments__hint{color:var(--color-ink-soft);font-size:.95rem}
.carta-panel{margin-top:clamp(1.6rem,4vw,2.6rem);scroll-margin-top:90px}
.carta-panel__inner{animation:carta-in var(--dur-slow) var(--ease-out)}
@keyframes carta-in{from{opacity:0;translate:0 14px}to{opacity:1;translate:0 0}}
.carta-panel .cat-panel__title-row{align-items:center}
.carta-panel__close{margin-left:auto;display:grid;place-items:center;inline-size:40px;block-size:40px;border-radius:50%;background:color-mix(in oklab,var(--white) 55%,transparent);border:1px solid var(--color-line);color:var(--color-ink-muted);font-size:.95rem}
.carta-panel__close:hover{background:var(--rose-100);color:var(--rose-700)}
.carta-panel .item-group__title .tag-new{vertical-align:middle;margin-left:.4rem}

/* Botón "Reservar mesa" de la nav: el mismo cristal claro que el del hero (.btn-ghost-light de arriba),
   con texto granate porque va sobre la barra rosa en vez de sobre la foto. */
.nav .btn-dark{
  background:color-mix(in oklab, var(--white) 38%, transparent);
  color:var(--rose-800);
  border:1px solid color-mix(in oklab, var(--white) 70%, transparent);
  text-shadow:none;
  box-shadow:0 10px 28px -14px color-mix(in oklab, var(--rose-800) 55%, transparent),
             inset 0 1px 0 color-mix(in oklab, var(--white) 60%, transparent);
  -webkit-backdrop-filter:blur(12px) saturate(1.5);
  backdrop-filter:blur(12px) saturate(1.5);
}
.nav .btn-dark:hover{
  background:color-mix(in oklab, var(--white) 55%, transparent);
  border-color:var(--white);
  translate:0 -1px;
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .nav .btn-dark{background:color-mix(in oklab, var(--white) 60%, var(--color-surface))}
}

/* "Déjanos tu reseña" en granate, como las secciones oscuras (brunch, trayectoria) */
.review-card{
  background:radial-gradient(120% 160% at 100% -20%, color-mix(in oklab, var(--rose-700) 55%, transparent) 0%, transparent 60%), var(--ink-900);
  border-color:color-mix(in oklab, var(--cream-50) 12%, transparent);
  box-shadow:0 24px 55px -28px color-mix(in oklab, var(--ink-900) 70%, transparent);
}
.review-card .section-title{color:#fff}
.review-card .section-title em{color:var(--rose-300)!important}
.review-card__copy{color:var(--color-on-dark-muted)}
.review-card__quote{color:color-mix(in oklab, var(--rose-400) 22%, transparent)}
.review-card .review-strip__stars span{color:color-mix(in oklab, var(--cream-50) 25%, transparent)}
