:root{
  --blanco:       #FAFAF7;
  --crema:        #F4EFE4;
  --crema2:       #EDE5D0;
  --verde1:       #2C5F3E;   /* oscuro títulos */
  --verde2:       #3A7D52;   /* medio */
  --verde3:       #5A9E70;   /* hoja */
  --verde4:       #A8D4B4;   /* claro decorativo */
  --verde5:       #DFF0E6;   /* muy claro fondo */
  --dorado:       #B8821A;
  --dorado2:      #D4A340;
  --dorado3:      #F0C96A;   /* suave */
  --marron:       #3D2B1A;
  --gris1:        #5A5A52;
  --gris2:        #8A8A7E;
  --gris3:        #C8C8BC;
  --sombra:       rgba(44,95,62,0.12);
  --sombra2:      rgba(44,95,62,0.22);
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{font-family:'DM Sans',sans-serif;background:var(--blanco);color:var(--marron);overflow-x:hidden;}

/* ─── NAVBAR ─── */
#navbar{
  position:fixed;top:0;left:0;right:0;z-index:999;
  display:flex;align-items:center;justify-content:center;
  padding:0;height:72px;
  background:rgba(250,250,247,0.94);
  backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(44,95,62,0.1);
  transition:all .3s;
}
#navbar.scrolled{box-shadow:0 4px 24px var(--sombra);}
.nav-inner{
  width:100%;max-width:1300px;
  padding:0 60px;
  display:flex;align-items:center;justify-content:space-between;
}

.nav-brand{display:flex;align-items:center;gap:12px;text-decoration:none;}
.nav-brand img{height:46px;filter:drop-shadow(0 2px 6px rgba(184,130,26,.3));}
.nav-brand-txt{font-family:'Cinzel',serif;font-size:.9rem;font-weight:700;color:var(--verde1);letter-spacing:.16em;line-height:1.1;}
.nav-brand-txt small{display:block;font-size:.48rem;font-weight:500;letter-spacing:.38em;color:var(--verde3);margin-top:2px;}

.nav-links{display:flex;list-style:none;gap:4px;}
.nav-links a{
  font-family:'DM Sans',sans-serif;font-size:.72rem;font-weight:600;
  letter-spacing:.15em;text-transform:uppercase;
  color:var(--gris1);text-decoration:none;padding:8px 16px;
  border-radius:4px;transition:all .25s;
}
.nav-links a:hover{color:var(--verde1);background:var(--verde5);}

.nav-cta{
  font-family:'DM Sans',sans-serif;font-size:.68rem;font-weight:600;
  letter-spacing:.15em;text-transform:uppercase;
  background:var(--verde1);color:var(--blanco);
  padding:9px 22px;border-radius:4px;text-decoration:none;
  transition:background .25s;
}
.nav-cta:hover{background:var(--verde2);}

.hamburger{
  display:none;flex-direction:column;gap:5px;
  cursor:pointer;padding:6px;z-index:1001;
  background:none;border:none;
}
.hamburger span{
  display:block;width:24px;height:2px;
  background:var(--verde1);border-radius:2px;
  transition:all .35s cubic-bezier(.16,1,.3,1);
}
.hamburger.open span:nth-child(1){transform:rotate(45deg) translate(5px,5px);}
.hamburger.open span:nth-child(2){opacity:0;transform:translateX(-8px);}
.hamburger.open span:nth-child(3){transform:rotate(-45deg) translate(5px,-5px);}

/* ── MOBILE DRAWER ── */
.mob-overlay{
  display:none;
  position:fixed;inset:0;z-index:998;
  background:rgba(14,26,20,.45);
  backdrop-filter:blur(3px);
  opacity:0;transition:opacity .35s ease;
}
.mob-overlay.open{display:block;opacity:1;}

.mob-drawer{
  position:fixed;top:0;right:0;bottom:0;z-index:999;
  width:300px;max-width:85vw;
  background:var(--blanco);
  display:flex;flex-direction:column;
  transform:translateX(100%);
  transition:transform .38s cubic-bezier(.16,1,.3,1);
  box-shadow:-8px 0 40px rgba(14,26,20,.18);
}
.mob-drawer.open{transform:translateX(0);}

/* drawer header */
.mob-drawer-head{
  display:flex;align-items:center;justify-content:space-between;
  padding:20px 24px;
  border-bottom:1px solid var(--crema2);
}
.mob-drawer-logo{display:flex;align-items:center;gap:10px;text-decoration:none;}
.mob-drawer-logo img{height:38px;filter:drop-shadow(0 2px 6px rgba(184,130,26,.3));}
.mob-drawer-logo span{
  font-family:'Cinzel',serif;font-size:.78rem;font-weight:700;
  color:var(--verde1);letter-spacing:.16em;line-height:1.1;
}
.mob-close{
  width:36px;height:36px;border-radius:8px;
  background:var(--crema);border:1px solid var(--crema2);
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;font-size:1.1rem;color:var(--gris1);
  transition:all .25s;
}
.mob-close:hover{background:var(--verde5);color:var(--verde1);}

/* drawer nav links */
.mob-nav{
  flex:1;overflow-y:auto;
  padding:12px 0;
}
.mob-nav a{
  display:flex;align-items:center;
  padding:16px 24px;
  font-family:'DM Sans',sans-serif;font-size:.85rem;font-weight:600;
  letter-spacing:.12em;text-transform:uppercase;
  color:var(--gris1);text-decoration:none;
  border-left:3px solid transparent;
  transition:all .2s;
}
.mob-nav a:hover{
  color:var(--verde1);
  background:var(--verde5);
  border-left-color:var(--verde1);
  padding-left:30px;
}
.mob-nav-sep{
  height:1px;background:var(--crema2);margin:8px 24px;
}

/* drawer footer: reserva + redes */
.mob-drawer-foot{
  padding:20px 24px 28px;
  border-top:1px solid var(--crema2);
  background:var(--crema);
}
.mob-reserva{
  display:flex;align-items:center;justify-content:center;gap:10px;
  width:100%;padding:14px;margin-bottom:0;
  font-family:'DM Sans',sans-serif;font-size:.75rem;font-weight:700;
  letter-spacing:.2em;text-transform:uppercase;
  background:var(--verde1);color:#fff;
  border:none;border-radius:8px;text-decoration:none;
  transition:all .3s;cursor:pointer;
}
.mob-reserva:hover{background:var(--verde2);transform:translateY(-1px);box-shadow:0 6px 20px var(--sombra2);}
.mob-reserva svg{width:16px;height:16px;stroke:#fff;stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round;}

/* ─── HERO ─── */
#inicio{
  height:100vh;min-height:600px;
  position:relative;overflow:hidden;
  display:flex;align-items:center;
}

/* ── SLIDER ── */
.hero-slider{position:absolute;inset:0;z-index:0;}
.hero-slide{
  position:absolute;inset:0;
  opacity:0;transition:opacity 1.2s ease;
  background:#1a4028;
}
.hero-slide.active{opacity:1;}
.hero-slide img,
.hero-slide video{
  width:100%;height:100%;object-fit:cover;display:block;
}
.slide-ph{
  width:100%;height:100%;
  display:flex;align-items:center;justify-content:center;
  font-size:5rem;opacity:.12;
}

/* sin overlay — imagen/video al natural */
.hero-overlay{ display:none; }

/* slider dots */
.hero-dots{
  position:absolute;bottom:28px;left:50%;transform:translateX(-50%);
  z-index:3;display:flex;gap:10px;
}
.hero-dot{
  width:8px;height:8px;border-radius:50%;
  background:rgba(255,255,255,.4);border:none;cursor:pointer;
  transition:all .3s;padding:0;
}
.hero-dot.active{background:#fff;transform:scale(1.3);}

/* Hero layout: estructura idéntica al nav-inner */
.hero-content{
  position:relative;z-index:2;
  width:100%;max-width:1300px;
  margin:0 auto;
  padding:0 60px;
  text-shadow:0 2px 16px rgba(0,0,0,.65);
}

.hero-h1{
  font-family:'Cinzel',serif;
  font-size:clamp(2.4rem,5.5vw,4.6rem);
  font-weight:700;color:#fff;
  letter-spacing:.10em;line-height:1;
  margin-bottom:8px;
}
.hero-h1 span{color:var(--dorado3);}
.hero-hsub{
  font-family:'Cinzel',serif;font-size:clamp(.62rem,1.3vw,.82rem);
  font-weight:700;letter-spacing:.30em;color:rgba(255,255,255,.8);
  text-transform:uppercase;margin-bottom:16px;
  text-shadow:0 1px 10px rgba(0,0,0,.6);
}
.hero-frase{
  font-family:'DM Serif Display',serif;font-size:clamp(.9rem,1.7vw,1.15rem);
  font-style:italic;color:rgba(255,255,255,.9);
  max-width:700px;margin-bottom:36px;
  text-shadow:0 1px 12px rgba(0,0,0,.6);
}
@keyframes heroIn{from{opacity:0;transform:translateX(-20px);}to{opacity:1;transform:translateX(0);}}
.hero-btns{display:flex;gap:24px;flex-wrap:wrap;}
.btn-primary{
  font-family:'DM Sans',sans-serif;font-size:.66rem;font-weight:600;
  letter-spacing:.2em;text-transform:uppercase;
  background:var(--dorado);color:#fff;border:none;
  padding:13px 28px;border-radius:4px;text-decoration:none;
  cursor:pointer;transition:all .3s;
  text-shadow:none;
}
.btn-primary:hover{background:var(--dorado2);transform:translateY(-1px);box-shadow:0 6px 20px rgba(184,130,26,.5);}
.btn-outline{
  font-family:'DM Sans',sans-serif;font-size:.66rem;font-weight:600;
  letter-spacing:.2em;text-transform:uppercase;
  background:rgba(0,0,0,.25);color:#fff;border:1.5px solid rgba(255,255,255,.7);
  padding:13px 28px;border-radius:4px;text-decoration:none;
  cursor:pointer;transition:all .3s;
  text-shadow:none;backdrop-filter:blur(4px);
}
.btn-outline:hover{background:rgba(255,255,255,.18);border-color:#fff;}

/* ─── SECTIONS ─── */
.sec{padding:96px 0;}
.sec-light{background:var(--blanco);}
.sec-cream{background:var(--crema);}
.sec-green{background:var(--verde5);}

/* Zona continua Nosotros → Carta → Contacto */
#nosotros,#carta,#contacto{background:#F2F2F2;color:inherit;}
#nosotros .h2,#carta .h2,#contacto .h2{color:var(--verde1);}
#nosotros .nos-desc,#carta .nos-desc{color:var(--gris1);}
#nosotros .nos-desc strong{color:var(--verde2);}
#nosotros .tl-h{color:var(--verde1);}
#nosotros .tl-lbl{color:var(--verde2);}
#nosotros .tl-p{color:var(--gris1);}
#nosotros .tl-year{color:var(--verde3);}
#nosotros .tl::before{background:rgba(255,255,255,.2);}
#nosotros .tl-dot{background:var(--verde5);border-color:var(--verde3);}
#nosotros .mv-card{background:rgba(255,255,255,0.75);border:1px solid rgba(255,255,255,0.9);}
#nosotros .mv-card h4{color:var(--verde2);}
#nosotros .mv-card p{color:var(--gris1);}
#nosotros .mv-card::before{background:linear-gradient(90deg,var(--verde3),transparent);}
#carta .h2{color:var(--verde1);}
#carta .cat-top-left h3{color:var(--verde1);}
#carta .cat-top-left p{color:var(--gris2);}
#carta .cat-top-right{background:var(--verde5);color:var(--verde3);}
#carta .ctab{color:var(--gris2);}
#carta .ctab:hover{color:var(--verde2);}
#carta .ctab.active{color:var(--verde1);border-bottom-color:var(--verde1);}
#carta .carta-tabbar{border-bottom-color:var(--crema2);}
#carta .carta-select{background:var(--blanco);border-color:var(--verde4);color:var(--verde1);}
#carta .dish-card{background:rgba(255,255,255,0.75);border:1px solid rgba(255,255,255,0.9);}
#carta .dish-card-name{color:var(--verde1);}
#carta .dish-card-desc{color:var(--gris2);}
#carta .dish-price-chip{background:var(--blanco);border-color:var(--dorado2);color:var(--dorado);}
#carta .dish-featured{background:rgba(255,255,255,0.75);border:1px solid rgba(255,255,255,0.9);}
#carta .dish-feat-name{color:var(--verde1);}
#carta .dish-feat-desc{color:var(--gris1);}
#carta .dish-feat-tag{background:var(--verde5);color:var(--verde2);}
#carta .beb-block{background:rgba(255,255,255,0.75);border:1px solid rgba(255,255,255,0.9);}
#carta .beb-block h4{color:var(--verde1);border-bottom-color:var(--crema2);}
#carta .beb-name{color:var(--marron);}
#carta .beb-sub{color:var(--gris2);}
#carta .beb-row{border-bottom-color:var(--verde5);}
#carta .ext-item{background:rgba(255,255,255,0.75);border:1px solid rgba(255,255,255,0.9);}
#carta .ext-item span:first-child{color:var(--gris1);}
#contacto .h2{color:var(--verde1);}
#contacto .c-body h5{color:var(--verde3);}
#contacto .c-body p,#contacto .c-body a{color:var(--gris1);}
#contacto .c-body a:hover{color:var(--verde2);}
#contacto .c-icon{background:var(--verde5);border-color:var(--verde4);}
#contacto .redes-lbl{color:var(--verde2);}
#contacto .red{background:var(--verde5);border-color:var(--verde4);color:var(--verde3);}
#contacto .red:hover{background:var(--verde2);border-color:var(--verde2);color:#fff;}
#contacto .form-card{background:rgba(255,255,255,0.80);border:1px solid rgba(255,255,255,0.95);}
#contacto .form-card h3{color:var(--verde1);}
#contacto .ff label{color:var(--verde3);}
#contacto .ff input,#contacto .ff textarea,#contacto .ff select{background:var(--crema);border-color:var(--crema2);color:var(--marron);}
#contacto .ff input:focus,#contacto .ff textarea:focus,#contacto .ff select:focus{border-color:var(--verde3);background:var(--blanco);}
#contacto .ff input::placeholder,#contacto .ff textarea::placeholder{color:var(--gris3);}
#contacto .form-nota{color:var(--gris2);}
#contacto .form-nota a{color:var(--verde2);}
#contacto .form-nota a:hover{color:var(--verde1);}

/* Contenedor universal — mismo ancho que nav-inner */
.container,
.nos-grid,
.carta-wrap,
.con-grid-wrap{
  max-width:1300px;
  margin:0 auto;
  padding:0 60px;
}

.label{display:none;}
.h2{
  font-family:'DM Serif Display',serif;
  font-size:clamp(1.8rem,3.8vw,2.8rem);
  color:var(--verde1);line-height:1.15;margin-bottom:14px;
}

/* ─── NOSOTROS ─── */
.nos-grid{display:grid;grid-template-columns:1fr 1fr;gap:72px;}
.nos-desc{font-size:1.05rem;line-height:1.85;color:var(--gris1);margin-bottom:28px;}
.nos-desc strong{color:var(--verde2);font-weight:600;}

.mv-grid{display:grid;grid-template-columns:1fr;gap:14px;margin-bottom:22px;}
.mv-card{
  background:rgba(255,255,255,0.55);border:1px solid rgba(255,255,255,0.7);
  border-radius:8px;padding:22px 18px;
  box-shadow:0 2px 12px rgba(44,95,62,0.08);
  transition:transform .3s,box-shadow .3s;
  backdrop-filter:blur(4px);
}
.mv-card:hover{transform:translateY(-3px);box-shadow:0 8px 28px rgba(44,95,62,0.15);}
.mv-card .mv-icon{font-size:1.4rem;margin-bottom:10px;}
.mv-card h4{font-family:'DM Sans',sans-serif;font-size:.72rem;font-weight:600;letter-spacing:.15em;text-transform:uppercase;color:var(--verde2);margin-bottom:8px;}
.mv-card p{font-size:.9rem;line-height:1.65;color:var(--gris1);}

.oxa-strip{
  display:flex;gap:16px;align-items:center;
  background:linear-gradient(135deg,var(--verde1),var(--verde2));
  border-radius:8px;padding:20px 22px;
}
.oxa-strip .ico{font-size:1.5rem;flex-shrink:0;}
.oxa-strip p{font-family:'DM Serif Display',serif;font-style:italic;font-size:1rem;color:rgba(255,255,255,.9);line-height:1.55;}
.oxa-strip p strong{color:var(--dorado3);font-style:normal;}

/* Timeline */
.tl-lbl{font-family:'DM Sans',sans-serif;font-size:.7rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--verde2);margin-bottom:22px;}
.tl{position:relative;padding-left:28px;}
.tl::before{content:'';position:absolute;left:10px;top:8px;bottom:8px;width:1.5px;background:var(--crema2);}
.tl-item{position:relative;margin-bottom:28px;}
.tl-item:last-child{margin-bottom:0;}
.tl-dot{
  position:absolute;left:-28px;top:4px;
  width:20px;height:20px;border-radius:50%;
  background:var(--verde5);border:2px solid var(--verde3);
  display:flex;align-items:center;justify-content:center;font-size:.7rem;
}
.tl-year{font-size:.65rem;font-weight:600;letter-spacing:.2em;color:var(--verde3);margin-bottom:3px;}
.tl-h{font-family:'DM Serif Display',serif;font-size:1rem;color:var(--verde1);margin-bottom:5px;}
.tl-p{font-size:.9rem;line-height:1.65;color:var(--gris1);}

/* ─── CARTA — nueva estética ─── */
.carta-wrap{width:100%;}

/* Tab bar — desktop */
.carta-tabbar{
  display:flex;gap:0;
  overflow-x:auto;
  border-bottom:2px solid rgba(44,95,62,0.2);
  margin-bottom:48px;
  scrollbar-width:none;
  box-sizing:border-box;
  position:relative;
}
.carta-tabbar::-webkit-scrollbar{display:none;}
.ctab{
  font-family:'DM Sans',sans-serif;font-size:.68rem;font-weight:600;
  letter-spacing:.12em;text-transform:uppercase;
  color:var(--gris2);background:transparent;
  border:none;border-bottom:3px solid transparent;
  padding:12px 20px;cursor:pointer;white-space:nowrap;
  margin-bottom:-2px;
  transition:all .25s;
  display:flex;align-items:center;gap:7px;
  flex-shrink:0;
  outline:none;
  border-radius:6px 6px 0 0;
}
.ctab:hover{color:var(--verde2);background:rgba(44,95,62,0.06);}
.ctab.active{
  color:var(--verde1);
  font-weight:700;
  border-bottom:3px solid var(--dorado);
  background:rgba(200,146,42,0.08);
}

/* Mobile carta selector */
.carta-select-wrap{display:none;margin-bottom:32px;position:relative;}
.carta-select-wrap::after{
  content:'▾';position:absolute;right:16px;top:50%;transform:translateY(-50%);
  color:var(--verde2);font-size:1rem;pointer-events:none;
}
.carta-select{
  width:100%;padding:14px 40px 14px 16px;
  background:var(--blanco);border:2px solid var(--verde4);border-radius:8px;
  font-family:'DM Sans',sans-serif;font-size:.95rem;font-weight:600;color:var(--verde1);
  appearance:none;-webkit-appearance:none;cursor:pointer;outline:none;
  box-shadow:0 2px 8px var(--sombra);
}
.carta-select:focus{border-color:var(--verde3);}

.cpane{display:none;animation:fadeSlide .35s ease both;}
.cpane.active{display:block;}
@keyframes fadeSlide{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:translateY(0);}}

/* category header */
.cat-top{
  display:flex;align-items:flex-end;justify-content:space-between;
  margin-bottom:28px;padding-bottom:18px;
  border-bottom:1px solid var(--crema2);
}
.cat-top-left h3{
  font-family:'DM Serif Display',serif;font-size:1.8rem;color:var(--verde1);margin-bottom:4px;
}
.cat-top-left p{font-size:.88rem;color:var(--gris2);font-style:italic;}
.cat-top-right{
  font-family:'DM Sans',sans-serif;font-size:.68rem;font-weight:600;
  letter-spacing:.1em;color:var(--verde3);
  background:var(--verde5);padding:6px 14px;border-radius:20px;white-space:nowrap;
}

/* ─── DISH FEATURED — tarjeta grande destacada ─── */
.dish-featured{
  background:rgba(255,255,255,0.88);
  border:1px solid var(--crema2);
  border-radius:14px;overflow:hidden;
  box-shadow:0 2px 12px rgba(44,95,62,0.08);
  transition:transform .3s,box-shadow .3s;
  display:grid;
  grid-template-columns:1fr 1fr;   /* imagen izq 50%, info der 50% */
  height:320px;                    /* grande */
  margin-bottom:14px;
}
.dish-featured:hover{
  transform:none;
  box-shadow:0 2px 12px rgba(44,95,62,0.08);
}
.dish-feat-img{
  position:relative;
  width:100%;height:100%;
  overflow:hidden;
  background:linear-gradient(135deg,#dff0e6,#f0f7f0);
}
.dish-feat-img img{
  position:absolute;inset:0;
  width:100%;height:100%;
  object-fit:cover;object-position:center;
  display:block;
  transition:transform 0.9s cubic-bezier(.16,1,.3,1);
}
.dish-featured:hover .dish-feat-img img{transform:none;}
.dish-placeholder-lg{
  position:absolute;inset:0;
  display:flex;align-items:center;justify-content:center;
  font-size:5rem;
  background:linear-gradient(135deg,#dff0e6,#f0f7f0);
}
.dish-feat-body{
  padding:36px 36px;
  display:flex;flex-direction:column;
  justify-content:center;
}
.dish-feat-tag{
  display:inline-flex;align-items:center;gap:6px;
  background:var(--verde5);color:var(--verde2);
  font-family:'DM Sans',sans-serif;font-size:.6rem;font-weight:700;
  letter-spacing:.12em;text-transform:uppercase;
  padding:5px 14px;border-radius:20px;
  margin-bottom:14px;border:1px solid var(--verde4);
  align-self:flex-start;
}
.dish-feat-name{
  font-family:'DM Serif Display',serif;
  font-size:1.65rem;color:var(--verde1);
  font-weight:700;line-height:1.2;margin-bottom:12px;
}
.dish-feat-desc{font-size:.97rem;color:var(--gris1);line-height:1.72;margin-bottom:22px;}
.dish-feat-price{
  font-family:'DM Serif Display',serif;
  font-size:1.6rem;font-weight:700;color:var(--dorado);
}

/* ════════════════════════════════════
   DISH CARDS — layout horizontal
   igual a imagen de referencia
   ════════════════════════════════════ */
.dish-cards{
  display:flex;flex-direction:column;gap:14px;
}

/* Tarjeta horizontal: imagen izq, info der — mismo tamaño */
.dish-card{
  background:rgba(255,255,255,0.88);
  border:1px solid var(--crema2);
  border-radius:14px;overflow:hidden;
  box-shadow:0 2px 12px rgba(44,95,62,0.08);
  transition:transform .3s,box-shadow .3s;
  display:grid;
  grid-template-columns:1fr 1fr;
  height:320px;
}
.dish-card:hover{
  transform:none;
  box-shadow:0 2px 12px rgba(44,95,62,0.08);
}

/* ── Imagen lado izquierdo ── */
.dish-card-img,
.dish-feat-img{
  position:relative;
  width:100%;
  height:100%;
  overflow:hidden;
  background:linear-gradient(135deg,#dff0e6,#f0f7f0);
  flex-shrink:0;
}

/* ─────────────────────────────────────────────────────
   IMAGEN ESTÁTICA con zoom lento
   Uso en HTML:
     <img src="tu-foto.jpg" alt="Nombre plato" class="img-static">
   ───────────────────────────────────────────────────── */
.dish-card-img img.img-static,
.dish-feat-img img.img-static{
  position:absolute;
  top:0;left:0;
  width:100%;height:100%;
  object-fit:cover;
  object-position:center;
  display:block;
  transition:transform 0.9s cubic-bezier(.16,1,.3,1);
  will-change:transform;
}

/* Zoom SOLO al pasar el mouse sobre la imagen */
.dish-card-img:hover img.img-static,
.dish-feat-img:hover img.img-static{
  transform:scale(1.08);
}

/* ─────────────────────────────────────────────────────
   IMAGEN 360° — arrastrar con mouse o dedo
   Uso en HTML:
     <div class="img-360-wrap" data-frames="36" data-imgw="9000">
       <img src="sprite-360.jpg" alt="360°">
     </div>
     <div class="badge-360">↔ 360°</div>

   sprite-360.jpg = imagen larga con todos los fotogramas
   data-frames = número de fotogramas (ej: 36)
   data-imgw   = ancho total del sprite en px (frames × ancho_frame)
   ───────────────────────────────────────────────────── */
.img-360-wrap{
  position:absolute;
  top:0;left:0;
  width:100%;height:100%;
  overflow:hidden;
  cursor:grab;
  user-select:none;
  touch-action:pan-y;
}
.img-360-wrap:active{cursor:grabbing;}
.img-360-wrap img{
  position:absolute;
  top:0;left:0;
  height:100%;
  width:auto;
  max-width:none;
  display:block;
}
.badge-360{
  position:absolute;bottom:10px;left:10px;z-index:3;
  background:rgba(14,26,20,.75);color:#fff;
  font-family:'DM Sans',sans-serif;font-size:.58rem;font-weight:700;
  letter-spacing:.08em;padding:4px 10px;border-radius:20px;
  display:flex;align-items:center;gap:5px;
  backdrop-filter:blur(4px);
  pointer-events:none;
}

/* placeholder emoji (mientras no hay imagen real) */
.dish-placeholder-sm,
.dish-placeholder-lg{
  position:absolute;inset:0;
  display:flex;align-items:center;justify-content:center;
  font-size:5rem;
  background:linear-gradient(135deg,#dff0e6,#f0f7f0);
}
.dish-card-img-overlay{display:none;}
.dish-price-chip{display:none;}
.share-chip{
  position:absolute;top:10px;left:10px;z-index:2;
  background:var(--verde2);color:#fff;
  font-size:.52rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  padding:3px 9px;border-radius:20px;
}

/* ── Info lado derecho ── */
.dish-card-body{
  padding:36px 36px;
  display:flex;flex-direction:column;
  justify-content:center;
  align-items:flex-start;
  text-align:left;
  gap:0;
}

/* tag de categoría (chip verde claro) */
.dish-card-tag{
  display:inline-flex;align-items:center;gap:6px;
  background:var(--verde5);color:var(--verde2);
  font-family:'DM Sans',sans-serif;font-size:.6rem;font-weight:700;
  letter-spacing:.12em;text-transform:uppercase;
  padding:4px 12px;border-radius:20px;
  margin-bottom:10px;
  border:1px solid var(--verde4);
}

.dish-card-name{
  font-family:'DM Serif Display',serif;
  font-size:1.65rem;color:var(--verde1);
  margin-bottom:12px;line-height:1.2;
  text-align:left;width:100%;font-weight:700;
}
.dish-card-desc{
  font-size:.97rem;color:var(--gris1);
  line-height:1.72;text-align:left;width:100%;
  margin-bottom:22px;
}

/* precio en el body */
.dish-card-price{
  font-family:'DM Serif Display',serif;
  font-size:1.6rem;font-weight:700;
  color:var(--dorado);
}

/* móvil: imagen arriba, info abajo */
@media(max-width:640px){
  .dish-card{grid-template-columns:1fr;min-height:auto;}
  .dish-card-img{height:190px;min-height:190px;width:100%;}
}


/* ── Acompañamientos en pastas ── */
.dish-acomp{
  margin-top:14px;
  width:100%;
}
.dish-acomp-title{
  font-family:'DM Sans',sans-serif;font-size:.6rem;font-weight:700;
  letter-spacing:.22em;text-transform:uppercase;
  color:var(--verde3);margin-bottom:8px;
}
.dish-acomp-list{
  display:flex;flex-direction:column;gap:5px;
  width:100%;
}
.dish-acomp-row{
  display:flex;justify-content:space-between;align-items:baseline;
  gap:8px;
  padding:5px 10px;
  background:var(--verde5);
  border-radius:6px;
  border:1px solid rgba(74,144,99,.15);
}
.dish-acomp-row-name{
  font-size:.8rem;color:var(--gris1);line-height:1.35;flex:1;
}
.dish-acomp-row-name strong{
  font-weight:700;color:var(--verde2);
}
.dish-acomp-row-price{
  font-family:'Cinzel',serif;font-size:.82rem;
  color:var(--dorado);font-weight:700;white-space:nowrap;flex-shrink:0;
}

/* Pasta card — auto height para acompañamientos */
.dish-card--tall{height:auto;min-height:320px;}
.dish-card--tall .dish-card-img{height:100%;min-height:320px;}
.dish-card--tall .dish-card-body{justify-content:flex-start;padding-top:28px;overflow-y:auto;}

.beb-cols{display:grid;grid-template-columns:1fr 1fr;gap:24px;}
.beb-block{background:rgba(255,255,255,0.75);border:1px solid rgba(255,255,255,0.9);border-radius:10px;padding:28px;box-shadow:0 2px 10px rgba(44,95,62,0.1);}
.beb-block h4{
  font-family:'DM Serif Display',serif;font-size:1.1rem;color:var(--verde1);
  margin-bottom:18px;padding-bottom:14px;
  border-bottom:1px solid var(--crema2);
  display:flex;align-items:center;gap:10px;
}
.beb-row{
  display:flex;justify-content:space-between;align-items:flex-start;
  padding:10px 0;border-bottom:1px solid var(--verde5);gap:12px;
}
.beb-row:last-child{border-bottom:none;}
.beb-name{font-size:.93rem;color:var(--marron);font-weight:400;}
.beb-sub{font-size:.75rem;color:var(--gris2);margin-top:2px;font-style:italic;}
.beb-price{font-family:'Cinzel',serif;font-size:.9rem;color:var(--dorado);font-weight:600;white-space:nowrap;margin-top:2px;}

/* extras */
.ext-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:10px;max-width:900px;margin:0 auto;}
.ext-item{
  display:flex;justify-content:space-between;align-items:center;
  padding:12px 16px;background:rgba(255,255,255,0.75);
  border:1px solid rgba(255,255,255,0.9);border-radius:8px;
  transition:border-color .25s,box-shadow .25s;
}
.ext-item:hover{border-color:var(--verde4);box-shadow:0 3px 12px var(--sombra);}
.ext-item span:first-child{font-size:.88rem;color:var(--gris1);}
.ext-item span:last-child{font-family:'Cinzel',serif;font-size:.85rem;color:var(--dorado);font-weight:600;}

/* Porción adicional con detalle interno */
.ext-item--detail{
  flex-direction:column;align-items:flex-start;gap:6px;
}
.ext-item-top{
  display:flex;justify-content:space-between;align-items:center;width:100%;
}
.ext-item-top span:first-child{font-size:.88rem;color:var(--gris1);}
.ext-item-top span:last-child{font-family:'Cinzel',serif;font-size:.85rem;color:var(--dorado);font-weight:600;}
.ext-item-sub{
  font-size:.75rem;color:var(--gris2);font-style:italic;line-height:1.45;
}

/* ─── CONTACTO REDISEÑO ─── */
.con-grid{display:grid;grid-template-columns:1fr 1.05fr;gap:80px;align-items:start;}
.con-info{display:flex;flex-direction:column;}

.con-section-lbl{
  font-family:'DM Sans',sans-serif;font-size:.65rem;font-weight:700;
  letter-spacing:.35em;text-transform:uppercase;
  color:var(--verde2);margin-bottom:16px;
}

.con-item{
  display:flex;gap:18px;align-items:flex-start;
  margin-bottom:24px;
}
.con-item-icon{
  width:48px;height:48px;flex-shrink:0;
  background:rgba(255,255,255,0.7);
  border:1px solid rgba(44,95,62,0.15);
  border-radius:10px;
  display:flex;align-items:center;justify-content:center;
  font-size:1.1rem;
  box-shadow:0 2px 8px rgba(44,95,62,0.08);
}
.con-item-body{flex:1;}
.con-item-title{
  font-family:'DM Sans',sans-serif;font-size:.65rem;font-weight:700;
  letter-spacing:.22em;text-transform:uppercase;
  color:var(--verde2);margin-bottom:5px;
}
.con-item-body p,
.con-item-body a{
  font-size:.97rem;color:var(--gris1);
  text-decoration:none;line-height:1.55;
  transition:color .25s;
}
.con-item-body a:hover{color:var(--verde2);}

.con-sep{
  height:1px;
  background:linear-gradient(90deg,var(--verde4),transparent);
  margin:8px 0 28px;
}
.con-redes-desc{
  font-size:.92rem;color:var(--gris2);
  font-style:italic;margin-bottom:4px;
}
.con-ayuda{
  list-style:none;
  display:flex;flex-direction:column;gap:10px;
}
.con-ayuda li{display:flex;align-items:center;gap:8px;}
.con-ayuda li::before{
  content:'›';font-size:1.1rem;font-weight:700;
  color:var(--gris2);flex-shrink:0;line-height:1;
}
.con-ayuda a{
  font-size:.93rem;color:var(--gris2);
  text-decoration:none;
  transition:color .25s;
}
.con-ayuda a:hover{color:var(--verde2);}
#contacto .con-ayuda a{color:var(--gris2);}
#contacto .con-ayuda a:hover{color:var(--verde2);}
#contacto .con-ayuda li::before{color:var(--gris2);}

/* override contacto overrides for new structure */
#contacto .con-item-title{color:var(--verde2);}
#contacto .con-item-body p,
#contacto .con-item-body a{color:var(--gris1);}
#contacto .con-item-body a:hover{color:var(--verde2);}
#contacto .con-item-icon{background:rgba(255,255,255,0.7);border-color:rgba(44,95,62,0.15);}
#contacto .con-section-lbl{color:var(--verde2);}
#contacto .con-section-lbl::after{background:linear-gradient(90deg,var(--verde4),transparent);}
#contacto .con-sep{background:linear-gradient(90deg,var(--verde4),transparent);}
#contacto .form-card h3{color:var(--verde1);}

/* responsive */
@media(max-width:960px){
  .con-grid{grid-template-columns:1fr;gap:40px;}
}

.redes-lbl{font-family:'DM Sans',sans-serif;font-size:.62rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--verde2);margin-bottom:12px;}
.redes{display:flex;gap:10px;flex-wrap:wrap;}
.red{
  width:44px;height:44px;
  display:flex;align-items:center;justify-content:center;
  background:transparent;
  border:1.5px solid #000;
  border-radius:10px;
  text-decoration:none;
  color:#000;
  transition:transform .25s,box-shadow .25s,opacity .25s;
  box-shadow:0 1px 4px var(--sombra);
}
.red:hover{
  transform:translateY(-2px);
  box-shadow:0 6px 16px var(--sombra2);
  opacity:.7;
}
.red svg{
  width:20px;height:20px;
  display:block;flex-shrink:0;
}
.red svg{width:18px;height:18px;stroke:currentColor;stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round;}

/* form */
.form-card{
  background:rgba(255,255,255,0.80);border:1px solid rgba(255,255,255,0.95);border-radius:14px;
  padding:36px 32px;box-shadow:0 4px 24px rgba(44,95,62,0.12);
  backdrop-filter:blur(4px);
}
.form-card h3{font-family:'DM Serif Display',serif;font-size:1.4rem;color:var(--verde1);margin-bottom:24px;}
.frow{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.ff{margin-bottom:14px;}
.ff label{display:block;font-size:.6rem;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--verde3);margin-bottom:6px;}
.ff input,.ff textarea,.ff select{
  width:100%;padding:11px 14px;
  background:var(--crema);border:1.5px solid var(--crema2);
  color:var(--marron);font-family:'DM Sans',sans-serif;font-size:.93rem;
  border-radius:6px;outline:none;transition:border-color .25s,background .25s;
  resize:none;-webkit-appearance:none;
}
.ff input:focus,.ff textarea:focus,.ff select:focus{border-color:var(--verde3);background:var(--blanco);}
.ff input::placeholder,.ff textarea::placeholder{color:var(--gris3);font-style:italic;}
.ff select option{background:var(--blanco);}
.ff textarea{height:105px;}
.btn-form{
  width:100%;padding:13px;margin-top:4px;
  font-family:'DM Sans',sans-serif;font-size:.7rem;font-weight:700;
  letter-spacing:.25em;text-transform:uppercase;
  background:var(--verde1);color:#fff;border:none;border-radius:6px;
  cursor:pointer;transition:all .25s;display:flex;align-items:center;justify-content:center;gap:8px;
}
.btn-form:hover{background:var(--verde2);transform:translateY(-1px);box-shadow:0 6px 20px var(--sombra2);}
.btn-form.sent{background:var(--verde3);cursor:default;}
.form-nota{margin-top:12px;text-align:center;font-size:.8rem;color:var(--gris2);font-style:italic;}
.form-nota a{color:var(--verde2);text-decoration:none;}
.form-nota a:hover{text-decoration:underline;}

/* ─── FOOTER ─── */
footer{
  background:var(--verde1);
  padding:24px 60px;text-align:center;
}
.foot-copy{
  font-family:'DM Sans',sans-serif;font-size:.78rem;
  color:rgba(255,255,255,.55);letter-spacing:.04em;line-height:1.8;
}
.foot-copy a{color:rgba(255,255,255,.55);text-decoration:none;}
.foot-copy a:hover{color:var(--dorado3);}

/* ─── WHATSAPP FLOTANTE ─── */
.wa-float{
  position:fixed;bottom:28px;right:28px;z-index:990;
  width:56px;height:56px;border-radius:50%;
  background:#25D366;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 4px 20px rgba(37,211,102,.45);
  text-decoration:none;
  transition:transform .25s,box-shadow .25s;
  animation:waPulse 2.5s ease-in-out infinite;
}
.wa-float:hover{
  transform:scale(1.1);
  box-shadow:0 6px 28px rgba(37,211,102,.6);
  animation:none;
}
@keyframes waPulse{
  0%,100%{box-shadow:0 4px 20px rgba(37,211,102,.45),0 0 0 0 rgba(37,211,102,.3);}
  50%{box-shadow:0 4px 20px rgba(37,211,102,.45),0 0 0 10px rgba(37,211,102,0);}
}
.wa-float svg{width:30px;height:30px;fill:#fff;}
.wa-tooltip{
  position:absolute;right:66px;top:50%;transform:translateY(-50%);
  background:var(--marron);color:#fff;
  font-family:'DM Sans',sans-serif;font-size:.72rem;font-weight:600;
  letter-spacing:.06em;white-space:nowrap;
  padding:6px 12px;border-radius:6px;
  opacity:0;pointer-events:none;
  transition:opacity .2s;
}
.wa-tooltip::after{
  content:'';position:absolute;left:100%;top:50%;transform:translateY(-50%);
  border:6px solid transparent;border-left-color:var(--marron);
}
.wa-float:hover .wa-tooltip{opacity:1;}
@media(max-width:600px){
  .wa-float{bottom:20px;right:16px;width:50px;height:50px;}
  .wa-float svg{width:26px;height:26px;}
  .wa-tooltip{display:none;}
}

/* ─── MODAL LEGAL ─── */
.modal-overlay{
  position:fixed;inset:0;z-index:1100;
  background:rgba(14,26,20,.6);
  backdrop-filter:blur(6px);
  display:flex;align-items:center;justify-content:center;
  padding:24px;
  opacity:0;pointer-events:none;
  transition:opacity .3s ease;
}
.modal-overlay.open{opacity:1;pointer-events:all;}
.modal-box{
  background:var(--blanco);border-radius:14px;
  width:100%;max-width:620px;max-height:80vh;
  display:flex;flex-direction:column;
  box-shadow:0 24px 80px rgba(14,26,20,.35);
  transform:translateY(20px);
  transition:transform .35s cubic-bezier(.16,1,.3,1);
}
.modal-overlay.open .modal-box{transform:translateY(0);}
.modal-head{
  display:flex;align-items:center;justify-content:space-between;
  padding:22px 28px;
  border-bottom:1px solid var(--crema2);
  flex-shrink:0;
}
.modal-head h4{
  font-family:'DM Serif Display',serif;font-size:1.25rem;
  color:var(--verde1);font-weight:700;
}
.modal-close{
  width:34px;height:34px;border-radius:8px;
  background:var(--crema);border:1px solid var(--crema2);
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;font-size:1rem;color:var(--gris1);
  transition:all .2s;flex-shrink:0;
}
.modal-close:hover{background:var(--verde5);color:var(--verde1);}
.modal-body{
  padding:24px 28px;overflow-y:auto;flex:1;
  font-size:.95rem;line-height:1.8;color:var(--gris1);
}
.modal-body h5{
  font-family:'DM Serif Display',serif;font-size:1.05rem;
  color:var(--verde1);margin:20px 0 8px;
}
.modal-body h5:first-child{margin-top:0;}
.modal-body p{margin-bottom:12px;}
.modal-body ul{margin:8px 0 12px 18px;}
.modal-body ul li{margin-bottom:4px;}

/* ─── FAMILIA TUNKI ─── */
.tunki-cards{
  display:grid;grid-template-columns:1fr 1fr;gap:24px;
}
.tunki-card{
  background:rgba(255,255,255,0.1);
  border:1px solid rgba(255,255,255,0.18);
  border-radius:16px;overflow:hidden;
  display:flex;flex-direction:column;
  transition:transform .3s,box-shadow .3s;
}
.tunki-card:hover{
  transform:translateY(-4px);
  box-shadow:0 16px 48px rgba(0,0,0,0.25);
}

/* imagen superior */
.tunki-card-img{
  width:100%;aspect-ratio:16/9;
  overflow:hidden;position:relative;
  background:rgba(0,0,0,0.25);flex-shrink:0;
}
.tunki-card-img img{
  width:100%;height:100%;object-fit:cover;
  display:block;transition:transform .5s ease;
}
.tunki-card:hover .tunki-card-img img{transform:scale(1.05);}
.tunki-card-img-ph{
  position:absolute;inset:0;
  display:flex;align-items:center;justify-content:center;
  font-size:4rem;opacity:.4;
}

/* cuerpo */
.tunki-card-body{
  padding:24px;display:flex;flex-direction:column;flex:1;
}
.tunki-card-tag{
  font-family:'DM Sans',sans-serif;font-size:.58rem;font-weight:700;
  letter-spacing:.3em;text-transform:uppercase;
  color:var(--dorado3);margin-bottom:8px;
}
.tunki-card-name{
  font-family:'DM Serif Display',serif;font-size:1.35rem;
  color:#fff;margin-bottom:10px;line-height:1.2;
}
.tunki-card-desc{
  font-size:.9rem;color:rgba(255,255,255,.72);
  line-height:1.65;margin-bottom:20px;flex:1;
}

/* botón con link */
.tunki-card-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:11px 22px;border-radius:8px;
  background:rgba(255,255,255,0.15);
  border:1.5px solid rgba(255,255,255,0.4);
  color:#fff;text-decoration:none;
  font-family:'DM Sans',sans-serif;font-size:.7rem;font-weight:700;
  letter-spacing:.15em;text-transform:uppercase;
  transition:all .3s;align-self:flex-start;
}
.tunki-card-btn:hover{
  background:rgba(255,255,255,0.25);
  border-color:#fff;
  transform:translateY(-1px);
}

/* ─── WHATSAPP CONTACT BOX ─── */
.wa-contact-box{
  background:rgba(255,255,255,0.85);
  border:1px solid rgba(44,95,62,0.12);
  border-radius:14px;padding:28px;
  box-shadow:0 4px 20px rgba(44,95,62,0.08);
}
.wa-contact-top{
  display:flex;align-items:center;gap:14px;margin-bottom:14px;
}
.wa-contact-icon{
  width:52px;height:52px;flex-shrink:0;border-radius:12px;
  background:#e8f8ee;border:1px solid #c3ead0;
  display:flex;align-items:center;justify-content:center;
}
.wa-contact-title{
  font-family:'DM Serif Display',serif;font-size:1.15rem;
  color:var(--verde1);font-weight:700;line-height:1.2;
}
.wa-contact-sub{font-size:.85rem;color:var(--gris2);margin-top:2px;}
.wa-contact-desc{font-size:.92rem;color:var(--gris1);line-height:1.65;margin-bottom:20px;}
.wa-contact-btn{
  display:flex;align-items:center;justify-content:center;gap:10px;
  width:100%;padding:14px;border-radius:10px;
  background:#25D366;color:#fff;text-decoration:none;
  font-family:'DM Sans',sans-serif;font-size:.75rem;font-weight:700;
  letter-spacing:.18em;text-transform:uppercase;
  transition:all .3s;
  box-shadow:0 4px 16px rgba(37,211,102,0.3);
}
.wa-contact-btn:hover{background:#1ebe5a;transform:translateY(-1px);box-shadow:0 6px 24px rgba(37,211,102,0.45);}
.wa-contact-hours{
  margin-top:12px;text-align:center;
  font-size:.78rem;color:var(--gris2);font-style:italic;
}

/* ─── GOOGLE MAPS BOX ─── */
.mapa-box{
  background:rgba(255,255,255,0.85);
  border:1px solid rgba(44,95,62,0.12);
  border-radius:14px;overflow:hidden;
  box-shadow:0 4px 20px rgba(44,95,62,0.08);
}
.mapa-header{
  display:flex;align-items:center;gap:12px;
  padding:16px 20px;
  border-bottom:1px solid rgba(44,95,62,0.1);
  background:rgba(44,95,62,0.04);
}
.mapa-title{
  font-family:'DM Sans',sans-serif;font-size:.85rem;font-weight:700;
  color:var(--verde1);
}
.mapa-sub{font-size:.78rem;color:var(--gris2);margin-top:1px;}
.mapa-frame{height:260px;overflow:hidden;}
.mapa-link{
  display:flex;align-items:center;justify-content:center;gap:6px;
  padding:12px;
  font-family:'DM Sans',sans-serif;font-size:.68rem;font-weight:700;
  letter-spacing:.12em;text-transform:uppercase;
  color:var(--verde2);text-decoration:none;
  transition:color .25s;background:rgba(44,95,62,0.04);
  border-top:1px solid rgba(44,95,62,0.1);
}
.mapa-link:hover{color:var(--verde1);}

/* ─── RESPONSIVE ─── */
@media(max-width:960px){
  #navbar{padding:0;}
  .nav-inner{padding:0 22px;}
  .nav-links,.nav-cta{display:none;}
  .hamburger{display:flex;}
  .sec{padding:68px 0;}
  .nos-grid{grid-template-columns:1fr;gap:40px;padding:0 22px !important;}
  .carta-wrap{padding:0 22px !important;}
  .con-grid{grid-template-columns:1fr;gap:36px;}
  [style*="max-width:1300px"]{padding-left:22px !important;padding-right:22px !important;}
  .beb-cols{grid-template-columns:1fr;}
  .dish-featured{grid-template-columns:1fr;}
  .frow{grid-template-columns:1fr;}
  footer{padding:20px 22px;}
  .mv-grid{grid-template-columns:1fr;}
  .carta-tabbar{display:none;}
  .carta-select-wrap{display:block;}
  .dish-feat-body{padding:20px;}
  .dish-feat-name{font-size:1.25rem;}
  .tunki-cards{grid-template-columns:1fr;}
  .mapa-frame{height:220px;}
  /* todas las tarjetas: misma escala en tablet */
  .dish-featured,
  .dish-card{grid-template-columns:1fr 1fr;height:260px;}
  .dish-feat-img,
  .dish-card-img{height:100%;}
}
@media(max-width:700px){
  .hero-content{padding:0 22px;}
  .hero-frase{max-width:100%;}
}
/* ── MÓVIL ≤640px — imagen arriba, texto abajo ── */
@media(max-width:640px){
  .dish-card,
  .dish-featured{
    grid-template-columns:1fr;
    height:auto;min-height:auto;
  }
  .dish-card-img,
  .dish-feat-img{height:220px;min-height:220px;width:100%;}
  .dish-card-body,
  .dish-feat-body{padding:20px 20px;}
  .dish-card-name,
  .dish-feat-name{font-size:1.3rem;}
  .cat-top{flex-direction:column;align-items:flex-start;gap:8px;}
  .tunki-card{flex-direction:column;}
}