/* Xielo Lounge — V1 Midnight Neon theme */
html, body { background: #000; color: #fff; font-family: 'Jost', sans-serif; }
a { color: #e8b64c; }
a:hover { color: #f5d488; }

@keyframes xielo-eq { 0%, 100% { transform: scaleY(.25); } 50% { transform: scaleY(1); } }
@keyframes xielo-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }
@keyframes xielo-neon-glow {
  0%, 100% { filter: drop-shadow(0 0 10px rgba(232,182,76,.45)) drop-shadow(0 0 22px rgba(214,41,118,.3)); }
  50% { filter: drop-shadow(0 0 22px rgba(232,182,76,.85)) drop-shadow(0 0 46px rgba(214,41,118,.6)); }
}
@keyframes xielo-neon-border {
  0%, 100% { box-shadow: 0 0 6px rgba(232,182,76,.4), 0 0 16px rgba(232,182,76,.18), inset 0 0 6px rgba(232,182,76,.12); border-color: #e8b64c; }
  50% { box-shadow: 0 0 16px rgba(232,182,76,.9), 0 0 40px rgba(232,182,76,.5), inset 0 0 10px rgba(232,182,76,.3); border-color: #f5d488; }
}

.site-header { background: rgba(0,0,0,0.55); border-bottom: 1px solid rgba(255,255,255,0.08); }
.site-header .brand-name { color: #fff; }
.main-nav a { color: rgba(255,255,255,0.75); }
.main-nav a:hover { color: #e8b64c; }
.nav-cta.btn { border: 1px solid #e8b64c; color: #e8b64c; background: transparent; }
.nav-cta.btn:hover { background: #e8b64c; color: #000; }
.hamburger span { background: #fff; }
.mobile-nav { background: rgba(0,0,0,0.97); }
.mobile-nav a { color: #fff; }
.mobile-nav a:hover { color: #e8b64c; }

.eq-bars { display: flex; align-items: flex-end; gap: 6px; height: 36px; }
.eq-bars span { width: 4px; border-radius: 2px; height: 100%; transform-origin: bottom; }
.eq-bars span:nth-child(1) { background: linear-gradient(180deg,#d62976,#f0a13e); animation: xielo-eq 1.0s ease-in-out infinite; }
.eq-bars span:nth-child(2) { background: linear-gradient(180deg,#e8b64c,#f5d488); animation: xielo-eq 1.3s ease-in-out .15s infinite; }
.eq-bars span:nth-child(3) { background: linear-gradient(180deg,#d62976,#f0a13e); animation: xielo-eq 0.8s ease-in-out .3s infinite; }
.eq-bars span:nth-child(4) { background: linear-gradient(180deg,#f0a13e,#e8b64c); animation: xielo-eq 1.2s ease-in-out .45s infinite; }
.eq-bars span:nth-child(5) { background: linear-gradient(180deg,#e8b64c,#f5d488); animation: xielo-eq 0.9s ease-in-out .6s infinite; }
.eq-bars span:nth-child(6) { background: linear-gradient(180deg,#d62976,#f0a13e); animation: xielo-eq 1.4s ease-in-out .75s infinite; }
.eq-bars span:nth-child(7) { background: linear-gradient(180deg,#f0a13e,#e8b64c); animation: xielo-eq 1.1s ease-in-out .9s infinite; }

.hero { position: relative; min-height: 92dvh; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; overflow: hidden; }
.hero-bg { position: absolute; inset: 0; z-index: 0; }
.hero-bg img { width: 100%; height: 100%; object-fit: cover; opacity: 0.85; }
.hero-bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,0.2), rgba(0,0,0,0.4) 55%, #000 94%); }
.hero-content { position: relative; z-index: 1; padding: 48px 20px; display: flex; flex-direction: column; align-items: center; }
.hero-logo { animation: xielo-float 6s ease-in-out infinite, xielo-neon-glow 3.2s ease-in-out infinite; width: clamp(200px, 52vw, 280px); height: auto; }
.hero-tagline-en { font-family: 'Cormorant Garamond', serif; font-style: italic; font-size: clamp(24px, 6vw, 30px); color: rgba(255,255,255,0.92); margin: 24px 0 8px; line-height: 1.3; text-shadow: 0 2px 18px rgba(0,0,0,0.8); }
.hero-tagline-es { font-size: clamp(13px, 3.5vw, 15px); letter-spacing: 0.2em; text-indent: 0.2em; text-transform: uppercase; color: rgba(255,255,255,0.6); margin: 0 0 30px; text-shadow: 0 2px 14px rgba(0,0,0,0.8); }
.hero-cta { border: 1px solid #e8b64c; color: #e8b64c; background: rgba(0,0,0,0.35); animation: xielo-neon-border 2.6s ease-in-out infinite; }
.hero-cta:hover { background: #e8b64c; color: #000; }
.hero-kicker { margin-top: 32px; font-size: 12px; letter-spacing: 0.34em; text-indent: 0.34em; text-transform: uppercase; color: rgba(255,255,255,0.4); }

section { border-top: 1px solid rgba(255,255,255,0.08); }
.section-eyebrow { color: #d62976; }
.section-heading { font-family: 'Cormorant Garamond', serif; font-weight: 500; font-size: clamp(30px, 7vw, 40px); }
.section-body { font-size: 17px; font-weight: 300; line-height: 1.75; color: rgba(255,255,255,0.68); }
.section-body-es { font-family: 'Cormorant Garamond', serif; font-style: italic; font-size: 18px; line-height: 1.6; color: rgba(255,255,255,0.45); }

#events { background: linear-gradient(180deg, rgba(214,41,118,0.06), transparent 70%); }

.menu-section { border: 1px solid rgba(232,182,76,0.25); }
.menu-section summary { color: #e8b64c; }
.menu-section summary .title { font-family: 'Cormorant Garamond', serif; font-weight: 500; font-size: 24px; }
.menu-section summary .chev { color: rgba(232,182,76,0.8); }
.menu-item .item-es { font-family: 'Cormorant Garamond', serif; font-size: 20px; color: #fff; }
.menu-item .item-en { color: rgba(255,255,255,0.45); }
.menu-item .price { color: #e8b64c; }

.reserve-cta { background: linear-gradient(90deg,#d62976,#f0a13e); color: #fff; font-weight: 500; }
.reserve-cta:hover { opacity: .85; }
.reserve-heading { font-family: 'Cormorant Garamond', serif; font-style: italic; }
.reserve-heading .es { font-size: 0.7em; color: rgba(255,255,255,0.5); display: block; margin-top: 6px; }

.hours-value { color: rgba(255,255,255,0.85); }
.hours-label { color: rgba(255,255,255,0.45); }
.map-link { color: rgba(255,255,255,0.85); }
.map-link:hover { color: #e8b64c; }

.floorplan-frame { border: 1px solid rgba(232,182,76,0.3); border-radius: 20px; overflow: hidden; max-width: 420px; margin: 0 auto; box-shadow: 0 0 0 1px rgba(0,0,0,0.4), 0 20px 60px rgba(0,0,0,0.55), 0 0 40px rgba(232,182,76,0.08); }
.floorplan-frame img { width: 100%; height: auto; display: block; }

.site-footer { border-top: 1px solid rgba(255,255,255,0.08); }
.ig-link { color: rgba(255,255,255,0.85); }
.footer-fine { font-size: 12px; letter-spacing: 0.32em; text-indent: 0.32em; text-transform: uppercase; color: rgba(255,255,255,0.5); }
