/* =========================================================
   TERO — Estilo "fino" (capa sobre styles.css)
   Volver al estilo anterior: sacar el <link> de este archivo en index.html
   ========================================================= */
:root{
  --bone:#F8F4EA; --bone-2:#EFE8D8; --paper:#FFFDF7;
  --olive:#2F3A26; --olive-2:#3A4830;
  --clay:#A4532E; --clay-dark:#8A4424;
  --gold:#B99556; --ink:#23281C; --muted:#6B685C;
  --line:rgba(35,40,28,.2); --line-soft:rgba(35,40,28,.12);
  --serif:"Cormorant Garamond", Georgia, serif;
  --sans:"Outfit", system-ui, -apple-system, sans-serif;
  --r:2px;
  --shadow:none; --shadow-lg:0 30px 60px -40px rgba(35,40,28,.45);
}
body{ font-weight:300; }
h1,h2,h3,h4{ font-weight:400; letter-spacing:-.01em; line-height:1.04; }
h1 em,h2 em{ font-style:italic; font-weight:300; }
.eyebrow{ font-weight:400; letter-spacing:.2em; font-size:12px; }
.lead{ font-weight:300; }

/* Botones: píldora oliva + contorno fino */
.btn{ border-radius:100px; font-weight:400; letter-spacing:.02em; }
.btn-clay{ background:var(--olive); color:#F8F4EA; box-shadow:none; }
.btn-clay:hover{ background:var(--olive-2); }
.btn-ghost{ border-color:var(--ink); color:var(--ink); border-radius:2px; }
.btn-ghost:hover{ background:var(--ink); color:var(--bone); }
.btn-light{ border-radius:100px; }

/* Header claro con línea fina */
.site-header{ background:var(--bone); backdrop-filter:none; box-shadow:none; border-bottom:1px solid rgba(35,40,28,.14); }
.nav a{ font-size:15px; font-weight:400; }
.header-cta .btn-clay{ background:transparent; color:var(--ink); border:1px solid var(--ink); border-radius:2px; padding:11px 26px; font-size:14px; }
.header-cta .btn-clay:hover{ background:var(--ink); color:var(--bone); }

/* Portada */
.hero-split{ background:var(--bone); grid-template-columns:1fr 1fr; align-items:center; gap:clamp(30px,5vw,70px); padding:110px var(--gut) 50px; min-height:min(100svh,900px); }
.hero-split-text{ padding:0; }
.hero-split-text h1{ font-weight:400; font-size:clamp(44px,6.2vw,92px); line-height:.98; }
.hero-split-text .lead{ color:#4a4a3e; font-size:18px; }
.hero-split-media{ display:block; height:min(70vh,640px); border-radius:40px 40px 40px 180px; overflow:hidden; background:none; }
.hero-split-media image-slot:first-child{ width:100%; height:100%; }
.hero-split-media image-slot:nth-child(n+2){ display:none; }
.hero-split-step{ letter-spacing:.14em; text-transform:uppercase; font-size:12px; }
.hero-split-step::before{ background:var(--muted); }

.strip{ background:var(--olive); }
.strip span{ font-weight:400; font-size:20px; }

/* Nosotros */
.intro .figure image-slot{ border-radius:0 0 0 0; }
.intro .figure .badge{ border-radius:0; border:1px solid rgba(185,149,86,.6); box-shadow:none; }
.intro .figure .badge .q{ color:var(--ink); font-weight:400; }

/* Tres experiencias: tarjetas de color con número dorado y foto enmarcada, sobre fondo carbón */
#restaurante{ background:#1C1E1A; color:#EDE6D4; padding-top:clamp(64px,8vw,110px) !important; }
#restaurante .eyebrow{ color:#D8B773; } #restaurante .eyebrow::before{ background:#D8B773; }
.serv-head{ flex-direction:column; align-items:center; text-align:center; }
.serv-head h2{ max-width:none; font-weight:300; font-size:clamp(34px,4.6vw,62px); color:#EDE6D4; }
.serv-head .lead{ color:rgba(237,230,212,.7); max-width:none; }
.serv-grid{ gap:26px; }
.serv-card{ display:grid; grid-template-rows:auto auto auto auto auto; align-content:start; border-radius:0; padding:26px 26px 22px; min-height:0; align-items:start; color:#F4EEDD; background:linear-gradient(160deg,#2F3A26,#3a4830); }
.serv-card:nth-child(2){ background:linear-gradient(160deg,#9A4A29,#B8613A); }
.serv-card:nth-child(3){ background:linear-gradient(160deg,#D9CBAA,#C7B48C); color:#2b2a20; }
.serv-card::after{ display:none; }
.serv-card .body{ display:contents; padding:0; }
.serv-card .num{ order:1; font-family:var(--serif); font-style:italic; font-weight:300; font-size:76px; line-height:.9; letter-spacing:0; opacity:1; color:#D8B773; margin-bottom:14px; }
.serv-card:nth-child(3) .num{ color:#8a6a30; }
.serv-card image-slot{ overflow:hidden; order:2; position:relative; inset:auto; z-index:auto; height:210px; margin:8px; outline:1px solid rgba(216,183,115,.5); outline-offset:8px; border-radius:0; margin-bottom:22px; }
.serv-card:nth-child(3) image-slot{ outline-color:rgba(138,106,48,.5); }
.serv-card h3{ order:3; font-family:var(--sans); font-weight:400; font-size:19px; letter-spacing:.1em; text-transform:uppercase; margin:6px 0 10px; }
.serv-card p{ order:4; max-height:none; opacity:.92; overflow:visible; color:inherit; font-size:14.5px; line-height:1.6; margin-bottom:26px; }
.serv-card .lnk{ order:5; align-self:end; border-bottom:0; border-top:1px solid rgba(255,255,255,.3); padding-top:14px; width:100%; justify-content:space-between; font-size:12px; letter-spacing:.12em; text-transform:uppercase; font-weight:400; }
.serv-card:nth-child(3) .lnk{ border-top-color:rgba(43,42,32,.25); }

/* Carta: crema, con separadores de puntos */
.menu-sec{ background:var(--bone); color:var(--ink); }
.menu-sec .eyebrow{ color:var(--clay); } .menu-sec .eyebrow::before, .menu-sec .eyebrow.center::after{ background:var(--clay); }
.menu-head h2{ font-weight:400; }
.menu-head p{ color:var(--muted); }
.menu-tabs{ gap:26px; border-bottom:1px solid var(--line); max-width:900px; margin-inline:auto; }
.menu-tab{ border:0; border-radius:0; color:var(--muted); font-weight:400; font-size:14.5px; letter-spacing:.02em; padding:0 0 12px; text-transform:none; margin-bottom:-1px; }
.menu-tab:hover{ color:var(--ink); border-color:transparent; }
.menu-tab.active{ background:transparent; border-bottom:1px solid var(--ink); color:var(--ink); }
.menu-item{ border-bottom:1px dotted rgba(35,40,28,.35); }
.menu-item .nm{ font-weight:500; font-size:25px; }
.menu-item .pr{ color:var(--clay); font-size:24px; }
.menu-item .ds{ color:var(--muted); }
.menu-item .tag{ border-radius:0; background:rgba(164,83,46,.12); color:var(--clay); }
.menu-subcat{ color:var(--clay); border-top:1px solid var(--line); }
.menu-legend{ color:var(--muted); }

/* Promociones y mediodía */
.promos{ background:var(--olive); border-top:0; }
.promos .eyebrow{ color:#D8B773; }
.promos .p-head h2{ color:#F4EEDD; font-weight:300; }
.promo-card{ border-radius:0 40px 0 0; border:0; box-shadow:none; }
.promo-card img{ border-radius:0; }
.pc-t{ font-weight:500; }
.midday{ background:var(--bone-2); }
.midday .m-head h2{ font-weight:400; }
.exec-banner, .midday .exec-banner{ border:1px solid rgba(35,40,28,.25); border-radius:0; box-shadow:none; background:var(--paper); }
.exec-banner .ex-p{ color:var(--clay); font-weight:400; }
.md-main, .midday .md-main{ border:0; border-radius:0 60px 0 0; box-shadow:none; background:var(--paper); }
.md-img{ border-radius:0; }
.md-price{ color:var(--clay); font-weight:400; }
.midday .md-ent, .midday .md-det{ border:1px solid rgba(35,40,28,.2); border-radius:0; background:var(--paper); }
.md-tag{ border-radius:0; }

/* Eventos */
.ev-feature{ border-radius:0 80px 0 0; }
.ev-mini{ border-radius:0; border:0; box-shadow:none; color:#F4EEDD; }
.ev-side .ev-mini:nth-child(1){ background:linear-gradient(160deg,#2F3A26,#3a4830); }
.ev-side .ev-mini:nth-child(2){ background:linear-gradient(160deg,#9A4A29,#B8613A); }
.ev-mini h4, .ev-mini p, .ev-stats .st b, .ev-stats .st span{ color:#F4EEDD; }
.ev-mini h4{ font-weight:400; }
.ev-feats span{ background:rgba(244,238,221,.16); color:#F4EEDD; border-radius:0; }
.why-card{ border-radius:0; border:1px solid var(--line); background:var(--paper); }
.why-card .ic{ border-radius:0; background:transparent; border:1px solid var(--gold); color:var(--gold); }
.g-grid image-slot{ border-radius:0; }
.g-grid image-slot.wide.tall:first-child{ border-radius:0 0 0 80px; }

/* Reseñas, reservas, horarios */
.reviews{ background:#1C1E1A; }
.reviews .eyebrow{ color:#D8B773; }
.r-card{ border-radius:0; border:1px solid rgba(237,230,212,.2); background:transparent; }
.r-card .who .av{ border-radius:50%; background:var(--clay); }
.reserve-card{ border-radius:0 60px 0 0; border:1px solid var(--line); box-shadow:none; background:var(--paper); }
.rf-toggle{ border-radius:0; background:transparent; border-bottom:1px solid var(--line); padding:0; }
.rf-toggle button{ border-radius:0; font-weight:400; }
.rf-toggle button.active{ background:transparent; color:var(--ink); border-bottom:1px solid var(--ink); box-shadow:none; }
.field input, .field select, .field textarea{ border-radius:0; }
.locate{ background:#1C1E1A; }
.loc-map{ border-radius:0 0 0 80px; }
.footer{ background:#14150f; }
.mobile-nav{ background:#1C1E1A; }

/* Ventanas */
.popup-card{ border-radius:0 40px 0 0; background:var(--paper); }
.popup-highlight{ border-radius:0; }
.private .wrap{ border-radius:0 60px 0 0; }
.sp-photo{ border-radius:0; }

@media (max-width:900px){
  .hero-split{ grid-template-columns:1fr; padding-top:120px; }
  .hero-split-media{ height:58vh; border-radius:30px 30px 30px 90px; }
  .serv-grid{ gap:18px; }
}

.hero-split{ padding-top:150px; }
.hero-split-text .eyebrow{ margin-top:0; }
.serv-card image-slot{ --radius:0px; }
.serv-card image-slot::part(image), .serv-card image-slot img{ border-radius:0 !important; }
.serv-card .lnk{ align-self:end; }
.serv-card:nth-child(1) .lnk, .serv-card:nth-child(2) .lnk, .serv-card:nth-child(3) .lnk{ margin-top:auto; }

/* Textos con color claro en línea (heredados del tema oscuro) sobre fondos ahora claros */
.menu-head .lead, .menu-head p{ color:var(--muted) !important; }
.menu-sec .menu-legend{ color:var(--muted); }
.menu-item .nm .gf, .menu-item .nm .shr, .menu-legend img{ filter:brightness(.62) saturate(1.5); }

/* Por qué Tero: filas compactas con el ícono al costado */
@media (max-width:900px){
  .why-grid{ grid-template-columns:1fr; gap:10px; margin-top:32px; }
  .why-card{ display:grid; grid-template-columns:44px 1fr; column-gap:16px; align-items:start; padding:16px 18px; }
  .why-card .ic{ grid-row:1 / span 2; width:44px; height:44px; margin:0; }
  .why-card .ic svg{ width:22px; height:22px; }
  .why-card h4{ font-size:20px; margin:0 0 4px; line-height:1.15; }
  .why-card p{ margin:0; font-size:14px; line-height:1.5; }
}

/* Portada: aire suficiente bajo la barra de aviso + header fijo */
.hero-split{ padding-top:150px; }
body.has-aviso .hero-split{ padding-top:calc(var(--aviso-h,40px) + 130px); }
.hero-split-text h1{ font-size:clamp(42px,5.4vw,84px); }
@media (max-width:900px){ body.has-aviso .hero-split{ padding-top:calc(var(--aviso-h,40px) + 110px); } }