/* ============================================================
   RELIANCE CLUB — RESPONSIVE
   Mobile-first breakpoints
   ============================================================ */

/* ── Variables & Viewport Safety (mobile overrides) ────────── */
@media (max-width: 768px) {
  :root {
    --nav-height: 64px;
    --gutter: 1.25rem;
  }

  html, body {
    width: 100%;
    max-width: 100vw;
    overflow-x: hidden !important;
    position: relative;
  }

  /* Body: enable cursor on touch */
  body { cursor: auto; }
  .rc-cursor, .rc-cursor-ring, .rc-cursor-label { display: none; }
}

/* ── Navigation ─────────────────────────────────────────────── */
@media (max-width: 768px) {
  #rc-nav {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    max-width: 100vw;
    height: 64px;
    padding: 0 var(--gutter);
    box-sizing: border-box;
    z-index: 500;
  }

  #rc-nav:not(.is-scrolled) {
    background: linear-gradient(180deg, rgba(10, 9, 7, 0.82) 0%, rgba(10, 9, 7, 0.4) 75%, transparent 100%) !important;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }

  #rc-nav.is-scrolled {
    background: rgba(245, 240, 232, 0.96) !important;
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border-bottom: 1px solid rgba(201, 169, 110, 0.35);
  }

  .nav__inner {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
  }

  .nav__cta { display: none !important; }
  .nav__logo {
    min-width: 0;
    flex-shrink: 1;
    gap: 8px;
  }
  .nav__logo-text {
    font-size: clamp(0.78rem, 3.8vw, 0.92rem);
    white-space: nowrap;
    line-height: 1.15;
  }
  .nav__logo-text small {
    font-size: 0.5rem;
    letter-spacing: 0.18em;
  }
}

/* ── Fullscreen Menu ────────────────────────────────────────── */
@media (max-width: 768px) {
  .menu__inner {
    grid-template-columns: 1fr;
    padding: clamp(24px, 3.5vh, 36px) var(--gutter) clamp(4px, 1vh, 8px);
  }

  .menu__preview { display: none; }

  .menu__nav {
    justify-content: space-between;
    height: 100%;
    min-height: 100%;
    width: 100%;
  }

  .menu__nav-item {
    font-size: clamp(1.65rem, 4.4vh, 2.35rem);
    line-height: 1.12;
    color: #000000 !important;
    opacity: 1 !important;
  }

  .menu__footer {
    flex-direction: column;
    gap: 4px;
    align-items: flex-start;
    padding: 0.4rem var(--gutter) max(0.4rem, env(safe-area-inset-bottom, 10px));
  }
}

/* ── Hero / Scenes ──────────────────────────────────────────── */
@media (max-width: 768px) {
  .scene--hero { height: 100svh; }

  /* Force fullscreen on mobile */
  .h-scroll-container {
    overflow-x: hidden;
  }

  .h-scroll-track {
    flex-direction: column;
  }

  .h-scroll-panel {
    flex: 0 0 100svh;
    width: 100%;
  }

  /* Pinned Sequence on Mobile */
  [data-sequence-wrap] {
    height: auto !important;
  }

  .scene--clublife {
    position: static !important;
    height: auto !important;
    overflow: visible !important;
  }

  .sequence-frame {
    position: relative !important;
    height: 100svh !important;
    min-height: 520px !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    overflow: hidden !important;
  }

  .sequence-frame .seq-bg img {
    opacity: 1 !important;
    transform: none !important;
    display: block !important;
  }
}

/* ── Editorial Grid ─────────────────────────────────────────── */
@media (max-width: 900px) {
  .editorial {
    grid-template-columns: 1fr;
    gap: var(--space-8);
  }

  .editorial--reverse { direction: ltr; }
}

/* ── Stats Strip ────────────────────────────────────────────── */
@media (max-width: 640px) {
  .stats-strip {
    grid-template-columns: 1fr;
  }

  .stat-item::after { display: none; }

  .stat-item {
    border-bottom: var(--border-gold);
    padding: var(--space-8) var(--space-6);
  }

  .stat-item:last-child { border-bottom: none; }
}

@media (max-width: 900px) and (min-width: 641px) {
  .stats-strip { grid-template-columns: 1fr; }
  .stat-item::after { display: none; }
}

/* ── Footer ─────────────────────────────────────────────────── */
@media (max-width: 1024px) {
  .footer__top {
    grid-template-columns: 1fr 1fr;
    gap: var(--space-10);
  }
}

@media (max-width: 640px) {
  .footer__top {
    grid-template-columns: 1fr;
    gap: var(--space-8);
  }

  .footer__bottom {
    flex-direction: column;
    gap: var(--space-4);
    text-align: center;
  }

  .footer__legal-links {
    flex-wrap: wrap;
    justify-content: center;
  }
}

/* ── Typography scaling ─────────────────────────────────────── */
@media (max-width: 640px) {
  .section-header__title {
    font-size: var(--text-3xl);
  }

  .menu__nav-item { font-size: clamp(1.45rem, 4.2vh, 2.05rem); }
  .stat-item__number { font-size: var(--text-5xl); }
}

/* ── Lightbox ───────────────────────────────────────────────── */
@media (max-width: 640px) {
  .lightbox__nav--prev { left: var(--space-3); }
  .lightbox__nav--next { right: var(--space-3); }

  .lightbox__image-wrap img {
    max-width: 95vw;
    max-height: 75vh;
  }
}

/* ── Gateway ────────────────────────────────────────────────── */
@media (max-width: 640px) {
  .gateway__logo-mark { font-size: 1.5rem; letter-spacing: 0.15em; }
  .gateway__skip { bottom: var(--space-5); right: var(--space-5); }
}

/* ── Touch-friendly tap targets ─────────────────────────────── */
@media (max-width: 768px) {
  .btn--primary, .btn--secondary {
    min-height: 48px;
    padding: var(--space-4) var(--space-6);
  }

  .nav__menu-btn {
    padding: 6px 8px;
    width: auto;
    min-width: 44px;
    height: 44px;
    display: inline-flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: center;
    gap: 4px;
  }

  .exp-card .exp-card__cta {
    opacity: 1;
    transform: translateY(0);
  }
}

/* ── Touch screen device overrides (pointer: coarse) ────────── */
@media (pointer: coarse) {
  body, button, a, [role="button"], .lightbox__close, .lightbox__nav {
    cursor: auto !important;
  }
  .rc-cursor, .rc-cursor-ring, .rc-cursor-label {
    display: none !important;
  }
}