:root{
  --bg:#0f0d0a;
  --paper:#fbf6ee;
  --cream:#f3e6d4;
  --wood:#3b2a1d;
  --cocoa:#6b3f24;
  --gold:#c8a46a;
  --ink:#1a140f;
  --muted:#6f6256;
  --card:#ffffff;
  --shadow: 0 18px 45px rgba(0,0,0,.18);
  --radius:22px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
  color:var(--ink);
  background: radial-gradient(1200px 900px at 15% 0%, #fff 0%, var(--paper) 40%, #efe0cd 100%);
}
a{color:inherit}
img{max-width:100%; display:block}
.container{width:min(1120px, 92vw); margin:0 auto}
.btn{
  display:inline-flex; gap:.55rem; align-items:center; justify-content:center;
  padding:.95rem 1.05rem;
  border-radius:999px;
  border:1px solid rgba(0,0,0,.10);
  text-decoration:none;
  font-weight:650;
  letter-spacing:.2px;
  transition: transform .15s ease, box-shadow .2s ease, background .2s ease;
  user-select:none;
}
.btn:hover{transform:translateY(-1px); box-shadow:0 10px 26px rgba(0,0,0,.12)}
.btn.primary{background:linear-gradient(135deg, var(--wood), #1b130d); color:#fff; border-color:rgba(255,255,255,.12)}
.btn.ghost{background:rgba(255,255,255,.65)}
.badge{
  display:inline-flex; align-items:center; gap:.5rem;
  padding:.4rem .7rem;
  border-radius:999px;
  background:rgba(255,255,255,.62);
  border:1px solid rgba(0,0,0,.06);
  font-weight:600;
  color:var(--wood);
}
nav{
  position:sticky; top:0; z-index:50;
  backdrop-filter:saturate(150%) blur(10px);
  background:rgba(251,246,238,.72);
  border-bottom:1px solid rgba(0,0,0,.07);
}
.nav-wrap{display:flex; align-items:center; justify-content:space-between; padding:.85rem 0}
.brand{display:flex; align-items:center; gap:.8rem; text-decoration:none}
.brand img{width:44px; height:44px; border-radius:12px; box-shadow:0 8px 18px rgba(0,0,0,.10)}
.brand .t{line-height:1.05}
.brand .t strong{display:block; font-size:1.05rem; letter-spacing:.2px}
.brand .t span{display:block; font-size:.86rem; color:var(--muted)}
.nav-links{display:flex; gap:.9rem; align-items:center}
.nav-links a{
  text-decoration:none; font-weight:650; color:var(--wood);
  padding:.55rem .8rem; border-radius:999px;
}
.nav-links a:hover{background:rgba(0,0,0,.05)}
.menu-btn{
  display:none;
  background:rgba(0,0,0,.05);
  border:1px solid rgba(0,0,0,.08);
  border-radius:12px;
  padding:.55rem .65rem;
}
.hero{
  position:relative;
  padding:4.7rem 0 2.2rem;
}
.hero-grid{
  display:grid;
  grid-template-columns: 1.15fr .85fr;
  gap:2rem;
  align-items:stretch;
}
.hero-card{
  border-radius:var(--radius);
  overflow:hidden;
  box-shadow: var(--shadow);
  background: linear-gradient(180deg, rgba(255,255,255,.9), rgba(255,255,255,.75));
  border:1px solid rgba(0,0,0,.06);
}
.hero-media{
  min-height:420px;
  background: url("assets/img/portada.jpg") center/cover no-repeat;
  position:relative;
}
.hero-media:after{
  content:"";
  position:absolute; inset:0;
  background: linear-gradient(90deg, rgba(15,13,10,.65), rgba(15,13,10,.10));
}
.hero-content{
  padding:2.1rem 2.2rem;
  display:flex; flex-direction:column; gap:1rem;
}
.h1{
  font-size: clamp(2.0rem, 3.7vw, 3.2rem);
  line-height:1.05;
  margin:.2rem 0;
  color:#1a120c;
}
.lead{font-size:1.05rem; color:#3f342c; line-height:1.55}
.hero-actions{display:flex; flex-wrap:wrap; gap:.7rem; margin-top:.2rem}
.kpis{display:grid; grid-template-columns: repeat(3,1fr); gap:.7rem; margin-top:.35rem}
.kpi{
  background:rgba(255,255,255,.65);
  border:1px solid rgba(0,0,0,.06);
  border-radius:18px;
  padding:.8rem .9rem;
}
.kpi strong{display:block; font-size:1.02rem; color:var(--wood)}
.kpi span{display:block; font-size:.85rem; color:var(--muted); margin-top:.1rem}

.section{padding:3.2rem 0}
.section h2{font-size:1.75rem; margin:0 0 .4rem; color:var(--wood)}
.section p{margin:.3rem 0; color:#3e342b; line-height:1.65}
.grid-2{display:grid; grid-template-columns:1fr 1fr; gap:1.4rem; align-items:start}
.card{
  background:rgba(255,255,255,.78);
  border:1px solid rgba(0,0,0,.06);
  border-radius:var(--radius);
  box-shadow:0 12px 30px rgba(0,0,0,.08);
  overflow:hidden;
}
.card .pad{padding:1.4rem}
.pill-list{display:flex; flex-wrap:wrap; gap:.55rem; margin:.8rem 0 0}
.pill{
  padding:.45rem .7rem;
  border-radius:999px;
  background:rgba(0,0,0,.05);
  border:1px solid rgba(0,0,0,.07);
  font-weight:650;
  color:#3d2b1e;
  font-size:.88rem;
}
.gallery{
  display:grid;
  grid-template-columns: repeat(12,1fr);
  gap:.8rem;
}
.g-item{grid-column: span 4; border-radius:18px; overflow:hidden; position:relative; cursor:pointer}
.g-item img{width:100%; height:260px; object-fit:cover; transition: transform .35s ease}
.g-item:after{
  content:""; position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(0,0,0,0), rgba(0,0,0,.25));
  opacity:.35; transition:opacity .25s ease;
}
.g-item:hover img{transform:scale(1.04)}
.g-item:hover:after{opacity:.55}

.lightbox{
  position:fixed; inset:0; z-index:200;
  display:none;
  align-items:center; justify-content:center;
  background:rgba(8,6,4,.82);
  padding:1.2rem;
}
.lightbox.open{display:flex}
.lb-inner{
  width:min(1100px, 96vw);
  max-height:86vh;
  border-radius:18px;
  overflow:hidden;
  box-shadow:0 40px 90px rgba(0,0,0,.45);
  background:#000;
  position:relative;
}
.lb-inner img{width:100%; height:86vh; object-fit:contain; background:#000}
.lb-close, .lb-prev, .lb-next{
  position:absolute; top:.8rem;
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.18);
  color:#fff;
  padding:.6rem .8rem;
  border-radius:999px;
  cursor:pointer;
  font-weight:700;
  backdrop-filter: blur(10px);
}
.lb-close{right:.8rem}
.lb-prev, .lb-next{top:50%; transform:translateY(-50%); padding:.65rem .85rem}
.lb-prev{left:.8rem}
.lb-next{right:.8rem}

.embed-grid{display:grid; grid-template-columns:1fr 1fr; gap:1.1rem}
.embed{
  border-radius:22px;
  overflow:hidden;
  border:1px solid rgba(0,0,0,.08);
  background:#fff;
  min-height:420px;
}
.embed .top{
  padding:.9rem 1rem;
  display:flex; align-items:center; justify-content:space-between;
  border-bottom:1px solid rgba(0,0,0,.07);
  background:linear-gradient(180deg,#fff, #fbf6ee);
}
.embed .top strong{color:var(--wood)}
.embed iframe{width:100%; height:420px; border:0}
.small-note{font-size:.9rem; color:var(--muted)}
.form-grid{display:grid; grid-template-columns:1fr 1fr; gap:.85rem}
.input, textarea{
  width:100%;
  padding:.9rem 1rem;
  border-radius:16px;
  border:1px solid rgba(0,0,0,.10);
  background:rgba(255,255,255,.9);
  font-size:1rem;
  outline:none;
}
textarea{min-height:140px; resize:vertical; grid-column:1/-1}
.input:focus, textarea:focus{border-color: rgba(107,63,36,.55); box-shadow:0 0 0 4px rgba(200,164,106,.20)}
.form-actions{display:flex; gap:.7rem; align-items:center; flex-wrap:wrap; margin-top:.85rem}

.map{border-radius:22px; overflow:hidden; border:1px solid rgba(0,0,0,.08); background:#fff}
.map iframe{width:100%; height:380px; border:0}

footer{
  padding:2.2rem 0;
  border-top:1px solid rgba(0,0,0,.08);
  background:rgba(251,246,238,.7);
}
footer .row{display:flex; gap:1rem; align-items:center; justify-content:space-between; flex-wrap:wrap}
footer p{margin:.2rem 0; color:#4a3f35}
.whatsapp-float{
  position:fixed; right:18px; bottom:18px; z-index:120;
  width:58px; height:58px; border-radius:50%;
  display:grid; place-items:center;
  background:linear-gradient(135deg,#1fa855,#0b7b39);
  box-shadow:0 16px 32px rgba(0,0,0,.22);
  border:1px solid rgba(255,255,255,.2);
  text-decoration:none;
}

.reveal{opacity:0; transform: translateY(14px); transition: opacity .7s ease, transform .7s ease}
.reveal.visible{opacity:1; transform: translateY(0)}

@media (max-width: 900px){
  .hero-grid{grid-template-columns:1fr; gap:1.1rem}
  .hero-media{min-height:340px}
  .grid-2{grid-template-columns:1fr}
  .embed-grid{grid-template-columns:1fr}
  .g-item{grid-column: span 6}
}
@media (max-width: 560px){
  .nav-links{display:none}
  .menu-btn{display:inline-flex}
  .kpis{grid-template-columns:1fr}
  .g-item{grid-column: span 12}
  .hero{padding:3.7rem 0 1.8rem}
}
.whatsapp-float span{font-size:28px; line-height:1; color:#fff}
