/* SCEVÁ responsive system — mobile first, isolated from legacy layout rules */
:root {
  --screen-gutter: 16px;
}

html,
body {
  width: 100%;
  min-width: 0 !important;
  max-width: 100%;
  overflow-x: hidden;
}

@supports (overflow: clip) {
  html,
  body { overflow-x: clip; }
}

body,
main,
nav,
section,
footer,
.wrap,
.hero-copy,
.section-head,
.event-grid,
.event-copy,
.club-grid,
.club-list,
.club-mobile,
.gallery-grid,
.gallery-column,
.booking-wrap,
.form-grid,
.field,
.full,
.zones,
.booking-bottom,
.location-grid,
.contact-list,
.contact-link,
.contact-link > div {
  min-width: 0;
  max-width: 100%;
}

p,
h1,
h2,
h3,
h4,
h5,
h6,
a,
button,
label,
address {
  min-width: 0;
  max-width: 100%;
  word-break: normal;
  overflow-wrap: break-word;
}

img,
video,
svg {
  max-width: 100%;
}

.display,
.menu-links a,
.club-item h3,
.club-card h3,
.contact-link h3,
.location-address,
.footer-brand {
  white-space: normal !important;
  word-break: normal !important;
  overflow-wrap: break-word !important;
  hyphens: none !important;
}

.display {
  width: 100%;
  text-wrap: balance;
}

.display br {
  display: initial !important;
}

.hero h1 {
  overflow-wrap: normal !important;
  word-break: normal !important;
}

.hero h1 span {
  display: block;
  white-space: nowrap;
}

.button {
  max-width: 100%;
  white-space: normal;
  text-align: center;
}

.site-nav,
.menu-overlay,
.hero,
.section,
footer,
.lightbox {
  width: 100%;
  max-width: 100%;
}

.wrap {
  width: 100%;
  margin-inline: auto;
}

.hero,
.section,
footer {
  padding-left: calc(var(--screen-gutter) + env(safe-area-inset-left, 0px)) !important;
  padding-right: calc(var(--screen-gutter) + env(safe-area-inset-right, 0px)) !important;
}

.nav-inner,
.menu-links {
  padding-left: calc(var(--screen-gutter) + env(safe-area-inset-left, 0px)) !important;
  padding-right: calc(var(--screen-gutter) + env(safe-area-inset-right, 0px)) !important;
}

.location-title {
  font-size: clamp(3rem,5vw,5rem) !important;
  line-height: 1 !important;
  letter-spacing: -.055em !important;
  white-space: normal !important;
}

/* Smartphone: 320–767 px */
@media (max-width: 47.99rem) {
  :root { --screen-gutter: 16px; }

  .site-nav { min-height: calc(68px + env(safe-area-inset-top, 0px)); }
  .nav-inner { height: 68px !important; }
  .nav-logo img { width: 58px !important; height: 40px !important; object-fit: contain; }
  .menu-button,
  .overlay-close { width: 48px !important; height: 48px !important; }

  .menu-overlay {
    display: block !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
  }
  .menu-side { display: none !important; }
  .menu-links {
    width: 100% !important;
    min-height: 100dvh !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    gap: clamp(8px,2vh,16px) !important;
    padding-top: calc(80px + env(safe-area-inset-top, 0px)) !important;
    padding-bottom: calc(32px + env(safe-area-inset-bottom, 0px)) !important;
  }
  .menu-links a {
    width: 100% !important;
    font-size: clamp(1.9rem,9.5vw,2.8rem) !important;
    line-height: 1.02 !important;
    letter-spacing: -.055em !important;
    white-space: normal !important;
  }

  .hero {
    min-height: 100svh !important;
    height: auto !important;
    padding-top: calc(96px + env(safe-area-inset-top, 0px)) !important;
    padding-bottom: calc(72px + env(safe-area-inset-bottom, 0px)) !important;
    overflow: hidden !important;
  }
  .hero-copy { width: 100% !important; }
  .hero-logo {
    width: min(86vw,360px) !important;
    height: auto !important;
    max-height: 128px !important;
  }
  .hero h1 {
    font-size: clamp(1.8rem,8.2vw,2.65rem) !important;
    line-height: .92 !important;
    letter-spacing: -.065em !important;
  }
  .hero-tag {
    max-width: 28rem;
    margin-inline: auto;
    font-size: 1rem !important;
    line-height: 1.45 !important;
  }
  .hero-actions {
    width: 100% !important;
    max-width: 360px !important;
    display: grid !important;
    grid-template-columns: minmax(0,1fr) !important;
    margin-inline: auto !important;
  }
  .hero-actions .button { width: 100% !important; min-height: 52px !important; }
  .scroll-cue { display: none !important; }

  .section {
    padding-top: 80px !important;
    padding-bottom: 80px !important;
    overflow: hidden !important;
  }
  .section-head {
    width: 100% !important;
    margin-bottom: 44px !important;
  }
  .section-head .display {
    margin-top: 12px !important;
    font-size: clamp(2rem,8.4vw,2.8rem) !important;
    line-height: 1 !important;
    letter-spacing: -.055em !important;
  }
  .section-head .display br { display: initial !important; }
  .eyebrow {
    font-size: .75rem !important;
    line-height: 1.4 !important;
    letter-spacing: .14em !important;
  }
  .giant-word { display: none !important; }

  .event-grid {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: minmax(0,1fr) !important;
    gap: 40px !important;
  }
  .clubbing-events-grid { grid-template-columns: minmax(0,1fr) !important; }
  .clubbing-event-card.is-loading { min-height: 340px !important; }
  .event-actions { display: grid !important; grid-template-columns: minmax(0,1fr) !important; }
  .event-actions .button { width: 100% !important; }
  .event-poster {
    width: 100% !important;
    min-height: 0 !important;
    height: auto !important;
    aspect-ratio: 4 / 5 !important;
    margin: 0 !important;
  }
  .poster-copy { inset: auto 16px 16px !important; }
  .poster-copy strong {
    font-size: clamp(2rem,10vw,3rem) !important;
    line-height: .92 !important;
  }
  .event-copy { width: 100% !important; }
  .event-copy .event-date {
    font-size: clamp(3rem,14vw,4.2rem) !important;
    line-height: .9 !important;
  }
  .event-date br { display: block !important; }
  .event-copy > p:not(.eyebrow) { font-size: 1rem !important; line-height: 1.55 !important; }
  .countdown {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: repeat(4,minmax(0,1fr)) !important;
    gap: 4px !important;
  }
  .countdown-item { min-width: 0 !important; text-align: center !important; }
  .countdown strong { font-size: clamp(1.45rem,7vw,2rem) !important; }
  .countdown span { font-size: .7rem !important; letter-spacing: .02em !important; }
  .countdown .separator { display: none !important; }

  .marquee { width: 100% !important; }
  .marquee-copy { font-size: 1.2rem !important; }

  .club-grid { display: none !important; }
  .club-mobile {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: minmax(0,1fr) !important;
    gap: 48px !important;
  }
  .club-card { width: 100% !important; }
  .club-card h3 { font-size: clamp(1.65rem,7.5vw,2.2rem) !important; line-height: 1.05 !important; }
  .club-card p { font-size: 1rem !important; line-height: 1.55 !important; }
  .club-card img { width: 100% !important; height: auto !important; aspect-ratio: 4 / 3 !important; }

  .gallery-grid,
  .gallery-column,
  .gallery-grid .gallery-column:last-child {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: minmax(0,1fr) !important;
    grid-column: auto !important;
    gap: 14px !important;
  }
  .gallery-shot { width: 100% !important; }

  .booking-wrap { width: 100% !important; }
  .booking-head {
    width: 100% !important;
    min-height: 240px !important;
  }
  .booking-head .display {
    font-size: clamp(2.15rem,9.4vw,3rem) !important;
    line-height: 1 !important;
    letter-spacing: -.055em !important;
  }
  .booking-head .display br { display: block !important; }
  .form-panel { width: 100% !important; margin-top: 36px !important; }
  .clubbing-features { grid-template-columns: minmax(0,1fr) !important; }
  .clubbing-feature { border-left: 0 !important; border-top: 1px solid var(--line) !important; }
  .clubbing-feature:first-child { border-top: 0 !important; }
  .clubbing-actions,
  .clubbing-actions .button { width: 100% !important; }
  .form-grid,
  .zones,
  .booking-bottom {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: minmax(0,1fr) !important;
  }
  .full { grid-column: 1 !important; }
  .field,
  .field input,
  .zone,
  .submit { width: 100% !important; }
  .field input { min-width: 0 !important; min-height: 52px !important; font-size: 16px !important; }
  .zone { min-height: 112px !important; }
  .total { font-size: 2.6rem !important; text-align: left !important; }

  .location-title {
    width: 100% !important;
    font-size: clamp(1.3rem,6.2vw,2.15rem) !important;
    line-height: 1.05 !important;
    letter-spacing: -.04em !important;
    white-space: normal !important;
  }
  .location-grid {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: minmax(0,1fr) !important;
    gap: 32px !important;
  }
  .location-card,
  .location-photo { width: 100% !important; }
  .location-address { font-size: clamp(1.45rem,7vw,2rem) !important; line-height: 1.12 !important; }
  .location-photo { min-height: 0 !important; height: auto !important; aspect-ratio: 4 / 3 !important; }

  .contact-link {
    width: 100% !important;
    min-height: 0 !important;
    display: grid !important;
    grid-template-columns: minmax(0,1fr) 28px !important;
    gap: 8px 12px !important;
    padding: 24px 0 !important;
  }
  .contact-link > span:first-child { grid-column: 1 / -1 !important; }
  .contact-link h3 {
    max-width: 100% !important;
    font-size: clamp(1.25rem,5.7vw,1.75rem) !important;
    line-height: 1.12 !important;
    overflow-wrap: anywhere !important;
  }
  .contact-link p { display: block !important; font-size: .92rem !important; line-height: 1.45 !important; }

  footer { padding-top: 72px !important; }
  .footer-brand {
    width: 100% !important;
    font-size: clamp(3.25rem,15vw,5rem) !important;
    line-height: .86 !important;
    letter-spacing: -.09em !important;
    white-space: normal !important;
  }
  .footer-meta {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 12px !important;
    font-size: .75rem !important;
    line-height: 1.4 !important;
  }

  .lightbox { padding: 72px 12px calc(64px + env(safe-area-inset-bottom,0px)) !important; }
  .lightbox img { max-width: calc(100vw - 24px) !important; max-height: calc(100dvh - 144px) !important; }
  .info-panel {
    left: calc(12px + env(safe-area-inset-left,0px)) !important;
    right: calc(12px + env(safe-area-inset-right,0px)) !important;
    width: auto !important;
    max-width: none !important;
  }
}

/* Very small phones */
@media (max-width: 22.5rem) {
  :root { --screen-gutter: 14px; }
  .hero h1 { font-size: 1.7rem !important; }
  .section-head .display { font-size: 1.9rem !important; }
  .menu-links a { font-size: 1.85rem !important; }
  .location-title { font-size: 1.25rem !important; }
  .countdown strong { font-size: 1.35rem !important; }
  .countdown span { font-size: .65rem !important; }
}

/* Tablet portrait and landscape: 768–1199 px */
@media (min-width: 48rem) and (max-width: 74.99rem) {
  :root { --screen-gutter: clamp(28px,4vw,48px); }
  .section { padding-top: clamp(96px,11vw,132px) !important; padding-bottom: clamp(96px,11vw,132px) !important; }
  .section-head .display { font-size: clamp(3.4rem,7vw,5.4rem) !important; line-height: .9 !important; }
  .giant-word { display: none !important; }

  .menu-overlay { grid-template-columns: minmax(0,1fr) minmax(240px,.55fr) !important; }
  .menu-links a { font-size: clamp(3.2rem,6vw,4.8rem) !important; white-space: normal !important; }

  .hero h1 { font-size: clamp(3.4rem,6.8vw,5.1rem) !important; }
  .hero-logo { width: min(78vw,650px) !important; }

  .event-grid { grid-template-columns: minmax(0,1fr) !important; gap: 56px !important; }
  .clubbing-events-grid { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
  .event-poster { width: min(100%,560px) !important; min-height: 0 !important; aspect-ratio: 4 / 5 !important; margin-inline: auto !important; }
  .event-copy { width: min(100%,680px) !important; margin-inline: auto !important; }

  .club-grid { display: none !important; }
  .club-mobile { display: grid !important; grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: 48px 24px !important; }
  .club-card img { width: 100% !important; }

  .gallery-grid { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
  .gallery-grid .gallery-column:last-child { grid-column: 1 / -1 !important; grid-template-columns: repeat(2,minmax(0,1fr)) !important; }

  .form-grid { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
  .zones,
  .booking-bottom { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
  .full { grid-column: 1 / -1 !important; }

  .location-title { font-size: clamp(2.7rem,5.7vw,4rem) !important; }
  .location-grid { grid-template-columns: minmax(0,.9fr) minmax(0,1.1fr) !important; gap: 40px !important; }
  .contact-link { grid-template-columns: 130px minmax(0,1fr) 36px !important; }
  .contact-link h3 { overflow-wrap: anywhere !important; }
  .footer-brand { font-size: clamp(5.5rem,13vw,9rem) !important; }
}

/* Larger tablets and small laptops */
@media (min-width: 56.25rem) and (max-width: 74.99rem) {
  .event-grid { grid-template-columns: minmax(280px,.8fr) minmax(0,1fr) !important; align-items: center !important; }
  .event-poster { width: 100% !important; }
  .club-grid { display: grid !important; grid-template-columns: minmax(0,.9fr) minmax(0,1.1fr) !important; }
  .club-mobile { display: none !important; }
}

/* Desktop and wide screens */
@media (min-width: 75rem) {
  :root { --screen-gutter: clamp(48px,5vw,80px); }
  .wrap { max-width: 1320px !important; }
  .hero h1 { font-size: clamp(4rem,5.7vw,5.7rem) !important; }
  .section-head .display { font-size: clamp(5.5rem,9vw,8.5rem) !important; }
  .event-grid { grid-template-columns: minmax(320px,.78fr) minmax(0,1fr) !important; }
  .club-grid { grid-template-columns: minmax(0,1.06fr) minmax(0,.94fr) !important; }
  .gallery-grid { grid-template-columns: minmax(0,1.05fr) minmax(0,.78fr) minmax(0,.95fr) !important; }
  .form-grid { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
  .location-grid { grid-template-columns: minmax(0,.85fr) minmax(0,1.15fr) !important; }
  .footer-brand { font-size: clamp(8rem,12vw,11rem) !important; }
}

/* Short landscape screens */
@media (max-height: 36rem) and (orientation: landscape) {
  .hero { min-height: 620px !important; }
  .scroll-cue { display: none !important; }
  .menu-overlay { display: block !important; }
  .menu-side { display: none !important; }
  .menu-links {
    min-height: 100dvh !important;
    display: grid !important;
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    align-content: center !important;
    gap: 10px 32px !important;
  }
  .menu-links a { font-size: clamp(1.7rem,7vh,2.6rem) !important; }
}

@media (prefers-reduced-motion: reduce) {
  .hero-copy,
  .hero-bg,
  .reveal { transform: none !important; }
}