@font-face{ font-family:'Fraunces'; src:url('../fonts/fraunces-400.woff2') format('woff2'); font-weight:400; font-style:normal; font-display:swap; }
@font-face{ font-family:'Fraunces'; src:url('../fonts/fraunces-600.woff2') format('woff2'); font-weight:600; font-style:normal; font-display:swap; }
@font-face{ font-family:'Fraunces'; src:url('../fonts/fraunces-400-italic.woff2') format('woff2'); font-weight:400; font-style:italic; font-display:swap; }
@font-face{ font-family:'Jost'; src:url('../fonts/jost-400.woff2') format('woff2'); font-weight:400; font-style:normal; font-display:swap; }
@font-face{ font-family:'Jost'; src:url('../fonts/jost-500.woff2') format('woff2'); font-weight:500; font-style:normal; font-display:swap; }
@font-face{ font-family:'Bitter'; src:url('../fonts/bitter-700.woff2') format('woff2'); font-weight:700; font-style:normal; font-display:swap; }
@font-face{ font-family:'Bitter'; src:url('../fonts/bitter-900.woff2') format('woff2'); font-weight:900; font-style:normal; font-display:swap; }

:root{
  --bg:#0d0b0a; --bg-panel:#161311; --bg-panel-2:#1d1815;
  --text:#f3ece2; --text-muted:#bfb2a2;
  --accent:#d9793d; --accent-2:#f0a367; --accent-deep:#8a4a26;
  --line:rgba(243,236,226,.14);
  --header-bg:rgba(13,11,10,.88);
  --serif:'Fraunces', Georgia, serif;
  --sans:'Jost', Arial, sans-serif;
  --slab:'Bitter', Georgia, serif;
  --maxw:1200px;
  --ease:cubic-bezier(.16,.8,.3,1);
}
/* Tema claro — usado en la página de la Carta */
body.theme-light{
  --bg:#faf6ef; --bg-panel:#f2e9db; --bg-panel-2:#ece0cd;
  --text:#241b12; --text-muted:#7a6852;
  --accent:#c1652c; --accent-2:#9c4e20; --accent-deep:#7a3c18;
  --line:rgba(36,27,18,.14);
  --header-bg:rgba(250,246,239,.9);
}
body.theme-light ::selection{background:var(--accent); color:#faf6ef;}
body.theme-light ::-webkit-scrollbar-track{background:var(--bg);}
*,*::before,*::after{box-sizing:border-box;}
@media (prefers-reduced-motion:reduce){ *{animation-duration:.01ms !important; transition-duration:.01ms !important;} }
html{-webkit-text-size-adjust:100%;}
body{margin:0; background:var(--bg); color:var(--text); font-family:var(--sans); font-weight:400; line-height:1.65; -webkit-font-smoothing:antialiased;}
img{max-width:100%; display:block;}
a{color:inherit; text-decoration:none;}
h1,h2,h3,h4{font-family:var(--serif); font-weight:600; margin:0 0 .4em;}
p{margin:0 0 1em;}
.container{max-width:var(--maxw); margin:0 auto; padding:0 32px;}
::selection{background:var(--accent); color:#0d0b0a;}
::-webkit-scrollbar{width:9px;}
::-webkit-scrollbar-track{background:var(--bg);}
::-webkit-scrollbar-thumb{background:var(--accent-deep); border-radius:6px;}
::-webkit-scrollbar-thumb:hover{background:var(--accent);}

.eyebrow{display:inline-flex; align-items:center; gap:10px; font-weight:500; font-size:.76rem; letter-spacing:.24em; text-transform:uppercase; color:var(--accent-2); margin-bottom:16px;}
.eyebrow::before{content:""; width:24px; height:1px; background:var(--accent);}
.section-pad{padding:96px 0;}
@media (max-width:768px){ .section-pad{padding:64px 0;} }
.section-head{max-width:620px; margin-bottom:48px;}
.section-head h2{font-size:clamp(1.9rem,4vw,2.7rem); line-height:1.15;}
.section-head p{color:var(--text-muted); font-size:1.02rem;}

/* Buttons & links */
.link-arrow{display:inline-flex; align-items:center; gap:10px; font-size:.82rem; letter-spacing:.1em; text-transform:uppercase; font-weight:500; padding-bottom:6px; border-bottom:1px solid var(--line); transition:gap .3s var(--ease), border-color .3s, color .3s;}
.link-arrow svg{width:14px; height:14px; flex-shrink:0; transition:transform .3s var(--ease);}
.link-arrow:hover{gap:16px; border-color:var(--accent); color:var(--accent-2);}
.link-arrow:hover svg{transform:translateX(3px);}
.btn-solid{display:inline-flex; align-items:center; gap:10px; background:var(--accent); color:#1a0f06; padding:16px 30px; font-size:.82rem; letter-spacing:.1em; text-transform:uppercase; font-weight:500; border:none; cursor:pointer; clip-path:polygon(0 0,100% 0,100% 80%,92% 100%,0 100%); transition:background .3s, transform .3s;}
.btn-solid:hover{background:var(--accent-2); transform:translateY(-2px);}
.btn-outline{display:inline-flex; align-items:center; gap:10px; background:transparent; color:var(--text); padding:15px 28px; font-size:.82rem; letter-spacing:.1em; text-transform:uppercase; font-weight:500; border:1px solid var(--line); transition:border-color .3s, color .3s;}
.btn-outline:hover{border-color:var(--accent); color:var(--accent-2);}

/* ---------- NAV (persistente, en las 4 páginas — integrada en el hero, no un bloque aparte) ---------- */
header{position:fixed; top:0; left:0; right:0; z-index:100; padding:26px 0; transition:background .4s, padding .4s, border-color .4s;}
header.solid{background:var(--header-bg); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); border-bottom:1px solid var(--line);}
header.scrolled{padding:16px 0;}
.nav-inner{display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:24px;}
.brand{display:flex; align-items:center; gap:10px; justify-self:start;}
.brand svg{width:27px; height:27px;}
.brand span{font-size:1.18rem;}
nav.site-nav{justify-self:center;}
nav.site-nav ul{list-style:none; display:flex; justify-content:center; gap:40px; margin:0; padding:0;}
nav.site-nav a{font-size:.86rem; letter-spacing:.13em; text-transform:uppercase; font-weight:500; color:var(--text); opacity:.85; position:relative; padding-bottom:3px; text-shadow:0 1px 8px rgba(0,0,0,.35);}
nav.site-nav a:hover, nav.site-nav a.current{opacity:1;}
nav.site-nav a.current::after{content:""; position:absolute; left:0; bottom:-3px; width:100%; height:1px; background:var(--accent);}
nav.site-nav a.is-accent{color:var(--accent-2); opacity:1;}
.nav-social{display:flex; align-items:center; gap:12px; justify-self:end;}
.nav-social a{width:32px; height:32px; border-radius:50%; border:1px solid var(--line); display:flex; align-items:center; justify-content:center; transition:border-color .3s;}
.nav-social a:hover{border-color:var(--accent);}
.nav-social svg{width:14px; height:14px; fill:var(--text);}
.burger{display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:6px;}
.burger span{width:22px; height:2px; background:var(--text);}
@media (max-width:760px){
  .nav-inner{display:flex; align-items:center;}
  .nav-social{display:none;}
  .burger{display:flex; order:2; margin-left:auto;}
  nav.site-nav{order:3; justify-self:auto;}
  nav.site-nav ul{position:fixed; inset:0 0 0 auto; width:min(72vw,320px); height:100vh; background:var(--bg-panel); flex-direction:column; align-items:flex-start; padding:110px 32px 40px; gap:26px; transform:translateX(100%); transition:transform .4s var(--ease); border-left:1px solid var(--line);}
  nav.site-nav ul.open{transform:translateX(0);}
}

/* ---------- BACKDROP fijo (foto difuminada detrás de toda la página, como el hero) ---------- */
.backdrop-photo{position:fixed; inset:0; z-index:-1; overflow:hidden;}
.backdrop-photo img{width:106%; height:106%; margin:-3%; object-fit:cover; object-position:center 32%; filter:blur(3px) saturate(1.05); transform:scale(1.02);}
.backdrop-photo::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(13,11,10,.5) 0%, rgba(13,11,10,.56) 40%, rgba(13,11,10,.78) 100%);}
.backdrop-header{padding:118px 0 14px; text-align:center;}
.backdrop-header .eyebrow{justify-content:center; color:var(--accent-2); margin-bottom:10px;}
.backdrop-header .eyebrow::before{display:none;}
.backdrop-header h1{font-family:var(--slab); font-weight:900; font-size:clamp(2.1rem,6vw,3.4rem); margin:0; letter-spacing:.01em; text-shadow:0 6px 30px rgba(0,0,0,.5);}
.after-backdrop{padding-top:20px !important;}
@media (max-width:760px){ .backdrop-header{padding:104px 0 10px;} }

/* ---------- BANNER DE VIDEO (Carta) ---------- */
.menu-video-banner{position:relative; height:58vh; min-height:400px; overflow:hidden; background:#0d0b0a;}
.menu-video-banner video{position:absolute; inset:0; width:100%; height:100%; object-fit:cover;}
.menu-video-banner::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(13,11,10,.32) 0%, rgba(13,11,10,.5) 55%, var(--bg) 100%);}
.menu-video-banner-content{position:relative; z-index:1; height:100%; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center;}
.menu-video-banner-content .eyebrow{justify-content:center; color:#f0a367;}
.menu-video-banner-content .eyebrow::before{display:none;}
.menu-video-banner-content h1{font-family:var(--slab); font-weight:900; font-size:clamp(2.6rem,7vw,4.4rem); margin:0; color:#f6efe4; text-shadow:0 6px 30px rgba(0,0,0,.55);}

/* ---------- Transición: la greca se dibuja al hacer scroll ---------- */
.greca-reveal{display:flex; flex-direction:column; align-items:center; gap:18px; padding:56px 0 64px; text-align:center;}
.greca-reveal svg{width:96px; height:96px;}
.greca-reveal p{font-family:var(--serif); font-style:italic; font-size:1.15rem; color:var(--text-muted); max-width:420px; margin:0; opacity:0; transform:translateY(10px); transition:opacity .8s var(--ease), transform .8s var(--ease);}
.greca-reveal p.in-view{opacity:1; transform:translateY(0);}

/* ---------- Índice lateral fijo con scroll-spy ---------- */
.menu-rail{position:fixed; right:26px; top:50%; transform:translateY(-50%); z-index:60; display:flex; flex-direction:column; gap:22px; opacity:0; pointer-events:none; transition:opacity .4s;}
.menu-rail.visible{opacity:1; pointer-events:auto;}
.menu-rail a{writing-mode:vertical-rl; text-orientation:mixed; font-size:.72rem; letter-spacing:.16em; text-transform:uppercase; color:var(--text-muted); position:relative; padding-right:14px; transition:color .3s;}
.menu-rail a::after{content:""; position:absolute; right:0; top:0; width:1px; height:100%; background:var(--line); transition:background .3s, height .3s;}
.menu-rail a.active{color:var(--accent);}
.menu-rail a.active::after{background:var(--accent);}
@media (max-width:1150px){ .menu-rail{display:none;} }

/* ---------- HERO simple (banner de página interior) ---------- */
.page-banner{position:relative; height:46vh; min-height:320px; display:flex; align-items:flex-end; overflow:hidden;}
.page-banner img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover;}
.page-banner::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(13,11,10,.35) 0%, rgba(13,11,10,.9) 100%);}
.page-banner-content{position:relative; z-index:1; width:100%; padding:0 0 56px;}
.page-banner .eyebrow{color:var(--accent-2);}
.page-banner h1{font-family:var(--slab); font-weight:900; font-size:clamp(2.4rem,7vw,4.2rem); margin:0; letter-spacing:.01em;}

/* Banner sin foto, para páginas en tema claro (Carta) */
.page-banner-plain{padding:160px 0 60px; text-align:center;}
.page-banner-plain h1{font-family:var(--slab); font-weight:900; font-size:clamp(2.4rem,7vw,4rem); margin:0; letter-spacing:.01em;}
.page-banner-plain .eyebrow{justify-content:center;}
.page-banner-plain .eyebrow::before{display:none;}

/* ---------- HERO home — pantalla completa, fondo difuminado, solo el nombre. La navegación vive en el header, encima del hero. ---------- */
.hero{height:100vh; min-height:560px; display:flex; align-items:center; justify-content:center; position:relative; overflow:hidden;}
.hero-media{position:absolute; inset:0; z-index:0;}
.hero-media img{width:106%; height:106%; margin:-3%; object-fit:cover; object-position:center 40%; filter:blur(7px) saturate(1.05); transform:scale(1.02);}
.hero-media::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(13,11,10,.55) 0%, rgba(13,11,10,.4) 45%, rgba(13,11,10,.72) 100%);}
.hero-content{position:relative; z-index:1; display:flex; flex-direction:column; align-items:center; text-align:center;}
.hero-emblem{width:clamp(46px,6.5vw,68px); height:auto; margin-bottom:22px; opacity:.95;}
.hero h1{font-family:var(--slab); font-weight:900; font-size:clamp(3.6rem,13vw,9.2rem); line-height:.9; letter-spacing:.03em; margin:0; color:var(--text); text-shadow:0 8px 40px rgba(0,0,0,.35);}

/* ---------- NOSOTROS (home) ---------- */
.about-grid{display:grid; grid-template-columns:1fr 1fr; gap:70px; align-items:center;}
.about-text .lead{font-family:var(--serif); font-style:italic; font-size:1.4rem; font-weight:400; line-height:1.5; color:var(--text);}
.about-text p.body-text{color:var(--text-muted); font-size:1.02rem;}
.stats{display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:20px; border-top:1px solid var(--line); padding-top:30px;}
.stat-num{font-family:var(--slab); font-size:clamp(1.9rem,3.4vw,2.6rem); color:var(--accent-2); font-weight:700; line-height:1;}
.stat-label{color:var(--text-muted); font-size:.78rem; letter-spacing:.03em; margin-top:6px;}
.about-collage{position:relative; height:520px;}
.about-collage .img-a{position:absolute; top:0; right:0; width:78%; height:82%; overflow:hidden;}
.about-collage .img-b{position:absolute; bottom:0; left:0; width:50%; height:44%; overflow:hidden; border:6px solid var(--bg);}
.about-collage img{width:100%; height:100%; object-fit:cover;}
@media (max-width:860px){ .about-grid{grid-template-columns:1fr; gap:40px;} .stats{grid-template-columns:1fr 1fr 1fr; gap:12px;} .about-collage{height:380px; margin-top:6px;} }
@media (max-width:520px){ .stats{grid-template-columns:1fr;} }

/* ---------- TESTIMONIOS ---------- */
.testimonials{background:var(--bg-panel);}
.t-list{display:grid; grid-template-columns:1fr 1fr 1fr; gap:0 44px;}
.t-item{padding:0;}
.t-stars{color:var(--accent); letter-spacing:3px; margin-bottom:12px; font-size:.82rem;}
.t-quote{font-family:var(--serif); font-style:italic; font-size:.98rem; color:var(--text); line-height:1.6;}
.t-author{margin-top:14px; font-size:.75rem; letter-spacing:.08em; text-transform:uppercase; color:var(--text-muted);}
.t-author b{color:var(--accent-2); font-weight:500;}
@media (max-width:860px){ .t-list{grid-template-columns:1fr; gap:32px;} }

/* ---------- CARTA (menú completo) ---------- */
.chapter{padding:70px 0;}
.chapter:nth-child(odd){background:var(--bg);}
.chapter:nth-child(even){background:var(--bg-panel);}
.chapter-inner{max-width:820px; margin:0 auto;}
.chapter-head{display:flex; align-items:baseline; gap:20px; margin-bottom:40px;}
.chapter-num{font-family:var(--slab); font-weight:900; font-size:clamp(2.6rem,5vw,3.6rem); color:var(--accent-deep); line-height:1;}
.chapter-title{font-family:var(--serif); font-style:italic; font-weight:400; font-size:clamp(1.8rem,3.4vw,2.5rem); margin:0;}
.subcat{font-weight:500; font-size:.74rem; letter-spacing:.2em; text-transform:uppercase; color:var(--accent-2); margin:0 0 20px; display:flex; align-items:center; gap:10px;}
.subcat::before{content:""; width:14px; height:1px; background:var(--accent);}
.dish-columns{columns:2 300px; column-gap:44px; margin-bottom:42px;}
.dish-block{break-inside:avoid; margin-bottom:22px;}
.dish-line{display:flex; align-items:baseline; gap:10px;}
.dish-line .name{font-family:var(--serif); font-weight:600; font-size:1.02rem; flex-shrink:0;}
.dish-line .leader{flex:1; border-bottom:1px dotted var(--line); min-width:14px; transform:translateY(-4px);}
.dish-line .price{font-family:var(--slab); font-weight:700; color:var(--accent); font-size:.96rem; flex-shrink:0;}
.dish-desc{color:var(--text-muted); font-size:.85rem; font-style:italic; margin:4px 0 0; line-height:1.5;}
.extras-block{margin-top:6px; padding:22px 26px; border:1px solid var(--line);}
.extras-block h5{font-weight:500; font-size:.7rem; letter-spacing:.18em; text-transform:uppercase; color:var(--text-muted); margin:0 0 12px;}
.extras-list{display:flex; flex-wrap:wrap; gap:8px 24px; margin:0; padding:0; list-style:none; font-size:.88rem;}
.extras-list li{color:var(--text-muted);}
.extras-list li b{color:var(--text); font-family:var(--slab); font-weight:700;}
@media (max-width:700px){ .dish-columns{columns:1;} }

/* ---------- RESERVACIONES ---------- */
.reserve-grid{display:grid; grid-template-columns:1.3fr 1fr; gap:60px; align-items:start;}
.reserve-form-wrap{max-width:640px; margin:0 auto;}
.reserve-form{display:grid; gap:20px;}
.form-row{display:grid; grid-template-columns:1fr 1fr; gap:20px;}
.field label{display:block; font-size:.76rem; letter-spacing:.1em; text-transform:uppercase; color:var(--text-muted); margin-bottom:8px;}
.field input, .field select, .field textarea{
  width:100%; background:var(--bg-panel); border:1px solid var(--line); color:var(--text);
  padding:14px 16px; font-family:var(--sans); font-size:.98rem; border-radius:0; transition:border-color .3s;
}
.field input:focus, .field select:focus, .field textarea:focus{outline:none; border-color:var(--accent);}
.field textarea{resize:vertical; min-height:100px;}
.form-note{font-size:.82rem; color:var(--text-muted); margin-top:4px;}
.reserve-side{background:var(--bg-panel); border:1px solid var(--line); padding:38px; position:sticky; top:110px;}
.reserve-side img{width:100%; height:220px; object-fit:cover; margin-bottom:26px;}
.reserve-side h4{font-family:var(--serif); font-style:italic; font-weight:400; font-size:1.3rem; margin-bottom:18px;}
.reserve-side .hours-row{display:flex; justify-content:space-between; padding:12px 0; border-bottom:1px solid var(--line); font-size:.92rem;}
.reserve-side .hours-row:last-of-type{border-bottom:none;}
.reserve-side .side-actions{display:flex; flex-direction:column; gap:14px; margin-top:22px;}
@media (max-width:900px){ .reserve-grid{grid-template-columns:1fr;} .form-row{grid-template-columns:1fr;} .reserve-side{position:static;} }

/* ---------- UBICACION ---------- */
.loc-grid{display:grid; grid-template-columns:.85fr 1.15fr; gap:40px;}
.hours-row{display:flex; justify-content:space-between; padding:10px 0; border-bottom:1px solid var(--line); font-size:.98rem;}
.hours-row:last-of-type{border-bottom:none;}
.hours-time{font-family:var(--slab); color:var(--accent-2); font-weight:700;}
.loc-addr{margin-top:18px; padding-top:18px; border-top:1px solid var(--line); color:var(--text-muted); line-height:1.5;}
.loc-addr b{color:var(--text); display:block; font-family:var(--serif); font-style:italic; font-size:1.15rem; font-weight:400; margin-bottom:6px;}
.map-frame{border:1px solid var(--line); min-height:340px;}
.map-frame iframe{width:100%; height:100%; min-height:400px; border:0; display:block;}
.loc-photo{margin-top:18px; height:170px; overflow:hidden;}
.loc-photo img{width:100%; height:100%; object-fit:cover;}
@media (max-width:900px){ .loc-grid{grid-template-columns:1fr;} }

/* ---------- FOOTER (siempre oscuro, colores fijos — no hereda el tema claro de la Carta) ---------- */
footer{background:#080706; color:#f3ece2; padding:60px 0 28px; border-top:1px solid rgba(243,236,226,.14);}
.footer-top{display:flex; justify-content:space-between; align-items:flex-start; gap:40px; flex-wrap:wrap; padding-bottom:40px; border-bottom:1px solid rgba(243,236,226,.14);}
.footer-brand{display:flex; align-items:center; gap:12px; color:#f3ece2;}
.footer-brand svg{width:32px; height:32px;}
.footer-brand span{font-family:var(--slab); font-weight:700; font-size:1.2rem; letter-spacing:.06em;}
.footer-cols{display:flex; gap:64px; flex-wrap:wrap;}
.footer-col h4{font-size:.72rem; letter-spacing:.18em; text-transform:uppercase; color:#f0a367; margin-bottom:14px; font-weight:500;}
.footer-col p, .footer-col a{display:block; color:#bfb2a2; font-size:.88rem; margin-bottom:8px;}
.footer-col a:hover{color:#f0a367;}
.social-row{display:flex; gap:14px; margin-top:6px;}
.social-row a{width:36px; height:36px; border:1px solid rgba(243,236,226,.14); border-radius:50%; display:flex; align-items:center; justify-content:center; transition:border-color .3s;}
.social-row a:hover{border-color:#d9793d;}
.social-row svg{width:15px; height:15px; fill:#f3ece2;}
.footer-bottom{display:flex; justify-content:space-between; padding-top:22px; color:#bfb2a2; font-size:.76rem; flex-wrap:wrap; gap:10px;}
@media (max-width:600px){ .footer-top{flex-direction:column;} .footer-cols{gap:36px;} }
