/* Hotel page styles – minimal, complementing base.css */
:root{
  --neon-purple: #7a2cff;
  --neon-blue: #00b7ff;
  --magenta: #ff2aa6;
  --charcoal: #0e0e14;
  --soft-cyan: #66e0ff;
}

.hotel-hero{
  position:relative;
  background: linear-gradient(180deg, rgba(10,10,18,.7), rgba(10,10,18,.65)), url('/assets/images/nightlife-vibes.webp') center/cover no-repeat;
  color:#fff;
  padding: clamp(5rem, 8vw, 9rem) 0;
}
.hotel-hero .hero-content{max-width:1100px;margin-inline:auto;text-align:center}
.hotel-hero .lead{margin:1rem auto 2rem;max-width:800px;opacity:.95}
.hero-ctas{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}

.section{padding: clamp(3rem, 6vw, 5rem) 0}
.section.alt{background: linear-gradient(180deg, rgba(122,44,255,.08), rgba(0,183,255,.06));}
.section-header{max-width:900px;margin:0 auto 1.5rem;text-align:center}
.section-cta{margin-top:1.25rem;display:flex;gap:.75rem;justify-content:center;flex-wrap:wrap}

.feature-grid{display:grid;grid-template-columns:repeat(1,minmax(0,1fr));gap:1rem;margin-top:1rem}
.feature-grid.three{grid-template-columns:repeat(1,minmax(0,1fr))}
@media (min-width: 700px){
  .feature-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .feature-grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}
}
.card{background:rgba(14,14,20,.6);backdrop-filter:saturate(130%) blur(6px);border:1px solid rgba(122,44,255,.25);padding:1.25rem;border-radius:14px}
.card h3{color:var(--soft-cyan)}

.media{margin:1rem auto 0;max-width:1100px}
.media img{display:block;width:100%;height:auto;border-radius:14px;border:1px solid rgba(0,183,255,.25)}
.media figcaption{font-size:.9rem;opacity:.8;margin-top:.5rem;text-align:center}

.offer-grid{display:grid;grid-template-columns:repeat(1,minmax(0,1fr));gap:1rem;margin-top:1rem}
@media (min-width: 800px){.offer-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
.offer-card{background:linear-gradient(180deg, rgba(255,42,166,.12), rgba(122,44,255,.12));border:1px solid rgba(255,42,166,.35);padding:1.25rem;border-radius:14px}
.offer-card h3{color:var(--magenta)}

.booking-panels{display:grid;gap:1.25rem;grid-template-columns:1fr}
@media (min-width: 1000px){.booking-panels{grid-template-columns:1.3fr .7fr}}
.booking-form{background:rgba(14,14,20,.6);border:1px solid rgba(0,183,255,.3);padding:1rem;border-radius:14px}
.form-row{display:grid;gap:.75rem;grid-template-columns:1fr}
.form-field{display:flex;flex-direction:column;gap:.35rem}
.form-field.full{grid-column:1/-1}
@media (min-width: 700px){.form-row{grid-template-columns:repeat(4,minmax(0,1fr))}}
.booking-summary{margin:.5rem 0 1rem;color:var(--soft-cyan);font-weight:600}
.form-help{opacity:.85}
.booking-actions{display:grid;gap:1rem;grid-template-columns:1fr}
@media (min-width: 700px){.booking-actions{grid-template-columns:repeat(2,minmax(0,1fr))}}
.split-cta{background:rgba(14,14,20,.6);border:1px solid rgba(122,44,255,.3);padding:1rem;border-radius:14px}

.testimonial-grid{display:grid;gap:1rem;grid-template-columns:repeat(1,minmax(0,1fr));margin-top:1rem}
@media (min-width: 900px){.testimonial-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
.quote{background:linear-gradient(180deg, rgba(0,183,255,.1), rgba(102,224,255,.08));border:1px solid rgba(0,183,255,.35);border-radius:14px;padding:1rem}
.quote footer{opacity:.85;margin-top:.5rem}

.contact-layout{display:grid;gap:1.25rem;grid-template-columns:1fr}
@media (min-width: 1000px){.contact-layout{grid-template-columns:1fr 1fr}}
.contact-details{background:rgba(14,14,20,.6);border:1px solid rgba(122,44,255,.35);padding:1rem;border-radius:14px}
.contact-form{background:rgba(14,14,20,.6);border:1px solid rgba(0,183,255,.35);padding:1rem;border-radius:14px}

/* Button adjustments to fit neon theme while using base classes */
.btn-primary{background:linear-gradient(90deg, var(--neon-purple), var(--neon-blue));border:none;color:#fff!important;box-shadow:0 8px 30px rgba(122,44,255,.35);border-radius:10px;padding:.7rem 1rem}
.btn-primary:hover{filter:brightness(1.06)}
.btn-outline{border:1px solid var(--soft-cyan)}

/* Focus visibility for accessibility */
:focus-visible{outline:2px solid var(--soft-cyan);outline-offset:2px}