/* ====================================================
   style.css — shared across all sub-pages
   (rooms / dive / gallery / location)
==================================================== */


    /* ── Tokens ── */
    [data-theme="night"]{
      --bg:rgba(4,8,15,0.85);--bg2:rgba(7,14,26,0.88);--bg3:rgba(10,21,37,0.90);
      --card:rgba(255,255,255,0.04);--card2:rgba(255,255,255,0.07);
      --border:rgba(255,255,255,0.09);--border2:rgba(255,255,255,0.14);
      --text:#f0f4f8;--text2:#94aab8;--text3:rgba(148,170,184,0.6);
      --accent:#4dc2e8;--accent-d:#2e9fc4;--accent-g:rgba(77,194,232,0.14);
      --gold:#e8c56a;--nav-bg:rgba(4,8,15,0.92);
      background-image:linear-gradient(rgba(4,8,15,0.82),rgba(4,8,15,0.82)),url('images/background/594413266_1405022098297117_5892045775093709556_n.jpg');
      background-size:cover;background-attachment:scroll;background-position:center;
      background-color:#04080f;
    }
    [data-theme="night"] body{background:transparent;}
    [data-theme="day"]{
      --bg:#f5f0ea;--bg2:#eae3d8;--bg3:#ddd5c8;
      --card:rgba(255,255,255,0.75);--card2:rgba(255,255,255,0.9);
      --border:rgba(0,0,0,0.08);--border2:rgba(0,0,0,0.14);
      --text:#0d1e2e;--text2:#3a5568;--text3:rgba(58,85,104,0.65);
      --accent:#1a6b98;--accent-d:#155880;--accent-g:rgba(26,107,152,0.1);
      --gold:#b8862a;--nav-bg:rgba(245,240,234,0.95);
    }
    *,*::before,*::after{margin:0;padding:0;box-sizing:border-box;}
    html{scroll-behavior:smooth;}
    body{font-family:'DM Sans',sans-serif;background:var(--bg);color:var(--text);transition:background .5s,color .5s;min-height:100vh;min-height:100dvh;}
    .c{max-width:1200px;margin:0 auto;padding:0 4rem;}

    /* ── Page progress bar ── */
    #pg-bar{position:fixed;top:0;left:0;height:2px;width:0;background:var(--accent);z-index:10001;transition:width .25s ease,opacity .4s ease;pointer-events:none;opacity:1;}
    #pg-bar.done{width:100%;opacity:0;}


    /* ── NAV ── */
    #nav{position:fixed;inset:0 0 auto 0;z-index:200;display:flex;align-items:center;justify-content:space-between;padding:.75rem 4rem;background:var(--nav-bg);backdrop-filter:blur(20px) saturate(160%);-webkit-backdrop-filter:blur(20px) saturate(160%);border-bottom:1px solid var(--border);transition:all .4s;}
    .nav-logo{display:flex;align-items:center;gap:.55rem;text-decoration:none;flex-shrink:0;}
    .nav-logo-img{height:44px;width:auto;flex-shrink:0;display:block;}
    [data-theme="day"] .nav-logo-night{display:none;}
    [data-theme="night"] .nav-logo-day{display:none;}
    .nav-links{display:flex;gap:2.2rem;list-style:none;}
    .nav-links a{color:var(--text2);text-decoration:none;font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;font-weight:400;transition:color .35s;position:relative;padding-bottom:2px;}
    .nav-links a::after{content:'';position:absolute;bottom:0;left:0;width:0;height:1px;background:var(--accent);transition:width .35s ease;}
    .nav-links a:hover,.nav-links a.active{color:var(--accent);}
    .nav-links a:hover::after,.nav-links a.active::after{width:100%;}
    .nav-right{display:flex;align-items:center;gap:1rem;}
    .theme-toggle{display:flex;align-items:center;gap:.5rem;background:rgba(255,255,255,.07);border:1px solid var(--border);border-radius:30px;padding:.3rem .8rem;cursor:pointer;transition:all .35s;font-size:.72rem;letter-spacing:.08em;color:var(--text2);white-space:nowrap;}
    .theme-toggle:hover{border-color:var(--accent);color:var(--accent);}
    .toggle-track{width:34px;height:18px;background:var(--accent-g);border:1px solid var(--border2);border-radius:9px;position:relative;transition:background .4s;flex-shrink:0;}
    .toggle-thumb{position:absolute;top:2px;left:2px;width:12px;height:12px;background:var(--accent);border-radius:50%;transition:transform .35s cubic-bezier(.34,1.56,.64,1),background .4s;}
    [data-theme="day"] .toggle-thumb{transform:translateX(16px);background:var(--gold);}
    [data-theme="day"] .toggle-track{background:rgba(232,197,106,.2);border-color:var(--gold);}
    .toggle-icon{font-size:.85rem;line-height:1;}
    .btn-book{background:var(--accent);color:#fff;padding:.55rem 1.5rem;border-radius:2px;font-size:.75rem;letter-spacing:.12em;text-transform:uppercase;text-decoration:none;transition:background .3s,transform .2s;}
    .btn-book:hover{background:var(--accent-d);transform:translateY(-1px);}

    /* ── Hamburger + Mobile Nav Drawer ── */
    .nav-hamburger{display:none;flex-direction:column;justify-content:center;gap:5px;background:none;border:none;cursor:pointer;padding:6px;z-index:201;margin-left:.5rem;}
    .nav-hamburger span{display:block;width:22px;height:1.5px;background:var(--text);transition:transform .3s ease,opacity .3s ease;}
    .nav-hamburger[aria-expanded="true"] span:nth-child(1){transform:translateY(6.5px) rotate(45deg);}
    .nav-hamburger[aria-expanded="true"] span:nth-child(2){opacity:0;}
    .nav-hamburger[aria-expanded="true"] span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg);}
    /* Day mode: dark-blue hamburger on all pages */
    [data-theme="day"] .nav-hamburger span{background:var(--accent);}
    [data-theme="day"] #nav.scrolled .nav-hamburger span{background:var(--accent);}
    .mobile-nav{display:none;position:fixed;inset:0;z-index:199;background:var(--bg);flex-direction:column;align-items:center;justify-content:center;gap:1.5rem;opacity:0;transition:opacity .3s ease;}
    .mobile-nav.open{opacity:1;}
    .mobile-nav a{font-family:'Playfair Display',serif;font-size:2rem;font-weight:300;color:var(--text);text-decoration:none;letter-spacing:.02em;transition:color .3s;}
    .mobile-nav a:hover,.mobile-nav a.active{color:var(--accent);}
    .mobile-nav-cta{margin-top:1rem;background:var(--accent);color:#fff !important;padding:.8rem 2.5rem;border-radius:2px;font-family:'DM Sans',sans-serif !important;font-size:.85rem !important;letter-spacing:.12em;text-transform:uppercase;}
    .mobile-nav-divider{width:40px;height:1px;background:var(--border);margin:.3rem 0;}

    @media(max-width:768px){
      #nav{padding:1rem 1.5rem;transition:none;}
      .nav-links,.nav-right .btn-book{display:none;}
      .nav-hamburger{display:flex;}
      .c{padding:0 1.5rem;}
      .r-footer{padding:1.5rem;}
    }

/* ── FOOTER ── */
    .r-footer{padding:2rem 4rem;border-top:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;font-size:.72rem;color:var(--text3);}
    @media(max-width:600px){.r-footer{flex-direction:column;gap:.5rem;text-align:center;padding:1.5rem;}}

    /* ── Scroll reveal ── */
    .rv{opacity:0;transform:translateY(24px);transition:opacity .65s ease,transform .65s ease;}
    .rv.on{opacity:1;transform:none;}
    .rv-d1{transition-delay:.1s;}.rv-d2{transition-delay:.2s;}.rv-d3{transition-delay:.3s;}
  
    /* ══════ UNIFIED FOOTER ══════ */
    footer.site-footer{background:var(--bg2);border-top:1px solid var(--border);padding:5rem 0 2.5rem;margin-top:0;}
    .site-footer .c{max-width:1300px;margin:0 auto;padding:0 4rem;}
    .foot-grid{display:grid;grid-template-columns:1fr 1.8fr;gap:4.5rem;margin-bottom:4rem;align-items:start;}
    .foot-col-links{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;}
    .foot-logo{font-family:'Playfair Display',serif;font-size:1.4rem;font-weight:300;color:var(--text);text-decoration:none;display:block;margin-bottom:1rem;}
    .foot-logo span{color:var(--accent);}
    .foot-desc{font-size:.82rem;color:var(--text3);line-height:1.75;max-width:300px;margin-bottom:1.5rem;}
    .foot-socials{display:flex;gap:.6rem;}
    .soc{width:36px;height:36px;border:1px solid var(--border);border-radius:50%;display:flex;align-items:center;justify-content:center;text-decoration:none;color:var(--text3);transition:all .3s;}
    .soc svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;display:block;}
    .soc svg.fill-icon{fill:currentColor;stroke:none;}
    .soc:hover{border-color:var(--accent);color:var(--accent);transform:translateY(-3px);box-shadow:0 6px 18px rgba(77,194,232,.18);}
    .foot-h{font-size:.65rem;letter-spacing:.22em;text-transform:uppercase;color:var(--accent);margin-bottom:1.2rem;}
    .foot-links{list-style:none;display:flex;flex-direction:column;gap:.65rem;}
    .foot-links a{font-size:.82rem;color:var(--text3);text-decoration:none;transition:color .3s;}
    .foot-links a:hover{color:var(--text);}
    .foot-bottom{display:flex;justify-content:space-between;align-items:center;padding-top:2rem;border-top:1px solid var(--border);max-width:1300px;margin:0 auto;padding-left:4rem;padding-right:4rem;}
    .foot-copy{font-size:.72rem;color:var(--text3);}
    .foot-legal{display:flex;gap:1.5rem;}
    .foot-legal a{font-size:.72rem;color:var(--text3);text-decoration:none;transition:color .3s;}
    .foot-legal a:hover{color:var(--text);}
    @media(max-width:900px){
      .foot-grid{grid-template-columns:1fr 1.5fr;gap:2rem;}
      .foot-col-links{grid-template-columns:1fr;gap:1.5rem;}
      .foot-desc{max-width:none;}
      .site-footer .c,.foot-bottom{padding-left:1.5rem;padding-right:1.5rem;}
      .foot-bottom{flex-direction:column;gap:.8rem;text-align:center;}
    }
    @media(max-width:768px){
      footer.site-footer{padding:2.5rem 0 1.5rem;}
      .foot-logo{font-size:1.1rem;}
      .foot-grid{margin-bottom:2rem;}
    }
    @media(max-width:480px){
      .foot-grid{grid-template-columns:1fr 1.2fr;gap:1rem;}
      .foot-desc{font-size:.75rem;line-height:1.6;}
    }


    /* ── Night ambient orbs ── */
    .orb-layer{position:fixed;inset:0;pointer-events:none;z-index:9;overflow:hidden;}
    [data-theme="day"] .orb-layer{display:none;}
    .orb{position:absolute;border-radius:50%;mix-blend-mode:screen;}
    .orb-1{width:520px;height:520px;background:radial-gradient(circle,rgba(77,194,232,.22) 0%,rgba(77,194,232,.06) 40%,transparent 65%);animation:orbA 24s ease-in-out infinite;}
    .orb-2{width:420px;height:420px;background:radial-gradient(circle,rgba(77,194,232,.16) 0%,rgba(30,120,200,.04) 40%,transparent 65%);animation:orbB 32s ease-in-out infinite;}
    .orb-3{width:480px;height:480px;background:radial-gradient(circle,rgba(100,200,255,.14) 0%,rgba(50,150,220,.04) 40%,transparent 65%);animation:orbC 28s ease-in-out infinite;}
    .orb-4{width:300px;height:300px;background:radial-gradient(circle,rgba(77,194,232,.28) 0%,rgba(77,194,232,.08) 35%,transparent 60%);animation:orbD 19s ease-in-out infinite;}
    .orb-5{width:660px;height:660px;background:radial-gradient(circle,rgba(20,80,160,.16) 0%,rgba(10,40,100,.04) 40%,transparent 65%);animation:orbE 40s ease-in-out infinite;}
    @keyframes orbA{0%{transform:translate(-5vw,-5vh);}25%{transform:translate(55vw,15vh);}50%{transform:translate(45vw,65vh);}75%{transform:translate(5vw,45vh);}100%{transform:translate(-5vw,-5vh);}}
    @keyframes orbB{0%{transform:translate(75vw,55vh);}25%{transform:translate(15vw,75vh);}50%{transform:translate(-5vw,25vh);}75%{transform:translate(45vw,5vh);}100%{transform:translate(75vw,55vh);}}
    @keyframes orbC{0%{transform:translate(25vw,75vh);}33%{transform:translate(65vw,5vh);}66%{transform:translate(-5vw,45vh);}100%{transform:translate(25vw,75vh);}}
    @keyframes orbD{0%{transform:translate(45vw,0vh);}20%{transform:translate(80vw,35vh);}40%{transform:translate(55vw,70vh);}60%{transform:translate(10vw,55vh);}80%{transform:translate(0vw,15vh);}100%{transform:translate(45vw,0vh);}}
    @keyframes orbE{0%{transform:translate(-15vw,35vh);}50%{transform:translate(55vw,-10vh);}100%{transform:translate(-15vw,35vh);}}
  
    /* ═══════════════════════════════════════════════
       MOBILE OPTIMISATIONS
    ═══════════════════════════════════════════════ */

    /* Base resets */
    *, *::before, *::after { box-sizing: border-box; }
    html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
    body { overflow-x: hidden; }
    img, video, svg { max-width: 100%; height: auto; }
    button, a, [role="button"], input, select, textarea {
      touch-action: manipulation;
    }

    /* ── Mobile Drawer ── */
    .mob-drawer {
      position: fixed;
      top: 0; right: -100%;
      width: 280px; max-width: 88vw;
      height:100vh;height:100dvh; height: 100dvh;
      background: var(--bg2, #0a1628);
      border-left: 1px solid var(--border, rgba(255,255,255,.08));
      z-index: 400;
      display: flex; flex-direction: column;
      padding: 1.5rem 2rem 2.5rem;
      transition: right 0.32s cubic-bezier(.4,0,.2,1);
      overflow-y: auto;
      -webkit-overflow-scrolling: touch;
    }
    .mob-drawer.open { right: 0; }

    .mob-overlay {
      position: fixed; inset: 0;
      background: rgba(4,8,15,.65);
      backdrop-filter: blur(2px);
      -webkit-backdrop-filter: blur(2px);
      z-index: 399;
      opacity: 0; pointer-events: none;
      transition: opacity 0.32s ease;
    }
    .mob-overlay.visible { opacity: 1; pointer-events: auto; }

    .mob-drawer-head {
      display: flex; justify-content: space-between; align-items: center;
      margin-bottom: 2.5rem;
    }
    .mob-drawer-logo {
      height: 36px; width: auto;
    }
    .mob-close {
      width: 38px; height: 38px; min-width: 38px;
      display: flex; align-items: center; justify-content: center;
      background: var(--card, rgba(255,255,255,.05));
      border: 1px solid var(--border, rgba(255,255,255,.08));
      border-radius: 50%; cursor: pointer; color: var(--text, #fff);
      font-size: 1.1rem; line-height: 1;
      transition: background .2s;
    }
    .mob-close:hover { background: var(--border2, rgba(255,255,255,.12)); }

    .mob-nav-links {
      list-style: none; display: flex; flex-direction: column;
      gap: 0; flex: 1;
    }
    .mob-nav-links li a {
      display: block;
      padding: 0.95rem 0;
      font-size: 0.9rem; letter-spacing: 0.12em;
      text-transform: uppercase; font-weight: 500;
      color: var(--text2, rgba(255,255,255,.7));
      text-decoration: none;
      border-bottom: 1px solid var(--border, rgba(255,255,255,.06));
      transition: color .2s;
      min-height: 48px; display: flex; align-items: center;
    }
    .mob-nav-links li a:hover,
    .mob-nav-links li a.active { color: var(--accent, #4dc8e8); }

    .mob-book-btn {
      display: block; text-align: center;
      margin-top: 2rem;
      padding: 0.9rem 1.5rem; min-height: 48px;
      background: var(--accent, #4dc8e8);
      color: #04080f !important; font-weight: 700;
      font-size: 0.8rem; letter-spacing: 0.15em;
      text-transform: uppercase; text-decoration: none;
      border-radius: 4px;
      transition: opacity .2s;
    }
    .mob-book-btn:hover { opacity: .88; }

    /* ── Ensure hamburger has minimum tap target ── */
    .nav-hamburger {
      min-width: 44px !important; min-height: 44px !important;
      display: none; align-items: center; justify-content: center;
    }
    @media(max-width:768px){ .nav-hamburger { display: flex !important; } }

    /* ── Tap target helpers ── */
    @media(max-width:768px) {
      .theme-toggle {
        min-height: 44px; display: flex; align-items: center; gap: 6px;
      }
      /* Safe-area padding for notch phones */
      #nav {
        padding-left: max(1.5rem, env(safe-area-inset-left));
        padding-right: max(1.5rem, env(safe-area-inset-right));
      }
      body {
        padding-bottom: env(safe-area-inset-bottom);
      }
    }

    /* ── 320px safety net ── */
    @media(max-width:380px) {
      .c { padding: 0 1rem; }
      .hero-h1, .page-hero-h1 { font-size: clamp(2rem, 9vw, 3rem); }
      .sec-h2 { font-size: clamp(1.5rem, 6vw, 2rem); }
      .sec-sub { font-size: 0.82rem; }
      .btn, .btn-primary, .btn-outline { padding: 0.75rem 1.25rem; font-size: 0.78rem; }
    }


  
  

/* ── Second block: mobile optimisations (shared) ── */
/* ══════════════════════════════════════════
     MOBILE NAV — SLIDE-IN DRAWER  (fix v2)
     Overrides the full-screen overlay style
  ══════════════════════════════════════════ */

  /* Convert full-screen overlay → right-side slide-in drawer */
  .mobile-nav {
    display: flex !important;
    position: fixed !important;
    top: 0 !important; right: -100% !important;
    left: auto !important; bottom: auto !important;
    width: 280px !important; max-width: 88vw !important;
    height: 100vh !important; height: 100dvh !important;
    background: var(--bg-primary, #08111e) !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    gap: 0 !important;
    padding: 4.5rem 2rem 2.5rem !important;
    z-index: 400 !important;
    opacity: 1 !important;
    transition: right 0.32s cubic-bezier(.4,0,.2,1) !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    border-left: 1px solid var(--border, rgba(255,255,255,.08)) !important;
    box-shadow: -10px 0 40px rgba(0,0,0,.45) !important;
  }
  .mobile-nav.open { right: 0 !important; }

  /* Reduce link font: 2rem Playfair → clean 0.88rem DM Sans */
  .mobile-nav a {
    font-family: 'DM Sans', sans-serif !important;
    font-size: 0.88rem !important;
    font-weight: 500 !important;
    letter-spacing: 0.13em !important;
    text-transform: uppercase !important;
    color: var(--text-secondary, rgba(255,255,255,.7)) !important;
    text-decoration: none !important;
    border-bottom: 1px solid var(--border, rgba(255,255,255,.07)) !important;
    padding: 0.95rem 0 !important;
    width: 100% !important;
    min-height: 48px !important;
    display: flex !important;
    align-items: center !important;
    transition: color .2s !important;
    background: none !important;
    border-radius: 0 !important;
    margin-top: 0 !important;
    box-shadow: none !important;
  }
  .mobile-nav a:hover,
  .mobile-nav a.active { color: var(--accent, #4dc8e8) !important; }

  /* Book Now CTA button */
  .mobile-nav .mobile-nav-cta,
  .mobile-nav a.mobile-nav-cta {
    margin-top: 1.5rem !important;
    background: var(--accent, #4dc8e8) !important;
    color: #04080f !important;
    padding: 0.9rem 1.5rem !important;
    min-height: 48px !important;
    border-radius: 4px !important;
    font-family: 'DM Sans', sans-serif !important;
    font-size: 0.8rem !important;
    letter-spacing: 0.15em !important;
    text-transform: uppercase !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-bottom: none !important;
    width: 100% !important;
    font-weight: 700 !important;
  }
  .mobile-nav .mobile-nav-cta:hover,
  .mobile-nav a.mobile-nav-cta:hover { opacity: .88 !important; }

  /* Hide old thin line dividers */
  .mobile-nav-divider { display: none !important; }

  /* ── Day mode: light-themed drawer ── */
  [data-theme="day"] .mobile-nav {
    background: var(--bg, #f5f0ea) !important;
    border-left-color: var(--border, rgba(0,0,0,.1)) !important;
    box-shadow: -10px 0 40px rgba(0,0,0,.12) !important;
  }
  [data-theme="day"] .mobile-nav a {
    color: var(--text2, #3a5568) !important;
    border-bottom-color: var(--border, rgba(0,0,0,.08)) !important;
  }
  [data-theme="day"] .mobile-nav a:hover,
  [data-theme="day"] .mobile-nav a.active { color: var(--accent, #1a6b98) !important; }
  /* Book Now CTA: always white text on the solid accent button */
  [data-theme="day"] .mobile-nav .mobile-nav-cta,
  [data-theme="day"] .mobile-nav a.mobile-nav-cta { color: #fff !important; }
  [data-theme="day"] .mob-nav-bkdrop {
    background: rgba(13,30,46,.35) !important;
  }

  /* ── Backdrop overlay ── */
  .mob-nav-bkdrop {
    position: fixed; inset: 0;
    background: rgba(4,8,15,.65);
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
    z-index: 399;
    opacity: 0; pointer-events: none;
    transition: opacity 0.32s ease;
  }
  .mob-nav-bkdrop.visible { opacity: 1; pointer-events: auto; }



  /* ── Mobile layout fixes (≤768px) ── */
  @media (max-width: 768px) {
    /* Smaller hero title */
    .hero-h1 { font-size: 2.4rem !important; line-height: 1.2 !important; }
    .hero-sub { font-size: 0.85rem !important; }

    /* Smaller section headings */
    .sec-h2 { font-size: clamp(1.4rem, 5.5vw, 1.9rem) !important; }
    .page-hero-h1 { font-size: clamp(2rem, 8vw, 2.8rem) !important; }

    /* Service cards: stronger gradient + tighter text */
    .svc-card { height: 220px !important; }
    .svc-card::before {
      background: linear-gradient(
        to top,
        rgba(4,8,15,.98) 0%,
        rgba(4,8,15,.70) 45%,
        rgba(4,8,15,.18) 100%
      ) !important;
    }
    .svc-content { padding: 1rem 1.2rem !important; }
    .svc-name { font-size: 0.98rem !important; margin-bottom: 0.25rem !important; }
    .svc-desc {
      font-size: 0.73rem !important;
      display: -webkit-box !important;
      -webkit-box-orient: vertical !important;
      -webkit-line-clamp: 2 !important;
      overflow: hidden !important;
    }

    /* About section: stack photos above text cleanly */
    .about-grid {
      display: flex !important;
      flex-direction: column !important;
      gap: 2rem !important;
    }
    .about-photos {
      height: 260px !important;
      overflow: hidden !important;
    }
    .about-text { order: 2; }

    /* Mosaic tiles */
    .mo { height: 140px !important; }

    /* Room cards text always visible */
    .rm-info { padding: 1.2rem !important; }
    .rm-name { font-size: 1.05rem !important; }
  }

  
    /* ── Hide cursor elements on mobile (mouse-only features) ── */
    @media (max-width: 768px) {
      #cur-dot, #cur-ring, .cur-ring-burst,
      .cur-ripple, .cur-burst { display: none !important; }

      /* Hide hover-only list on touch (tap triggers :hover in some browsers) */
      .svc-list { display: none !important; }
    }
    @media (hover: none) {
      #cur-dot, #cur-ring, .cur-ring-burst,
      .cur-ripple, .cur-burst { display: none !important; }
      .svc-list { display: none !important; }
    }
  
    /* ── HARD-KILL cursor & svc-list on all mobile/touch (broadened) ── */
    @media (max-width: 1100px) {
      #cur-dot, #cur-ring, .cur-ring-burst,
      .cur-ripple, .cur-burst, .cursor-trail {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
      }
      .svc-list { display: none !important; }
    }
    @media (hover: none) {
      #cur-dot, #cur-ring, .cur-ring-burst,
      .cur-ripple, .cur-burst, .cursor-trail {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
      }
      .svc-list { display: none !important; }
    }
  
    /* ── Kill hover-list on mobile/touch (explicit high-specificity override) ── */
    @media (max-width: 1100px) {
      .svc-content { max-height: calc(100% - 3.5rem); overflow: hidden; }
      .svc-card:hover .svc-list,
      .svc-card:focus .svc-list,
      .svc-card:active .svc-list,
      .svc-list {
        display: none !important;
        max-height: 0 !important;
        opacity: 0 !important;
      }
    }
    @media (hover: none) {
      .svc-content { max-height: calc(100% - 3.5rem); overflow: hidden; }
      .svc-card:hover .svc-list,
      .svc-card:focus .svc-list,
      .svc-card:active .svc-list,
      .svc-list {
        display: none !important;
        max-height: 0 !important;
        opacity: 0 !important;
      }
    }
  
  /* ════════════════════════════════════════════
     MOBILE COMPACT — reduce scroll, tighten spacing
  ════════════════════════════════════════════ */
  @media (max-width: 768px) {

    /* Section padding: 8rem → 2.8rem */
    .pad    { padding: 2.8rem 0 !important; }
    .pad-sm { padding: 1.8rem 0 !important; }
    .c { padding: 0 1.2rem !important; }

    /* Section header spacing */
    .sec-header { margin-bottom: 1.4rem !important; }
    .sec-h2, .page-hero-h1 {
      margin-bottom: 0.5rem !important;
      line-height: 1.15 !important;
      letter-spacing: -0.01em !important;
    }
    .eyebrow, .sec-eyebrow {
      margin-bottom: 0.4rem !important;
      letter-spacing: 0.1em !important;
      font-size: 0.58rem !important;
    }
    .sec-sub, .sec-lead {
      font-size: 0.82rem !important;
      line-height: 1.6 !important;
      margin-bottom: 0.8rem !important;
      letter-spacing: 0 !important;
    }

    /* Hero */
    .hero-h1 {
      font-size: 2.1rem !important;
      line-height: 1.1 !important;
      margin-bottom: 0.5rem !important;
      letter-spacing: -0.02em !important;
    }
    .hero-sub {
      font-size: 0.78rem !important;
      margin-bottom: 1.2rem !important;
      letter-spacing: 0.01em !important;
    }
    .hero-content { padding: 0 1.2rem 3rem !important; }
    .hero-btns { gap: 0.6rem !important; }
    .btn, .btn-primary, .btn-outline {
      padding: 0.65rem 1.2rem !important;
      font-size: 0.7rem !important;
      letter-spacing: 0.07em !important;
    }

    /* About */
    .about-grid { gap: 1.2rem !important; }
    .about-photos { height: 200px !important; }

    /* Service cards */
    .services-grid { gap: 5px !important; }
    .svc-card { height: 170px !important; }
    .svc-name { font-size: 0.88rem !important; }
    .svc-desc {
      font-size: 0.68rem !important;
      line-height: 1.45 !important;
    }

    /* Rooms */
    .rooms-grid { gap: 0.9rem !important; }
    .rm-info { padding: 0.9rem !important; }
    .rm-name { font-size: 0.9rem !important; letter-spacing: 0 !important; }
    .rm-desc { font-size: 0.72rem !important; line-height: 1.5 !important; }

    /* Reviews */
    .reviews-grid { gap: 0.9rem !important; }
    .rv-quote { font-size: 0.82rem !important; line-height: 1.5 !important; }

    /* Booking section */
    .booking-title { font-size: 1.7rem !important; margin-bottom: 0.4rem !important; }

    /* Gallery grid */
    .gal-grid { gap: 3px !important; }

    /* Mosaic */
    .mo { height: 120px !important; }
    .mosaic { gap: 4px !important; }

    /* Dive photo grid */
    .dpg-item { height: 170px !important; }

    /* Footer */
    .foot-col-links { gap: 1.2rem !important; }
    .foot-bottom { padding-top: 0.8rem !important; }

    
    /* ── MOBILE PERF: orb-layer uses mix-blend-mode:screen — kills mobile GPU ── */
    .orb-layer { display: none !important; }

    /* ── MOBILE PERF: hero rays & bubbles — heavy animations, not visible on small screens ── */
    .hero-bubbles, .hb, .h-ray { display: none !important; }

    /* ── MOBILE PERF: nav backdrop-filter is the most expensive GPU effect ── */
    #nav.scrolled {
      backdrop-filter: none !important;
      -webkit-backdrop-filter: none !important;
      background: rgba(4,8,15,0.94) !important;
    }
    [data-theme="day"] #nav.scrolled {
      background: rgba(245,240,234,0.96) !important;
    }

    /* General: reduce letter-spacing on body copy */
    .sec-lead, .sec-sub, .rm-desc, .svc-desc,
    .rv-quote, .foot-desc, p { letter-spacing: 0 !important; }
  }

  
  /* ── Cursor off on touch (pointer:coarse covers all phones/tablets) ── */
  @media (pointer: coarse) {
    #cur-dot, #cur-ring,
    .cur-ring-burst, .cur-ripple, .cur-burst { display: none !important; }
    canvas                                   { display: none !important; }
    body, body *                             { cursor: auto !important; }
  }
  .is-touch #cur-dot, .is-touch #cur-ring,
  .is-touch .cur-ring-burst, .is-touch .cur-ripple,
  .is-touch .cur-burst                       { display: none !important; }
  .is-touch canvas                           { display: none !important; }
  .is-touch body, .is-touch body *           { cursor: auto !important; }