/* ===== Merlot & Manchego · BrandBook stylesheet ===== */
@font-face { font-family:'Giaza'; src:url('../fonts/Giaza.otf') format('opentype'); font-display:swap; }
@font-face { font-family:'Jacques Pro'; src:url('../fonts/JacquesPro-Light.ttf') format('truetype'); font-weight:300; font-display:swap; }
@font-face { font-family:'Jacques Pro'; src:url('../fonts/JacquesPro-Regular.ttf') format('truetype'); font-weight:400; font-display:swap; }
@font-face { font-family:'Jacques Pro'; src:url('../fonts/JacquesPro-Medium.ttf') format('truetype'); font-weight:500; font-display:swap; }
@font-face { font-family:'Jacques Pro'; src:url('../fonts/JacquesPro-SemiBold.ttf') format('truetype'); font-weight:600; font-display:swap; }
@font-face { font-family:'Brittany'; src:url('../fonts/BrittanySignature.ttf') format('truetype'); font-display:swap; }

:root{
  --green:#034C32; --merlot:#0A714E; --olive:#A19868; --burgundy:#7C3354;
  --terra:#D58F82; --ivory:#F5F5F5; --ink:#3d4b42;
}
*{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; }
body{ font-family:'Jacques Pro',sans-serif; background:var(--ivory); color:var(--ink);
  font-weight:300; line-height:1.6; }
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }

/* ---------- nav ---------- */
.nav{ position:fixed; top:0; left:0; right:0; z-index:50;
  display:flex; align-items:center; justify-content:space-between;
  padding:14px 5vw; background:rgba(3,76,50,.92); backdrop-filter:blur(8px); }
.nav .brand{ display:flex; align-items:center; gap:12px; }
.nav .brand img{ height:44px; }
.nav .links{ display:flex; gap:28px; align-items:center; }
.nav .links a{ color:rgba(245,245,245,.9); font-weight:400; font-size:.85rem;
  letter-spacing:.18em; text-transform:uppercase; }
.nav .links a:hover{ color:var(--terra); }
.nav .cta{ background:var(--terra); color:var(--green); font-weight:600;
  padding:10px 22px; border-radius:999px; letter-spacing:.08em; }
.nav .cta:hover{ background:#e5a396; color:var(--green); }
@media (max-width:760px){ .nav .links a:not(.cta){ display:none; } }

/* ---------- hero ---------- */
.hero{ min-height:100svh; background:var(--green); color:var(--ivory);
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  position:relative; overflow:hidden; text-align:center; padding:120px 6vw 90px; }
.hero .amp{ position:absolute; font-family:'Giaza'; font-size:min(120vw,1300px); line-height:1;
  color:rgba(245,245,245,.05); right:-18%; bottom:-42%; pointer-events:none; }
.hero .amp2{ position:absolute; font-family:'Giaza'; font-size:min(80vw,900px); line-height:1;
  color:rgba(245,245,245,.04); left:-14%; top:-22%; pointer-events:none; }
.hero .frame{ position:absolute; inset:22px; border:1px solid rgba(161,152,104,.5); pointer-events:none; }
.hero .logo{ width:min(58vw,300px); }
.hero .script{ font-family:'Brittany'; font-size:clamp(2.6rem,7vw,4.6rem); color:var(--terra);
  transform:rotate(-4deg); margin-top:26px; }
.hero .divider{ width:120px; margin:34px auto 26px; opacity:.9; }
.hero .tagline{ letter-spacing:.42em; text-transform:uppercase; font-weight:400;
  font-size:clamp(.7rem,2.4vw,.95rem); color:rgba(245,245,245,.9); text-indent:.42em; }
.hero .btns{ margin-top:46px; display:flex; gap:18px; flex-wrap:wrap; justify-content:center; }
.btn{ display:inline-block; padding:15px 34px; border-radius:999px; font-weight:600;
  letter-spacing:.08em; font-size:.95rem; transition:transform .15s ease; }
.btn:hover{ transform:translateY(-2px); }
.btn-terra{ background:var(--terra); color:var(--green); }
.btn-ghost{ border:1.5px solid rgba(245,245,245,.65); color:var(--ivory); }

/* ---------- section shells ---------- */
.section{ padding:90px 6vw; position:relative; overflow:hidden; }
.section-inner{ max-width:1080px; margin:0 auto; position:relative; z-index:2; }
.eyebrow{ letter-spacing:.5em; text-transform:uppercase; font-weight:500;
  font-size:.78rem; color:var(--olive); text-indent:.5em; text-align:center; }
h2.title{ font-family:'Giaza'; font-weight:normal; color:var(--green);
  font-size:clamp(2rem,5.4vw,3.2rem); text-align:center; margin-top:14px; }
.script-line{ font-family:'Brittany'; color:var(--burgundy); text-align:center;
  font-size:clamp(1.8rem,4.6vw,2.6rem); transform:rotate(-3deg); margin-top:8px; }
.lead{ max-width:720px; margin:26px auto 0; text-align:center; font-size:1.06rem; color:#55645a; }
.lead b{ font-weight:600; color:var(--green); }

/* nosotros */
.nosotros{ background:var(--ivory); }
.nosotros .board-wm{ position:absolute; width:min(70vw,560px); right:-90px; bottom:-40px;
  opacity:.12; pointer-events:none; }

/* features */
.features{ background:#eeece6; }
.cards{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:26px; margin-top:48px; }
.cardf{ background:#fff; border:1px solid rgba(161,152,104,.4); border-radius:22px;
  padding:38px 30px; text-align:center; box-shadow:0 14px 34px rgba(3,76,50,.07); }
.cardf img{ height:64px; margin:0 auto 18px; }
.cardf h3{ font-family:'Giaza'; font-weight:normal; color:var(--green); font-size:1.5rem; }
.cardf p{ margin-top:10px; font-size:.95rem; color:#66756b; }

/* galería */
.gal{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:20px; margin-top:48px; }
.gal figure{ border-radius:20px; overflow:hidden; box-shadow:0 16px 36px rgba(3,76,50,.14);
  position:relative; aspect-ratio:4/5; }
.gal img{ width:100%; height:100%; object-fit:cover; transition:transform .4s ease; }
.gal figure:hover img{ transform:scale(1.04); }

/* menú banner */
.menuband{ background:var(--green); color:var(--ivory); text-align:center; }
.menuband .amp{ position:absolute; font-family:'Giaza'; font-size:min(90vw,900px); line-height:1;
  color:rgba(245,245,245,.05); left:-12%; bottom:-46%; pointer-events:none; }
.menuband h2{ color:var(--ivory); }
.menuband .eyebrow{ color:var(--olive); }
.menuband p{ color:rgba(245,245,245,.88); }

/* ubicación */
.ubic{ background:var(--ivory); }
.ubic-grid{ display:grid; grid-template-columns:1fr 1fr; gap:44px; margin-top:48px; align-items:center; }
@media (max-width:820px){ .ubic-grid{ grid-template-columns:1fr; } }
.ubic .sketch{ border-radius:20px; overflow:hidden; box-shadow:0 16px 36px rgba(3,76,50,.15);
  aspect-ratio:4/3; }
.ubic .sketch img{ width:100%; height:100%; object-fit:cover; }
.info-card{ background:#fff; border:1px solid rgba(161,152,104,.4); border-radius:22px;
  padding:40px 36px; box-shadow:0 14px 34px rgba(3,76,50,.07); }
.info-card h3{ font-family:'Giaza'; font-weight:normal; color:var(--green); font-size:1.6rem; }
.info-card .row{ margin-top:20px; }
.info-card .lbl{ letter-spacing:.28em; text-transform:uppercase; font-weight:600;
  font-size:.7rem; color:var(--olive); }
.info-card .val{ margin-top:5px; color:#55645a; font-size:1rem; }
.info-card .val b{ font-weight:600; color:var(--burgundy); }
.info-card .btn{ margin-top:26px; background:var(--green); color:var(--ivory); }

/* footer */
footer{ background:var(--green); color:rgba(245,245,245,.85); text-align:center;
  padding:60px 6vw 44px; position:relative; overflow:hidden; }
footer .mm{ height:26px; margin:0 auto 20px; opacity:.9; }
footer .flogo{ width:120px; margin:0 auto 18px; }
footer .fscript{ font-family:'Brittany'; color:var(--terra); font-size:1.8rem;
  transform:rotate(-3deg); margin-bottom:18px; }
footer .ftag{ letter-spacing:.34em; text-transform:uppercase; font-size:.72rem;
  color:rgba(245,245,245,.6); text-indent:.34em; }
footer .copy{ margin-top:24px; font-size:.75rem; color:rgba(245,245,245,.45); }

/* ---------- página menú ---------- */
.menu-hero{ background:var(--green); color:var(--ivory); text-align:center;
  padding:150px 6vw 70px; position:relative; overflow:hidden; }
.menu-hero .logo{ width:150px; margin:0 auto; }
.menu-hero .script{ font-family:'Brittany'; font-size:clamp(2rem,6vw,3rem);
  color:var(--terra); transform:rotate(-4deg); margin-top:16px; }
.menu-wrap{ max-width:860px; margin:0 auto; padding:60px 6vw 80px; }
.msec{ margin-bottom:56px; }
.msec-head{ display:flex; align-items:center; gap:16px; margin-bottom:6px; }
.msec-head .samp{ font-family:'Giaza'; color:var(--olive); font-size:1.7rem; line-height:1; }
.msec-head h2{ font-family:'Giaza'; font-weight:normal; color:var(--green);
  font-size:clamp(1.7rem,4.6vw,2.3rem); white-space:nowrap; }
.msec-head .rule{ flex:1; height:1px; background:linear-gradient(to right,var(--olive),transparent); }
.msec-head img{ height:40px; }
.msec-note{ color:var(--burgundy); font-weight:400; font-size:.9rem; margin-bottom:14px; }
.mitem{ padding:16px 0; border-bottom:1px solid rgba(161,152,104,.3); }
.mitem:last-child{ border-bottom:none; }
.mitem-head{ display:flex; align-items:baseline; gap:12px; }
.mitem-head .nm{ font-weight:600; color:var(--green); font-size:1.04rem; }
.mitem-head .ld{ flex:1; border-bottom:2px dotted rgba(161,152,104,.6); position:relative; top:-4px; }
.mitem-head .pr{ font-weight:500; color:var(--burgundy); white-space:nowrap; }
.mitem-desc{ font-size:.92rem; color:#66756b; margin-top:6px; max-width:640px; }
.chips{ display:flex; flex-wrap:wrap; gap:8px; margin-top:10px; }
.chip{ background:#fff; border:1px solid rgba(161,152,104,.5); border-radius:9px;
  padding:5px 12px; font-size:.82rem; color:#55645a; }
.chip b{ font-weight:600; color:var(--burgundy); margin-left:6px; }
.menu-end{ text-align:center; margin-top:40px; }
.menu-end img{ height:40px; margin:0 auto 10px; }
.menu-end .fscript{ font-family:'Brittany'; color:var(--burgundy); font-size:1.9rem;
  transform:rotate(-3deg); }
.backtop{ display:block; text-align:center; margin:30px auto 0; color:var(--olive);
  letter-spacing:.2em; text-transform:uppercase; font-size:.75rem; font-weight:500; }

/* ===== dinámica · animaciones y efectos ===== */

/* nav con transición al hacer scroll */
.nav{ transition:padding .35s ease, background .35s ease, box-shadow .35s ease; }
.nav.scrolled{ padding:8px 5vw; background:rgba(3,76,50,.98); box-shadow:0 8px 28px rgba(0,0,0,.22); }
.nav .brand img{ transition:height .35s ease; }
.nav.scrolled .brand img{ height:36px; }
.nav .links a{ position:relative; }
.nav .links a:not(.cta)::after{ content:""; position:absolute; left:0; bottom:-6px; height:1px; width:0;
  background:var(--terra); transition:width .3s ease; }
.nav .links a:not(.cta):hover::after{ width:100%; }

/* entrada del hero */
@keyframes heroUp{ from{ opacity:0; transform:translateY(30px); } to{ opacity:1; transform:none; } }
@keyframes heroScript{ from{ opacity:0; transform:rotate(-4deg) translateY(26px); }
  to{ opacity:1; transform:rotate(-4deg); } }
@keyframes heroDivider{ from{ opacity:0; transform:scaleX(.2); } to{ opacity:.9; transform:scaleX(1); } }
@keyframes heroTag{ from{ opacity:0; letter-spacing:.18em; } to{ opacity:1; letter-spacing:.42em; } }
@keyframes heroFrame{ from{ opacity:0; } to{ opacity:1; } }
@keyframes ampPulse{ 0%,100%{ opacity:1; } 50%{ opacity:.55; } }
.hero .logo{ animation:heroUp 1s .15s cubic-bezier(.22,.61,.36,1) both; }
.hero .script{ animation:heroScript 1s .5s cubic-bezier(.22,.61,.36,1) both; }
.hero .divider{ animation:heroDivider .9s .85s cubic-bezier(.22,.61,.36,1) both; }
.hero .tagline{ animation:heroTag 1.2s 1s cubic-bezier(.22,.61,.36,1) both; }
.hero .btns{ animation:heroUp 1s 1.25s cubic-bezier(.22,.61,.36,1) both; }
.hero .frame{ animation:heroFrame 1.4s .3s ease both; }
.hero .amp, .hero .amp2, .menuband .amp{ animation:ampPulse 9s ease-in-out infinite; will-change:transform; }

/* revelado al hacer scroll */
.js .rv{ opacity:0; transform:translateY(28px);
  transition:opacity .85s cubic-bezier(.22,.61,.36,1), transform .85s cubic-bezier(.22,.61,.36,1); }
.js .rv.on{ opacity:1; transform:translateY(0); }
.js .script-line.rv{ transform:rotate(-3deg) translateY(26px); }
.js .script-line.rv.on{ transform:rotate(-3deg); }
.js .ubic .sketch.rv{ transform:translateX(-34px); }
.js .info-card.rv{ transform:translateX(34px); }
.js .ubic .sketch.rv.on, .js .info-card.rv.on{ transform:none; }
.js .gal figure.rv{ transform:translateY(34px) scale(.96); }
.js .gal figure.rv.on{ transform:none; }

/* marquee de marca */
.marquee{ background:var(--green); overflow:hidden; padding:16px 0; border-top:1px solid rgba(161,152,104,.35);
  border-bottom:1px solid rgba(161,152,104,.35); }
.mq-track{ display:flex; width:max-content; animation:mq 32s linear infinite; }
.marquee:hover .mq-track{ animation-play-state:paused; }
.mq-track > span{ white-space:nowrap; display:inline-flex; align-items:baseline; }
.mq-track i{ font-style:normal; letter-spacing:.34em; text-transform:uppercase; font-weight:500;
  font-size:.82rem; color:rgba(245,245,245,.8); padding:0 14px; }
.mq-track b{ font-family:'Brittany'; font-weight:normal; font-size:1.25rem; color:var(--terra); padding:0 14px; }
.mq-track em{ font-style:normal; font-family:'Giaza'; color:var(--olive); font-size:1rem; }
@keyframes mq{ to{ transform:translateX(-50%); } }

/* hovers */
.cardf{ transition:transform .4s cubic-bezier(.22,.61,.36,1), box-shadow .4s ease; }
.cardf:hover{ transform:translateY(-8px); box-shadow:0 26px 52px rgba(3,76,50,.15); }
.cardf img{ transition:transform .4s cubic-bezier(.34,1.56,.64,1); }
.cardf:hover img{ transform:scale(1.12) rotate(-5deg); }
.btn{ position:relative; overflow:hidden; }
.btn::after{ content:""; position:absolute; top:0; left:-130%; width:60%; height:100%;
  background:linear-gradient(105deg, transparent, rgba(255,255,255,.35), transparent);
  transform:skewX(-18deg); transition:left .65s ease; pointer-events:none; }
.btn:hover::after{ left:160%; }
.info-card .btn:hover, .nav .cta:hover{ box-shadow:0 10px 24px rgba(3,76,50,.25); }
.mitem{ transition:opacity .85s cubic-bezier(.22,.61,.36,1), transform .85s cubic-bezier(.22,.61,.36,1),
  background .25s ease, padding .25s ease; border-radius:10px; }
.mitem:hover{ background:rgba(161,152,104,.09); padding-left:10px; padding-right:10px; }
.chip{ transition:transform .2s ease, border-color .2s ease; }
.chip:hover{ transform:translateY(-2px); border-color:var(--burgundy); }

/* instagram */
.social{ margin-top:22px; }
.social a{ display:inline-flex; align-items:center; gap:10px; padding:10px 22px; border-radius:999px;
  border:1px solid rgba(245,245,245,.35); color:rgba(245,245,245,.9); font-size:.85rem;
  letter-spacing:.08em; font-weight:400; transition:background .3s ease, color .3s ease, transform .2s ease; }
.social a:hover{ background:var(--terra); color:var(--green); border-color:var(--terra); transform:translateY(-2px); }
.social svg{ width:17px; height:17px; }
.info-card .ig{ color:var(--burgundy); font-weight:500; }
.info-card .ig:hover{ text-decoration:underline; }

/* accesibilidad: sin movimiento */
@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{ animation:none !important; transition:none !important; }
  .js .rv{ opacity:1; transform:none; }
}
.menu-hero .logo{ animation:heroUp .9s .1s cubic-bezier(.22,.61,.36,1) both; }
.menu-hero .script{ animation:heroScript .9s .4s cubic-bezier(.22,.61,.36,1) both; }

/* ===== whatsapp flotante ===== */
.wa{ position:fixed; right:22px; bottom:22px; z-index:60; width:56px; height:56px;
  border-radius:50%; background:var(--merlot); color:#fff; display:flex; align-items:center;
  justify-content:center; box-shadow:0 12px 30px rgba(3,76,50,.35);
  transition:transform .25s cubic-bezier(.34,1.56,.64,1), background .25s ease; overflow:visible; }
.wa:hover{ transform:scale(1.1); background:var(--green); }
.wa svg{ width:28px; height:28px; }
.wa::before{ content:""; position:absolute; inset:0; border-radius:50%;
  border:2px solid rgba(10,113,78,.55); animation:waPing 2.6s ease-out infinite; }
@keyframes waPing{ 0%{ transform:scale(1); opacity:1; } 70%,100%{ transform:scale(1.55); opacity:0; } }
@media (max-width:760px){ .wa{ width:54px; height:54px; right:16px; bottom:16px; } .wa svg{ width:27px; height:27px; } }

/* ===== mapa ===== */
.map-wrap{ margin-top:34px; border-radius:20px; overflow:hidden;
  box-shadow:0 16px 36px rgba(3,76,50,.15); border:1px solid rgba(161,152,104,.4); }
.map-wrap iframe{ display:block; width:100%; height:380px; border:0;
  filter:saturate(.85) hue-rotate(-8deg); }

/* rappi */
.info-card .ibtns{ display:flex; gap:12px; flex-wrap:wrap; }
.btn-rappi{ background:var(--burgundy); color:#fff; }
.btn-rappi:hover{ box-shadow:0 10px 24px rgba(124,51,84,.3); }
.social{ display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }
.info-card .btn-rappi{ background:var(--burgundy); color:#fff; margin-top:0; }
.info-card .ibtns{ margin-top:26px; align-items:center; }
.info-card .ibtns .btn{ margin-top:0; }
