
:root{
  --bg-dark:#000;
  --bg-light:#111;
  --text-light:#fff;
  --text-dim:#c7c7c7;
  --gold-start:#a88a2a;
  --gold-end:#fff1a8;
  --accent:#d4af37;
  --radius-xl:1.5rem;
  --radius-lg:1rem;
  --radius-md:.5rem;
  --transition:.3s ease;
  --shadow-card:0 20px 40px rgba(0,0,0,.6);
  --max-w:1200px;
  --font-head:'Playfair Display',serif;
  --font-body:'Montserrat',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',sans-serif;
}

*{box-sizing:border-box;margin:0;padding:0}

body{
  background-color:var(--bg-dark);
  color:var(--text-light);
  font-family:var(--font-body);
  line-height:1.5;
}

/* WhatsApp Float */
.whatsapp-float{
  position:fixed;
  right:1rem;
  bottom:1rem;
  background:linear-gradient(135deg,#25d366 0%,#128c7e 100%);
  color:#fff;
  display:flex;
  align-items:center;
  gap:.5rem;
  font-weight:600;
  text-decoration:none;
  padding:.8rem 1rem;
  border-radius:var(--radius-lg);
  box-shadow:0 10px 25px rgba(0,0,0,.6);
  z-index:9999;
  font-size:.9rem;
}
.whatsapp-float .wa-icon{font-size:1.2rem;line-height:1}

/* HERO */
.hero{
  position:relative;
  min-height:90vh;
  background:#000 url('assets/1.jpg') center/cover no-repeat fixed;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:4rem 1rem 6rem;
}
.hero-overlay{
  position:absolute;
  inset:0;
  background:radial-gradient(circle at 50% 40%,rgba(0,0,0,.1) 0%,rgba(0,0,0,.8) 60%,rgba(0,0,0,1) 100%);
}
.hero-content{
  position:relative;
  max-width:600px;
  z-index:2;
  animation:fadeUp .8s both;
  color:var(--text-light);
}
.logo-main{
  width:110px;
  height:auto;
  border-radius:var(--radius-md);
  box-shadow:0 20px 40px rgba(0,0,0,.8);
  border:2px solid var(--accent);
  background:#000;
  padding:.5rem;
  margin:0 auto 1rem;
}
.brand-title{
  font-family:var(--font-head);
  font-size:2.8rem;
  font-weight:600;
  color:var(--text-light);
  letter-spacing:.05em;
}
.brand-sub{
  text-transform:uppercase;
  font-weight:700;
  font-size:1rem;
  color:var(--accent);
  letter-spacing:.2em;
  margin-top:.5rem;
}
.hero-badges{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:1rem;
  margin:2rem 0;
}
.badge{
  background:rgba(0,0,0,.6);
  border:1px solid var(--accent);
  border-radius:var(--radius-md);
  padding:1rem 1.2rem;
  font-size:.8rem;
  line-height:1.4;
  min-width:150px;
  color:var(--text-light);
  box-shadow:0 15px 30px rgba(0,0,0,.8);
}
.cta-btn{
  background:linear-gradient(90deg,var(--gold-start) 0%,var(--gold-end) 100%);
  color:#000;
  font-weight:700;
  text-decoration:none;
  display:inline-block;
  padding:1rem 1.5rem;
  border-radius:var(--radius-lg);
  font-size:1rem;
  box-shadow:0 20px 40px rgba(0,0,0,.8);
  border:0;
  cursor:pointer;
  transition:var(--transition);
}
.cta-btn:hover{
  filter:brightness(1.1);
  box-shadow:0 25px 50px rgba(0,0,0,.9);
}

/* SECTION */
.section{
  padding:4rem 1rem;
  position:relative;
}
.section-dark{
  background:linear-gradient(180deg,#000 0%,#1a1a1a 100%);
  color:var(--text-light);
}
.section-light{
  background:#111;
  color:var(--text-light);
}
.section-inner{
  max-width:var(--max-w);
  margin:0 auto;
}
.section-title{
  font-family:var(--font-head);
  font-size:2rem;
  line-height:1.2;
  font-weight:600;
  color:var(--accent);
  margin-bottom:1rem;
  text-align:left;
}
.section-title.center{text-align:center}
.section-desc{
  color:var(--text-dim);
  font-size:1rem;
  max-width:700px;
  margin-bottom:2rem;
}
.section-desc.center{
  margin-left:auto;
  margin-right:auto;
  text-align:center;
}

/* Nosotros Layout */
.section-dark .section-inner{
  display:grid;
  gap:2rem;
}
@media(min-width:768px){
  .section-dark .section-inner{
    grid-template-columns:1fr 1fr;
    align-items:center;
  }
}
.section-text .bullets{
  list-style:none;
  margin-top:1.5rem;
  color:var(--accent);
  font-weight:600;
}
.section-text .bullets li{
  margin:.4rem 0;
  font-size:.9rem;
}

/* gallery thumbs pequeño lado derecho */
.gallery-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:.75rem;
}
.gallery-thumb{
  width:100%;
  border-radius:var(--radius-md);
  object-fit:cover;
  height:140px;
  cursor:pointer;
  box-shadow:var(--shadow-card);
  border:1px solid rgba(212,175,55,.4);
}
@media(min-width:768px){
  .gallery-thumb{height:160px;}
}

/* Productos Cards */
.cards-productos{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(250px,100%),1fr));
  gap:1.5rem;
}
.producto-card{
  background:#000;
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow-card);
  border:1px solid rgba(212,175,55,.3);
  padding:1rem 1rem 2rem;
  text-align:center;
  transition:var(--transition);
}
.producto-card:hover{
  transform:translateY(-4px) scale(1.02);
  box-shadow:0 30px 60px rgba(0,0,0,.9);
}
.producto-card img{
  width:100%;
  height:180px;
  object-fit:cover;
  border-radius:var(--radius-md);
  border:1px solid rgba(212,175,55,.4);
  margin-bottom:1rem;
}
.producto-card h3{
  font-size:1.1rem;
  font-weight:600;
  color:var(--accent);
  margin-bottom:.4rem;
}
.producto-card p{
  font-size:.9rem;
  color:var(--text-dim);
}

/* Full gallery */
.gallery-full{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(200px,100%),1fr));
  gap:.75rem;
}
.gallery-item{
  width:100%;
  height:180px;
  object-fit:cover;
  border-radius:var(--radius-md);
  cursor:pointer;
  box-shadow:var(--shadow-card);
  border:1px solid rgba(212,175,55,.4);
  transition:var(--transition);
}
.gallery-item:hover{
  transform:scale(1.03);
}

/* Lightbox */
.lightbox{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.9);
  display:flex;
  align-items:center;
  justify-content:center;
  z-index:10000;
  flex-direction:column;
  padding:1rem;
}
.lightbox.hidden{display:none;}
.lightbox-img{
  max-width:100%;
  max-height:80vh;
  border-radius:var(--radius-md);
  box-shadow:0 30px 80px rgba(0,0,0,.9);
  border:2px solid var(--accent);
  background:#000;
}
.lightbox-close{
  color:#fff;
  font-size:2rem;
  font-weight:700;
  cursor:pointer;
  margin-bottom:1rem;
  line-height:1;
  user-select:none;
}

/* VIDEO */
.video-wrapper{
  position:relative;
  max-width:800px;
  margin:0 auto;
  border-radius:var(--radius-lg);
  overflow:hidden;
  background:#000;
  border:1px solid rgba(212,175,55,.4);
  box-shadow:var(--shadow-card);
}
.video-frame{
  width:100%;
  height:400px;
}
@media(max-width:600px){
  .video-frame{height:220px;}
}

/* SOCIAL */
.social-wrapper{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:2rem;
}
.fb-wrapper{
  background:#000;
  border-radius:var(--radius-lg);
  border:1px solid rgba(212,175,55,.4);
  padding:1rem;
  box-shadow:var(--shadow-card);
  max-width:420px;
  width:100%;
  text-align:center;
}
.fallback-link{
  font-size:.8rem;
  color:var(--text-dim);
  margin-top:.5rem;
}
.fallback-link a{
  color:var(--accent);
  text-decoration:none;
}

/* FORMULARIO */
.contact-form{
  max-width:600px;
  margin:0 auto;
  background:#000;
  border-radius:var(--radius-lg);
  border:1px solid rgba(212,175,55,.4);
  box-shadow:var(--shadow-card);
  padding:2rem;
}
.form-row{
  display:flex;
  flex-direction:column;
  margin-bottom:1rem;
}
.form-row label{
  font-size:.8rem;
  font-weight:600;
  color:var(--accent);
  margin-bottom:.4rem;
}
.form-row input,
.form-row textarea{
  background:#111;
  color:var(--text-light);
  border:1px solid rgba(212,175,55,.4);
  border-radius:var(--radius-md);
  padding:.8rem .9rem;
  font-family:var(--font-body);
  font-size:.9rem;
  outline:none;
  transition:var(--transition);
}
.form-row input:focus,
.form-row textarea:focus{
  border:1px solid var(--accent);
  box-shadow:0 0 10px rgba(212,175,55,.6);
}
.form-btn{
  width:100%;
  margin-top:1rem;
}

/* FOOTER */
.footer{
  background:#000;
  text-align:center;
  padding:2rem 1rem 4rem;
  border-top:1px solid rgba(212,175,55,.3);
  color:var(--text-dim);
  font-size:.8rem;
  line-height:1.6;
}
.footer a{
  color:var(--accent);
  text-decoration:none;
  font-weight:600;
}

/* Animations */
@keyframes fadeUp{
  from{opacity:0;transform:translateY(20px)}
  to{opacity:1;transform:translateY(0)}
}
.fade-in{
  animation:fadeUp .8s both;
}

/* Utilities */
.center{text-align:center}
