/* ============================================
   QAYDAO VIP — Continuous Vertical Mobile Catalog
   Activated when body.mobile-catalog-mode (set by JS on mobile)
   ============================================ */

@media (max-width: 1024px) {
  /* Reset page chrome on mobile catalog mode */
  body.mobile-catalog-mode {
    background: #0B0904;
    overflow-x: hidden;
    margin: 0;
    padding: 0;
  }
  body.mobile-catalog-mode #nav,
  body.mobile-catalog-mode .ph,
  body.mobile-catalog-mode .fb-controls,
  body.mobile-catalog-mode .other-cat,
  body.mobile-catalog-mode .ft,
  body.mobile-catalog-mode .wa-fab { display: none !important; }
  body.mobile-catalog-mode .fb-section {
    margin: 0; padding: 0;
    background: #0B0904 !important;
    min-height: 100vh;
  }

  /* ============ CONTINUOUS VERTICAL STACK ============ */
  #flipbook.mv2 {
    display: block;
    width: 100%;
    background: #0B0904;
    padding: 60px 0 90px;  /* top bar + bottom bar */
    margin: 0;
  }

  .mv2-page {
    width: 100%;
    margin: 0;
    background: #0B0904;
    position: relative;
  }

  .mv2-page img {
    display: block;
    width: 100%;
    height: auto;
    user-select: none;
    -webkit-user-select: none;
    -webkit-touch-callout: none;
  }

  /* Elegant gold separator between pages (coffee-table book style) */
  .mv2-sep {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    padding: 28px 32px;
    background: #0B0904;
  }
  .mv2-sep-line {
    flex: 1;
    height: 1px;
    background: linear-gradient(to right, transparent 0%, rgba(196,151,74,.5) 50%, transparent 100%);
    max-width: 60px;
  }
  .mv2-sep-num {
    font-family: 'Poppins', sans-serif;
    font-size: 9px;
    letter-spacing: .26em;
    color: rgba(196,151,74,.7);
    white-space: nowrap;
  }

  /* ============ UI OVERLAY ============ */
  #mv2-ui {
    position: fixed;
    inset: 0;
    z-index: 200;
    pointer-events: none;
    transition: opacity .4s ease;
  }
  #mv2-ui.hidden { opacity: 0; }
  #mv2-ui > * { pointer-events: auto; }

  /* Top bar — sticky transparent with blur */
  #mv2-topbar {
    position: fixed; top: 0; left: 0; right: 0;
    height: 56px;
    padding: 0 16px;
    padding-top: env(safe-area-inset-top, 0);
    display: flex; align-items: center; justify-content: space-between;
    background: linear-gradient(180deg, rgba(11,9,4,.94) 0%, rgba(11,9,4,.5) 75%, rgba(11,9,4,0) 100%);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
  }
  .mv2-logo {
    display: flex; flex-direction: column; gap: 1px;
    text-decoration: none;
  }
  .mv2-logo-en {
    font-family: 'Bodoni Moda', serif;
    font-size: 17px; font-weight: 300; letter-spacing: .2em;
    color: #FDFAF5;
  }
  .mv2-logo-ar {
    font-family: 'Cairo', sans-serif;
    font-size: 8px; letter-spacing: .22em;
    color: #C4974A;
    text-align: center;
  }

  /* Page counter */
  .mv2-counter {
    display: flex; align-items: center; gap: 4px;
    background: rgba(11,9,4,.55);
    border: 1px solid rgba(196,151,74,.3);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    padding: 6px 14px;
    border-radius: 999px;
  }
  .mv2-counter span {
    font-family: 'Poppins', sans-serif;
    font-size: 12px; font-weight: 400;
    color: #FDFAF5;
    letter-spacing: .04em;
    transition: color .3s;
  }
  #mv2-current {
    color: #C4974A; font-weight: 500;
    min-width: 22px; text-align: center;
  }
  .mv2-counter-sep { color: rgba(255,255,255,.3); }
  .mv2-counter-total { color: rgba(255,255,255,.55); }

  .mv2-switch {
    font-family: 'Cairo', sans-serif;
    font-size: 11px; letter-spacing: .12em;
    color: #C4974A;
    border: 1px solid rgba(196,151,74,.4);
    padding: 7px 13px;
    border-radius: 4px;
    text-decoration: none;
    background: rgba(11,9,4,.5);
    backdrop-filter: blur(8px);
  }

  /* Bottom bar — floating */
  #mv2-bottombar {
    position: fixed; bottom: 0; left: 0; right: 0;
    padding: 14px 18px;
    padding-bottom: calc(16px + env(safe-area-inset-bottom, 0));
    display: flex; justify-content: center; align-items: center; gap: 10px;
    background: linear-gradient(0deg, rgba(11,9,4,.94) 0%, rgba(11,9,4,.55) 65%, rgba(11,9,4,0) 100%);
  }
  .mv2-btn {
    width: 46px; height: 46px;
    border-radius: 50%;
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(196,151,74,.32);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    color: #FDFAF5;
    font-family: 'Cairo', sans-serif;
    font-size: 18px;
    display: inline-flex; align-items: center; justify-content: center;
    text-decoration: none;
    transition: all .25s ease;
    cursor: pointer;
  }
  .mv2-btn:active {
    transform: scale(.9);
    background: rgba(196,151,74,.2);
  }
  .mv2-btn-sm {
    width: 38px; height: 38px;
    font-size: 14px;
    opacity: .75;
  }
  .mv2-wa {
    background: #25D366;
    border-color: #25D366;
    color: #fff;
    font-size: 20px;
    width: 50px; height: 50px;
    box-shadow: 0 4px 14px rgba(37,211,102,.35);
  }
  .mv2-wa:active { background: #1ea854; }

  /* Initial hint */
  #mv2-hint {
    position: fixed;
    bottom: 100px;
    left: 50%;
    transform: translateX(-50%);
    background: rgba(11,9,4,.78);
    border: 1px solid rgba(196,151,74,.3);
    backdrop-filter: blur(12px);
    padding: 10px 20px;
    border-radius: 999px;
    font-family: 'Cairo', sans-serif;
    font-size: 11px;
    color: rgba(255,255,255,.82);
    letter-spacing: .04em;
    white-space: nowrap;
    transition: opacity .5s ease;
    z-index: 250;
    animation: mv2HintPulse 2.4s ease-in-out 1s infinite;
  }
  @keyframes mv2HintPulse {
    0%, 100% { transform: translateX(-50%) translateY(0); }
    50% { transform: translateX(-50%) translateY(-4px); }
  }

  /* Lead Gate adjustments on mobile */
  #lead-gate { padding: 20px 16px; }
  .lg-card { padding: 36px 22px; }
  .lg-card h2 { font-size: 24px !important; line-height: 1.35; }
}

/* Landscape on mobile devices */
@media (max-width: 1024px) and (orientation: landscape) and (min-width: 769px) {
  body.mobile-catalog-mode .mv2-page img {
    max-width: 720px;
    margin: 0 auto;
  }
}

/* ============ GLOBAL OVERRIDES (any size, when mobile-catalog-mode is on) ============ */
body.mobile-catalog-mode {
  background: #0B0904 !important;
  overflow-x: hidden !important;
}
body.mobile-catalog-mode #nav,
body.mobile-catalog-mode .ph,
body.mobile-catalog-mode .fb-controls,
body.mobile-catalog-mode .other-cat,
body.mobile-catalog-mode .ft,
body.mobile-catalog-mode .wa-fab { display: none !important; }
body.mobile-catalog-mode .fb-section {
  margin: 0 !important;
  padding: 0 !important;
  background: #0B0904 !important;
  min-height: 100vh !important;
}