/* Lounge page styles - scoped and minimal, built on base.css */
:root {
  --electric-purple: #7a2df0;
  --neon-blue: #1fb6ff;
  --soft-cyan: #74f7ff;
  --vibrant-magenta: #ff2d9a;
  --charcoal: #111318;
}

.lounge-container { /* page container */
  max-width: 1200px;
  margin-inline: auto;
  padding-inline: 1rem;
}

.page-section {
  padding: 4rem 0;
}
.page-section.alt {
  background: linear-gradient(180deg, rgba(31,182,255,0.05), rgba(122,45,240,0.05));
}
.section-head h2 {
  margin: 0 0 .5rem 0;
}
.section-head p {
  margin: 0 0 1.5rem 0;
  color: #c9d1d9;
}

/* Hero */
.lounge-hero {
  background: radial-gradient(1200px 400px at 20% -10%, rgba(122,45,240,.35), transparent),
              radial-gradient(900px 300px at 90% 0%, rgba(31,182,255,.25), transparent),
              #0b0d12;
  color: #fff;
  border-bottom: 1px solid rgba(255,255,255,0.08);
}
.hero-inner {
  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  gap: 2rem;
  align-items: center;
  padding: 3.5rem 0;
}
.hero-title {
  font-size: clamp(1.8rem, 3vw, 3rem);
  line-height: 1.15;
}
.hero-sub { color: #d3d9e3; margin: 1rem 0 1.5rem; }
.hero-ctas { display: flex; gap: .75rem; flex-wrap: wrap; }

/* Buttons built on base classes */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; padding: .8rem 1.1rem; border-radius: .75rem; text-decoration: none; border: 1px solid transparent; transition: transform .2s ease, box-shadow .2s ease; }
.btn:hover { transform: translateY(-2px); }
.btn-primary { background: linear-gradient(90deg, var(--electric-purple), var(--vibrant-magenta)); color: #fff!important; box-shadow: 0 8px 30px rgba(122,45,240,.35); }
.btn-ghost { background: rgba(255,255,255,.04); color: #fff; border-color: rgba(255,255,255,.12); }
.btn-link { color: var(--soft-cyan); text-decoration: underline; }

/* Feature grid */
.feature-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 1rem; }
.card { background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.08); border-radius: 1rem; padding: 1rem; backdrop-filter: blur(6px); }
.card-title { margin: 0 0 .25rem 0; font-weight: 700; }
.card-text { margin: 0 0 .75rem 0; color: #c9d1d9; }
.price { color: var(--soft-cyan); font-weight: 700; }
.card-media { padding: 0; overflow: hidden; }
.card-media img { display: block; width: 100%; height: auto; aspect-ratio: 1 / 1; object-fit: cover; }
.card-media .card-body { padding: 1rem; }

/* Split layout */
.split { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; align-items: center; }
.split .media img { border-radius: 1rem; border: 1px solid rgba(255,255,255,0.08); }

.feature-list { display: grid; gap: .5rem; padding: 0; margin: 0 0 1rem 0; list-style: none; }
.feature-list li { position: relative; padding-left: 1.25rem; }
.feature-list li::before { content: ""; position: absolute; left: 0; top: .6rem; width: .6rem; height: .6rem; border-radius: 50%; background: linear-gradient(90deg, var(--neon-blue), var(--electric-purple)); box-shadow: 0 0 8px var(--neon-blue); }

.timeline { list-style: none; padding: 0; margin: 0 0 1rem 0; display: grid; gap: .5rem; }

.callout { background: rgba(255,255,255,0.04); border: 1px dashed rgba(255,255,255,0.2); border-radius: 1rem; padding: 1rem; }
.cta-row { display: flex; gap: .75rem; flex-wrap: wrap; }

/* Filters & events */
.filters { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1rem; }
.filter-btn { background: rgba(255,255,255,0.04); color: #fff; border: 1px solid rgba(255,255,255,0.12); border-radius: 2rem; padding: .5rem .9rem; cursor: pointer; }
.filter-btn.is-active { background: linear-gradient(90deg, var(--electric-purple), var(--vibrant-magenta)); border-color: transparent; }
.events-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1rem; }
.event-card { background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.08); border-radius: 1rem; padding: 1rem; }
.event-title { margin: 0 0 .25rem 0; }
.event-meta { color: #98a1b3; margin: 0 0 .5rem 0; }

/* Reservation form */
.reserve-form { display: grid; gap: 1rem; }
.form-row { display: grid; grid-template-columns: repeat(2,1fr); gap: 1rem; }
.form-field { display: grid; gap: .4rem; }
.form-field input, .form-field select { width: 100%; padding: .75rem .9rem; border-radius: .6rem; border: 1px solid rgba(255,255,255,0.12); background: rgba(255,255,255,0.03); color: #fff; }
.form-actions { display: flex; gap: .75rem; align-items: center; }
.sr-status { margin-top: .5rem; min-height: 1.25rem; color: var(--soft-cyan); }

/* Gallery */
.gallery-one { display: grid; gap: 1rem; }
.gallery-item img { width: 100%; height: auto; border-radius: 1rem; border: 1px solid rgba(255,255,255,0.08); }

/* Testimonials */
.testimonials { display: grid; grid-template-columns: repeat(3,1fr); gap: 1rem; }
.quote { margin: 0; background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.08); border-radius: 1rem; padding: 1rem; }
.quote cite { display: block; margin-top: .5rem; color: #98a1b3; font-style: normal; }

/* Hero media adjustments */
.hero-media img { width: 100%; height: auto; border-radius: 1rem; border: 1px solid rgba(255,255,255,0.08); }

/* Responsive */
@media (max-width: 1024px) {
  .feature-grid { grid-template-columns: repeat(2,1fr); }
  .events-grid { grid-template-columns: repeat(2,1fr); }
  .hero-inner { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .split { grid-template-columns: 1fr; }
  .form-row { grid-template-columns: 1fr; }
  .events-grid { grid-template-columns: 1fr; }
  .testimonials { grid-template-columns: 1fr; }
}
