/* ════════════════════════════════════════════════════════════
   CANAIMA BAR · Castellón · Cocina venezolana & tapas
   Sistema de diseño · Nacho Studio Digital
   Paleta: Azul Canaima + amarillo guacamayo + rojo fachada
   ════════════════════════════════════════════════════════════ */

:root{
  --azul:#1F2C7A; --azul-deep:#141E57; --azul-soft:#E7E9F5;
  --amarillo:#F6B72B; --amarillo-deep:#E0A013;
  --rojo:#D23A2E; --rojo-deep:#B12B22;
  --crema:#FBF6EC; --bg-pure:#FEFCF7;
  --tinta:#1A1C2B; --verde:#1F8A6D; --muted:#5A5E72; --border:#E8E2D2;
  --white:#ffffff;

  --azul-rgb:31,44,122; --amarillo-rgb:246,183,43; --tinta-rgb:26,28,43;

  --display:'Bricolage Grotesque', system-ui, sans-serif;
  --sans:'DM Sans', system-ui, -apple-system, sans-serif;

  --radius:14px; --radius-sm:8px; --radius-lg:24px;
  --shadow-sm:0 2px 10px rgba(var(--tinta-rgb), .07);
  --shadow:0 14px 34px rgba(var(--tinta-rgb), .12);
  --shadow-lg:0 26px 60px rgba(var(--tinta-rgb), .18);
  --ease:.35s cubic-bezier(.2,.7,.2,1);
  --ease-out:cubic-bezier(.23,1,.32,1);

  --header-h:74px;
  --maxw:1200px;
}

*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; scroll-padding-top:calc(var(--header-h) + 14px); -webkit-text-size-adjust:100%; }
body{ font-family:var(--sans); font-size:16px; line-height:1.6; color:var(--tinta); background:var(--crema); overflow-x:hidden; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }
img,video,svg{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
ul{ list-style:none; }
button{ font-family:inherit; cursor:pointer; border:none; background:none; }

h1,h2,h3,h4{ font-family:var(--display); font-weight:800; line-height:1.08; color:var(--azul); letter-spacing:-.02em; }

/* ---- Layout helpers ---- */
.wrap{ max-width:var(--maxw); margin:0 auto; padding:0 5%; }
.section{ padding:4.5rem 0; }
.section-azul{ background:var(--azul); color:var(--crema); }
.section-azul h1,.section-azul h2,.section-azul h3{ color:var(--crema); }
.section-crema2{ background:var(--bg-pure); }
.section-head{ max-width:680px; margin:0 auto 2.6rem; text-align:center; }
.eyebrow{ display:inline-block; font-family:var(--sans); font-size:.68rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase;
  color:var(--azul); background:rgba(var(--amarillo-rgb), .22); padding:.4rem .85rem; border-radius:100px; margin-bottom:1rem; }
.section-azul .eyebrow{ color:var(--amarillo); background:rgba(255,255,255,.12); }
.section-title{ font-size:clamp(2rem,4.8vw,3.2rem); margin-bottom:1rem; }
.section-sub{ font-size:1.05rem; color:var(--muted); line-height:1.7; }
.section-azul .section-sub{ color:rgba(251,246,236,.85); }

/* ---- Botones ---- */
.btn{ display:inline-flex; align-items:center; justify-content:center; gap:.6rem; padding:.95rem 1.7rem; border-radius:100px;
  font-family:var(--sans); font-size:.95rem; font-weight:700; letter-spacing:.01em; white-space:nowrap;
  transition:transform var(--ease), background var(--ease), box-shadow var(--ease), color var(--ease), border-color var(--ease); }
.btn:active{ transform:scale(.97); }
.btn-primary{ background:var(--azul); color:var(--crema); box-shadow:0 10px 26px rgba(var(--azul-rgb), .30); }
.btn-primary:hover{ background:var(--azul-deep); transform:translateY(-2px); box-shadow:0 14px 32px rgba(var(--azul-rgb), .40); }
.btn-amarillo{ background:var(--amarillo); color:var(--azul-deep); box-shadow:0 10px 26px rgba(var(--amarillo-rgb), .35); }
.btn-amarillo:hover{ background:var(--amarillo-deep); transform:translateY(-2px); }
.btn-outline{ background:transparent; color:var(--azul); border:1.5px solid rgba(var(--azul-rgb),.3); }
.btn-outline:hover{ border-color:var(--azul); transform:translateY(-2px); }
.btn-wa{ background:#25d366; color:#fff; box-shadow:0 8px 24px rgba(37,211,102,.3); }
.btn-wa:hover{ background:#1ebe5b; transform:translateY(-2px); }
.btn-lg{ padding:1.1rem 2.2rem; font-size:1rem; }

/* ---- Topbar ---- */
.topbar{ background:var(--azul-deep); color:rgba(251,246,236,.85); font-size:.8rem; }
.topbar-inner{ max-width:var(--maxw); margin:0 auto; padding:.5rem 5%; display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.topbar-left,.topbar-right{ display:flex; align-items:center; gap:1.4rem; }
.topbar-item{ display:inline-flex; align-items:center; gap:.4rem; transition:color var(--ease); }
.topbar-item i{ color:var(--amarillo); }
.topbar-item:hover{ color:#fff; }
.topbar-social:hover{ color:var(--amarillo); }

/* ---- Header ---- */
#header{ position:sticky; top:0; z-index:800; height:var(--header-h); background:rgba(251,246,236,.92);
  backdrop-filter:blur(14px) saturate(140%); -webkit-backdrop-filter:blur(14px) saturate(140%);
  border-bottom:1px solid var(--border); transition:transform var(--ease), box-shadow var(--ease); will-change:transform; }
#header.compact{ box-shadow:var(--shadow-sm); }
@media (max-width:768px){ #header.header-hidden{ transform:translateY(-100%); } }
.header-inner{ max-width:var(--maxw); margin:0 auto; padding:0 5%; height:100%; display:flex; align-items:center; justify-content:space-between; gap:1.5rem; }
.logo{ display:inline-flex; align-items:center; gap:.6rem; }
.logo-name{ font-family:var(--display); font-size:1.5rem; font-weight:800; color:var(--azul); letter-spacing:-.03em; line-height:1; }
.logo-name .bar{ font-size:.6rem; letter-spacing:.28em; color:var(--rojo); display:inline-block; vertical-align:super; margin-left:2px; }
.main-nav{ display:flex; align-items:center; gap:1.7rem; }
.main-nav a{ font-size:.92rem; font-weight:600; color:var(--tinta); transition:color var(--ease); position:relative; }
.main-nav a:not(.nav-cta)::after{ content:''; position:absolute; left:0; bottom:-6px; width:0; height:2px; background:var(--amarillo); transition:width var(--ease); }
.main-nav a:not(.nav-cta):hover::after{ width:100%; }
.main-nav a:not(.nav-cta):hover{ color:var(--azul); }
.nav-cta{ background:var(--azul); color:var(--crema) !important; padding:.6rem 1.3rem; border-radius:100px; font-weight:700; transition:background var(--ease), transform var(--ease); }
.nav-cta:hover{ background:var(--azul-deep); transform:translateY(-1px); }
.menu-btn{ display:none; width:44px; height:44px; border-radius:12px; align-items:center; justify-content:center;
  font-size:1.15rem; color:var(--azul); background:rgba(var(--azul-rgb),.07); border:1px solid rgba(var(--azul-rgb),.12);
  transition:background var(--ease), border-color var(--ease), transform var(--ease); }
.menu-btn:hover{ background:rgba(var(--azul-rgb),.13); border-color:rgba(var(--azul-rgb),.22); }
.menu-btn:active{ transform:scale(.9); }

/* ---- Drawer móvil ---- */
.drawer{ position:fixed; inset:0; z-index:900; pointer-events:none; }
.drawer-backdrop{ position:absolute; inset:0; background:rgba(20,30,87,.5); backdrop-filter:blur(5px); opacity:0; transition:opacity var(--ease); }
.drawer-panel{ position:absolute; top:0; right:0; bottom:0; width:min(86vw,360px); background:var(--bg-pure); box-shadow:var(--shadow-lg);
  transform:translateX(100%); transition:transform var(--ease); display:flex; flex-direction:column; padding:1.5rem 1.4rem calc(1.4rem + env(safe-area-inset-bottom)); overflow-y:auto; }
.drawer-panel::before{ content:''; position:absolute; top:0; left:0; right:0; height:4px; background:linear-gradient(90deg, var(--amarillo), var(--rojo)); }
.drawer.open{ pointer-events:all; }
.drawer.open .drawer-backdrop{ opacity:1; }
.drawer.open .drawer-panel{ transform:translateX(0); }
.drawer-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:.9rem; }
.drawer-close{ width:42px; height:42px; border-radius:50%; display:grid; place-items:center; font-size:1.1rem; color:var(--azul);
  background:rgba(var(--azul-rgb),.07); transition:background var(--ease), transform var(--ease); }
.drawer-close:hover{ background:rgba(var(--azul-rgb),.14); }
.drawer-close:active{ transform:scale(.9) rotate(90deg); }
.drawer-tagline{ display:flex; align-items:center; gap:.5rem; font-size:.74rem; font-weight:700; letter-spacing:.04em; text-transform:uppercase;
  color:rgba(var(--tinta-rgb),.55); margin:0 .2rem 1.1rem; padding-bottom:1.1rem; border-bottom:1px solid var(--border); }
.drawer-tagline i{ color:var(--amarillo-deep); }
.drawer-nav{ display:flex; flex-direction:column; gap:.3rem; }
.drawer-nav a{ display:flex; align-items:center; gap:.85rem; padding:.7rem .75rem; border-radius:var(--radius); font-weight:600; color:var(--tinta);
  opacity:0; transform:translateX(18px); transition:background var(--ease), transform var(--ease), opacity .4s var(--ease-out); }
.drawer.open .drawer-nav a{ opacity:1; transform:translateX(0); }
.drawer.open .drawer-nav a:nth-child(1){ transition-delay:.06s; }
.drawer.open .drawer-nav a:nth-child(2){ transition-delay:.11s; }
.drawer.open .drawer-nav a:nth-child(3){ transition-delay:.16s; }
.drawer.open .drawer-nav a:nth-child(4){ transition-delay:.21s; }
.drawer.open .drawer-nav a:nth-child(5){ transition-delay:.26s; }
.drawer-nav a .dn-ico{ width:40px; height:40px; flex:none; border-radius:12px; display:grid; place-items:center; font-size:.95rem;
  background:rgba(var(--azul-rgb),.08); color:var(--azul); transition:background var(--ease), color var(--ease); }
.drawer-nav a .dn-txt{ flex:1; }
.drawer-nav a .dn-go{ font-size:.78rem; color:rgba(var(--azul-rgb),.32); transition:transform var(--ease), color var(--ease); }
.drawer-nav a:hover{ background:var(--azul-soft); }
.drawer-nav a:hover .dn-ico{ background:var(--amarillo); color:var(--azul-deep); }
.drawer-nav a:hover .dn-go{ transform:translateX(3px); color:var(--azul); }
.drawer-nav a:active{ transform:scale(.98); }
.drawer-foot{ margin-top:auto; padding-top:1.3rem; border-top:1px solid var(--border); display:flex; flex-direction:column; gap:.6rem; }
.drawer-foot .btn{ width:100%; }
.drawer-rating{ display:flex; align-items:center; justify-content:center; gap:.45rem; margin-top:.4rem; font-size:.8rem; color:rgba(var(--tinta-rgb),.6); }
.drawer-rating .stars{ color:var(--amarillo); letter-spacing:.5px; }
.drawer-rating strong{ color:var(--azul); }
.drawer-social{ display:flex; justify-content:center; gap:.6rem; margin-top:.5rem; }
.drawer-social a{ width:42px; height:42px; border-radius:50%; display:grid; place-items:center; font-size:1rem; color:var(--azul);
  background:rgba(var(--azul-rgb),.07); transition:background var(--ease), color var(--ease), transform var(--ease); }
.drawer-social a:hover{ background:var(--amarillo); color:var(--azul-deep); transform:translateY(-2px); }

/* ---- Hero ---- */
.hero{ position:relative; isolation:isolate; overflow:hidden; padding:4rem 0 3.75rem; background:var(--azul-deep); }
.hero::before{ content:''; position:absolute; inset:0; z-index:-2; background-image:url('assets/hero-tapas.jpg');
  background-image:-webkit-image-set(url('assets/hero-tapas.webp') type('image/webp'), url('assets/hero-tapas.jpg') type('image/jpeg'));
  background-image:image-set(url('assets/hero-tapas.webp') type('image/webp'), url('assets/hero-tapas.jpg') type('image/jpeg'));
  background-size:cover; background-position:center; }
.hero::after{ content:''; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg, rgba(20,30,87,.86) 0%, rgba(31,44,122,.78) 60%, rgba(20,30,87,.9) 100%); }
.hero-inner{ max-width:760px; margin:0 auto; padding:0 5%; text-align:center; color:var(--crema); }
.hero h1{ color:var(--crema); font-size:clamp(2.6rem,6.4vw,4.4rem); line-height:1.02; margin-bottom:1.1rem; }
.hero h1 .accent{ color:var(--amarillo); }
.hero-lead{ font-size:1.18rem; color:rgba(251,246,236,.92); line-height:1.65; margin:0 auto 1.8rem; max-width:560px; }
.hero-ctas{ display:flex; gap:.8rem; flex-wrap:wrap; justify-content:center; margin-bottom:1.8rem; }
.hero-rating{ display:inline-flex; align-items:center; gap:.7rem; background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.2); padding:.55rem 1.1rem; border-radius:100px; backdrop-filter:blur(4px); }
.hero-rating .stars{ color:var(--amarillo); letter-spacing:1px; font-size:.95rem; }
.hero-rating strong{ font-size:.95rem; color:#fff; }
.hero-rating span{ font-size:.82rem; color:rgba(251,246,236,.8); }

/* ---- Banda de sellos (cinta en movimiento) ---- */
.trust-band{ position:relative; isolation:isolate; overflow:hidden; background:var(--azul-deep); padding:1.5rem 0; }
.trust-band::before{ content:''; position:absolute; inset:0; z-index:-1;
  background:
    radial-gradient(circle at 14% 18%, rgba(var(--amarillo-rgb), .22), transparent 42%),
    radial-gradient(circle at 88% 84%, rgba(210,58,46,.20), transparent 44%); }
.marquee{ overflow:hidden;
  -webkit-mask:linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent);
  mask:linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent); }
.marquee-track{ display:flex; width:max-content; align-items:center; animation:marquee 34s linear infinite; }
.marquee-track:hover{ animation-play-state:paused; }
@keyframes marquee{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }
.mq-item{ display:flex; flex-direction:column; align-items:center; text-align:center; gap:.6rem; padding:0 2.6rem; white-space:nowrap; position:relative; }
.mq-item::after{ content:''; position:absolute; right:0; top:50%; transform:translateY(-50%); height:54px; width:1px; background:rgba(251,246,236,.16); }
.mq-ico{ width:50px; height:50px; border-radius:50%; background:var(--amarillo); color:var(--azul-deep); display:grid; place-items:center;
  font-size:1.3rem; flex:none; box-shadow:0 6px 16px rgba(0,0,0,.25), inset 0 1px 1px rgba(255,255,255,.4); }
.mq-txt{ display:flex; flex-direction:column; align-items:center; line-height:1.2; }
.mq-txt strong{ font-family:var(--display); font-weight:800; font-size:1.02rem; letter-spacing:.05em; text-transform:uppercase; color:#fff; }
.mq-txt em{ font-style:normal; font-size:.68rem; font-weight:600; text-transform:uppercase; letter-spacing:.16em; color:rgba(251,246,236,.6); margin-top:.15rem; }

/* ---- Carta destacados ---- */
.chips-marquee{ overflow:hidden; margin-bottom:2rem;
  -webkit-mask:linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
  mask:linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); }
.chips-track{ display:flex; width:max-content; gap:.7rem; align-items:center; animation:marquee 26s linear infinite reverse; }
.chips-track:hover{ animation-play-state:paused; }
.dish-chip{ flex:none; white-space:nowrap; background:var(--bg-pure); border:1px solid var(--border); border-radius:100px; padding:.5rem 1.1rem; font-size:.85rem; font-weight:600; color:var(--azul); }
.dish-chip i{ color:var(--amarillo-deep); margin-right:.4rem; }
.dishes-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:1.5rem; }
.dish-card{ position:relative; min-height:300px; border-radius:var(--radius); overflow:hidden; display:flex; flex-direction:column; justify-content:flex-end;
  padding:1.5rem; color:#fff; box-shadow:var(--shadow-sm); transition:transform var(--ease), box-shadow var(--ease); }
.dish-card:hover{ transform:translateY(-6px); box-shadow:var(--shadow); }
.dish-card .card-bg{ position:absolute; inset:0; z-index:0; }
.dish-card .card-bg img{ width:100%; height:100%; object-fit:cover; transition:transform .6s var(--ease-out); }
.dish-card:hover .card-bg img{ transform:scale(1.06); }
.dish-card::after{ content:''; position:absolute; inset:0; z-index:1; background:linear-gradient(180deg, rgba(20,30,87,.1) 0%, rgba(20,30,87,.55) 55%, rgba(20,30,87,.9) 100%); }
.dish-card>*{ position:relative; z-index:2; }
.dish-card .tag{ position:absolute; top:1rem; left:1rem; background:var(--rojo); color:#fff; font-size:.7rem; font-weight:700; letter-spacing:.05em; text-transform:uppercase; padding:.3rem .7rem; border-radius:100px; }
.dish-card h3{ color:#fff; font-size:1.4rem; margin-bottom:.3rem; }
.dish-card p{ font-size:.88rem; color:rgba(255,255,255,.85); line-height:1.5; margin-bottom:.7rem; }
.dish-card .price{ font-family:var(--display); font-weight:800; font-size:1.15rem; color:var(--amarillo); }
.carta-cta{ text-align:center; margin-top:2.5rem; }
/* Sección carta compacta */
#carta{ padding:3.4rem 0; }
#carta .section-head{ margin-bottom:1.7rem; }
#carta .section-sub{ font-size:1rem; }
#carta .chips-marquee{ margin-bottom:1.4rem; }

/* Cards de plato destacado (sin foto, estilo menú) */
.feat-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:1rem; }
.feat-card{ position:relative; background:var(--bg-pure); border:1px solid var(--border); border-radius:var(--radius); padding:1.3rem 1.35rem; transition:transform var(--ease), box-shadow var(--ease), border-color var(--ease); }
.feat-card:hover{ transform:translateY(-5px); box-shadow:var(--shadow); border-color:rgba(var(--amarillo-rgb),.5); }
.feat-card .star{ position:absolute; top:1rem; right:1rem; font-size:.66rem; font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:var(--rojo); }
.feat-card h3{ font-size:1.12rem; margin-bottom:.35rem; padding-right:2.6rem; }
.feat-card p{ font-size:.82rem; color:var(--muted); line-height:1.45; margin-bottom:.65rem; }
.feat-card .price{ font-family:var(--display); font-weight:800; font-size:1.15rem; color:var(--amarillo-deep); }

/* Banner carta completa con foto */
.carta-banner{ position:relative; isolation:isolate; overflow:hidden; border-radius:var(--radius-lg); margin-top:1.8rem; padding:2.2rem 1.8rem; text-align:center; color:#fff; box-shadow:var(--shadow); }
.carta-banner::before{ content:''; position:absolute; inset:0; z-index:-2; background:url('assets/hero-tapas.jpg') center/cover; }
.carta-banner::after{ content:''; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg, rgba(20,30,87,.78), rgba(31,44,122,.88)); }
.carta-banner h3{ color:#fff; font-size:clamp(1.5rem,3.5vw,2.1rem); margin-bottom:.6rem; }
.carta-banner p{ color:rgba(251,246,236,.9); max-width:480px; margin:0 auto 1.5rem; }

/* ---- Nosotros (split) ---- */
.split{ display:grid; grid-template-columns:1fr 1fr; gap:3.5rem; align-items:center; }
.split-media{ aspect-ratio:4/3; border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow); background:var(--azul-soft); }
.split-media img{ width:100%; height:100%; object-fit:cover; }
.split-content h2{ font-size:clamp(1.9rem,4vw,2.7rem); margin-bottom:1.2rem; }
.split-content p{ color:var(--muted); margin-bottom:1rem; line-height:1.75; }
.split-creds{ display:flex; flex-wrap:wrap; gap:.7rem; margin:1.4rem 0; }
.split-cred{ display:inline-flex; align-items:center; gap:.5rem; font-size:.9rem; font-weight:600; color:var(--azul); background:var(--azul-soft); padding:.45rem .9rem; border-radius:100px; }
.split-cred i{ color:var(--amarillo-deep); }

/* ---- Nosotros con foto de fondo ---- */
.about{ position:relative; isolation:isolate; overflow:hidden; padding:5rem 0; color:var(--crema); text-align:center; }
.about::before{ content:''; position:absolute; inset:0; z-index:-2;
  background-image:url('assets/historia-venezuela.jpg');
  background-image:-webkit-image-set(url('assets/historia-venezuela.webp') type('image/webp'), url('assets/historia-venezuela.jpg') type('image/jpeg'));
  background-image:image-set(url('assets/historia-venezuela.webp') type('image/webp'), url('assets/historia-venezuela.jpg') type('image/jpeg'));
  background-size:cover; background-position:center; }
.about::after{ content:''; position:absolute; inset:0; z-index:-1;
  background:linear-gradient(180deg, rgba(20,30,87,.86) 0%, rgba(31,44,122,.8) 100%); }
.about-inner{ max-width:720px; margin:0 auto; padding:0 5%; }
.about .eyebrow{ background:rgba(255,255,255,.14); color:var(--amarillo); }
.about h2{ color:var(--crema); font-size:clamp(1.9rem,4.5vw,2.8rem); margin-bottom:1.2rem; }
.about p{ color:rgba(251,246,236,.9); margin-bottom:1rem; line-height:1.7; }
.about-stats{ display:flex; justify-content:center; margin:1.9rem auto; max-width:540px; }
.about-stat{ flex:1; display:flex; flex-direction:column; align-items:center; gap:.1rem; position:relative; padding:0 .6rem; }
.about-stat:not(:last-child)::after{ content:''; position:absolute; right:0; top:14%; height:72%; width:1px; background:rgba(251,246,236,.18); }
.about-stat i{ color:var(--amarillo); font-size:1.5rem; margin-bottom:.4rem; }
.about-stat strong{ font-family:var(--display); font-weight:800; font-size:1.15rem; color:#fff; line-height:1.1; }
.about-stat span{ font-size:.72rem; color:rgba(251,246,236,.72); text-transform:uppercase; letter-spacing:.1em; }
.about .btn{ margin-top:.4rem; }

/* ---- Galería ---- */
.gallery{ display:grid; grid-template-columns:repeat(2,1fr); gap:1rem; max-width:900px; margin:0 auto; }
.gallery-item{ aspect-ratio:4/3; border-radius:var(--radius); overflow:hidden; background:var(--azul-soft); position:relative; }
.gallery-item img{ width:100%; height:100%; object-fit:cover; transition:transform .6s var(--ease-out); }
.gallery-item:hover img{ transform:scale(1.05); }
.gallery-item.gal-feature{ grid-row:span 2; aspect-ratio:auto; }
.gallery-ph{ display:grid; place-items:center; height:100%; color:var(--azul); opacity:.5; font-size:2rem; }

/* ---- Ubicación / mapa CTA ---- */
.map-cta{ display:flex; align-items:center; gap:1.5rem; background:var(--bg-pure); border:1px solid var(--border); border-radius:var(--radius); padding:1.6rem 2rem; box-shadow:var(--shadow-sm); transition:transform var(--ease), border-color var(--ease), box-shadow var(--ease); }
.map-cta:hover{ transform:translateY(-3px); border-color:var(--amarillo); box-shadow:var(--shadow); }
.map-cta-icon{ width:60px; height:60px; flex-shrink:0; border-radius:50%; background:var(--azul); color:var(--amarillo); display:grid; place-items:center; font-size:1.4rem; }
.map-cta-body{ flex:1; min-width:0; }
.map-cta-body strong{ display:block; font-family:var(--display); font-size:1.25rem; color:var(--azul); }
.map-cta-body span{ font-size:.9rem; color:var(--muted); }
.map-cta-action{ flex-shrink:0; display:inline-flex; align-items:center; gap:.5rem; padding:.8rem 1.3rem; border-radius:100px; background:var(--azul-soft); color:var(--azul); font-size:.82rem; font-weight:700; letter-spacing:.04em; transition:background var(--ease), color var(--ease); }
.map-cta:hover .map-cta-action{ background:var(--azul); color:var(--amarillo); }

/* ---- Reservas / contacto ---- */
.contact-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:.9rem; max-width:840px; margin:0 auto; }
.contact-card{ display:flex; align-items:center; gap:.9rem; background:var(--bg-pure); border:1px solid var(--border);
  border-radius:100px; padding:.75rem 1.1rem; transition:transform var(--ease), box-shadow var(--ease), border-color var(--ease); }
.contact-card:hover{ transform:translateY(-3px); box-shadow:var(--shadow); border-color:rgba(var(--azul-rgb),.35); }
.contact-ico{ width:44px; height:44px; flex:none; border-radius:50%; background:var(--azul-soft); color:var(--azul);
  display:grid; place-items:center; font-size:1.15rem; }
.contact-card-wa .contact-ico{ background:rgba(37,211,102,.16); color:#1ebe5b; }
.contact-txt{ display:flex; flex-direction:column; line-height:1.2; flex:1; min-width:0; text-align:left; }
.contact-txt strong{ font-size:.98rem; color:var(--azul); }
.contact-txt span{ font-size:.8rem; color:var(--muted); }
.contact-go{ color:var(--amarillo-deep); font-size:.9rem; flex:none; transition:transform var(--ease); }
.contact-card:hover .contact-go{ transform:translateX(3px); }

/* ---- CTA final ---- */
.cta-final{ position:relative; isolation:isolate; overflow:hidden; display:flex; align-items:center; min-height:clamp(360px,52vh,560px); background:var(--azul-deep); color:var(--crema); text-align:center; }
.cta-final .wrap{ width:100%; }
.cta-final::before{ content:''; position:absolute; inset:0; z-index:-2;
  background-image:url('assets/venezuela-cta.jpg');
  background-image:-webkit-image-set(url('assets/venezuela-cta.webp') type('image/webp'), url('assets/venezuela-cta.jpg') type('image/jpeg'));
  background-image:image-set(url('assets/venezuela-cta.webp') type('image/webp'), url('assets/venezuela-cta.jpg') type('image/jpeg'));
  background-size:cover; background-position:center; }
.cta-final::after{ content:''; position:absolute; inset:0; z-index:-1;
  background:linear-gradient(180deg, rgba(20,30,87,.40) 0%, rgba(31,44,122,.48) 55%, rgba(20,30,87,.66) 100%); }
.cta-final h2, .cta-final p{ text-shadow:0 2px 18px rgba(13,20,60,.6), 0 1px 3px rgba(13,20,60,.45); }
.cta-final h2{ color:var(--crema); font-size:clamp(2rem,4.5vw,3rem); margin-bottom:1rem; }
.cta-final p{ color:rgba(251,246,236,.88); max-width:560px; margin:0 auto 2rem; font-size:1.05rem; }

/* ---- Footer ---- */
footer{ background:var(--azul-deep); color:rgba(251,246,236,.8); padding:3.5rem 0 0; }
.footer-grid{ max-width:var(--maxw); margin:0 auto; padding:0 5%; display:grid; grid-template-columns:1.4fr 1fr 1.2fr; gap:2.5rem; }
.footer-col h4{ color:var(--amarillo); font-family:var(--sans); font-size:.8rem; letter-spacing:.14em; text-transform:uppercase; margin-bottom:1.1rem; font-weight:700; }
.footer-col a,.footer-col p{ font-size:.9rem; color:rgba(251,246,236,.75); transition:color var(--ease); line-height:1.7; }
.footer-col a:hover{ color:var(--amarillo); }
.footer-brand .logo-name{ color:var(--crema); }
.footer-brand p{ margin-top:1rem; }
.footer-social{ display:flex; gap:.7rem; margin-top:1.2rem; }
.footer-social a{ width:38px; height:38px; border-radius:50%; background:rgba(255,255,255,.1); color:var(--crema); display:grid; place-items:center; transition:background var(--ease), transform var(--ease); }
.footer-social a:hover{ background:var(--amarillo); color:var(--azul-deep); transform:translateY(-2px); }
.footer-contact-item{ display:flex; align-items:flex-start; gap:.6rem; margin-bottom:.7rem; font-size:.9rem; }
.footer-contact-item i{ color:var(--amarillo); margin-top:.2rem; }
.footer-bottom{ margin-top:3rem; padding:1.3rem 5%; border-top:1px solid rgba(255,255,255,.12); display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap; max-width:var(--maxw); margin-left:auto; margin-right:auto; font-size:.8rem; color:rgba(251,246,236,.6); }
.footer-bottom a{ color:rgba(251,246,236,.6); }
.footer-bottom a:hover{ color:var(--amarillo); }
.footer-rating{ display:inline-flex; align-items:center; gap:.45rem; margin-top:1rem; font-size:.88rem; font-weight:700; color:var(--azul-deep); background:var(--amarillo); padding:.4rem .9rem; border-radius:100px; }
.footer-rating i{ color:var(--azul-deep); }
.footer-credit-bar{ background:rgba(0,0,0,.22); text-align:center; padding:.95rem 5%; font-size:.78rem; color:rgba(251,246,236,.62); max-width:none; }
.footer-credit-bar a{ color:var(--amarillo); font-weight:600; }
.footer-credit-bar a:hover{ text-decoration:underline; }

/* ---- WhatsApp FAB + sticky móvil ---- */
.wa-fab{ position:fixed; bottom:22px; right:22px; z-index:400; width:56px; height:56px; border-radius:50%; background:#25d366; color:#fff; display:grid; place-items:center; font-size:1.6rem; box-shadow:0 8px 28px rgba(37,211,102,.4); transition:transform var(--ease), bottom var(--ease); animation:waPulse 2.8s ease-in-out infinite; }
.wa-fab:hover{ transform:scale(1.08); }
@keyframes waPulse{ 0%,100%{ box-shadow:0 8px 28px rgba(37,211,102,.4), 0 0 0 0 rgba(37,211,102,.5); } 50%{ box-shadow:0 8px 28px rgba(37,211,102,.4), 0 0 0 14px rgba(37,211,102,0); } }
.mobile-sticky{ position:fixed; bottom:0; left:0; right:0; z-index:399; display:none; background:var(--bg-pure); border-top:1px solid var(--border); box-shadow:0 -6px 24px rgba(var(--tinta-rgb),.12); padding:.7rem 4%; padding-bottom:calc(.7rem + env(safe-area-inset-bottom)); gap:.6rem; transform:translateY(100%); transition:transform var(--ease); }
.mobile-sticky.visible{ transform:translateY(0); }
.mobile-sticky .btn{ flex:1; }

/* ---- Modales legales ---- */
.legal-modal{ position:fixed; inset:0; z-index:1000; display:flex; align-items:center; justify-content:center; padding:1.5rem; opacity:0; pointer-events:none; transition:opacity var(--ease); }
.legal-modal.open{ opacity:1; pointer-events:all; }
.legal-overlay{ position:absolute; inset:0; background:rgba(20,30,87,.55); backdrop-filter:blur(6px); }
.legal-box{ position:relative; width:100%; max-width:720px; max-height:85vh; overflow-y:auto; background:var(--crema); border-radius:var(--radius); padding:2.5rem; box-shadow:var(--shadow-lg); }
.legal-box h2{ font-size:1.6rem; margin-bottom:1.2rem; }
.legal-box h3{ font-size:1.1rem; margin:1.4rem 0 .5rem; color:var(--azul); }
.legal-box p,.legal-box li{ font-size:.9rem; color:var(--muted); line-height:1.7; margin-bottom:.7rem; }
.legal-box ul{ padding-left:1.2rem; list-style:disc; }
.legal-close{ position:absolute; top:1rem; right:1rem; width:40px; height:40px; border-radius:50%; background:var(--azul-soft); color:var(--azul); display:grid; place-items:center; font-size:1.1rem; transition:background var(--ease), transform var(--ease); }
.legal-close:hover{ background:var(--azul); color:#fff; transform:rotate(90deg); }

/* ---- Reveal + stagger ---- */
.reveal{ opacity:0; transform:translateY(22px); filter:blur(6px); transition:opacity .6s var(--ease-out), transform .6s var(--ease-out), filter .6s var(--ease-out); }
.reveal.in{ opacity:1; transform:none; filter:none; }
.dishes-grid>.reveal:nth-child(2),.contact-grid>.reveal:nth-child(2){ transition-delay:.08s; }
.dishes-grid>.reveal:nth-child(3),.contact-grid>.reveal:nth-child(3){ transition-delay:.16s; }
.dishes-grid>.reveal:nth-child(4),.contact-grid>.reveal:nth-child(4){ transition-delay:.24s; }

/* ---- Grano de papel ---- */
body::before{ content:''; position:fixed; inset:0; z-index:9999; pointer-events:none; opacity:.03; mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); background-size:180px 180px; }

/* ---- Carrusel móvil ---- */
.carousel-hint{ display:none; }
@media (max-width:768px){
  .carousel-hint{ display:flex; align-items:center; justify-content:center; gap:.5rem; font-size:.78rem; color:var(--azul); font-weight:600; margin-top:1rem; }
  .carousel-hint i{ animation:nudge 1.4s ease-in-out infinite; }
  @keyframes nudge{ 0%,100%{transform:translateX(0);} 50%{transform:translateX(5px);} }
  .carousel-m{ display:flex; overflow-x:auto; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; gap:1rem; margin:0 -5%; padding:.5rem 5% 1rem; scrollbar-width:none; }
  .carousel-m::-webkit-scrollbar{ display:none; }
  .carousel-m>*{ scroll-snap-align:center; flex:0 0 80%; max-width:320px; }
}

/* ---- Responsive ---- */
@media (max-width:900px){
  .split{ grid-template-columns:1fr; gap:2rem; }
  .split-media{ max-width:460px; margin:0 auto; }
  .map-cta{ flex-direction:column; text-align:center; }
  .footer-grid{ grid-template-columns:1fr 1fr; }
}
@media (max-width:768px){
  .main-nav a{ display:none; }
  .menu-btn{ display:inline-flex; }
  .section{ padding:3.5rem 0; }
  .topbar-left .topbar-item:nth-child(2){ display:none; }
  .mobile-sticky{ display:flex; }
  body{ padding-bottom:64px; }
  .wa-fab{ bottom:74px; }
  body:has(.mobile-sticky:not(.visible)) .wa-fab{ bottom:22px; }
  .footer-grid{ grid-template-columns:1fr; gap:1.8rem; }
  /* ---- Centrado coherente en móvil ---- */
  .trust-band{ padding:1.2rem 0; }
  .marquee-track{ animation-duration:22s; }
  .mq-item{ padding:0 1.3rem; gap:.7rem; }
  .mq-ico{ width:42px; height:42px; font-size:1.1rem; }
  .mq-txt strong{ font-size:1rem; }
  .mq-txt em{ font-size:.62rem; letter-spacing:.13em; }
  .feat-card{ text-align:center; }
  .feat-card h3{ padding-right:0; }
  .feat-card .star{ position:static; display:inline-block; margin-bottom:.6rem; }
  .split-content{ text-align:center; }
  .split-creds{ justify-content:center; }
  .footer-col{ text-align:center; }
  .footer-brand .logo, .footer-social{ justify-content:center; }
  .footer-contact-item{ justify-content:center; text-align:left; }
}
@media (max-width:480px){
  .hero{ padding:3.25rem 0 3rem; }
  .hero-ctas .btn{ flex:1; }
  .legal-box{ padding:1.6rem 1.3rem; }
}

/* ---- Hover gate táctil ---- */
@media (hover:none){
  .dish-card:hover,.btn:hover,.nav-cta:hover,.map-cta:hover,.contact-card:hover,.footer-social a:hover,
  .dish-card:hover .card-bg img,.gallery-item:hover img{ transform:none; }
}

/* ---- Reduced motion ---- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
  .reveal{ opacity:1; transform:none; filter:none; }
  .wa-fab{ animation:none; }
}