/* ============================================================
   SLICIZ LOUNGE — Light Theme Overrides
   Fixes the spots in styles.css that hardcode dark-theme colors
   so they read correctly on a light background. Sections that
   sit over the dark hero / VIP photos intentionally keep light
   text.
   ============================================================ */

/* ── Hero background (local building photo) ───────────────── */
/* Show the whole building (zoomed out) with a dark fill behind the
   letterbox area; no Ken Burns zoom. Mobile keeps cover so the tall
   viewport doesn't leave large empty bands. */
.hero__bg {
  background-image: url('../images/SlicizFront.png');
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  background-color: #0f0c08; /* dark fill behind the letterboxed photo */
  filter: brightness(1.12);
  animation: none;
  transform: none;
}
@media (max-width: 768px) {
  .hero__bg { background-size: cover; }
}

/* Lighter overlay so the photo reads brighter; keep the bottom a bit
   darker for the headline that now sits low in the hero. */
.hero__overlay {
  background: linear-gradient(
    180deg,
    rgba(15, 12, 8, 0.12) 0%,
    rgba(15, 12, 8, 0.18) 50%,
    rgba(15, 12, 8, 0.6) 100%
  );
}

/* ── Hero text: low in the hero, hidden on load, fades in on scroll ── */
.hero { align-items: flex-end; }
.hero__content {
  padding-top: 0;
  padding-bottom: clamp(4rem, 10vh, 7rem);
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.7s ease, transform 0.7s ease;
}
.hero.is-revealed .hero__content {
  opacity: 1;
  transform: translateY(0);
}

/* ── Brand statement headline (moved from the hero) ───────── */
.brand-statement__headline {
  font-family: var(--font-display);
  font-size: clamp(2.75rem, 6vw, 5rem);
  font-weight: var(--fw-light);
  line-height: 1.05;
  letter-spacing: 0.02em;
  color: var(--color-text-primary);
  max-width: 900px;
  margin-inline: auto;
  margin-bottom: var(--space-lg);
  padding-inline: var(--container-pad);
}
.brand-statement__headline em {
  font-style: italic;
  color: var(--color-accent-gold);
}

/* ── Navigation ───────────────────────────────────────────── */
/* At the top the nav floats over the dark hero photo → light text */
.nav__links a { color: rgba(255, 255, 255, 0.85); }
.nav__hamburger span { background: #fff; }

/* Nudge the Reserve button toward the edge so it clears the hero photo */
.nav__cta { margin-right: -1.25rem; }

/* Once scrolled, the nav sits over light content → dark text */
.nav.scrolled {
  background: rgba(250, 248, 243, 0.9);
  border-bottom: 1px solid var(--color-border);
}
.nav.scrolled .nav__links a { color: var(--color-text-primary); }
.nav.scrolled .nav__links a:hover { color: var(--color-accent-gold); }
.nav.scrolled .nav__hamburger span { background: var(--color-text-primary); }

/* ── Hero (over dark photo, keep text light) ──────────────── */
.hero__headline { color: #fff; }
.btn-secondary {
  color: #fff;
  border-color: rgba(255, 255, 255, 0.4);
}

/* ── About (light section, was light-on-dark body copy) ───── */
.about__body { color: #3D372E; }

/* ── Visit (light section) ────────────────────────────────── */
.visit__value { color: #2A251E; }
.visit__hours-row { color: #3D372E; border-bottom-color: rgba(0, 0, 0, 0.06); }

/* Show the map in its natural light styling */
.visit__map iframe { filter: none; }

/* ── Misc light-background tweaks ─────────────────────────── */
.event-row:hover { background: rgba(0, 0, 0, 0.03); }