/* Gaming page specific styles – minimal and complementary to base.css */
:root {
  --neon-blue: #3dd6ff;
  --electric-purple: #7b2cff;
  --magenta: #ff2da6;
  --charcoal: #12131a;
  --soft-cyan: #9cf3ff;
}

.gaming-hero {
  background: radial-gradient(1200px 600px at 20% 10%, rgba(123,44,255,0.22), transparent),
              radial-gradient(1000px 500px at 90% 20%, rgba(255,45,166,0.18), transparent),
              linear-gradient(180deg, rgba(18,19,26,0.9), rgba(18,19,26,0.9));
  color: #fff;
  padding: 3rem 0;
}
.gaming-hero .hero-inner { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: 2rem; align-items: center; }
@media (max-width: 900px){ .gaming-hero .hero-inner{ grid-template-columns: 1fr; } }
.gaming-hero .lead { opacity: 0.92; }
.gaming-hero .hero-figure img { border-radius: 12px; box-shadow: 0 20px 60px rgba(0,0,0,0.45); width: 100%; height: auto; }
.hero-ctas { display:flex; gap: 1rem; flex-wrap: wrap; margin-top: 1rem; }

.section-nav { margin: 1rem auto 2rem; }
.section-nav-list { display: flex; flex-wrap: wrap; gap: .75rem 1rem; list-style: none; padding: 0; }
.section-nav-list a { padding: .5rem .75rem; border: 1px solid rgba(156,243,255,0.35); border-radius: 999px; color: var(--soft-cyan); text-decoration: none; }
.section-nav-list a:hover { background: rgba(156,243,255,0.08); }

.section-header { margin-bottom: 1rem; }
.cards { display: grid; gap: 1rem; }
.cards.three-up { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 900px){ .cards.three-up{ grid-template-columns: 1fr; } }
.card { background: linear-gradient(180deg, rgba(255,255,255,0.04), rgba(255,255,255,0.02)); border: 1px solid rgba(255,255,255,0.08); border-radius: 12px; padding: 1rem; color: #e9ecf1; }
.card .badge { display: inline-block; padding: .25rem .5rem; border-radius: 6px; background: rgba(59,130,246,0.16); color: var(--soft-cyan); font-size: .85rem; }
.card .price { color: var(--soft-cyan); font-weight: 700; }
.card-actions { display: flex; gap: .5rem; flex-wrap: wrap; margin-top: .5rem; }

.inline-form fieldset { display: grid; gap: .5rem; grid-template-columns: repeat(6, 1fr); align-items: end; }
.inline-form label { grid-column: span 2; font-size: .9rem; opacity: .9; }
.inline-form input, .inline-form select { grid-column: span 4; }
.inline-form .checkbox { grid-column: span 6; display: flex; align-items: center; gap: .5rem; }
.inline-form button { grid-column: span 2; }
@media (max-width: 900px){
  .inline-form fieldset { grid-template-columns: 1fr; }
  .inline-form label, .inline-form input, .inline-form select, .inline-form .checkbox, .inline-form button { grid-column: 1 / -1; }
}

.zone-layout { display: grid; grid-template-columns: .9fr 1.1fr; gap: 1.25rem; align-items: start; }
@media (max-width: 900px){ .zone-layout { grid-template-columns: 1fr; } }
.zone-figure img, .vip-figure img { width: 100%; height: auto; border-radius: 12px; box-shadow: 0 20px 60px rgba(0,0,0,0.4); }
.zone-list { list-style: none; padding: 0; margin: 0; display: grid; gap: .75rem; }
.zone-list h3 { margin: 0 0 .25rem; color: var(--soft-cyan); }

.vip-content { display: grid; grid-template-columns: 1fr 1fr; gap: 1.25rem; }
@media (max-width: 900px){ .vip-content { grid-template-columns: 1fr; } }
.checklist { list-style: none; padding: 0; margin: 0; display: grid; gap: .35rem; }
.checklist li::before { content: ""; display: inline-block; width: .6rem; height: .6rem; margin-right: .5rem; border-radius: 50%; background: linear-gradient(135deg, var(--electric-purple), var(--magenta)); box-shadow: 0 0 12px rgba(255,45,166,0.6); }

.tour-card { display: grid; gap: .75rem; justify-items: start; }
.tour-card img { border-radius: 12px; width: 100%; height: auto; box-shadow: 0 20px 60px rgba(0,0,0,0.45); }
.tour-modal { max-width: 900px; width: min(92vw, 900px); border: 1px solid rgba(255,255,255,0.15); border-radius: 12px; padding: 0; background: #0d0f15; color: #fff; }
.tour-modal::backdrop { background: rgba(0,0,0,0.6); }
.modal-header, .modal-footer { padding: .75rem 1rem; display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid rgba(255,255,255,0.08);
}
.modal-footer { border-top: 1px solid rgba(255,255,255,0.08); border-bottom: none; }
.modal-body { padding: 1rem; }
.icon-btn { background: transparent; border: 1px solid rgba(255,255,255,0.2); border-radius: 8px; color: #fff; font-size: 1.2rem; width: 2rem; height: 2rem; line-height: 1; }
.icon-btn:hover { background: rgba(255,255,255,0.08); }

.etiquette-list, .tips-list { display: grid; gap: .5rem; }

.calendar { display: grid; gap: .75rem; }
.calendar-item { display: grid; grid-template-columns: 130px 1fr auto; align-items: center; gap: .75rem; padding: .75rem; border: 1px solid rgba(255,255,255,0.08); border-radius: 10px; }
.calendar-item time { color: var(--soft-cyan); font-weight: 700; }
@media (max-width: 700px){ .calendar-item { grid-template-columns: 1fr; justify-items: start; } }

.accordion .accordion-trigger { width: 100%; text-align: left; padding: .75rem 1rem; border-radius: 10px; border: 1px solid rgba(255,255,255,0.1); background: rgba(255,255,255,0.03); color: #e9ecf1; }
.accordion .accordion-trigger[aria-expanded="true"] { background: linear-gradient(180deg, rgba(123,44,255,0.16), rgba(255,45,166,0.1)); border-color: rgba(123,44,255,0.35); }
.accordion-panel { padding: .5rem 1rem 1rem; }

.tiers { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.tier { border: 1px solid rgba(255,255,255,0.08); border-radius: 10px; padding: 1rem; background: rgba(255,255,255,0.03); }
.tier h3 { color: var(--soft-cyan); }

.cta-banner { margin: 2rem auto; padding: 1.25rem; background: linear-gradient(90deg, rgba(123,44,255,0.18), rgba(61,214,255,0.12)); border: 1px solid rgba(255,255,255,0.08); border-radius: 12px; text-align: center; }
.cta-banner .cta-row { display: flex; gap: .75rem; justify-content: center; flex-wrap: wrap; margin-top: .5rem; }

/* Utility alignments to integrate with base.css */
.container { max-width: 1200px; margin-inline: auto; padding-inline: 1rem; }
.btn { cursor: pointer; }
.btn-small { padding: .4rem .65rem; font-size: .9rem; }
.btn-link { background: transparent; border: none; color: var(--soft-cyan); text-decoration: underline; padding: .25rem 0; }
.btn-primary { background: linear-gradient(135deg, var(--electric-purple), var(--magenta)); color: #fff!important; border: none; border-radius: 10px; padding: .7rem 1rem; box-shadow: 0 8px 30px rgba(123,44,255,0.35); }
.btn-secondary { background: rgba(255,255,255,0.08); color: #fff; border: 1px solid rgba(255,255,255,0.2); border-radius: 10px; padding: .7rem 1rem; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); border: 0; }
