/* Fuentes de respaldo con metricas ajustadas: evitan que el texto
   cambie de tamaño cuando cargan las webfonts (reduce el CLS). */
@font-face{
  font-family:'Fraunces-fallback';
  src:local('Georgia'), local('Times New Roman'), local('serif');
  size-adjust:105%; ascent-override:92%; descent-override:24%; line-gap-override:0%;
}
@font-face{
  font-family:'Lora-fallback';
  src:local('Georgia'), local('Times New Roman'), local('serif');
  size-adjust:102%; ascent-override:100%; descent-override:26%; line-gap-override:0%;
}
@font-face{
  font-family:'Inter-fallback';
  src:local('Helvetica Neue'), local('Arial'), local('sans-serif');
  size-adjust:100%; ascent-override:97%; descent-override:24%; line-gap-override:0%;
}

:root{
  --cream:#EFE6D2;
  --cream-2:#F8F3E7;
  --paper-edge:#E2D5B8;
  --ink:#2A2420;
  --garnet:#7B1E2B;
  --garnet-dark:#5E1621;
  --pine:#1F3D2E;
  --pine-dark:#152B21;
  --gold:#B8912F;
  --ember:#C1541C;
  --font-display:'Fraunces', 'Fraunces-fallback', Georgia, serif;
  --font-body:'Lora', 'Lora-fallback', Georgia, serif;
  --font-ui:'Inter', 'Inter-fallback', 'Helvetica Neue', Arial, sans-serif;
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  background:var(--cream);
  color:var(--ink);
  font-family:var(--font-body);
  -webkit-font-smoothing:antialiased;
}
a{color:inherit; text-decoration:none;}
img,svg{display:block; max-width:100%;}
.wrap{max-width:1180px; margin:0 auto; padding:0 28px;}
.eyebrow{
  font-family:var(--font-ui); font-size:.72rem; letter-spacing:.22em;
  text-transform:uppercase; color:var(--garnet); font-weight:600;
}

/* ---------- TOP BAR ---------- */
.topbar{ background:var(--pine); color:var(--cream-2); font-family:var(--font-ui); font-size:.78rem; }
.topbar .wrap{display:flex; justify-content:space-between; align-items:center; height:38px;}
.lang-switch{display:flex; gap:10px;}
.lang-switch a{opacity:.55;}
.lang-switch a.active{opacity:1; border-bottom:1px solid var(--gold);}

/* ---------- HEADER ---------- */
header.site{ background:var(--cream-2); border-bottom:1px solid var(--paper-edge); position:sticky; top:0; z-index:50; }
header.site .wrap{ display:flex; align-items:center; justify-content:space-between; height:84px; }
.brand{display:flex; align-items:center; gap:12px;}
.brand-mark-img{
  width:52px; height:52px; border-radius:50%; object-fit:cover;
  box-shadow:0 0 0 2px var(--cream-2), 0 0 0 3px var(--gold);
}
.brand-name{font-family:var(--font-display); font-weight:700; font-size:1.15rem; line-height:1.05;}
.brand-name small{display:block; font-family:var(--font-ui); font-weight:500; letter-spacing:.14em; font-size:.62rem; color:var(--pine); text-transform:uppercase; margin-top:3px;}

nav.main{display:flex; gap:32px; font-family:var(--font-ui); font-size:.88rem; font-weight:500;}
nav.main a{position:relative; padding:4px 0;}
nav.main a::after{ content:''; position:absolute; left:0; bottom:-2px; width:0; height:2px; background:var(--ember); transition:width .25s ease; }
nav.main a:hover::after{width:100%;}

.cta-btn{
  font-family:var(--font-ui); font-weight:600; font-size:.84rem;
  background:var(--ember); color:var(--cream-2); padding:11px 22px; border-radius:3px;
  letter-spacing:.02em; box-shadow:0 3px 0 var(--garnet-dark); display:inline-block;
  transition:transform .15s ease;
}
.cta-btn:hover{transform:translateY(-2px);}
.cta-ghost{border:1.5px solid var(--ink); padding:9.5px 20px; border-radius:3px; font-family:var(--font-ui); font-weight:600; font-size:.84rem; display:inline-block;}

@media(max-width:880px){ nav.main{display:none;} }
@media(max-width:400px){
  header.site .wrap{ height:auto; min-height:64px; padding-top:10px; padding-bottom:10px; gap:10px; }
  .brand-name{ font-size:.92rem; }
  .brand-name small{ display:none; }
  .cta-btn{ padding:8px 12px; font-size:.72rem; white-space:nowrap; }
  .brand-mark-img{ width:40px; height:40px; }
}

/* ---------- HERO ---------- */
.hero{
  position:relative; overflow:hidden; padding:36px 24px 40px;
  min-height:560px;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  background-color:var(--cream);
}
.hero-bg{
  position:absolute; top:0; right:0; bottom:0; left:0;
  background-image:url('/images/hero-bg.jpg?v=3');
  background-size:cover; background-position:center 45%;
}
.hero-veil{
  position:absolute; top:0; right:0; bottom:0; left:0;
  background:linear-gradient(180deg, rgba(239,230,210,.52) 0%, rgba(239,230,210,.80) 55%, rgba(239,230,210,.96) 85%, rgba(239,230,210,1) 100%);
}
.hero-logo-wrap{ position:relative; z-index:2; display:flex; justify-content:center; }
.hero-logo{ width:min(320px, 72vw); height:auto; border-radius:50%; box-shadow:0 16px 38px rgba(0,0,0,.35); }
.hero-copy{ position:relative; z-index:2; text-align:center; padding:24px 0 0; }
.hero-sub{
  font-family:var(--font-ui); font-size:.98rem; color:#16281E; letter-spacing:.02em;
  max-width:520px; margin:0 auto 30px; font-weight:600;
  text-shadow:0 1px 3px rgba(248,243,231,.85);
}
.hero-actions{display:flex; gap:16px; justify-content:center; flex-wrap:wrap;}

.flag-rule{height:5px; width:100%; background:linear-gradient(90deg, var(--pine) 0 33%, var(--cream-2) 33% 66%, var(--garnet) 66% 100%);}

.territories-strip{ background:var(--cream-2); border-top:1px solid var(--paper-edge); border-bottom:1px solid var(--paper-edge); padding:16px 0; min-height:54px; }
.territories-strip .wrap{
  display:flex; align-items:center; justify-content:center; gap:18px;
  font-family:var(--font-ui); font-size:.8rem; letter-spacing:.08em; text-transform:uppercase; color:var(--ink); font-weight:600;
}
.territories-strip .dot{width:5px; height:5px; border-radius:50%; background:var(--gold); flex:0 0 5px;}
.territories-strip .place{color:var(--garnet);}
@media(max-width:760px){
  .territories-strip{ padding:14px 0; min-height:0; }
  .territories-strip .wrap{
    flex-direction:column; gap:7px; font-size:.72rem; letter-spacing:.06em; text-align:center;
  }
  .territories-strip .dot,
  .territories-strip .place{ display:none; }
}

/* ---------- SECTION BASE ---------- */
section{padding:88px 0;}
.section-head{max-width:640px; margin:0 auto 48px; text-align:center;}
.section-head h2{ font-family:var(--font-display); font-weight:700; font-size:clamp(1.9rem,3.4vw,2.6rem); margin-top:10px; color:var(--ink); }
.section-head p{margin-top:14px; color:#5B5347; font-size:1rem; line-height:1.6;}

/* ---------- MENU (lista, sin imagenes) ---------- */
.menu-section{background:var(--cream);}
.menu-category{max-width:760px; margin:0 auto 52px;}
.menu-category:last-child{margin-bottom:0;}
.menu-category-title{
  font-family:var(--font-display); font-weight:700; font-size:1.3rem; color:var(--garnet);
  text-align:center; margin-bottom:22px; position:relative; padding-bottom:12px;
}
.menu-category-title::after{
  content:''; position:absolute; bottom:0; left:50%; transform:translateX(-50%);
  width:54px; height:2px; background:var(--gold);
}
.menu-list{display:flex; flex-direction:column;}
.menu-item{
  display:flex; flex-direction:column; gap:6px;
  padding:16px 2px; border-bottom:1px dashed var(--paper-edge);
}
.menu-item:last-child{border-bottom:none;}
.menu-item-head{display:flex; align-items:baseline; gap:8px;}
.menu-item-name{font-family:var(--font-display); font-weight:700; font-size:1.05rem; color:var(--ink); white-space:nowrap;}
.menu-item-dots{flex:1; border-bottom:1px dotted #C9BB98; margin-bottom:5px; min-width:12px;}
.menu-item-price{font-family:var(--font-ui); font-weight:700; color:var(--garnet); font-size:.98rem; white-space:nowrap;}
.menu-item-tagline{font-family:var(--font-body); font-size:.92rem; color:var(--ink); line-height:1.5;}
.menu-item-ingredients{
  font-family:var(--font-ui); font-size:.82rem; color:#7C7263; line-height:1.5;
  letter-spacing:.01em;
}

.allergen-list{display:flex; gap:10px; flex-wrap:wrap; margin-top:2px;}
.allergen-none{
  font-family:var(--font-ui); font-size:.74rem; color:#8A8071; font-style:italic;
}
.allergen-icon{
  position:relative; width:18px; height:18px; color:var(--pine); opacity:.7;
}
.allergen-icon svg{width:100%; height:100%;}
.allergen-icon sup{
  position:absolute; top:-4px; right:-6px; font-size:.62rem; font-weight:700; color:var(--garnet);
}
.allergen-legend{
  max-width:760px; margin:24px auto 0; text-align:center; font-family:var(--font-ui);
  font-size:.76rem; line-height:1.6; color:#6B6252;
}
.allergen-legend-table{
  max-width:640px; margin:44px auto 0; background:var(--cream-2); border:1px solid var(--paper-edge);
  border-radius:8px; padding:22px 24px;
}
.allergen-legend-table-title{
  font-family:var(--font-display); font-weight:700; font-size:1rem; color:var(--garnet);
  text-align:center; margin-bottom:16px;
}
.allergen-legend-grid{
  display:flex; flex-wrap:wrap; justify-content:center; gap:10px 12px;
}
.allergen-legend-item{
  display:flex; align-items:center; gap:8px; font-family:var(--font-ui); font-size:.82rem; color:var(--ink);
  background:var(--cream); border:1px solid var(--paper-edge); border-radius:20px; padding:7px 14px 7px 11px;
}
.allergen-icon--legend{ opacity:1; flex-shrink:0; }

@media(max-width:600px){
  .menu-item-name{white-space:normal;}
  .menu-item-dots{display:none;}
}

/* ---------- STORY ---------- */
.story-section{background:var(--pine); color:var(--cream-2);}
.story-grid{display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:center;}
@media(max-width:860px){ .story-grid{grid-template-columns:1fr;} }
.story-grid .eyebrow{color:var(--gold);}
.story-grid h2{font-family:var(--font-display); font-size:2rem; margin:12px 0 18px; font-weight:700;}
.story-grid p{line-height:1.75; color:#DCE6DF; font-size:.98rem;}
.story-photo{
  width:100%; height:auto; border-radius:10px; display:block;
  box-shadow:0 14px 34px rgba(0,0,0,.4);
}

/* ---------- LOCATION ---------- */
.location-section{background:var(--cream-2);}
.loc-grid{display:grid; grid-template-columns:1.1fr .9fr; gap:50px;}
@media(max-width:860px){ .loc-grid{grid-template-columns:1fr;} }
.loc-card{ background:var(--cream); border:1px solid var(--paper-edge); border-radius:8px; padding:34px; }
.loc-card h3{font-family:var(--font-display); font-size:1.35rem; margin-bottom:18px;}
.loc-row{display:flex; gap:14px; padding:12px 0; border-bottom:1px solid var(--paper-edge); font-family:var(--font-ui); font-size:.9rem;}
.loc-row:last-child{border-bottom:none;}
.loc-row .label{color:var(--garnet); font-weight:600; min-width:96px;}
.map-card{
  border:1px solid var(--paper-edge); border-radius:8px; overflow:hidden; background:var(--cream);
}
.map-figure{position:relative; line-height:0;}
.map-img-link{display:block; line-height:0;}
.map-img-link img{width:100%; height:auto; display:block;}
.map-btn{
  position:absolute; top:14px; left:14px; z-index:2; line-height:normal;
  box-shadow:0 3px 0 var(--garnet-dark), 0 4px 14px rgba(0,0,0,.28);
}
@media(max-width:480px){
  .map-btn{top:10px; left:10px; padding:9px 14px; font-size:.78rem;}
}


.loc-row a{color:var(--garnet); font-weight:600; text-decoration:underline;}
.loc-card .cta-btn{ margin-right:10px; }

/* ---------- FOOTER ---------- */
footer{background:var(--pine-dark); color:#C9D3CB; padding:56px 0 26px;}
.footer-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:40px; padding-bottom:36px;}
@media(max-width:760px){ .footer-grid{grid-template-columns:1fr; gap:28px;} }
footer h4{font-family:var(--font-ui); font-size:.78rem; letter-spacing:.14em; text-transform:uppercase; color:var(--gold); margin-bottom:14px;}
footer p, footer li{font-size:.88rem; line-height:1.7; color:#B7C3BB;}
footer li a{transition:color .2s ease;}
footer li a:hover{color:var(--gold);}
footer ul{list-style:none;}
.footer-brand{font-family:var(--font-display); font-size:1.3rem; color:var(--cream-2); font-weight:700; margin-bottom:10px;}
.footer-bottom{border-top:1px solid rgba(255,255,255,.1); padding-top:20px; font-family:var(--font-ui); font-size:.76rem; color:#8FA096; display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;}
.footer-bottom span + span{ margin-left:16px; }

/* ---- Hero e historia en pantallas pequeñas ---- */
@media(max-width:760px){
  .hero{ min-height:440px; padding:28px 20px 32px; }
  .hero-bg{ background-image:url('/images/hero-bg-mobile.jpg?v=3'); background-position:center 40%; }
  .hero-veil{ background:linear-gradient(180deg, rgba(239,230,210,.46) 0%, rgba(239,230,210,.78) 52%, rgba(239,230,210,.96) 85%, rgba(239,230,210,1) 100%); }
  .hero-logo{ width:min(210px, 56vw); }
  .hero-copy{ padding:20px 0 0; }
  .hero-sub{ font-size:.92rem; margin-bottom:24px; }
  .story-photo{ margin-top:8px; }
}
@media(max-width:420px){
  .hero-logo{ width:min(185px, 54vw); }
  .hero-sub{ font-size:.88rem; }
}

/* ---- Páginas legales ---- */
.legal-section{background:var(--cream); padding:64px 0 80px;}
.legal-wrap{max-width:760px;}
.legal-wrap h1{font-family:var(--font-display); font-size:2rem; font-weight:700; margin-bottom:22px; color:var(--ink);}
.legal-wrap h2{font-family:var(--font-display); font-size:1.18rem; font-weight:700; margin:34px 0 10px; color:var(--garnet);}
.legal-wrap p{line-height:1.75; margin-bottom:12px; color:#4A4238; font-size:.95rem;}
.legal-wrap ul{margin:10px 0 12px 20px;}
.legal-wrap li{line-height:1.8; color:#4A4238; font-size:.95rem;}
.legal-back{margin-top:40px;}
.legal-back a{font-family:var(--font-ui); font-weight:600; color:var(--garnet); text-decoration:underline;}
.footer-bottom a{text-decoration:underline;}
