:root{
  --bg:#0b0b0c;
  --bg2:#0f1012;
  --card:#121317;
  --text:#f4f4f5;
  --muted:#b7bac2;
  --accent:#d4af37;
  --accent2:#ffffff;
  --ring: rgba(212,175,55,.35);
  --shadow: 0 18px 45px rgba(0,0,0,.45);
  --radius: 22px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,"Helvetica Neue",Arial,sans-serif;background:radial-gradient(1200px 700px at 15% 10%, rgba(212,175,55,.12), transparent 55%), radial-gradient(900px 700px at 90% 20%, rgba(255,255,255,.05), transparent 60%), var(--bg); color:var(--text);}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.container{width:min(1120px, 92vw); margin:0 auto;}
.btn{
  display:inline-flex; align-items:center; justify-content:center;
  gap:.55rem; padding:.85rem 1.05rem;
  border-radius:999px; border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.06);
  backdrop-filter: blur(8px);
  transition: transform .18s ease, background .18s ease, border-color .18s ease, box-shadow .18s ease;
  cursor:pointer;
  user-select:none;
}
.btn:hover{transform: translateY(-1px); background:rgba(255,255,255,.10); border-color: rgba(212,175,55,.42); box-shadow: 0 10px 25px rgba(0,0,0,.35);}
.btn.primary{background: linear-gradient(135deg, rgba(212,175,55,.9), rgba(212,175,55,.55)); border-color: rgba(212,175,55,.65); color:#0b0b0c; font-weight:700;}
.btn.primary:hover{background: linear-gradient(135deg, rgba(212,175,55,1), rgba(212,175,55,.68));}
.badge{display:inline-flex; align-items:center; gap:.4rem; padding:.35rem .7rem; border-radius:999px; border:1px solid rgba(212,175,55,.35); background: rgba(212,175,55,.12); color: var(--text); font-size:.88rem;}
.nav{
  position:sticky; top:0; z-index:50;
  background: rgba(11,11,12,.62); border-bottom:1px solid rgba(255,255,255,.08);
  backdrop-filter: blur(10px);
}
.nav-inner{display:flex; align-items:center; justify-content:space-between; padding:.85rem 0; gap:1rem;}
.brand{display:flex; align-items:center; gap:.75rem;}
.brand img{width:40px; height:40px; border-radius:12px; box-shadow: 0 10px 25px rgba(0,0,0,.35);}
.brand .title{display:flex; flex-direction:column; line-height:1.1}
.brand .title strong{letter-spacing:.08em; text-transform:uppercase; font-size:.92rem}
.brand .title span{color:var(--muted); font-size:.9rem}
.navlinks{display:flex; gap:.9rem; align-items:center;}
.navlinks a{color:var(--muted); font-weight:600; font-size:.95rem; padding:.4rem .55rem; border-radius:999px; transition: background .18s ease, color .18s ease;}
.navlinks a:hover{color:var(--text); background: rgba(255,255,255,.07);}
.menu-btn{display:none}
.hero{
  position:relative; overflow:hidden;
  min-height: 72vh;
  display:flex; align-items:stretch;
}
.hero::before{
  content:""; position:absolute; inset:0;
  background: url("assets/img/portada.jpg") center/cover no-repeat;
  filter: saturate(1.05) contrast(1.05);
  transform: scale(1.03);
}
.hero::after{
  content:""; position:absolute; inset:0;
  background: linear-gradient(90deg, rgba(11,11,12,.92) 0%, rgba(11,11,12,.72) 45%, rgba(11,11,12,.35) 100%);
}
.hero-content{
  position:relative; z-index:2;
  display:grid; grid-template-columns: 1.1fr .9fr;
  align-items:center; gap:2rem;
  padding: 4.2rem 0;
}
.h1{font-size: clamp(2.2rem, 5vw, 3.35rem); margin:.6rem 0 1rem; letter-spacing:-.02em;}
.lead{color:var(--muted); font-size:1.08rem; line-height:1.65;}
.hero-card{
  background: rgba(18,19,23,.62);
  border:1px solid rgba(255,255,255,.10);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 1.25rem;
  backdrop-filter: blur(10px);
}
.kpi{display:grid; grid-template-columns: repeat(2, 1fr); gap:.75rem; margin-top:1rem;}
.kpi .item{padding:.85rem .9rem; border-radius:18px; border:1px solid rgba(255,255,255,.10); background: rgba(255,255,255,.05);}
.kpi .item strong{display:block; font-size:1.05rem;}
.kpi .item span{display:block; color:var(--muted); font-size:.9rem; margin-top:.2rem}
.section{padding: 4rem 0;}
.section h2{font-size: clamp(1.55rem, 3vw, 2.1rem); margin:0 0 1rem;}
.section p{color:var(--muted); line-height:1.7; margin:0 0 1rem;}
.grid3{display:grid; grid-template-columns: repeat(3, 1fr); gap:1rem; margin-top:1.3rem;}
.card{
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
  border:1px solid rgba(255,255,255,.10);
  border-radius: var(--radius);
  box-shadow: 0 12px 30px rgba(0,0,0,.25);
  padding: 1.25rem;
}
.card h3{margin:.2rem 0 .35rem; font-size:1.05rem;}
.card p{margin:0; color:var(--muted); font-size:.98rem;}
.pill{display:inline-flex; align-items:center; gap:.5rem; padding:.38rem .7rem; border-radius:999px; background: rgba(212,175,55,.10); border:1px solid rgba(212,175,55,.25); color: var(--text); font-weight:700; font-size:.85rem;}
.gallery{
  display:grid; grid-template-columns: repeat(4, 1fr);
  gap:.75rem; margin-top:1.2rem;
}
.gallery button{
  padding:0; border:0; background:transparent; cursor:pointer;
  border-radius: 18px; overflow:hidden;
  position:relative;
  box-shadow: 0 10px 25px rgba(0,0,0,.28);
  outline: 1px solid rgba(255,255,255,.10);
  transition: transform .18s ease, outline-color .18s ease;
}
.gallery button:hover{transform: translateY(-2px); outline-color: rgba(212,175,55,.5);}
.gallery img{width:100%; height:190px; object-fit:cover;}
.gallery button::after{
  content:"Ampliar"; position:absolute; inset:auto 10px 10px auto;
  font-size:.82rem; padding:.35rem .55rem; border-radius:999px;
  background: rgba(0,0,0,.55); border:1px solid rgba(255,255,255,.15);
  color: rgba(255,255,255,.92);
}
.lightbox{
  position:fixed; inset:0; z-index:999;
  background: rgba(0,0,0,.76);
  display:none; align-items:center; justify-content:center;
  padding: 18px;
}
.lightbox.open{display:flex;}
.lightbox .frame{
  width:min(1100px, 96vw); max-height: 86vh;
  background: rgba(18,19,23,.72);
  border:1px solid rgba(255,255,255,.12);
  border-radius: 22px;
  overflow:hidden;
  box-shadow: 0 25px 70px rgba(0,0,0,.6);
  position:relative;
}
.lightbox img{width:100%; height:100%; object-fit:contain; background:#000; max-height:86vh;}
.lightbox .close{
  position:absolute; top:10px; right:10px;
  width:42px; height:42px; border-radius:999px;
  border:1px solid rgba(255,255,255,.18);
  background: rgba(0,0,0,.42);
  color: white; font-size:22px; cursor:pointer;
}
.video{
  border-radius: var(--radius);
  overflow:hidden;
  border:1px solid rgba(255,255,255,.12);
  box-shadow: var(--shadow);
  background: rgba(255,255,255,.04);
}
.video .ratio{position:relative; padding-top:56.25%;}
.video iframe{position:absolute; inset:0; width:100%; height:100%; border:0;}
.split{display:grid; grid-template-columns: 1fr 1fr; gap:1.3rem; align-items:start;}
.embed{
  border-radius: var(--radius);
  border:1px solid rgba(255,255,255,.12);
  overflow:hidden;
  background: rgba(255,255,255,.04);
  min-height: 330px;
}
.embed .head{padding: 1rem 1.1rem; border-bottom:1px solid rgba(255,255,255,.10); display:flex; align-items:center; justify-content:space-between; gap:1rem;}
.embed .head strong{font-size:1rem}
.embed iframe{width:100%; height:360px; border:0; background:#111;}
.form{
  display:grid; gap:.75rem;
}
.input{
  padding:.9rem 1rem;
  border-radius: 16px;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.05);
  color: var(--text);
  outline:none;
}
textarea.input{min-height: 130px; resize: vertical;}
.small{font-size:.92rem; color: var(--muted);}
.footer{
  padding: 2.6rem 0;
  border-top:1px solid rgba(255,255,255,.10);
  color: var(--muted);
}
.footer .row{display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap;}
.floating{
  position:fixed; right:18px; bottom:18px; z-index:80;
  display:flex; flex-direction:column; gap:.7rem;
}
.fab{
  width:54px; height:54px; border-radius:999px;
  display:grid; place-items:center;
  border:1px solid rgba(255,255,255,.16);
  background: rgba(18,19,23,.75);
  backdrop-filter: blur(10px);
  box-shadow: 0 18px 45px rgba(0,0,0,.5);
  transition: transform .18s ease, border-color .18s ease, background .18s ease;
}
.fab:hover{transform: translateY(-2px); border-color: rgba(212,175,55,.55); background: rgba(18,19,23,.88);}
.fab svg{width:24px; height:24px; fill: none; stroke: var(--text); stroke-width:2; stroke-linecap:round; stroke-linejoin:round;}
.reveal{opacity:0; transform: translateY(18px); transition: opacity .7s ease, transform .7s ease;}
.reveal.visible{opacity:1; transform: translateY(0);}
@media (max-width: 940px){
  .hero-content{grid-template-columns: 1fr; padding: 3.2rem 0;}
  .split{grid-template-columns:1fr;}
  .gallery{grid-template-columns: repeat(2, 1fr);}
  .grid3{grid-template-columns: 1fr;}
  .navlinks{display:none;}
  .menu-btn{display:inline-flex;}
}

/* Mobile dropdown */
.navlinks.open{display:flex; position:absolute; left:0; right:0; top:64px; padding: .8rem 4vw 1rem; background: rgba(11,11,12,.92); border-bottom:1px solid rgba(255,255,255,.10); flex-direction:column; gap:.35rem;}
.navlinks.open a{padding:.75rem .9rem; border-radius:14px;}