/* ==========================================================================
   Asador El Horno — hoja de estilos
   Paleta: rescoldo (negro cálido), pergamino, vino/oxblood, latón
   Tipografía: Fraunces (titulares) + Libre Franklin (texto y cartas)
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,300;0,9..144,400;0,9..144,500;0,9..144,600;1,9..144,400;1,9..144,500&family=Libre+Franklin:wght@400;500;600;700&display=swap');

:root{
  --ember:      #1a1512;
  --ember-2:    #241d18;
  --iron:       #2e2621;
  --parchment:  #f3ecdd;
  --parchment-2:#eae1cd;
  --bone:       #ede6d6;
  --oxblood:    #7a2020;
  --oxblood-lt: #98362f;
  --brass:      #b8863b;
  --ink:        #241b16;
  --ink-soft:   #4a3d33;

  --serif: 'Fraunces', Georgia, serif;
  --sans:  'Libre Franklin', -apple-system, Segoe UI, sans-serif;

  --max: 1180px;
  --pad: clamp(1.25rem, 4vw, 3rem);
  --header-h: 132px;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  background:var(--parchment);
  color:var(--ink);
  font-family:var(--sans);
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }

h1,h2,h3,.script{
  font-family:var(--serif);
  font-weight:400;
  margin:0;
  color:var(--ink);
}

.script{
  display:block;
  font-style:italic;
  font-weight:400;
  font-optical-sizing:auto;
  color:#9b8f7d;
  font-size:clamp(2.6rem, 6vw, 4.4rem);
  line-height:1;
  letter-spacing:-0.01em;
}
.script.on-dark{ color:#8a7c66; }

.eyebrow{
  display:block;
  font-family:var(--sans);
  font-weight:600;
  font-size:.72rem;
  letter-spacing:.16em;
  color:var(--oxblood);
}

/* Unified heading style — one typeface (serif) throughout, no font-mixing.
   A short brass rule marks it as a section head instead of switching type. */
.heading{
  font-family:var(--serif);
  font-weight:500;
  font-size:clamp(1.9rem, 4vw, 2.6rem);
  color:var(--ink);
  margin:0 0 1.9rem;
  padding-bottom:.9rem;
  position:relative;
  line-height:1.15;
}
.heading::after{
  content:'';
  position:absolute; left:0; bottom:0;
  width:46px; height:2px;
  background:var(--brass);
}
.heading.center{ text-align:center; }
.heading.center::after{ left:50%; transform:translateX(-50%); }
.heading.on-ember{ color:var(--bone); }
.heading.sm{ font-size:clamp(1.4rem,2.6vw,1.7rem); margin-bottom:1.4rem; }

.container{ max-width:var(--max); margin:0 auto; padding:0 var(--pad); }

/* --------------------------- divider / motif --------------------------- */
.divider-mark{
  display:block;
  width:64px;
  height:1px;
  background:rgba(122,32,32,.35);
  margin:1.7rem auto;
  position:relative;
}
.divider-mark::before{
  content:'';
  position:absolute; top:50%; left:50%;
  width:7px; height:7px;
  background:var(--brass);
  transform:translate(-50%,-50%) rotate(45deg);
}
.divider-mark.on-ember{ background:rgba(184,134,59,.4); }
.divider-mark.tight{ margin:1.1rem auto; }

/* --------------------------------- header ------------------------------- */
.site-header{
  position:sticky; top:0; z-index:50;
  background:var(--ember);
  border-bottom:1px solid rgba(184,134,59,.25);
}
.site-header .container{
  display:flex; align-items:center; justify-content:space-between;
  height:var(--header-h);
}
.brand img{ height:92px; width:auto; }
.main-nav{ display:flex; align-items:center; gap:2.1rem; }
.main-nav a{
  font-size:.82rem;
  font-weight:600;
  letter-spacing:.1em;
  color:var(--bone);
  padding:.4rem 0;
  border-bottom:1px solid transparent;
  transition:color .2s, border-color .2s;
}
.main-nav a:hover,
.main-nav a[aria-current="page"]{
  color:var(--brass);
  border-bottom-color:var(--brass);
}
.nav-toggle{
  display:none;
  background:none;border:none;cursor:pointer;
  width:32px;height:32px;position:relative;
}
.nav-toggle span, .nav-toggle span::before, .nav-toggle span::after{
  content:'';
  position:absolute; left:4px; right:4px; height:2px;
  background:var(--bone);
}
.nav-toggle span{ top:15px; }
.nav-toggle span::before{ top:-8px; }
.nav-toggle span::after{ top:8px; }

@media (max-width:760px){
  .nav-toggle{ display:block; }
  .main-nav{
    position:fixed; inset:var(--header-h) 0 0 0;
    background:var(--ember);
    flex-direction:column;
    justify-content:flex-start;
    gap:0;
    padding:1rem var(--pad);
    transform:translateX(100%);
    transition:transform .3s ease;
  }
  .main-nav.open{ transform:translateX(0); }
  .main-nav a{
    width:100%;
    padding:1rem 0;
    border-bottom:1px solid rgba(184,134,59,.18);
  }
}

/* ---------------------------------- hero -------------------------------- */
.hero{
  background:var(--ember);
  color:var(--bone);
  position:relative;
  overflow:hidden;
  padding:clamp(4rem,12vw,7.5rem) 0 clamp(3.5rem,10vw,6rem);
  text-align:center;
}
.hero::before{
  content:'';
  position:absolute; inset:0;
  background-image:
    radial-gradient(ellipse at 50% 0%, rgba(184,134,59,.10), transparent 60%);
  pointer-events:none;
}
.hero .hero-logo{
  width:min(50vw,230px);
  margin:0 auto 2rem;
}
.hero h1{
  font-size:clamp(2.4rem, 7vw, 4.6rem);
  color:var(--bone);
  line-height:1.05;
}
.hero p.lede{
  max-width:46ch;
  margin:1.4rem auto 0;
  color:#c9beac;
  font-size:1.05rem;
}
.hero .cta-row{ margin-top:2.2rem; }

/* --------------------------------- buttons ------------------------------ */
.btn{
  display:inline-block;
  font-family:var(--sans);
  font-weight:700;
  font-size:.8rem;
  letter-spacing:.08em;
  padding:.95rem 2.1rem;
  background:var(--oxblood);
  color:var(--bone);
  border:1px solid var(--oxblood);
  transition:background .2s, color .2s, border-color .2s;
}
.btn:hover{ background:var(--oxblood-lt); border-color:var(--oxblood-lt); }
.btn.outline{
  background:transparent;
  border-color:var(--brass);
  color:var(--brass);
}
.btn.outline:hover{ background:var(--brass); color:var(--ember); }
.btn.on-parchment{ background:var(--ink); border-color:var(--ink); }
.btn.on-parchment:hover{ background:var(--oxblood); border-color:var(--oxblood); }

/* --------------------------------- sections ------------------------------ */
section{ padding:clamp(3.5rem,8vw,6rem) 0; }
.on-parchment{ background:var(--parchment); }
.on-parchment-2{ background:var(--parchment-2); }
.on-ember{ background:var(--ember); color:var(--bone); }
.on-ember .script{ color:#8a7c66; }
.on-ember p{ color:#c9beac; }

.split{
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:clamp(2rem,6vw,5rem);
  align-items:center;
}
@media (max-width:820px){ .split{ grid-template-columns:1fr; } }

.lead-block .script{ margin-bottom:.4rem; }
.lead-block p + p{ margin-top:1rem; }
.lead-block p{ color:var(--ink-soft); max-width:52ch; }

.stat-card{
  border:1px solid rgba(184,134,59,.35);
  padding:2.4rem;
  text-align:center;
}
.stat-card .year{
  font-family:var(--serif);
  font-size:3.4rem;
  color:var(--brass);
  line-height:1;
}
.stat-card p{ margin-top:.8rem; color:var(--ink-soft); font-size:.92rem; letter-spacing:.04em; }

/* -------------------------- especialidades band -------------------------- */
.specialties{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1px;
  background:rgba(184,134,59,.25);
  border-top:1px solid rgba(184,134,59,.25);
  border-bottom:1px solid rgba(184,134,59,.25);
}
.specialty{
  background:var(--ember);
  padding:3.4rem 1.6rem;
  text-align:center;
}
.specialty h3{
  font-family:var(--serif);
  font-style:italic;
  color:var(--bone);
  font-size:1.7rem;
}
@media (max-width:700px){ .specialties{ grid-template-columns:1fr; } }

/* ------------------------------ menu / carta ------------------------------ */
.carta-hero{
  background:var(--ember);
  color:var(--bone);
  text-align:center;
  padding:clamp(3rem,8vw,5rem) 0 clamp(2.2rem,6vw,3rem);
}
.carta-section{ padding:clamp(2.6rem,6vw,4rem) 0; }
.carta-section:nth-child(even){ background:var(--parchment-2); }

.menu-columns{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:0 clamp(2rem,6vw,4.5rem);
}
@media (max-width:700px){ .menu-columns{ grid-template-columns:1fr; } }

.menu-group{ margin-bottom:2.2rem; }
.menu-group h3{
  font-family:var(--serif);
  font-weight:500;
  font-size:1.25rem;
  color:var(--ink);
  margin-bottom:1rem;
  padding-bottom:.4rem;
  border-bottom:1px solid rgba(122,32,32,.25);
}

.menu-item{
  display:flex;
  align-items:baseline;
  gap:.4rem;
  padding:.5rem 0;
}
.menu-item .name{ color:var(--ink-soft); }
.menu-item .leader{
  flex:1;
  border-bottom:1px dotted rgba(74,61,51,.4);
  transform:translateY(-4px);
  margin:0 .3rem;
}
.menu-item .price{
  font-variant-numeric:tabular-nums;
  font-weight:600;
  color:var(--oxblood);
  white-space:nowrap;
}

/* ---------------------------- menus de grupo ------------------------------ */
.grupo-intro{
  max-width:60ch;
  margin:0 auto;
  text-align:center;
  color:var(--ink-soft);
}
.grupo-intro p + p{ margin-top:1rem; }

.menu-cards{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:2rem;
  margin-top:3rem;
  align-items:start;
}
@media (max-width:900px){ .menu-cards{ grid-template-columns:1fr; max-width:520px; margin-inline:auto; } }

.menu-card{
  background:var(--parchment);
  border:1px solid rgba(122,32,32,.2);
  padding:2.4rem 2rem;
  text-align:center;
}
.menu-card h3{
  font-family:var(--serif);
  font-weight:500;
  font-size:1.9rem;
  color:var(--ink);
  margin:0 0 1.6rem;
}
.menu-card ul{ list-style:none; margin:0; padding:0; text-align:left; }
.menu-card li{
  padding:.5rem 0;
  border-bottom:1px dashed rgba(74,61,51,.25);
  color:var(--ink-soft);
  font-size:.94rem;
}
.menu-card li:last-of-type{ border-bottom:none; }
.menu-card .divider-row{ margin:.9rem 0; text-align:center; }
.menu-card .price-tag{
  display:inline-block;
  margin-top:1.6rem;
  font-family:var(--serif);
  font-size:1.5rem;
  color:var(--oxblood);
}
.menu-card .price-tag small{
  display:block;
  font-family:var(--sans);
  font-size:.65rem;
  letter-spacing:.1em;
  color:var(--ink-soft);
  margin-top:.2rem;
}

.grupo-cta{ text-align:center; margin-top:3.4rem; }
.grupo-cta p{ color:var(--ink-soft); margin-bottom:1.4rem; }

/* --------------------------------- contact ------------------------------- */
.contact-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:clamp(2rem,6vw,4rem);
}
@media (max-width:820px){ .contact-grid{ grid-template-columns:1fr; } }

.contact-list{ list-style:none; margin:1.6rem 0 0; padding:0; }
.contact-list li{
  display:flex; gap:1rem; align-items:flex-start;
  padding:.9rem 0;
  border-bottom:1px solid rgba(184,134,59,.2);
}
.contact-list .ico{
  width:20px; flex:none; margin-top:.15rem;
  color:var(--brass);
}
.contact-list a:hover{ color:var(--brass); }
.contact-list .label{ display:block; font-size:.72rem; letter-spacing:.1em; color:#8a7c66; margin-bottom:.15rem; }

.map-frame{
  border:1px solid rgba(184,134,59,.3);
  filter:grayscale(.4) contrast(1.05);
  width:100%; min-height:340px;
}

/* --------------------------------- footer -------------------------------- */
.site-footer{
  background:var(--ember);
  color:#a99c88;
  padding:3rem 0 2rem;
}
.footer-grid{
  display:grid;
  grid-template-columns:1.2fr 1fr 1fr;
  gap:2.5rem;
  padding-bottom:2rem;
  border-bottom:1px solid rgba(184,134,59,.18);
}
@media (max-width:700px){ .footer-grid{ grid-template-columns:1fr; } }
.footer-grid img{ height:88px; width:auto; margin-bottom:1.2rem; }
.footer-grid p{ font-size:.9rem; line-height:1.7; }
.footer-grid h4{
  font-family:var(--sans);
  font-size:.72rem;
  letter-spacing:.12em;
  color:var(--brass);
  margin:0 0 1rem;
}
.footer-grid a{ display:block; font-size:.9rem; padding:.25rem 0; color:#c9beac; }
.footer-grid a:hover{ color:var(--brass); }
.footer-bottom{
  padding-top:1.6rem;
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:.5rem;
  font-size:.78rem; letter-spacing:.03em;
}

/* --------------------------------- utility -------------------------------- */
.center{ text-align:center; }
.mt-lg{ margin-top:3rem; }