/* =====================================================================
   TRATTORIA GRAPPOLO · trattoriagrappolo.co · 2026
   Sistema de diseño — verde oliva profundo, crema, oro champagne, vino
   ===================================================================== */
:root{
  --ink:#22261a;            /* fondo oscuro principal */
  --ink-2:#2b3020;
  --olive:#5a6132;
  --olive-deep:#3f4529;
  --cream:#f2e7d0;
  --cream-soft:#eadfc6;
  --paper:#f6eedb;
  --gold:#c9a24b;
  --gold-soft:#d9bc7a;
  --wine:#6d1f2c;
  --white:#fffdf7;
  --shadow:0 24px 60px -24px rgba(15,17,9,.55);
  --r-arch:46% 46% 0 0 / 24% 24% 0 0;   /* arco marca */
  --r:18px;
  --f-display:"Fraunces",Georgia,serif;
  --f-body:"Figtree",system-ui,Segoe UI,sans-serif;
  --ease:cubic-bezier(.22,.8,.24,1);
  --header-h:76px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
html:focus-within{scroll-behavior:smooth}
body{
  font-family:var(--f-body);
  background:var(--ink);
  color:var(--cream);
  line-height:1.65;
  font-weight:340;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img,video{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
ul{list-style:none}
button{font:inherit;border:0;background:none;cursor:pointer;color:inherit}
/* evita el zoom de doble-tap de iOS al pulsar rápido botones/enlaces
   (p. ej. las flechas del libro del menú) */
a,button{touch-action:manipulation}
/* <picture> (AVIF+JPG) no debe afectar el layout: el img se comporta como
   si colgara directo del contenedor */
picture{display:contents}
::selection{background:var(--gold);color:var(--ink)}

.container{width:min(1180px,92%);margin-inline:auto}
.section{padding:clamp(72px,9vw,130px) 0;position:relative}
.section--paper{background:var(--paper);color:var(--olive-deep)}
.section--cream{background:var(--cream);color:var(--olive-deep)}
.section--ink{background:var(--ink);color:var(--cream)}
.section--ink2{background:var(--ink-2);color:var(--cream)}

.kicker{
  display:inline-flex;align-items:center;gap:12px;
  font-size:.78rem;letter-spacing:.34em;text-transform:uppercase;
  color:var(--gold);font-weight:500;margin-bottom:18px;
}
.kicker::before{content:"";width:34px;height:1px;background:var(--gold)}
.h-xl{
  font-family:var(--f-display);font-weight:560;
  font-size:clamp(2rem,4.6vw,3.4rem);
  line-height:1.08;letter-spacing:.01em;
}
.lead{font-size:clamp(1rem,1.4vw,1.15rem);opacity:.86;max-width:56ch;font-weight:330}

/* ---------- Botones ---------- */
.btn{
  display:inline-flex;align-items:center;gap:10px;
  padding:15px 30px;border-radius:999px;
  background:var(--gold);color:#241d0c;font-weight:600;font-size:.95rem;
  letter-spacing:.02em;transition:transform .45s var(--ease),box-shadow .45s var(--ease),background .3s;
  box-shadow:0 12px 30px -14px rgba(201,162,75,.55);
  position:relative;overflow:hidden;
}
.btn::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.35) 50%,transparent 70%);
  transform:translateX(-120%);transition:transform .7s var(--ease);
}
.btn:hover{transform:translateY(-3px);box-shadow:0 20px 40px -16px rgba(201,162,75,.7)}
.btn:hover::after{transform:translateX(120%)}
.btn svg{width:18px;height:18px;flex:none}
.btn--ghost{
  background:transparent;color:var(--cream);
  border:1px solid rgba(242,231,208,.45);box-shadow:none;
}
.btn--ghost:hover{border-color:var(--gold);color:var(--gold-soft);box-shadow:none}
.btn--dark{background:var(--olive-deep);color:var(--cream);box-shadow:0 14px 30px -16px rgba(30,34,18,.6)}
.btn--wine{background:var(--wine);color:var(--cream)}
.btn--sm{padding:10px 20px;font-size:.86rem}

/* ---------- Preloader ---------- */
.preloader{
  position:fixed;inset:0;z-index:200;background:var(--ink);
  display:flex;align-items:center;justify-content:center;flex-direction:column;gap:22px;
  transition:opacity .6s var(--ease),visibility .6s;
}
.preloader img{width:min(300px,60vw);opacity:0;animation:pre-in 1s var(--ease) .1s forwards}
.preloader .bar{width:120px;height:1px;background:rgba(242,231,208,.18);overflow:hidden;border-radius:2px}
.preloader .bar i{display:block;height:100%;width:40%;background:var(--gold);animation:pre-bar 1s var(--ease) infinite}
.preloader.done{opacity:0;visibility:hidden}
@keyframes pre-in{from{opacity:0;transform:translateY(14px) scale(.96)}to{opacity:1;transform:none}}
@keyframes pre-bar{0%{transform:translateX(-120%)}100%{transform:translateX(320%)}}

/* ---------- Header ---------- */
.header{
  position:fixed;top:0;left:0;right:0;z-index:100;
  transition:background .5s var(--ease),box-shadow .5s,backdrop-filter .5s;
}
.header__inner{
  width:min(1320px,94%);margin-inline:auto;height:var(--header-h);
  display:flex;align-items:center;justify-content:space-between;gap:20px;
}
/* el blur va en ::before: backdrop-filter en .header crearía un "containing
   block" y el menú móvil (position:fixed) quedaría atrapado en la barra */
.header::before{
  content:"";position:absolute;inset:0;z-index:-1;
  background:rgba(28,31,19,.86);backdrop-filter:blur(14px);
  opacity:0;transition:opacity .5s var(--ease);
}
.header.scrolled::before{opacity:1}
.header.scrolled{box-shadow:0 10px 40px -20px rgba(0,0,0,.6)}
.brand img{height:48px;width:auto;transition:transform .4s var(--ease)}
.brand:hover img{transform:scale(1.04)}
.nav{display:flex;align-items:center;gap:28px}
.nav__links{display:flex;gap:26px}
.nav__links a{
  font-size:.92rem;font-weight:420;letter-spacing:.04em;position:relative;opacity:.92;
  padding:6px 0;
}
.nav__links a::after{
  content:"";position:absolute;left:0;bottom:0;height:1px;width:100%;
  background:var(--gold);transform:scaleX(0);transform-origin:right;
  transition:transform .45s var(--ease);
}
.nav__links a:hover::after,.nav__links a.active::after{transform:scaleX(1);transform-origin:left}
.lang{
  display:flex;border:1px solid rgba(242,231,208,.3);border-radius:999px;overflow:hidden;
}
.lang button{
  padding:7px 13px;font-size:.8rem;font-weight:600;letter-spacing:.06em;opacity:.6;
  transition:.3s;
}
.lang button.active{background:var(--gold);color:#241d0c;opacity:1}
.nav .btn{padding:11px 22px;font-size:.88rem}
.burger{display:none;width:44px;height:44px;position:relative;z-index:110}
.burger span{
  position:absolute;left:10px;right:10px;height:2px;background:var(--cream);
  transition:.4s var(--ease);
}
.burger span:nth-child(1){top:15px}
.burger span:nth-child(2){top:22px}
.burger span:nth-child(3){top:29px}
.burger.open span:nth-child(1){top:22px;transform:rotate(45deg)}
.burger.open span:nth-child(2){opacity:0}
.burger.open span:nth-child(3){top:22px;transform:rotate(-45deg)}

/* ---------- Hero ---------- */
.hero{min-height:100svh;position:relative;display:flex;align-items:center;overflow:hidden}
.hero__media{position:absolute;inset:0}
.hero__media video,.hero__media img{
  width:100%;height:100%;object-fit:cover;
  animation:hero-zoom 26s var(--ease) infinite alternate;
}
@keyframes hero-zoom{from{transform:scale(1)}to{transform:scale(1.09)}}
.hero::before{
  content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg,rgba(22,24,14,.55) 0%,rgba(22,24,14,.25) 40%,rgba(22,24,14,.82) 100%);
}
.hero::after{ /* grano sutil */
  content:"";position:absolute;inset:0;z-index:1;opacity:.5;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .05 0'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)'/%3E%3C/svg%3E");
}
.hero__inner{
  position:relative;z-index:2;width:min(1180px,92%);margin-inline:auto;
  padding-top:calc(var(--header-h) + 30px);text-align:center;
}
.hero__logo{width:clamp(128px,16vw,180px);aspect-ratio:1/1;height:auto;object-fit:contain;margin:0 auto 26px;filter:drop-shadow(0 14px 34px rgba(0,0,0,.5))}
/* Sello Grappolo: texto circular giratorio + G manuscrita — transparente,
   deja ver el video del hero (reemplaza al emblema, redundante con el header) */
.hero__seal{
  position:relative;width:clamp(136px,15vw,180px);aspect-ratio:1/1;margin:0 auto 26px;
  filter:drop-shadow(0 10px 28px rgba(0,0,0,.55));
}
.hero__seal .ring{position:absolute;inset:0;width:100%;height:100%;animation:seal-spin 46s linear infinite}
.hero__seal .ring text{
  font-family:var(--f-body);font-size:12px;font-weight:600;letter-spacing:.22em;
  fill:var(--gold-soft);text-transform:uppercase;
}
.hero__seal>img{
  position:absolute;left:50%;top:50%;width:40%;height:auto;transform:translate(-50%,-50%);
}
@keyframes seal-spin{to{transform:rotate(360deg)}}
.hero__kicker{
  font-size:.8rem;letter-spacing:.4em;text-transform:uppercase;color:var(--gold-soft);
  margin-bottom:22px;font-weight:480;
}
.hero h1{
  font-family:var(--f-display);font-weight:520;line-height:1.05;
  font-size:clamp(2.3rem,6vw,4.6rem);letter-spacing:.005em;
  text-wrap:balance;
}
.hero h1 .l2{
  display:block;font-style:italic;font-weight:420;color:var(--gold-soft);
  font-size:.72em;margin-top:10px;
}
.hero__sub{max-width:52ch;margin:22px auto 0;font-size:clamp(.98rem,1.3vw,1.12rem);opacity:.9}
.hero__cta{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;margin-top:34px;margin-bottom:20px}
.hero__badge{
  display:inline-flex;align-items:center;gap:8px;margin-top:26px;
  font-size:.8rem;letter-spacing:.08em;padding:8px 16px;border-radius:999px;
  border:1px solid rgba(242,231,208,.25);background:rgba(22,24,14,.35);backdrop-filter:blur(6px);
}
.hero__badge i{width:8px;height:8px;border-radius:50%;background:#7ec26a;box-shadow:0 0 12px #7ec26a}
.hero__badge.closed i{background:#d08484;box-shadow:0 0 12px #d08484}
.hero__scroll{
  position:absolute;bottom:14px;left:50%;transform:translateX(-50%);z-index:2;
  display:flex;flex-direction:column;align-items:center;gap:6px;
  font-size:.68rem;letter-spacing:.3em;text-transform:uppercase;opacity:.65;pointer-events:none;
}
@media (max-height:860px),(max-width:820px){.hero__scroll{display:none}}
/* cuando "Desliza" está visible, se reserva la franja inferior para que
   los botones del hero jamás se le monten encima */
@media (min-height:861px) and (min-width:821px){.hero{padding-bottom:96px}}
.mouse{width:22px;height:36px;border:1px solid rgba(242,231,208,.6);border-radius:12px;position:relative}
.mouse::after{
  content:"";position:absolute;top:7px;left:50%;width:3px;height:7px;margin-left:-1.5px;
  border-radius:3px;background:var(--gold);animation:wheel 1.8s var(--ease) infinite;
}
@keyframes wheel{0%{opacity:1;transform:translateY(0)}70%{opacity:0;transform:translateY(12px)}100%{opacity:0}}

/* ---------- Marquee ---------- */
.marquee{
  background:var(--gold);color:#241d0c;overflow:hidden;padding:13px 0;
  position:relative;z-index:3;
}
.marquee__track{display:flex;gap:0;width:max-content;animation:mq 34s linear infinite}
.marquee span{
  font-family:var(--f-display);font-style:italic;font-weight:500;
  font-size:1.02rem;white-space:nowrap;display:inline-flex;align-items:center;
}
.marquee span::after{
  content:"";width:22px;height:22px;margin:0 26px;flex:none;
  background:url("../logos/g-dark-sm.png") center/contain no-repeat;opacity:.8;
}
@keyframes mq{to{transform:translateX(-50%)}}

/* ---------- Historia ---------- */
.story{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(40px,6vw,90px);align-items:center}
.story__copy p{margin-bottom:16px;opacity:.9;max-width:58ch}
.story__copy p.first::first-letter{
  font-family:var(--f-display);font-size:3.2em;float:left;line-height:.82;
  padding-right:10px;color:var(--gold);font-weight:560;
}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:38px}
.stat{
  border:1px solid rgba(242,231,208,.14);border-radius:14px;padding:18px 10px;text-align:center;
  background:rgba(242,231,208,.03);
}
.stat b{
  display:block;font-family:var(--f-display);font-weight:560;color:var(--gold-soft);
  font-size:clamp(1.4rem,2.4vw,1.9rem);
}
.stat span{font-size:.76rem;letter-spacing:.06em;opacity:.72}
.story__collage{position:relative;height:clamp(420px,44vw,600px)}
.story__collage img{
  position:absolute;object-fit:cover;box-shadow:var(--shadow);
}
.story__collage .c1{
  width:62%;height:74%;left:0;top:4%;border-radius:var(--r-arch);
  border:6px solid rgba(242,231,208,.08);
}
.story__collage .c2{
  width:47%;height:52%;right:0;bottom:0;border-radius:16px;
  border:6px solid var(--ink);z-index:2;
}
.story__collage .g-mark{
  position:absolute;right:6%;top:0;width:120px;opacity:.9;z-index:3;
  filter:drop-shadow(0 8px 24px rgba(0,0,0,.4));
  animation:float-g 7s ease-in-out infinite;
}
@keyframes float-g{0%,100%{transform:translateY(0) rotate(-4deg)}50%{transform:translateY(-12px) rotate(2deg)}}

/* ---------- Especialidades ---------- */
.spec__head{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:52px;flex-wrap:wrap}
.spec__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.spec-card{
  position:relative;border-radius:var(--r-arch);overflow:hidden;
  aspect-ratio:3/4.1;box-shadow:0 18px 44px -20px rgba(46,50,28,.45);
  transform:translateZ(0);
}
.spec-card img{width:100%;height:100%;object-fit:cover;transition:transform 1.1s var(--ease)}
.spec-card:hover img{transform:scale(1.08)}
.spec-card::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 42%,rgba(24,26,15,.88) 100%);
}
.spec-card__num{
  position:absolute;top:16px;right:18px;z-index:2;
  font-family:var(--f-display);font-style:italic;color:var(--cream);
  opacity:.65;font-size:1.05rem;
}
.spec-card__body{position:absolute;left:0;right:0;bottom:0;padding:22px;z-index:2;color:var(--cream)}
.spec-card__body h3{font-family:var(--f-display);font-weight:540;font-size:1.22rem;margin-bottom:6px}
.spec-card__body p{
  font-size:.87rem;opacity:0;max-height:0;transition:.6s var(--ease);line-height:1.5;
}
.spec-card:hover .spec-card__body p{opacity:.92;max-height:120px}

/* ---------- Menú teaser (libro 3D) ---------- */
.booktease{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,6vw,90px);align-items:center}
.booktease__stage{perspective:1400px;display:flex;justify-content:center}
.bookmock{
  position:relative;width:min(320px,70vw);aspect-ratio:1486/1924;
  transform-style:preserve-3d;transform:rotateY(-13deg) rotateX(3deg);
  transition:transform 1s var(--ease);
  filter:drop-shadow(0 40px 50px rgba(10,12,5,.55));
}
.booktease__stage:hover .bookmock{transform:rotateY(-5deg) rotateX(2deg)}
.bookmock img{width:100%;height:100%;position:relative;z-index:2}
/* Canto de páginas ("lomo"): la MISMA silueta de la portada (arco incluido)
   usada como máscara y desplazada a la derecha → el bloque de páginas sigue
   exactamente la curva del arco y nunca sobresale recto */
.bookmock::after{
  content:"";position:absolute;top:36%;bottom:1%;right:-6px;width:7px;z-index:1;
  background:repeating-linear-gradient(90deg,#e8dcc2 0 1.6px,#cbbf9f 1.6px 2.6px);
  border-radius:0 3px 3px 0;transform:translateZ(-4px);
  box-shadow:1px 0 2px rgba(0,0,0,.18);
}
@supports ((-webkit-mask-image:url("")) or (mask-image:url(""))){
  .bookmock::before,.bookmock::after{
    content:"";position:absolute;inset:0;width:auto;top:0;bottom:0;right:0;z-index:1;
    border-radius:0;box-shadow:none;
    -webkit-mask:url("../menu/es/pg-01.webp") 50% 50%/100% 100% no-repeat;
    mask:url("../menu/es/pg-01.webp") 50% 50%/100% 100% no-repeat;
  }
  .bookmock::before{background:#c6ba9a;transform:translateZ(-6px) translateX(9px)}
  .bookmock::after{
    background:repeating-linear-gradient(90deg,#e8dcc2 0 1.8px,#d3c6a5 1.8px 3px);
    transform:translateZ(-3px) translateX(4.5px);
  }
}
.booktease__copy .btn{margin-top:26px}
.booktease__hint{
  display:inline-flex;align-items:center;gap:8px;margin-top:16px;margin-left:14px;
  font-size:.8rem;letter-spacing:.1em;opacity:.66;text-transform:uppercase;
}

/* ---------- Reels ---------- */
.reel__head{text-align:center;max-width:640px;margin:0 auto 52px}
.reel__row{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.reel-card{
  position:relative;border-radius:20px;overflow:hidden;aspect-ratio:9/15.2;
  background:#181a10;box-shadow:var(--shadow);
}
.reel-card video{width:100%;height:100%;object-fit:cover}
.reel-card::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 60%,rgba(16,18,9,.75) 100%);
  pointer-events:none;
}
.reel-card__label{
  position:absolute;left:16px;bottom:14px;z-index:2;font-size:.9rem;font-weight:480;
  letter-spacing:.05em;
}
.reel-card__sound{
  position:absolute;right:12px;bottom:12px;z-index:3;width:38px;height:38px;border-radius:50%;
  background:rgba(22,24,14,.55);backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;
  transition:.3s;
}
.reel-card__sound:hover{background:var(--gold);color:#241d0c}
.reel-card__sound svg{width:17px;height:17px}

/* ---------- Galería ---------- */
.gal__filters{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-bottom:38px}
.gal__filters button{
  padding:9px 20px;border-radius:999px;font-size:.86rem;letter-spacing:.05em;
  border:1px solid rgba(63,69,41,.35);color:var(--olive-deep);transition:.35s;
}
.section--ink .gal__filters button,.section--ink2 .gal__filters button{
  border-color:rgba(242,231,208,.3);color:var(--cream);
}
.gal__filters button.active{background:var(--olive-deep);color:var(--cream);border-color:var(--olive-deep)}
.gallery{columns:4 240px;column-gap:16px}
.gallery figure{
  break-inside:avoid;margin-bottom:16px;border-radius:14px;overflow:hidden;cursor:zoom-in;
  position:relative;transform:translateZ(0);
}
.gallery figure.hidden{display:none}
.gallery img{width:100%;transition:transform .9s var(--ease),filter .6s}
.gallery figure:hover img{transform:scale(1.06)}
.gallery .cap{
  position:absolute;left:0;right:0;bottom:0;padding:26px 14px 10px;font-size:.78rem;letter-spacing:.06em;
  background:linear-gradient(transparent,rgba(18,20,11,.85));color:var(--cream);
  opacity:0;transition:.4s;
}
.gallery figure:hover .cap{opacity:1}

/* ---------- Reseñas ---------- */
.reviews__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-bottom:42px}
.review{
  border:1px solid rgba(242,231,208,.13);border-radius:20px;padding:30px 26px;
  background:linear-gradient(160deg,rgba(242,231,208,.05),transparent 60%);
  position:relative;
}
.review .g{position:absolute;top:18px;right:22px;width:34px;opacity:.35}
.review .stars{color:var(--gold);letter-spacing:4px;margin-bottom:14px;font-size:.95rem}
.review p{font-size:.95rem;opacity:.9;font-style:italic}
.reviews__foot{display:flex;gap:14px;align-items:center;justify-content:center;flex-wrap:wrap}
.rating-pill{
  display:inline-flex;align-items:baseline;gap:8px;padding:10px 20px;border-radius:999px;
  border:1px solid rgba(242,231,208,.2);font-size:.85rem;
}
.rating-pill b{font-family:var(--f-display);font-size:1.15rem;color:var(--gold-soft)}

/* ---------- Sedes ---------- */
.loc__grid{display:grid;grid-template-columns:1fr 1fr;gap:26px}
.loc-card{
  position:relative;border-radius:26px;overflow:hidden;min-height:560px;
  display:flex;align-items:flex-end;box-shadow:var(--shadow);
}
.loc-card video,.loc-card>img.bg{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
}
.loc-card::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(20,22,12,.12) 0%,rgba(20,22,12,.38) 40%,rgba(15,17,9,.9) 78%,rgba(12,14,7,.97) 100%);
}
.loc-card__body{position:relative;z-index:2;padding:26px 26px 28px;width:100%}
/* letras crema puras sobre el video: solo halo oscuro para legibilidad */
.loc-card__body h3{
  color:var(--cream);
  text-shadow:0 2px 10px rgba(0,0,0,.85),0 1px 2px rgba(0,0,0,.9);
}
.loc-card__body .loc-row,.loc-card__body .loc-row a{
  color:var(--cream);
  text-shadow:0 1px 6px rgba(0,0,0,.85),0 1px 2px rgba(0,0,0,.9);
}
.loc-card__body .loc-row svg{filter:drop-shadow(0 1px 3px rgba(0,0,0,.9))}
.loc-card__tag{
  position:absolute;top:22px;left:22px;z-index:2;
  padding:8px 18px;border-radius:999px;font-size:.78rem;letter-spacing:.22em;text-transform:uppercase;
  background:rgba(22,24,14,.5);backdrop-filter:blur(8px);border:1px solid rgba(242,231,208,.25);
}
.loc-card__state{
  display:inline-flex;align-items:center;gap:6px;vertical-align:middle;margin-left:10px;
  font-size:.66rem;letter-spacing:.08em;text-transform:uppercase;padding:5px 11px;border-radius:999px;
  background:rgba(22,24,14,.62);border:1px solid rgba(242,231,208,.28);
  text-shadow:none;transform:translateY(-3px);font-family:var(--f-body);font-weight:500;
}
.loc-card__state{color:var(--cream)}
.loc-card__state i{width:7px;height:7px;border-radius:50%;background:#7ec26a;box-shadow:0 0 8px #7ec26a}
.loc-card__state.closed i{background:#e06060;box-shadow:0 0 8px #e06060}
.loc-card h3{font-family:var(--f-display);font-weight:540;font-size:1.7rem;margin-bottom:14px}
.loc-row{display:flex;gap:12px;margin-bottom:10px;font-size:.92rem;align-items:flex-start}
.loc-row svg{width:17px;height:17px;flex:none;margin-top:4px;color:var(--gold-soft)}
.loc-row b{display:block;font-weight:560;font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;opacity:.75}
.loc-row .prewrap{white-space:pre-line}
.loc-card__actions{display:flex;gap:12px;margin-top:20px;flex-wrap:wrap}

/* ---------- FAQ ---------- */
.faq{max-width:820px;margin-inline:auto}
.faq details{
  border-bottom:1px solid rgba(63,69,41,.22);padding:6px 0;
}
.faq summary{
  cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:20px;
  font-family:var(--f-display);font-weight:540;font-size:1.12rem;padding:16px 4px;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:"+";font-family:var(--f-body);font-size:1.5rem;font-weight:300;color:var(--gold);
  transition:transform .4s var(--ease);flex:none;
}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq .a{padding:0 4px 20px;opacity:.85;max-width:64ch}

/* ---------- CTA final ---------- */
.cta-final{
  position:relative;padding:clamp(90px,12vw,150px) 0;text-align:center;overflow:hidden;
}
.cta-final .bg{position:absolute;inset:0;background:center/cover no-repeat;filter:brightness(.36)}
.cta-final .g-mark{width:74px;margin:0 auto 24px;opacity:.95;position:relative}
.cta-final h2{position:relative;font-family:var(--f-display);font-weight:520;font-size:clamp(2rem,4.6vw,3.4rem)}
.cta-final p{position:relative;margin:16px auto 34px;opacity:.88}

/* ---------- Footer ---------- */
.footer{background:#1b1e11;padding:70px 0 30px;color:var(--cream)}
.footer__top{
  display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:38px;margin-bottom:48px;
}
.footer__brand img.round{height:110px;width:auto;margin-bottom:16px}
.footer__brand p{font-size:.9rem;opacity:.75;max-width:30ch}
.footer h4{
  font-size:.8rem;letter-spacing:.24em;text-transform:uppercase;color:var(--gold-soft);
  margin-bottom:18px;font-weight:560;
}
.footer__col a,.footer__col span{display:block;font-size:.92rem;opacity:.8;margin-bottom:10px;transition:.3s}
.footer__col a:hover{opacity:1;color:var(--gold-soft);transform:translateX(3px)}
.footer__bottom{
  border-top:1px solid rgba(242,231,208,.12);padding-top:24px;
  display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;
  font-size:.8rem;opacity:.62;align-items:center;
}
.footer__bottom .g{height:26px;width:auto;opacity:.8}

/* ---------- Flotantes ---------- */
.floats{position:fixed;right:22px;bottom:22px;z-index:90;display:flex;flex-direction:column;gap:12px}
.fab{
  width:54px;height:54px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  box-shadow:0 14px 34px -12px rgba(0,0,0,.55);transition:transform .35s var(--ease);
}
.fab:hover{transform:translateY(-4px) scale(1.05)}
.fab svg{width:24px;height:24px}
.fab--wa{background:#25d366;color:#fff}
.fab--top{background:var(--cream);color:var(--ink);opacity:0;visibility:hidden;transition:.4s}
.fab--top.show{opacity:1;visibility:visible}

/* ---------- Lightbox ---------- */
.lightbox{
  position:fixed;inset:0;z-index:150;background:rgba(14,15,8,.94);
  display:flex;align-items:center;justify-content:center;
  opacity:0;visibility:hidden;transition:.4s;
}
.lightbox.open{opacity:1;visibility:visible}
.lightbox img{max-width:92vw;max-height:88vh;border-radius:10px;box-shadow:var(--shadow)}
.lightbox button{
  position:absolute;color:var(--cream);font-size:1.6rem;width:52px;height:52px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;background:rgba(242,231,208,.08);
  transition:.3s;
}
.lightbox button:hover{background:var(--gold);color:#241d0c}
.lb-close{top:20px;right:20px}
.lb-prev{left:16px;top:50%;transform:translateY(-50%)}
.lb-next{right:16px;top:50%;transform:translateY(-50%)}

/* ---------- Animaciones reveal ---------- */
.reveal{opacity:0;transform:translateY(34px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.reveal[data-rev="left"]{transform:translateX(-40px)}
.reveal[data-rev="right"]{transform:translateX(40px)}
.reveal[data-rev="zoom"]{transform:scale(.92)}
.reveal.in{opacity:1;transform:none}
.d1{transition-delay:.08s}.d2{transition-delay:.16s}.d3{transition-delay:.24s}.d4{transition-delay:.32s}

/* =====================================================================
   PÁGINA DE LA CARTA (flipbook)
   ===================================================================== */
.carta-hero{
  padding:calc(var(--header-h) + 54px) 0 30px;text-align:center;position:relative;
}
.carta-hero .g-bg{
  position:absolute;right:-60px;top:30px;width:340px;opacity:.14;pointer-events:none;
}
.carta-toolbar{
  display:flex;justify-content:center;align-items:center;gap:12px;flex-wrap:wrap;
  padding:8px 0 26px;position:relative;z-index:5;
}
.carta-toolbar .btn{padding:10px 20px;font-size:.85rem}
.tool-pill{
  display:inline-flex;align-items:center;gap:8px;padding:10px 20px;border-radius:999px;
  border:1px solid rgba(242,231,208,.28);font-size:.85rem;letter-spacing:.04em;transition:.3s;
}
.tool-pill:hover{border-color:var(--gold);color:var(--gold-soft)}
.tool-pill.active{background:var(--gold);border-color:var(--gold);color:#241d0c}

.book-wrap{
  position:relative;margin:6px auto 20px;user-select:none;-webkit-user-select:none;
  width:min(1120px,96vw);
}
.book{
  position:relative;margin-inline:auto;perspective:2600px;touch-action:pan-y;
}
/* CAPA BASE (modo libro abierto): el pliego visible se dibuja PLANO aqui,
   siempre nitido; las hojas 3D solo se muestran mientras vuelan */
.spread-base{position:absolute;inset:0;z-index:5}
.spread-base img{
  position:absolute;top:0;height:100%;width:50%;object-fit:contain;
  filter:drop-shadow(0 18px 30px rgba(10,12,5,.42));
  -webkit-user-drag:none;user-select:none;
}
.spread-base .sb-l{left:0}
.spread-base .sb-r{left:50%}
.book:not(.dbl) .spread-base{display:none}
.book.dbl .sheet:not(.animating){visibility:hidden}
.book .sheet{
  position:absolute;top:0;width:50%;height:100%;left:50%;
  transform-style:preserve-3d;transform-origin:left center;
  transition:transform .62s var(--ease);
}
.book .sheet .face{
  position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;
  display:flex;align-items:center;justify-content:center;
}
.book .sheet .face.back{transform:rotateY(180deg)}
.book .sheet img{
  width:100%;height:100%;object-fit:contain;
  filter:drop-shadow(0 18px 30px rgba(10,12,5,.42));
  -webkit-user-drag:none;user-select:none;
}
/* la hoja EN VUELO va sin filter: drop-shadow re-rasteriza en cada frame de
   la animación 3D y es lo que hacía trabar el pase en iPhone/Safari */
.book .sheet.animating img{filter:none}
/* paginas aun no cargadas (carga progresiva): sin src el navegador pintaria
   el texto alternativo, que se asomaba por el arco transparente */
.book .sheet img:not([src]){visibility:hidden}
@media (max-width:780px){
  .book .sheet img{filter:drop-shadow(0 10px 14px rgba(10,12,5,.38))}
}
.book .sheet.flipped{transform:rotateY(-180deg)}
.book .sheet .shade{
  position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .5s;
  background:linear-gradient(90deg,rgba(0,0,0,.28),transparent 30%);
}
.book.flipping .sheet.animating .shade{opacity:1}
.book__nav{
  position:absolute;top:50%;transform:translateY(-50%);z-index:20;
  width:52px;height:52px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background:rgba(242,231,208,.1);backdrop-filter:blur(8px);color:var(--cream);
  transition:.3s;border:1px solid rgba(242,231,208,.18);
}
.book__nav:hover{background:var(--gold);color:#241d0c;border-color:var(--gold)}
.book__nav.prev{left:-8px}
.book__nav.next{right:-8px}
.book__nav svg{width:20px;height:20px}
.book__nav[disabled]{opacity:.25;pointer-events:none}
.book__meta{
  text-align:center;font-size:.84rem;letter-spacing:.1em;opacity:.7;margin-top:10px;
}
.book__thumbs{
  display:flex;gap:10px;justify-content:flex-start;overflow-x:auto;padding:18px 4px 8px;
  scrollbar-width:thin;max-width:min(1120px,96vw);margin-inline:auto;
}
.book__thumbs img{
  height:74px;border-radius:6px;cursor:pointer;opacity:.55;transition:.3s;flex:none;
}
.book__thumbs img:hover{opacity:.9;transform:translateY(-3px)}
.book__thumbs img.active{opacity:1;outline:2px solid var(--gold);outline-offset:2px}

/* Zoom de página */
.pgzoom{
  position:fixed;inset:0;z-index:160;background:rgba(14,15,8,.96);
  opacity:0;visibility:hidden;transition:.35s;overflow:hidden;cursor:grab;
  display:flex;align-items:center;justify-content:center;
}
.pgzoom.open{opacity:1;visibility:visible}
.pgzoom img{
  height:160vh;max-width:none;will-change:transform;pointer-events:none;
}
.pgzoom__hint{
  position:absolute;bottom:22px;left:50%;transform:translateX(-50%);
  font-size:.8rem;letter-spacing:.14em;opacity:.7;
}
.pgzoom__close{
  position:absolute;top:18px;right:18px;width:50px;height:50px;border-radius:50%;
  background:rgba(242,231,208,.1);color:var(--cream);font-size:1.4rem;z-index:2;
}

/* Lista SEO de la carta */
.menu-list{max-width:860px;margin:30px auto 0}
.menu-list h2{
  font-family:var(--f-display);font-weight:560;font-size:1.6rem;color:var(--gold-soft);
  margin:44px 0 6px;display:flex;align-items:center;gap:14px;
}
.menu-list h2::after{content:"";flex:1;height:1px;background:rgba(242,231,208,.16)}
.menu-list .note{font-size:.85rem;opacity:.65;margin-bottom:16px;font-style:italic}
.mrow{
  display:flex;align-items:baseline;gap:10px;padding:9px 0;
  border-bottom:1px dashed rgba(242,231,208,.1);
}
.mrow .nm{font-weight:520}
.mrow .tags{font-size:.72rem;opacity:.6;letter-spacing:.04em}
.mrow .dots{flex:1;border-bottom:1px dotted rgba(242,231,208,.35);transform:translateY(-4px)}
.mrow .pr{font-weight:560;color:var(--gold-soft);white-space:nowrap}
.mrow .ds{display:block;font-size:.86rem;opacity:.72;margin-top:2px;max-width:56ch}
.mcol{flex-direction:column;align-items:stretch}
.mcol .top{display:flex;align-items:baseline;gap:10px}

/* =====================================================================
   EDITOR DE PÁGINAS
   ===================================================================== */
.editor{max-width:1060px;margin-inline:auto;padding:calc(var(--header-h) + 40px) 0 90px}
.editor h1{font-family:var(--f-display);font-size:2rem;margin-bottom:8px}
.editor .help{
  background:rgba(201,162,75,.08);border:1px solid rgba(201,162,75,.3);border-radius:14px;
  padding:18px 22px;font-size:.92rem;margin:20px 0 30px;line-height:1.7;
}
.editor .help b{color:var(--gold-soft)}
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:16px}
.pcard{
  border:1px solid rgba(242,231,208,.16);border-radius:14px;padding:12px;text-align:center;
  background:rgba(242,231,208,.03);cursor:grab;transition:.25s;position:relative;
}
.pcard.dragging{opacity:.4}
.pcard.over{outline:2px dashed var(--gold);outline-offset:3px}
.pcard img{width:100%;border-radius:8px;pointer-events:none;margin-bottom:10px}
.pcard .nm{font-size:.78rem;opacity:.85;min-height:34px}
.pcard .num{
  position:absolute;top:8px;left:10px;font-family:var(--f-display);font-size:.9rem;
  color:var(--gold-soft);background:rgba(22,24,14,.72);border-radius:8px;padding:2px 9px;
}
.pcard.off img{filter:grayscale(1) brightness(.5)}
.pcard.off .nm{opacity:.4}
.pcard .vis{
  margin-top:8px;font-size:.74rem;padding:5px 12px;border-radius:999px;
  border:1px solid rgba(242,231,208,.3);transition:.3s;
}
.pcard .vis.on{background:var(--olive);border-color:var(--olive);color:var(--cream)}
.editor__actions{display:flex;gap:14px;margin-top:34px;flex-wrap:wrap}

/* =====================================================================
   BLOG
   ===================================================================== */
.blog-hero{padding:calc(var(--header-h) + 60px) 0 40px;text-align:center}
.blog-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:26px;margin-top:20px;
}
.post-card{
  border-radius:20px;overflow:hidden;background:rgba(242,231,208,.04);
  border:1px solid rgba(242,231,208,.1);transition:.5s var(--ease);display:flex;flex-direction:column;
}
.post-card:hover{transform:translateY(-6px);border-color:rgba(201,162,75,.5)}
.post-card .im{aspect-ratio:16/10;overflow:hidden}
.post-card .im img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease)}
.post-card:hover .im img{transform:scale(1.06)}
.post-card .bd{padding:24px;display:flex;flex-direction:column;gap:10px;flex:1}
.post-card .meta{font-size:.76rem;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-soft);opacity:.9}
.post-card h3{font-family:var(--f-display);font-weight:540;font-size:1.3rem;line-height:1.25}
.post-card p{font-size:.92rem;opacity:.78;flex:1}
.post-card .rd{font-size:.85rem;color:var(--gold-soft);display:inline-flex;gap:8px;align-items:center}

.article{max-width:760px;margin-inline:auto;padding:calc(var(--header-h) + 50px) 0 80px}
.article .meta{font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-soft);margin-bottom:14px}
.article h1{font-family:var(--f-display);font-weight:560;font-size:clamp(1.9rem,4vw,2.8rem);line-height:1.12;margin-bottom:20px}
.article .intro{font-size:1.12rem;opacity:.9;margin-bottom:28px;font-weight:330}
.article figure{margin:30px 0;border-radius:18px;overflow:hidden}
.article figure img{width:100%}
.article figcaption{font-size:.8rem;opacity:.6;padding:10px 4px;font-style:italic}
.article h2{font-family:var(--f-display);font-weight:550;font-size:1.5rem;margin:38px 0 14px;color:var(--gold-soft)}
.article p{margin-bottom:16px;opacity:.88}
.article .cta-inline{
  margin:34px 0;padding:26px;border-radius:18px;border:1px solid rgba(201,162,75,.35);
  background:rgba(201,162,75,.06);text-align:center;
}
.article .cta-inline p{margin-bottom:16px}

/* =====================================================================
   RESPONSIVE
   ===================================================================== */
@media (max-width:1080px){
  .spec__grid{grid-template-columns:repeat(2,1fr)}
  .reel__row{grid-template-columns:repeat(2,1fr)}
  .footer__top{grid-template-columns:1fr 1fr}
}
@media (max-width:920px){
  .nav{
    position:fixed;inset:0;background:rgba(24,27,15,.98);backdrop-filter:blur(16px);
    flex-direction:column;justify-content:center;gap:34px;
    opacity:0;visibility:hidden;transition:.45s var(--ease);z-index:105;
  }
  .nav.open{opacity:1;visibility:visible}
  .nav__links{flex-direction:column;text-align:center;gap:22px}
  .nav__links a{font-size:1.3rem;font-family:var(--f-display)}
  .burger{display:block}
  .story{grid-template-columns:1fr}
  .story__collage{order:-1;height:min(72vw,430px)}
  .booktease{grid-template-columns:1fr;text-align:center}
  .booktease__copy .kicker{justify-content:center}
  .loc__grid{grid-template-columns:1fr}
  .reviews__grid{grid-template-columns:1fr}
  .stats{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:640px){
  .spec__grid{grid-template-columns:1fr 1fr;gap:12px}
  .spec-card__body{padding:14px}
  .spec-card__body h3{font-size:1rem}
  .reel__row{grid-template-columns:repeat(2,1fr);gap:12px}
  .hero__cta .btn{width:100%;justify-content:center}
  .gallery{columns:2 150px}
  .book__nav.prev{left:2px}
  .book__nav.next{right:2px}
  .book__nav{width:42px;height:42px}
  .floats{right:14px;bottom:14px}
}

/* Reduced motion */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001s !important;transition-duration:.001s !important;scroll-behavior:auto !important}
  .hero__media video{animation:none}
  .reveal{opacity:1;transform:none}
}

/* =====================================================================
   SELECTOR DE WHATSAPP (elegir sede)
   ===================================================================== */
.wa-modal{
  position:fixed;inset:0;z-index:170;display:flex;align-items:center;justify-content:center;
  padding:20px;background:rgba(14,15,8,.72);backdrop-filter:blur(6px);
  opacity:0;visibility:hidden;transition:.32s var(--ease);
}
.wa-modal.open{opacity:1;visibility:visible}
.wa-card{
  width:min(440px,94vw);background:linear-gradient(160deg,#2b3020,#202416);
  border:1px solid rgba(201,162,75,.28);border-radius:22px;padding:26px 24px 22px;
  box-shadow:var(--shadow);transform:translateY(16px) scale(.98);transition:.4s var(--ease);
}
.wa-modal.open .wa-card{transform:none}
.wa-card h3{font-family:var(--f-display);font-weight:540;font-size:1.4rem;text-align:center;margin-bottom:4px}
.wa-card p.sub{text-align:center;font-size:.86rem;opacity:.7;margin-bottom:20px}
.wa-opt{
  display:flex;align-items:center;gap:14px;width:100%;text-align:left;
  padding:15px 18px;border-radius:14px;border:1px solid rgba(242,231,208,.14);
  background:rgba(242,231,208,.04);margin-bottom:12px;transition:.3s var(--ease);
}
.wa-opt:hover{border-color:#25d366;background:rgba(37,211,102,.1);transform:translateY(-2px)}
.wa-opt .ic{
  width:44px;height:44px;border-radius:50%;background:#25d366;color:#fff;flex:none;
  display:flex;align-items:center;justify-content:center;
}
.wa-opt .ic svg{width:24px;height:24px}
.wa-opt b{display:block;font-size:1rem;font-weight:560}
.wa-opt span{font-size:.8rem;opacity:.68}
.wa-close-btn{display:block;margin:6px auto 0;font-size:.85rem;opacity:.6;padding:8px 16px;transition:.3s}
.wa-close-btn:hover{opacity:1;color:var(--gold-soft)}

/* ---------- Menú lista: filtros + iconos ---------- */
.mfilters{
  display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin:0 auto 30px;max-width:820px;
}
.mfilters button{
  padding:7px 16px;border-radius:999px;font-size:.82rem;letter-spacing:.03em;
  border:1px solid rgba(242,231,208,.24);color:var(--cream);transition:.3s;opacity:.85;
}
.mfilters button:hover{border-color:var(--gold);color:var(--gold-soft)}
.mfilters button.active{background:var(--gold);border-color:var(--gold);color:#241d0c;opacity:1}
.mcat.hidden{display:none}
.micons{display:inline-flex;gap:5px;align-items:center}
.mic{width:17px;height:17px;object-fit:contain;opacity:.92}


/* ===== Ronda 3 (jul 2026) ===== */
html{overflow-x:clip}
.carta-hero{overflow:hidden}
@media (max-width:640px){.carta-hero .g-bg{right:-24px;width:230px;top:60px}}

/* selector de idioma visible en la barra móvil (fuera del menú de 3 líneas) */
.lang--mobile{display:none;margin-left:auto}
@media (max-width:920px){.lang--mobile{display:flex}.header__inner{gap:12px}}
@media (min-width:921px){.lang--mobile{display:none !important}}

/* historia: el arco conserva su proporción en móvil */
@media (max-width:920px){.story__collage .c1{height:auto;aspect-ratio:3/3.8}}

/* flipbook móvil: flechas abajo (donde no tapan nada) y libro más grande */
@media (max-width:780px){
  .book-wrap{display:flex;flex-wrap:wrap;justify-content:center;column-gap:26px}
  .book{order:1;flex:0 0 100%}
  .book__nav{order:2;position:static;transform:none;margin-top:14px;width:56px;height:56px}
}

/* reseñas: autor + píldoras clicables + CTA */
.review__who{margin-top:14px;font-size:.82rem;letter-spacing:.06em;color:var(--gold-soft);opacity:.9}
a.rating-pill{transition:.3s}
a.rating-pill:hover{border-color:var(--gold);color:var(--gold-soft);transform:translateY(-2px)}
.reviews__cta{text-align:center;font-size:.92rem;opacity:.78;margin-bottom:16px}

/* leyenda de iconos de la lista del menú */
.micon-legend{display:flex;gap:20px;justify-content:center;flex-wrap:wrap;font-size:.8rem;opacity:.72;margin:-6px 0 26px}
.micon-legend span{display:inline-flex;align-items:center;gap:6px}
.micon-legend em{font-style:normal}

/* footer rediseñado */
.footer__actions{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;margin:0 0 44px}
.footer__motto{text-align:center;margin-bottom:44px}
.footer__motto img{height:46px;margin:0 auto 12px;opacity:.92}
.footer__motto p{font-family:var(--f-display);font-style:italic;font-size:1.35rem;color:var(--gold-soft)}
.footer__rate .stars{color:var(--gold);letter-spacing:3px;margin-bottom:8px}
.footer__rate .rate-note{font-size:.8rem;opacity:.6;margin-top:8px;max-width:26ch}

/* ===== Ronda 4 (jul 2026) ===== */
/* modal Califícanos: opciones doradas */
#rateModal .ic{background:var(--gold);color:#241d0c;font-size:1.25rem}
#rateModal .wa-opt:hover{border-color:var(--gold);background:rgba(201,162,75,.12)}

/* libro del inicio: balanceo suave en táctil para invitar a tocarlo */
@media (hover:none){
  .bookmock.sway{animation:book-sway 3.4s var(--ease) infinite alternate}
}
@keyframes book-sway{
  from{transform:rotateY(-13deg) rotateX(3deg)}
  to{transform:rotateY(-2deg) rotateX(1deg)}
}

/* carta inmersiva (body[data-autohide]): barra y flotantes se esconden al bajar
   — se usa top (no transform) para no romper el nav fijo del móvil.
   En PC tambien: reaparece al subir el scroll o llevar el mouse arriba. */
body[data-autohide] .header{transition:top .45s var(--ease),background .5s var(--ease),box-shadow .5s}
body[data-autohide].chrome-hide .header{top:-96px}
body[data-autohide] .floats{transition:opacity .35s var(--ease),visibility .35s,transform .35s var(--ease)}
body[data-autohide].chrome-hide .floats{opacity:0;visibility:hidden;transform:translateY(16px)}


/* ---------- Foto por plato (lista del menu) ---------- */
.mrow.has-photo{cursor:pointer;transition:background .25s}
.mrow.has-photo:hover{background:rgba(201,162,75,.05)}
.mrow.has-photo .nm::after{
  content:"";display:inline-block;width:16px;height:14px;margin-left:9px;
  vertical-align:-1px;opacity:.7;background:var(--gold-soft);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 3 7.2 5H4a2 2 0 0 0-2 2v11a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2h-3.2L15 3H9zm3 5.5A4.5 4.5 0 1 1 7.5 13 4.5 4.5 0 0 1 12 8.5zm0 2A2.5 2.5 0 1 0 14.5 13 2.5 2.5 0 0 0 12 10.5z'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 3 7.2 5H4a2 2 0 0 0-2 2v11a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2h-3.2L15 3H9zm3 5.5A4.5 4.5 0 1 1 7.5 13 4.5 4.5 0 0 1 12 8.5zm0 2A2.5 2.5 0 1 0 14.5 13 2.5 2.5 0 0 0 12 10.5z'/%3E%3C/svg%3E") center/contain no-repeat;
}
.dish-scrim{
  position:fixed;inset:0;z-index:178;background:rgba(14,15,8,.45);
  opacity:0;visibility:hidden;transition:.25s;
}
.dish-scrim.open{opacity:1;visibility:visible}
.dish-pop{
  position:fixed;z-index:179;width:min(270px,78vw);
  background:linear-gradient(160deg,#2b3020,#202416);
  border:1px solid rgba(201,162,75,.35);border-radius:16px;padding:10px 10px 8px;
  box-shadow:0 24px 60px -18px rgba(0,0,0,.65);
  opacity:0;visibility:hidden;transform:scale(.94);transition:.22s var(--ease);
  pointer-events:none;
}
.dish-pop.open{opacity:1;visibility:visible;transform:scale(1);pointer-events:auto}
.dish-pop img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:10px;display:block}
.dish-pop .dp-name{
  display:block;text-align:center;font-size:.84rem;letter-spacing:.04em;
  color:var(--gold-soft);padding:8px 2px 2px;font-family:var(--f-display);
}
.dish-pop.center{left:50%!important;top:50%!important;transform:translate(-50%,-50%) scale(.94)}
.dish-pop.center.open{transform:translate(-50%,-50%) scale(1)}

/* vista GRANDE del plato (clic): foto amplia centrada */
.dish-pop.big{width:min(780px,92vw)}
.dish-pop.big img{aspect-ratio:auto;max-height:74vh;width:100%;object-fit:contain;background:#181a10}
.dish-pop.big .dp-name{font-size:1.05rem;padding-top:10px}


/* ===== Carta en PC: miniaturas al LADO para que el libro sea mas alto ===== */
@media (min-width:781px){
  .carta-stage{display:flex;gap:16px;align-items:flex-start;justify-content:center;width:min(1300px,97vw);margin-inline:auto}
  .carta-main{flex:1;min-width:0}
  .book__thumbs{
    flex:0 0 96px;flex-direction:column;overflow-y:auto;overflow-x:hidden;
    max-height:calc(100vh - 210px);padding:4px 6px;margin:0;
  }
  .book__thumbs img{width:100%;height:auto}
}

/* ===== Foto de plato: zoom con segundo toque (origen donde tocas) ===== */
.dish-pop.big{overflow:hidden}
.dish-pop.big img{transition:transform .35s var(--ease)}


/* ===== Carta PC pantalla-completa: numero de pagina FLOTA sobre el libro ===== */
@media (min-width:781px){
  .carta-main{position:relative}
  .book__meta{
    position:absolute;left:50%;transform:translateX(-50%);bottom:4px;z-index:26;
    margin:0;padding:5px 16px;border-radius:999px;font-size:.78rem;
    background:rgba(24,27,15,.6);backdrop-filter:blur(5px);
    border:1px solid rgba(242,231,208,.14);pointer-events:none;
  }
  .book__thumbs{max-height:calc(100vh - 110px)}
}

/* ===== Zoom del libro: arrastre tactil fluido + pellizco ===== */
.pgzoom{touch-action:none}
@media (max-width:780px){
  .pgzoom img{height:132vh} /* menos aumento en el celular */
}

/* ===== Foto de plato: zoom con desplazamiento (movil y PC) ===== */
.dish-pop.big{touch-action:none;overflow:hidden}
.dish-pop.big img{transition:transform .3s var(--ease)}
.dish-pop.big.arrastrando img{transition:none}
.dish-pop.big.zoomed{cursor:grab}


/* ===== Carta movil: flechas mas discretas + numero de pagina flotante ===== */
@media (max-width:780px){
  .book__nav{width:56px;height:56px;margin-top:12px}
  .carta-main{position:relative}
  .book__meta{
    position:absolute;left:50%;transform:translateX(-50%);bottom:66px;z-index:26;
    margin:0;padding:3px 11px;border-radius:999px;font-size:.68rem;
    background:rgba(24,27,15,.65);backdrop-filter:blur(5px);
    border:1px solid rgba(242,231,208,.14);pointer-events:none;
    opacity:0;transition:opacity .35s var(--ease);
  }
  .book__meta.show{opacity:1}
}


/* ===== Miniaturas numeradas (navegar a una pagina especifica) ===== */
.book__thumbs .twrap{position:relative;flex:none;display:block}
.book__thumbs .twrap i{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  font-style:normal;font-family:var(--f-body);font-weight:600;font-size:.82rem;
  color:var(--cream);pointer-events:none;line-height:1;
  width:28px;height:28px;display:flex;align-items:center;justify-content:center;
  background:rgba(34,38,26,.5);border:1px solid rgba(242,231,208,.2);
  border-radius:50%;backdrop-filter:blur(2px);
  text-shadow:0 1px 4px rgba(0,0,0,.7);
}
@media (min-width:781px){.book__thumbs .twrap{width:100%}}


/* ===== Instagram sutil en el hero ===== */
.hero__ig{
  display:inline-flex;align-items:center;justify-content:center;
  width:42px;height:42px;margin:14px 0 34px;border-radius:13px;
  border:1px solid rgba(201,162,75,.45);color:var(--gold-soft);
  background:rgba(22,24,14,.25);backdrop-filter:blur(4px);
  transition:.3s var(--ease);opacity:.92;
}
.hero__ig svg{width:20px;height:20px}
.hero__ig:hover{background:var(--gold);color:#241d0c;transform:translateY(-2px)}

/* ===== Pastillas de calificacion: que se noten tocables ===== */
.rating-pill{
  background:rgba(201,162,75,.08);border-color:rgba(201,162,75,.45);
  cursor:pointer;
}
.rating-pill::after{content:"\2197";font-size:.78em;margin-left:7px;opacity:.7}
button.rating-pill{font:inherit;color:inherit}

/* ===== Encuesta de satisfaccion ===== */
.enc{
  max-width:600px;margin:0 auto;padding:30px 26px;
  border:1px solid rgba(201,162,75,.28);border-radius:22px;
  background:linear-gradient(165deg,rgba(242,231,208,.05),rgba(242,231,208,.015));
}
.enc-stars{display:flex;justify-content:center;gap:6px;margin-bottom:18px}
.enc-stars button{font-size:2.1rem;color:rgba(242,231,208,.28);transition:.2s;line-height:1;touch-action:manipulation}
.enc-stars button.on{color:var(--gold);text-shadow:0 0 18px rgba(201,162,75,.45)}
.enc-stars button:hover{transform:scale(1.15)}
.enc-sedes{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin-bottom:18px}
.enc-sedes button{
  padding:8px 18px;border-radius:999px;font-size:.85rem;
  border:1px solid rgba(242,231,208,.25);opacity:.85;transition:.25s;
}
.enc-sedes button.on{background:var(--gold);border-color:var(--gold);color:#241d0c;opacity:1;font-weight:600}
.enc textarea,.enc input{
  width:100%;padding:12px 15px;border-radius:13px;font:inherit;font-size:.93rem;
  border:1px solid rgba(242,231,208,.2);background:rgba(242,231,208,.05);
  color:var(--cream);margin-bottom:12px;resize:vertical;
}
.enc textarea::placeholder,.enc input::placeholder{color:rgba(242,231,208,.45)}
.enc-row{display:grid;grid-template-columns:1fr 1.4fr;gap:12px}
@media(max-width:620px){.enc-row{grid-template-columns:1fr}}
.enc-status{text-align:center;font-size:.88rem;margin-top:12px;opacity:.85;min-height:1.2em}
.enc-gracias{text-align:center;font-size:1.15rem;font-family:var(--f-display);padding:26px 6px;color:var(--gold-soft)}


/* boton "comparte en Google" tras la encuesta 5 estrellas */
.enc-share{margin-top:18px;text-align:center}
.enc-share .btn{background:var(--gold)}
.enc-share .hint{display:block;font-size:.84rem;opacity:.75;margin-top:12px}