/* ── VARIABLES ── */
:root {
  --bg:    #111111;
  --bg2:   #181818;
  --bg3:   #222222;
  --bg4:   #2a2a2a;
  --gold:  #C85A0A;
  --gold2: #9e4608;
  --cream: #F5F0E8;
  --muted: #888888;
  --bdr:   rgba(200,90,10,.18);
  --H: 'Bebas Neue', sans-serif;
  --B: 'Inter', sans-serif;
  --ease: .3s ease;
  --r: 4px;
}

/* ── RESET ── */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { font-family:var(--B); background:var(--bg); color:var(--cream); overflow-x:hidden; line-height:1.6; }
img  { display:block; max-width:100%; }
a    { text-decoration:none; color:inherit; }
button { cursor:pointer; border:none; background:none; font-family:var(--B); }

/* ── NAVBAR ── */
.nav {
  position:fixed; top:0; left:0; right:0; z-index:200;
  padding:1.1rem 1.5rem;
  display:flex; align-items:center; justify-content:space-between;
  transition:background var(--ease), padding var(--ease), border-color var(--ease);
  border-bottom:1px solid transparent;
}
.nav.solid { background:rgba(17,17,17,.97); padding:.7rem 1.5rem; border-color:var(--bdr); }
.nav-logo img { height:42px; width:auto; }
.nav-logo-text { font-family:var(--H); font-size:1.4rem; letter-spacing:3px; }
.nav-logo-text em { color:var(--gold); font-style:normal; }
.nav-center { display:none; list-style:none; gap:2rem; }
.nav-center a {
  font-size:.78rem; font-weight:500; letter-spacing:2px;
  text-transform:uppercase; color:var(--muted);
  transition:color var(--ease);
}
.nav-center a:hover, .nav-center a.active { color:var(--gold); }
.nav-right { display:flex; align-items:center; gap:.75rem; }
.btn-nav-secondary {
  font-family:var(--H); font-size:.95rem; letter-spacing:1px;
  padding:.5rem 1rem; border:1px solid var(--bdr);
  border-radius:var(--r); color:var(--cream);
  transition:border-color var(--ease), color var(--ease);
  display:none;
}
.btn-nav-secondary:hover { border-color:var(--gold); color:var(--gold); }
.btn-nav-primary {
  font-family:var(--H); font-size:.95rem; letter-spacing:1px;
  padding:.5rem 1.2rem; background:var(--gold); color:#111;
  border-radius:var(--r); transition:background var(--ease);
  white-space:nowrap;
}
.btn-nav-primary:hover { background:var(--gold2); }
@media(min-width:768px) {
  .nav-center { display:flex; }
  .btn-nav-secondary { display:block; }
  .nav-hamburger { display:none !important; }
}

/* ── HAMBURGER ── */
.nav-hamburger {
  display:flex; flex-direction:column; justify-content:center; gap:5px;
  width:2.2rem; height:2.2rem; padding:.3rem;
  background:none; border:none; cursor:pointer; flex-shrink:0;
}
.nav-hamburger span {
  display:block; width:100%; height:2px;
  background:var(--cream); border-radius:2px;
  transition:transform .3s ease, opacity .3s ease;
}
.nav-hamburger.open span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
.nav-hamburger.open span:nth-child(2) { opacity:0; }
.nav-hamburger.open span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }

/* ── MOBILE NAV OVERLAY ── */
.mobile-nav {
  display:none; position:fixed; inset:0; z-index:195;
  background:rgba(17,17,17,.98);
  flex-direction:column; align-items:center; justify-content:center; gap:0;
  padding:2rem;
}
.mobile-nav.open { display:flex; }
.mobile-nav a {
  font-family:var(--H); font-size:2.2rem; letter-spacing:3px;
  color:var(--cream); padding:.85rem 2rem; text-align:center;
  transition:color var(--ease); width:100%;
}
.mobile-nav a:hover, .mobile-nav a.mob-active { color:var(--gold); }
.mobile-nav-divider { width:3rem; height:1px; background:var(--bdr); margin:.75rem 0; }
.mobile-nav-ctas { display:flex; gap:.75rem; flex-wrap:wrap; justify-content:center; margin-top:.5rem; }

/* ── BOTONES ── */
.btn-gold {
  display:inline-flex; align-items:center; gap:.6rem;
  background:var(--gold); color:#111;
  font-family:var(--H); font-size:1.1rem; letter-spacing:1.5px;
  padding:.85rem 2rem; border-radius:var(--r);
  transition:background var(--ease), transform var(--ease);
}
.btn-gold:hover { background:var(--gold2); transform:translateY(-2px); }
.btn-outline {
  display:inline-flex; align-items:center; gap:.6rem;
  color:var(--cream); font-family:var(--H); font-size:1.1rem; letter-spacing:1.5px;
  padding:.85rem 2rem; border-radius:var(--r);
  border:1px solid rgba(245,240,232,.28);
  transition:border-color var(--ease), color var(--ease), transform var(--ease);
}
.btn-outline:hover { border-color:var(--gold); color:var(--gold); transform:translateY(-2px); }
.btn-wa {
  display:inline-flex; align-items:center; gap:.75rem;
  background:#25D366; color:#fff;
  font-family:var(--H); font-size:1.15rem; letter-spacing:1.5px;
  padding:1rem 2.5rem; border-radius:var(--r);
  transition:background var(--ease), transform var(--ease);
}
.btn-wa:hover { background:#1da851; transform:translateY(-2px); }

/* ── LAYOUT ── */
.wrap { max-width:1120px; margin:0 auto; padding:0 1.5rem; }
.section-label { font-size:.72rem; font-weight:600; letter-spacing:4px; text-transform:uppercase; color:var(--gold); margin-bottom:.6rem; display:block; }
.section-h2 { font-family:var(--H); font-size:clamp(2.2rem,6vw,3.6rem); letter-spacing:1px; line-height:1; }
.section-desc { color:var(--muted); font-size:.92rem; line-height:1.7; max-width:540px; }
.section-head { margin-bottom:2.5rem; }

/* ── DIAGONAL ── */
.cut-b { width:100%; height:60px; background:var(--bg); clip-path:polygon(0 100%,100% 0,100% 100%); margin-top:-60px; position:relative; z-index:3; }
.cut-b2 { width:100%; height:60px; clip-path:polygon(0 0,100% 0,0 100%); position:relative; z-index:2; margin-bottom:-1px; }

/* ── FADE-IN ── */
.fi { opacity:0; transform:translateY(24px); transition:opacity .6s ease,transform .6s ease; }
.fi.on { opacity:1; transform:translateY(0); }

/* ── STICKY WA ── */
.wa-sticky {
  position:fixed; bottom:0; left:0; right:0; z-index:199;
  background:#25D366; color:#fff;
  display:flex; align-items:center; justify-content:center; gap:.7rem;
  padding:.9rem 1.5rem;
  font-family:var(--H); font-size:1.05rem; letter-spacing:1.5px;
  transition:background var(--ease);
}
.wa-sticky:hover { background:#1da851; }
@media(min-width:768px) { .wa-sticky { display:none; } }

/* ── FOOTER ── */
footer {
  background:#0a0a0a; padding:2.5rem 1.5rem 5rem;
  border-top:1px solid var(--bdr);
}
@media(min-width:768px) { footer { padding-bottom:2.5rem; } }
.foot-inner {
  max-width:1120px; margin:0 auto;
  display:flex; flex-direction:column; align-items:center; gap:1.25rem; text-align:center;
}
.foot-logo { font-family:var(--H); font-size:1.2rem; letter-spacing:3px; }
.foot-logo em { color:var(--gold); font-style:normal; }
.foot-logo img { height:38px; margin:0 auto; }
.foot-nav { display:flex; gap:2rem; flex-wrap:wrap; justify-content:center; }
.foot-nav a { font-size:.82rem; color:var(--muted); transition:color var(--ease); }
.foot-nav a:hover { color:var(--gold); }
.foot-social { display:flex; gap:.75rem; }
.foot-social a {
  width:2.1rem; height:2.1rem; border-radius:50%;
  border:1px solid var(--bdr);
  display:flex; align-items:center; justify-content:center;
  color:var(--muted); font-size:.82rem;
  transition:border-color var(--ease), color var(--ease);
}
.foot-social a:hover { border-color:var(--gold); color:var(--gold); }
.foot-legal { display:flex; gap:1.5rem; flex-wrap:wrap; justify-content:center; }
.foot-legal a { font-size:.78rem; color:var(--muted); }
.foot-legal a:hover { color:var(--gold); }
.foot-copy { font-size:.76rem; color:var(--muted); }
.foot-firma { font-size:.7rem; color:rgba(136,136,136,.45); }
.foot-firma a { color:rgba(136,136,136,.6); }
.foot-firma a:hover { color:var(--gold); }

/* ── PAGE HERO SIMPLE ── */
.page-hero {
  padding:7rem 1.5rem 3rem;
  background:var(--bg2);
  border-bottom:1px solid var(--bdr);
}
.page-hero-inner { max-width:1120px; margin:0 auto; }
.page-hero .section-label { margin-bottom:.5rem; }
.page-hero .section-h2 { margin-bottom:.75rem; }

/* ── RATING BADGE ── */
.rating-badge {
  display:inline-flex; align-items:center; gap:.5rem;
  background:rgba(212,160,23,.12); border:1px solid var(--bdr);
  padding:.35rem .85rem; border-radius:999px;
  font-size:.8rem; font-weight:500;
}
.rating-badge .stars { color:var(--gold); letter-spacing:1px; font-size:.85rem; }
.rating-badge strong { color:var(--gold); }