:root{
  --bg:#0c0805;
  --gold:#d9a940;
  --gold-light:#f3d998;
  --red:#e2314f;
  --red-glow: rgba(226,49,79,.55);
  --cream:#f6ead9;
  --cream-dim:#cbb9a4;
  --green:#4f9d5c;
  --card:#1a120c;
  --line:rgba(217,169,64,.25);
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:
    radial-gradient(ellipse 900px 500px at 50% -10%, rgba(226,49,79,.25), transparent 60%),
    radial-gradient(ellipse 700px 500px at 100% 20%, rgba(217,169,64,.12), transparent 60%),
    var(--bg);
  color:var(--cream);
  font-family:'Work Sans', sans-serif;
  -webkit-font-smoothing:antialiased;
  min-height:100vh;
}
h1,h2,h3,.display{font-family:'Anton', sans-serif; letter-spacing:.5px; text-transform:uppercase;}
.eyebrow{font-family:'Bebas Neue', sans-serif; letter-spacing:3px; color:var(--gold); font-size:.85rem;}
a{color:inherit;}
.wrap{max-width:1080px; margin:0 auto; padding:0 24px;}

/* NAV */
nav.site-nav{position:sticky; top:0; z-index:50; background:rgba(12,8,5,.85); backdrop-filter:blur(10px); border-bottom:1px solid var(--line); overflow:visible;}
nav.site-nav .wrap{display:flex; align-items:center; justify-content:space-between; padding:8px 24px; overflow:visible; position:relative; gap:10px;}
.brand{display:flex; align-items:center; gap:14px; overflow:visible; min-width:0; flex:1 1 auto;}
.brand-logo-wrap{position:relative; width:200px; height:200px; flex:none; margin:-8px 0 -78px; z-index:60;}
.brand-logo-wrap::before{
  content:''; position:absolute; inset:-16px; border-radius:50%;
  background:conic-gradient(from 0deg, var(--red), var(--gold-light), var(--red), var(--gold-light), var(--red));
  animation:brandRingSpin 4s linear infinite;
}
.brand-logo-wrap img{position:relative; height:200px; width:200px; border-radius:50%; object-fit:cover;
  display:block; border:3px solid #0c0805;
  box-shadow:0 10px 34px rgba(0,0,0,.65);
  animation:navLogoPulse 2.8s ease-in-out infinite;}
@keyframes brandRingSpin{ 100%{ transform:rotate(360deg); } }
@keyframes navLogoPulse{
  0%, 100% { box-shadow:0 10px 34px rgba(0,0,0,.65), 0 0 12px 3px var(--red-glow); }
  50%      { box-shadow:0 10px 34px rgba(0,0,0,.65), 0 0 26px 12px var(--red-glow); }
}
.brand span{font-family:'Bebas Neue'; letter-spacing:1px; font-size:1.4rem; color:var(--gold-light);}
.navlinks{display:flex; gap:22px; font-size:.92rem;}
.navlinks a{text-decoration:none; color:var(--cream-dim); transition:color .2s;}
.navlinks a:hover{color:var(--gold);}

/* Botón hamburguesa (checkbox oculto + label): oculto en escritorio */
.nav-toggle-input{display:none;}
.nav-toggle{display:none; flex-direction:column; justify-content:center; gap:5px; width:38px; height:38px; background:none; border:1px solid var(--line); border-radius:8px; cursor:pointer; padding:0; flex:none;}
.nav-toggle span{display:block; width:20px; height:2px; margin:0 auto; background:var(--cream); transition:transform .25s ease, opacity .25s ease;}
.nav-toggle-input:checked ~ .nav-toggle span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.nav-toggle-input:checked ~ .nav-toggle span:nth-child(2){opacity:0;}
.nav-toggle-input:checked ~ .nav-toggle span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

/* HERO */
.hero{text-align:center; padding:70px 24px 50px; position:relative; overflow:hidden;}
.hero-logo{width:160px; height:160px; border-radius:50%; object-fit:cover;
  box-shadow:0 0 0 3px var(--red), 0 0 40px 6px var(--red-glow), 0 0 70px 20px rgba(217,169,64,.15);
  margin-bottom:22px; animation:heroLogoPulse 2.8s ease-in-out infinite;}
@keyframes heroLogoPulse{
  0%, 100% { box-shadow:0 0 0 3px var(--red), 0 0 40px 6px var(--red-glow), 0 0 70px 20px rgba(217,169,64,.15); }
  50%      { box-shadow:0 0 0 3px var(--gold-light), 0 0 55px 14px var(--red-glow), 0 0 90px 26px rgba(217,169,64,.25); }
}

/* HERO SLIDER como FONDO completo de toda la sección (foto/video de fiestas) */
.hero.has-bg-slider{padding:0; min-height:clamp(420px, 78vh, 720px); display:flex; align-items:center;}
.hero-slider{position:absolute; inset:0; z-index:0; overflow:hidden; background:#000;}
.hero-slider .slide{position:absolute; inset:0; opacity:0; transition:opacity 1s ease; pointer-events:none;}
.hero-slider .slide.active{opacity:1; pointer-events:auto;}
.hero-slider .slide img, .hero-slider .slide video{width:100%; height:100%; object-fit:cover; object-position:center; display:block;}
.hero-slider .slide .yt-cover{position:absolute; inset:0; overflow:hidden;}
.hero-slider .slide .yt-cover iframe{position:absolute; top:50%; left:50%; border:0; transform:translate(-50%,-50%);}
.hero-overlay{position:absolute; inset:0; z-index:1; pointer-events:none;
  background:linear-gradient(180deg, rgba(10,7,5,.10) 0%, rgba(10,7,5,.05) 45%, rgba(10,7,5,.72) 100%);}
.hero-slider::after{
  content:''; position:absolute; inset:0; z-index:1; pointer-events:none;
  box-shadow:inset 0 0 70px 14px rgba(196,42,42,.28), inset 0 0 110px 26px rgba(0,0,0,.3);
  animation:heroGlowPulse 3.4s ease-in-out infinite;
}
@keyframes heroGlowPulse{
  0%, 100% { box-shadow:inset 0 0 70px 14px rgba(196,42,42,.24), inset 0 0 110px 26px rgba(0,0,0,.28); }
  50%      { box-shadow:inset 0 0 95px 22px rgba(217,169,64,.28), inset 0 0 120px 30px rgba(0,0,0,.20); }
}
.hero-slider .slide-dots{position:absolute; bottom:22px; left:0; right:0; display:flex; gap:8px; justify-content:center; z-index:2;}
.audio-toggle-btn{position:absolute; bottom:20px; right:20px; z-index:3; display:flex; align-items:center; gap:8px;
  background:rgba(12,8,5,.7); backdrop-filter:blur(6px); border:1px solid rgba(255,255,255,.25); color:var(--cream);
  border-radius:999px; padding:9px 16px; font-size:.85rem; font-weight:600; cursor:pointer;
  transition:background .2s, border-color .2s, transform .15s;}
.audio-toggle-btn:hover{background:rgba(12,8,5,.9); border-color:var(--gold-light); transform:translateY(-2px);}
@media (max-width:640px){ .audio-toggle-btn span{display:none;} .audio-toggle-btn{padding:10px 12px;} }
.hero-slider .dot{width:10px; height:10px; border-radius:50%; border:2px solid rgba(255,255,255,.6); background:rgba(255,255,255,.15); cursor:pointer; padding:0; transition:background .2s;}
.hero-slider .dot.active{background:var(--gold-light); border-color:var(--gold-light);}
.hero-content{position:relative; z-index:2; width:100%;}
.has-bg-slider .hero-content{text-shadow:0 2px 10px rgba(0,0,0,.85), 0 4px 30px rgba(0,0,0,.7);}

.hero h1{font-size:clamp(2.4rem, 6vw, 4.2rem); margin:.2em 0; line-height:.95;
  color:#ffffff;
  text-shadow:0 0 8px rgba(255,255,255,.6), 0 0 24px rgba(255,255,255,.35),
              0 0 50px rgba(196,42,42,.5), 0 4px 18px rgba(0,0,0,.85);}
.hero p.sub{color:var(--cream-dim); font-size:1.05rem; max-width:520px; margin:0 auto 28px;}
.cta-row{display:flex; gap:14px; justify-content:center; flex-wrap:wrap;}
.btn{display:inline-flex; align-items:center; gap:8px; padding:14px 26px; border-radius:999px; border:1px solid var(--line);
  font-weight:600; font-size:.95rem; cursor:pointer; text-decoration:none; transition:transform .15s;}
.btn:hover{transform:translateY(-2px);}
.btn-primary{background:linear-gradient(135deg, var(--red), #b81d38); color:#fff; border:none; box-shadow:0 8px 24px -8px var(--red-glow);}
.btn-ghost{background:transparent; color:var(--gold-light); border:1px solid var(--line);}
.btn-sm{padding:8px 16px; font-size:.82rem;}
.btn-danger{background:rgba(226,49,79,.15); color:#ffb3c0; border:1px solid rgba(226,49,79,.4);}

.schedule-pill{display:inline-block; margin-top:22px; padding:8px 18px; border-radius:999px;
  background:rgba(217,169,64,.08); border:1px solid var(--line);
  font-family:'Bebas Neue'; letter-spacing:2px; font-size:.85rem; color:var(--gold);}

section{padding:64px 0; border-top:1px solid var(--line);}
.section-head{text-align:center; margin-bottom:38px;}
.section-head h2{font-size:clamp(1.8rem,4vw,2.6rem); margin:.2em 0; color:var(--cream);}

.combo-card{background:linear-gradient(160deg, var(--card), #0f0a06); border:1px solid var(--line); border-radius:22px;
  padding:36px; max-width:560px; margin:0 auto;}
.combo-price{font-family:'Bebas Neue'; font-size:3rem; color:var(--gold); line-height:1;}
.combo-price small{font-size:1rem; color:var(--cream-dim); font-family:'Work Sans';}
.combo-list{list-style:none; padding:0; margin:20px 0 0; display:grid; gap:12px;}
.combo-list li{display:flex; gap:10px; align-items:flex-start; font-size:.98rem;}

.mesas-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:16px;}
.mesa-card{background:var(--card); border:1px solid var(--line); border-radius:16px; padding:20px; text-align:left;
  cursor:pointer; transition:border-color .2s, transform .15s; position:relative;}
.mesa-card:hover{transform:translateY(-3px); border-color:var(--gold);}
.mesa-card.selected{border-color:var(--red); box-shadow:0 0 0 1px var(--red);}
.mesa-num{font-family:'Anton'; font-size:1.6rem; color:var(--gold-light);}
.mesa-desc{color:var(--cream-dim); font-size:.85rem; margin-top:4px; min-height:32px;}
.mesa-tag-ocupada{display:none;}
.mesa-card.ocupada{background:rgba(196,42,42,.16); border-color:var(--red); cursor:not-allowed; opacity:.85;}
.mesa-card.ocupada:hover{transform:none;}
.mesa-card.ocupada .mesa-num, .mesa-card.ocupada .mesa-desc{opacity:.55;}
.mesa-card.ocupada .mesa-tag-ocupada{display:inline-block; margin-top:8px; font-size:.7rem; font-weight:700;
  letter-spacing:.5px; color:var(--red); background:rgba(196,42,42,.15); border:1px solid var(--red);
  border-radius:20px; padding:3px 10px;}

.form-card{background:var(--card); border:1px solid var(--line); border-radius:22px; padding:32px; max-width:720px; margin:0 auto;}
label{display:block; font-size:.82rem; color:var(--gold-light); margin:18px 0 6px; font-weight:600; letter-spacing:.3px;}
label:first-child{margin-top:0;}
input[type=text], input[type=date], input[type=number], input[type=email], input[type=password], input[type=file],
select, textarea{width:100%; padding:11px 14px; border-radius:10px; border:1px solid var(--line);
  background:#0f0a07; color:var(--cream); font-family:'Work Sans'; font-size:.95rem;}
input:focus, select:focus, textarea:focus{outline:2px solid var(--gold); outline-offset:1px;}
.grid2{display:grid; grid-template-columns:1fr 1fr; gap:16px;}
.guests-grid{display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:6px;}
.hint{font-size:.78rem; color:var(--cream-dim); margin-top:6px;}
.row-between{display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap;}
.stepper{display:flex; align-items:center; gap:10px;}
.stepper button{width:34px; height:34px; border-radius:8px; border:1px solid var(--line); background:#0f0a07; color:var(--gold); font-size:1.1rem; cursor:pointer;}
.checkbox-row{display:flex; align-items:center; gap:10px; margin-top:16px;}
.checkbox-row input{width:auto;}
.total-box{margin-top:24px; padding:18px 20px; border-radius:14px; background:rgba(226,49,79,.08); border:1px solid rgba(226,49,79,.35);
  display:flex; justify-content:space-between; align-items:center;}
.total-box .amt{font-family:'Bebas Neue'; font-size:2rem; color:var(--gold-light);}
.pay-options{display:grid; gap:10px; margin-top:8px;}
.pay-option{border:1px solid var(--line); border-radius:12px; padding:12px 14px; display:flex; gap:10px; align-items:flex-start; cursor:pointer;}
.pay-option input{width:auto; margin-top:3px;}
.bank-box{margin-top:10px; padding:14px; border-radius:12px; background:#0f0a07; border:1px solid var(--line); font-size:.88rem; display:none;}
.bank-box.show{display:block;}
.bank-line{display:flex; justify-content:space-between; padding:6px 0; border-bottom:1px dashed var(--line);}
.bank-line:last-child{border-bottom:none;}
.file-drop{margin-top:10px; border:1px dashed var(--line); border-radius:12px; padding:16px; text-align:center; font-size:.85rem; color:var(--cream-dim);}

.social-row{display:flex; gap:16px; justify-content:center; flex-wrap:wrap;}
.social-btn{display:flex; align-items:center; gap:10px; padding:12px 22px; border-radius:999px; border:1px solid var(--line);
  text-decoration:none; font-weight:600; font-size:.9rem; background:var(--card);}
.social-btn svg{width:20px; height:20px;}

footer{padding:36px 24px; text-align:center; color:var(--cream-dim); font-size:.8rem; border-top:1px solid var(--line);}
.note{font-size:.78rem; color:var(--cream-dim); text-align:center; margin-top:10px;}

/* FLASH */
.flash{max-width:1080px; margin:16px auto 0; padding:0 24px;}
.flash-msg{padding:14px 18px; border-radius:12px; font-size:.9rem; margin-bottom:10px;}
.flash-msg.success{background:rgba(79,157,92,.12); border:1px solid rgba(79,157,92,.4); color:#bfe8c6;}
.flash-msg.error{background:rgba(226,49,79,.12); border:1px solid rgba(226,49,79,.4); color:#ffc4d0;}

/* ===== ADMIN ===== */
.admin-shell{display:flex; min-height:100vh;}
.admin-sidebar{width:220px; flex-shrink:0; background:var(--card); border-right:1px solid var(--line); padding:24px 0; position:sticky; top:0; height:100vh;}
.admin-sidebar .brand{padding:0 20px 20px; border-bottom:1px solid var(--line); margin-bottom:12px;}
.admin-sidebar a{display:block; padding:12px 20px; color:var(--cream-dim); text-decoration:none; font-size:.9rem; border-left:3px solid transparent;}
.admin-sidebar a:hover, .admin-sidebar a.active{color:var(--gold-light); background:rgba(217,169,64,.06); border-left-color:var(--gold);}
.admin-main{flex:1; padding:32px 36px; max-width:1100px;}
.admin-main h1{font-size:1.8rem; margin-bottom:24px;}
.stat-cards{display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:12px; margin-bottom:28px;}
.stat-card{background:var(--card); border:1px solid var(--line); border-radius:14px; padding:16px;}
.stat-card .v{font-family:'Bebas Neue'; font-size:1.8rem; color:var(--gold-light);}
.stat-card .l{font-size:.75rem; color:var(--cream-dim); text-transform:uppercase; letter-spacing:.5px;}
table.admin-table{width:100%; border-collapse:collapse; margin-top:12px; font-size:.85rem; background:var(--card); border-radius:14px; overflow:hidden;}
table.admin-table th, table.admin-table td{padding:10px 12px; border-bottom:1px solid var(--line); text-align:left;}
table.admin-table th{color:var(--gold); font-family:'Bebas Neue'; letter-spacing:1px; font-size:.8rem; background:rgba(217,169,64,.05);}
table.admin-table tr:last-child td{border-bottom:none;}
.badge{display:inline-block; padding:3px 10px; border-radius:999px; font-size:.72rem; font-weight:600;}
.badge.pendiente{background:rgba(217,169,64,.15); color:var(--gold-light);}
.badge.confirmada{background:rgba(79,157,92,.15); color:#bfe8c6;}
.badge.cancelada{background:rgba(226,49,79,.15); color:#ffc4d0;}
.inline-form{display:inline;}
.admin-card{background:var(--card); border:1px solid var(--line); border-radius:16px; padding:22px; margin-bottom:20px;}
.admin-card h3{font-family:'Bebas Neue'; letter-spacing:1px; color:var(--gold); font-size:1.1rem; margin:0 0 14px;}
.top-actions{display:flex; justify-content:space-between; align-items:center; margin-bottom:20px; flex-wrap:wrap; gap:12px;}
.combo-item-row{display:grid; grid-template-columns:80px 1fr auto; gap:10px; align-items:center; margin-bottom:8px;}
select[multiple]{height:auto;}
.day-checks{display:flex; gap:14px; flex-wrap:wrap; margin-top:6px;}
.day-checks label{display:flex; align-items:center; gap:6px; font-weight:400; color:var(--cream); margin:0; font-size:.85rem;}
.day-checks input{width:auto;}
.login-card{max-width:380px; margin:80px auto; text-align:center;}
.small-link{font-size:.8rem; color:var(--cream-dim); text-decoration:underline;}

@media (max-width:900px){
  .admin-shell{flex-direction:column;}
  .admin-sidebar{width:100%; height:auto; position:static; display:flex; overflow-x:auto; padding:12px;}
  .admin-sidebar .brand{display:none;}
  .admin-sidebar a{padding:10px 14px; white-space:nowrap; border-left:none; border-bottom:3px solid transparent;}
  .admin-sidebar a:hover, .admin-sidebar a.active{border-left:none; border-bottom-color:var(--gold);}
  .admin-main{padding:20px;}
}
@media (max-width:640px){
  .grid2, .guests-grid{grid-template-columns:1fr;}
  .nav-toggle{display:flex;}
  .brand span{font-size:.85rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:38vw;}
  .navlinks{
    display:none;
    position:absolute;
    top:100%;
    left:0;
    right:0;
    flex-direction:column;
    gap:0;
    background:rgba(12,8,5,.97);
    backdrop-filter:blur(10px);
    border-bottom:1px solid var(--line);
    padding:8px 0;
  }
  .navlinks.open, .nav-toggle-input:checked ~ .navlinks{display:flex;}
  .navlinks a{padding:14px 24px; border-top:1px solid var(--line);}
  .navlinks a:first-child{border-top:none;}
  .brand-logo-wrap{width:130px; height:130px; margin:-4px 0 -45px;}
  .brand-logo-wrap img{width:130px; height:130px;}
}
@media (max-width:400px){
  .brand span{display:none;}
  .brand-logo-wrap{width:90px; height:90px; margin:0;}
  .brand-logo-wrap img{width:90px; height:90px;}
}

/* En celulares, los videos verticales (formato reel/story) se ven mejor con
   el cuadro del hero más alto: se recorta mucho menos que con la altura
   pensada originalmente para escritorio. */
@media (max-width:768px){
  .hero.has-bg-slider{min-height:88vh;}
  /* Enfoca el recorte un poco más arriba (donde suele estar la cara/torso
     de la persona) en vez del centro exacto del video. */
  .hero-slider .slide video{object-position:center 20%;}
}