/* ═══════════════════════════════════════════════
   ROAMAIO — Global Stylesheet
   ═══════════════════════════════════════════════ */
@import url('https://fonts.googleapis.com/css2?family=Baloo+2:wght@700;800&family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,600&family=Cormorant+Display:ital,wght@0,500;0,600;0,700;1,500;1,600&family=DM+Sans:ital,opsz,wght@0,9..40,300;0,9..40,400;0,9..40,500;1,9..40,300&family=DM+Mono:wght@300;400;500&display=swap');

:root {
  /* ── RoamAIo Brand Colors ── */
  --teal:        #00C9D4;
  --teal-light:  #33D8E2;
  --teal-dark:   #008E97;
  --orange:      #FF8C00;
  --orange-light:#FFA733;
  --orange-dark: #E07A00;
  --navy:        #0A1628;
  --navy2:       #0F2040;

  /* ── Keep legacy aliases so existing CSS doesn't break ── */
  --terra:       #FF8C00;
  --terra-light: #FFA733;
  --gold:        #00C9D4;
  --gold-light:  #33D8E2;
  --sage:        #00C9D4;
  --sage-light:  #7AE8ED;
  --charcoal:    #0A1628;
  --charcoal2:   #0F2040;

  /* ── Neutrals ── */
  --cream:       #F0FAFB;
  --cream2:      #E4F5F7;
  --cream3:      #D0EDF0;
  --sand:        #B0D4D8;
  --sand-light:  #C8E5E8;
  --text:        #0A1628;
  --text-mid:    #2A4A5A;
  --text-soft:   #6A8A96;
  --white:       #FFFFFF;
  --border:      rgba(0,160,170,0.12);
  --border-gold: rgba(0,201,212,0.3);

  --shadow-sm:   0 4px 20px rgba(0,150,160,0.08);
  --shadow-md:   0 12px 40px rgba(0,150,160,0.12);
  --shadow-lg:   0 24px 60px rgba(0,150,160,0.16);
  --radius-sm:   10px;
  --radius-md:   20px;
  --radius-lg:   28px;
  --transition:  all 0.25s cubic-bezier(0.4,0,0.2,1);
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; font-size: 16px; }

body {
  background: #060D1A;
  color: var(--cream);
  font-family: 'DM Sans', sans-serif;
  overflow-x: hidden;
  cursor: none;
}

/* ─── SUBTLE DOT GRID TEXTURE ─── */
body::before {
  content: '';
  position: fixed; inset: 0;
  background-image:
    radial-gradient(circle, rgba(0,201,212,0.06) 1px, transparent 1px);
  background-size: 40px 40px;
  pointer-events: none; z-index: 0; opacity: 1;
}

/* Noise grain overlay */
body::after {
  content: '';
  position: fixed; inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");
  pointer-events: none; z-index: 9000; opacity: 0.6; mix-blend-mode: overlay;
}

/* ─── CUSTOM CURSOR ─── */
#roamaio-cursor { width:10px;height:10px;background:var(--teal);border-radius:50%;position:fixed;pointer-events:none;z-index:9999;transform:translate(-50%,-50%);transition:width 0.3s,height 0.3s,background 0.3s;mix-blend-mode:screen; }
#roamaio-ring   { width:38px;height:38px;border:1.5px solid var(--teal);border-radius:50%;position:fixed;pointer-events:none;z-index:9998;transform:translate(-50%,-50%);transition:all 0.18s ease;opacity:0.5; }

/* ─── NAV ─── */
.roamaio-nav {
  position: fixed; top:0; left:0; right:0; z-index:1000;
  display: flex; align-items:center; justify-content:space-between;
  padding: 0 5%; height: 76px;
  background: rgba(6,13,26,0.0);
  backdrop-filter: blur(0px);
  border-bottom: 1px solid rgba(0,201,212,0.0);
  transition: background 0.4s, box-shadow 0.4s, border-color 0.4s, backdrop-filter 0.4s;
}
.roamaio-nav.scrolled {
  background: rgba(6,13,26,0.94);
  backdrop-filter: blur(24px) saturate(1.5);
  border-bottom-color: rgba(0,201,212,0.12);
  box-shadow: 0 1px 0 rgba(0,201,212,0.06), 0 8px 32px rgba(0,0,0,0.5);
}

/* ─── LOGO ─── */
.nav-logo { display:flex;align-items:center;gap:11px;text-decoration:none; overflow:visible; }
.logo-mark-svg { flex-shrink:0;display:block; }
.logo-wordmark {
  font-family: 'DM Sans', sans-serif;
  font-size: 1.38rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  color: #F0FAFB;
  text-transform: none;
  line-height: 1;
}
.logo-wordmark .logo-accent {
  font-style: normal;
  font-weight: 900;
  background: linear-gradient(135deg, var(--teal) 0%, var(--orange) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.logo-wordmark .logo-o {
  color: var(--orange);
  font-weight: 900;
  -webkit-text-fill-color: var(--orange);
}
.logo-mark { display:none; }
.logo-inner { display:none; }

.nav-links { display:flex;gap:2.5rem;list-style:none; }
.nav-links a { color:rgba(255,250,242,0.55);text-decoration:none;font-size:0.82rem;font-weight:500;letter-spacing:0.06em;transition:color 0.2s;position:relative;padding-bottom:2px; }
.nav-links a::after { content:'';position:absolute;bottom:0;left:0;width:0;height:1.5px;background:var(--terra-light);transition:width 0.3s; }
.nav-links a:hover, .nav-links a.active { color:var(--terra-light); }
.nav-links a:hover::after, .nav-links a.active::after { width:100%; }

.nav-actions { display:flex;gap:1rem;align-items:center; }
.btn-ghost-sm { padding:9px 20px;background:transparent;border:1.5px solid rgba(255,250,242,0.25);color:rgba(255,250,242,0.7);font-family:'DM Sans',sans-serif;font-size:0.78rem;font-weight:500;letter-spacing:0.08em;cursor:pointer;border-radius:100px;transition:var(--transition);text-decoration:none;display:inline-flex;align-items:center; }
.btn-ghost-sm:hover { background:rgba(255,250,242,0.1);border-color:rgba(255,250,242,0.4);color:white; }
.btn-primary-sm { padding:9px 22px;background:var(--terra);border:none;color:white;font-family:'DM Sans',sans-serif;font-size:0.78rem;font-weight:500;letter-spacing:0.08em;cursor:pointer;border-radius:100px;transition:var(--transition);box-shadow:0 4px 20px rgba(255,140,0,0.35);text-decoration:none;display:inline-flex;align-items:center; }
.btn-primary-sm:hover { background:var(--terra-light);transform:translateY(-1px);box-shadow:0 8px 28px rgba(255,140,0,0.5); }

/* ─── PAGE HERO SHARED ─── */
.page-hero { padding: 140px 5% 80px; position:relative; overflow:hidden; }
.page-hero-bg { position:absolute;inset:0;overflow:hidden;z-index:0; }
.blob { position:absolute;border-radius:50%;filter:blur(80px);opacity:0.3; }
.blob-terra { background:radial-gradient(circle,#E07A50 0%,transparent 70%); }
.blob-sage   { background:radial-gradient(circle,#7A9E7E 0%,transparent 70%); }
.blob-gold   { background:radial-gradient(circle,#C9963B 0%,transparent 70%); }
.page-hero-content { position:relative;z-index:1; }

/* ─── TYPOGRAPHY ─── */
.eyebrow { display:inline-flex;align-items:center;gap:8px;font-size:0.68rem;font-weight:600;letter-spacing:0.3em;text-transform:uppercase;color:var(--terra);margin-bottom:1rem; }
.eyebrow-line { width:30px;height:1.5px;background:var(--terra); }
.eyebrow-dot { width:7px;height:7px;background:var(--terra);border-radius:50%;animation:blink 2s ease infinite; }
@keyframes blink { 0%,100%{opacity:1} 50%{opacity:0.3} }

.h-display { font-family:'Cormorant Display',serif;font-size:clamp(2.2rem,5vw,4.5rem);font-weight:900;line-height:1.08;letter-spacing:-0.02em; }
.h-section  { font-family:'Cormorant Display',serif;font-size:clamp(1.8rem,3.5vw,3.2rem);font-weight:800;line-height:1.15;letter-spacing:-0.02em; }
.h-card     { font-family:'Cormorant Display',serif;font-size:1.3rem;font-weight:700; }
em.accent   { font-style:italic;font-weight:400;color:var(--terra); }

.text-lead  { font-size:1.05rem;color:var(--text-mid);line-height:1.75;max-width:560px; }
.text-body  { font-size:0.9rem;color:var(--text-mid);line-height:1.75; }

/* ─── BUTTONS ─── */
.btn-primary { padding:14px 32px;background:var(--terra);border:none;color:white;font-family:'DM Sans',sans-serif;font-size:0.88rem;font-weight:600;letter-spacing:0.06em;cursor:pointer;border-radius:100px;transition:var(--transition);box-shadow:0 6px 24px rgba(255,140,0,0.3);display:inline-flex;align-items:center;gap:10px;text-decoration:none; }
.btn-primary:hover { background:var(--terra-light);transform:translateY(-2px);box-shadow:0 12px 32px rgba(255,140,0,0.4); }
.btn-secondary { padding:14px 32px;background:transparent;border:2px solid var(--charcoal);color:var(--charcoal);font-family:'DM Sans',sans-serif;font-size:0.88rem;font-weight:600;letter-spacing:0.06em;cursor:pointer;border-radius:100px;transition:var(--transition);display:inline-flex;align-items:center;gap:10px;text-decoration:none; }
.btn-secondary:hover { background:var(--charcoal);color:var(--cream);transform:translateY(-2px); }
.btn-dark { padding:14px 32px;background:var(--charcoal);border:none;color:var(--cream);font-family:'DM Sans',sans-serif;font-size:0.88rem;font-weight:600;letter-spacing:0.06em;cursor:pointer;border-radius:100px;transition:var(--transition);display:inline-flex;align-items:center;gap:10px;text-decoration:none; }
.btn-dark:hover { background:var(--charcoal2);transform:translateY(-2px); }

/* ─── CARDS ─── */
.card-base { background:var(--cream2);border:1px solid var(--border);border-radius:var(--radius-md);padding:2.5rem;transition:var(--transition); }
.card-base:hover { transform:translateY(-6px);box-shadow:var(--shadow-md); }

/* ─── DEST CARDS ─── */
.dest-card { border-radius:var(--radius-md);overflow:hidden;position:relative;cursor:pointer;transition:transform 0.4s cubic-bezier(0.34,1.56,0.64,1); }
.dest-card:hover { transform:scale(1.02);z-index:2; }
.dest-img { position:absolute;inset:0;transition:transform 0.5s ease;background-size:cover;background-position:center;background-repeat:no-repeat; }
.dest-card:hover .dest-img { transform:scale(1.07); }
.dest-grad { position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,0.78) 0%,rgba(0,0,0,0.1) 50%,transparent 100%); }
.dest-info { position:absolute;bottom:0;left:0;right:0;padding:1.5rem 1.8rem;z-index:2; }
.dest-ai-badge { display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,0.15);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,0.2);border-radius:100px;padding:4px 12px;font-size:0.65rem;letter-spacing:0.12em;color:rgba(255,255,255,0.9);margin-bottom:0.6rem;text-transform:uppercase; }
.ai-dot { width:5px;height:5px;background:var(--gold-light);border-radius:50%;animation:blink 1.5s ease infinite; }
.dest-name { font-family:'Cormorant Display',serif;font-size:1.3rem;font-weight:700;color:white;margin-bottom:0.3rem; }
.dest-meta { display:flex;align-items:center;gap:12px; }
.dest-country { font-size:0.75rem;color:rgba(255,255,255,0.7);letter-spacing:0.05em; }
.dest-price { font-family:'DM Mono',monospace;font-size:0.75rem;color:var(--gold-light); }
.dest-hover-actions { position:absolute;top:1.2rem;right:1.2rem;z-index:2;display:flex;gap:8px;opacity:0;transition:opacity 0.3s; }
.dest-card:hover .dest-hover-actions { opacity:1; }
.icon-btn { width:36px;height:36px;background:rgba(255,255,255,0.15);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,0.25);border-radius:50%;color:white;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:var(--transition); }
.icon-btn:hover { background:var(--terra);border-color:var(--terra); }
.icon-btn svg { width:14px;height:14px; }

/* Destination BGs */
.bg-santorini { background:linear-gradient(160deg,#1a3a6e 0%,#2060b0 35%,#5090d0 55%,#e8d098 80%,#d4b870 100%); }
.bg-bali      { background:linear-gradient(160deg,#0d3018 0%,#1a6030 35%,#3a9050 55%,#80c070 80%,#c8e890 100%); }
.bg-kyoto     { background:linear-gradient(160deg,#2a1030 0%,#5a204a 40%,#9a4070 60%,#e880a0 85%,#f4b0c0 100%); }
.bg-dubai     { background:linear-gradient(160deg,#0a0a0a 0%,#201000 35%,#604020 60%,#d0903a 85%,#f8d070 100%); }
.bg-maldives  { background:linear-gradient(160deg,#003040 0%,#006080 30%,#00a0b0 55%,#60d0e0 75%,#a0e8f0 100%); }
.bg-paris     { background:linear-gradient(160deg,#1a1a2e 0%,#3a3a6e 40%,#7070c0 65%,#c8c8e8 85%,#f0e8d0 100%); }
.bg-morocco   { background:linear-gradient(160deg,#2a1000 0%,#6a2800 35%,#b05010 60%,#e89040 85%,#f8d090 100%); }
.bg-peru      { background:linear-gradient(160deg,#0a1a08 0%,#1a4010 35%,#508030 60%,#a0b060 80%,#c8d890 100%); }
.bg-iceland   { background:linear-gradient(160deg,#080818 0%,#101840 35%,#204090 60%,#60a0d0 80%,#a0d8f0 100%); }
.bg-vietnam   { background:linear-gradient(160deg,#1a0810 0%,#401020 40%,#802040 65%,#c05070 85%,#e890a0 100%); }
.bg-amalfi    { background:linear-gradient(160deg,#083048 0%,#106090 35%,#20a0b8 55%,#78d0c0 75%,#d0f0e0 100%); }
.bg-cairo     { background:linear-gradient(160deg,#180c00 0%,#402000 35%,#886020 60%,#c8a040 82%,#f0d088 100%); }

/* ─── FORMS ─── */
.form-group { display:flex;flex-direction:column;gap:6px;margin-bottom:1.25rem; }
.form-label { font-size:0.75rem;font-weight:600;letter-spacing:0.1em;text-transform:uppercase;color:var(--text-mid); }
.form-input { padding:13px 18px;background:var(--white);border:1.5px solid rgba(0,150,160,0.1);border-radius:var(--radius-sm);font-family:'DM Sans',sans-serif;font-size:0.92rem;color:var(--text);outline:none;transition:border-color 0.3s,box-shadow 0.3s;width:100%; }
.form-input:focus { border-color:var(--terra);box-shadow:0 0 0 4px rgba(196,99,58,0.08); }
.form-input::placeholder { color:var(--text-soft); }
.form-select { padding:13px 18px;background:var(--white);border:1.5px solid rgba(0,150,160,0.1);border-radius:var(--radius-sm);font-family:'DM Sans',sans-serif;font-size:0.92rem;color:var(--text);outline:none;transition:border-color 0.3s;width:100%;cursor:pointer;appearance:none; }
.form-select:focus { border-color:var(--terra); }
.form-textarea { padding:13px 18px;background:var(--white);border:1.5px solid rgba(0,150,160,0.1);border-radius:var(--radius-sm);font-family:'DM Sans',sans-serif;font-size:0.92rem;color:var(--text);outline:none;transition:border-color 0.3s;resize:vertical;width:100%; }
.form-textarea:focus { border-color:var(--terra);box-shadow:0 0 0 4px rgba(196,99,58,0.08); }

/* ─── TAGS / CHIPS ─── */
.chip { padding:7px 16px;background:rgba(255,250,242,0.05);border:1px solid rgba(255,250,242,0.1);border-radius:100px;font-size:0.78rem;color:rgba(255,250,242,0.55);cursor:pointer;transition:var(--transition);display:inline-flex;align-items:center;gap:6px; }
.chip:hover, .chip.active { background:var(--terra);color:white;border-color:var(--terra);transform:translateY(-1px); }
.chip-gold { border-color:var(--border-gold);color:var(--gold); }
.chip-gold:hover { background:var(--gold);color:white;border-color:var(--gold); }

/* ─── STATS ─── */
.stat-num { font-family:'Cormorant Display',serif;font-size:2.8rem;font-weight:900;color:var(--terra);line-height:1; }
.stat-label { font-size:0.75rem;color:var(--text-soft);letter-spacing:0.1em;text-transform:uppercase;margin-top:0.4rem; }

/* ─── FOOTER ─── */
.roamaio-footer { /* RoamAIo footer */ background:#040302;border-top:1px solid rgba(255,250,242,0.04);padding:5rem 5% 3rem; }
.footer-grid { display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:4rem;margin-bottom:4rem; }
.footer-tagline { font-size:0.85rem;color:rgba(255,250,242,0.4);line-height:1.7;max-width:260px;margin-bottom:1.5rem; }
.footer-socials { display:flex;gap:10px; }
.social-btn { width:36px;height:36px;border:1px solid rgba(255,250,242,0.12);border-radius:10px;display:flex;align-items:center;justify-content:center;color:rgba(255,250,242,0.4);font-size:0.85rem;cursor:pointer;transition:var(--transition);text-decoration:none; }
.social-btn:hover { border-color:var(--terra);color:var(--terra); }
.footer-col-title { font-size:0.7rem;font-weight:600;letter-spacing:0.2em;text-transform:uppercase;color:rgba(255,250,242,0.3);margin-bottom:1.2rem; }
.footer-links { list-style:none;display:flex;flex-direction:column;gap:0.7rem; }
.footer-links a { color:rgba(255,250,242,0.5);text-decoration:none;font-size:0.85rem;transition:color 0.2s; }
.footer-links a:hover { color:var(--cream); }
.footer-bottom { border-top:1px solid rgba(255,250,242,0.06);padding-top:2rem;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem; }
.footer-copy { font-size:0.72rem;color:rgba(255,250,242,0.25);letter-spacing:0.05em; }
.footer-legal { display:flex;gap:1.5rem; }
.footer-legal a { font-size:0.72rem;color:rgba(255,250,242,0.25);text-decoration:none;transition:color 0.2s; }
.footer-legal a:hover { color:rgba(255,250,242,0.6); }

/* ─── REVEAL ANIMATIONS ─── */
.reveal { opacity:0;transform:translateY(36px);transition:opacity 0.8s ease,transform 0.8s ease; }
.reveal.visible { opacity:1;transform:translateY(0); }
.reveal-left { opacity:0;transform:translateX(-36px);transition:opacity 0.8s ease,transform 0.8s ease; }
.reveal-left.visible { opacity:1;transform:translateX(0); }
.reveal-right { opacity:0;transform:translateX(36px);transition:opacity 0.8s ease,transform 0.8s ease; }
.reveal-right.visible { opacity:1;transform:translateX(0); }

/* ─── PAGINATION ─── */
.pagination { display:flex;align-items:center;gap:8px;justify-content:center;margin-top:3rem; }
.page-btn { width:40px;height:40px;border:1.5px solid var(--border);border-radius:10px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:0.85rem;font-family:'DM Mono',monospace;color:var(--text-mid);background:transparent;transition:var(--transition); }
.page-btn:hover, .page-btn.active { background:var(--terra);border-color:var(--terra);color:white; }

/* ─── TOAST ─── */
#roamaio-toast { position:fixed;bottom:2rem;left:50%;transform:translateX(-50%) translateY(100px);background:var(--charcoal);color:var(--cream);padding:14px 24px;border-radius:100px;font-size:0.85rem;font-weight:500;z-index:9999;transition:transform 0.4s cubic-bezier(0.34,1.56,0.64,1);white-space:nowrap;display:flex;align-items:center;gap:10px;box-shadow:var(--shadow-lg); }
#roamaio-toast.show { transform:translateX(-50%) translateY(0); }
#roamaio-toast svg { width:16px;height:16px;color:var(--gold); }

/* ─── BREADCRUMB ─── */
.breadcrumb { display:flex;align-items:center;gap:8px;font-size:0.75rem;color:var(--text-soft);margin-bottom:1.5rem; }
.breadcrumb a { color:var(--terra);text-decoration:none; }
.breadcrumb a:hover { text-decoration:underline; }
.breadcrumb-sep { opacity:0.4; }

/* ─── LOADING BAR ─── */
.page-loader { position:fixed;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--terra),var(--gold),var(--terra));background-size:200% 100%;z-index:10000;animation:loader-slide 0.8s ease forwards; }
@keyframes loader-slide { from{transform:scaleX(0);transform-origin:left} to{transform:scaleX(1);transform-origin:left} }

/* ═══════════════════════════════════════════════
   MOBILE NAV — HAMBURGER + DRAWER
   ═══════════════════════════════════════════════ */

/* Hamburger button — hidden on desktop */
.mobile-menu-btn {
  display: none;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 5px;
  width: 44px;
  height: 44px;
  min-width: 44px;
  background: rgba(28,20,16,0.15);
  border: 2px solid rgba(28,20,16,0.3);
  border-radius: 10px;
  cursor: pointer;
  padding: 0;
  transition: var(--transition);
  flex-shrink: 0;
  position: relative;
  z-index: 1100;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}
.mobile-menu-btn span {
  display: block;
  width: 20px;
  height: 2.5px;
  background: #111111;
  border-radius: 2px;
  transition: all 0.3s ease;
  transform-origin: center;
  pointer-events: none;
}
.mobile-menu-btn.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.mobile-menu-btn.open span:nth-child(2) { opacity: 0; transform: scaleX(0); }
.mobile-menu-btn.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
.mobile-menu-btn:hover { background: rgba(28,20,16,0.25); }
.mobile-menu-btn:active { background: rgba(0,201,212,0.2); border-color: #00C9D4; }

/* Dark hero pages — white dashes on transparent nav */
.roamaio-nav:not(.scrolled) .mobile-menu-btn {
  background: rgba(255,255,255,0.1);
  border-color: rgba(255,255,255,0.35);
}
.roamaio-nav:not(.scrolled) .mobile-menu-btn span {
  background: #FFFFFF;
}

/* Light nav pages — always dark dashes */
.nav-light .mobile-menu-btn,
.roamaio-nav.scrolled .mobile-menu-btn {
  background: rgba(28,20,16,0.1);
  border-color: rgba(28,20,16,0.25);
}
.nav-light .mobile-menu-btn span,
.roamaio-nav.scrolled .mobile-menu-btn span {
  background: #111111;
}

/* Mobile drawer overlay */
.mobile-menu {
  display: none;
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  z-index: 999;
  pointer-events: none;
}
.mobile-menu.open { pointer-events: all; }

.mobile-menu-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(8,6,4,0.7);
  backdrop-filter: blur(4px);
  opacity: 0;
  transition: opacity 0.35s ease;
}
.mobile-menu.open .mobile-menu-backdrop { opacity: 1; }

.mobile-menu-panel {
  position: absolute;
  top: 0; right: 0;
  width: min(320px, 88vw);
  height: 100%;
  background: #060D1A;
  border-left: 1px solid rgba(255,250,242,0.08);
  transform: translateX(100%);
  transition: transform 0.38s cubic-bezier(0.4,0,0.2,1);
  display: flex;
  flex-direction: column;
  padding: 0;
  overflow-y: auto;
}
.mobile-menu.open .mobile-menu-panel { transform: translateX(0); }

.mobile-menu-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1.2rem 1.5rem;
  border-bottom: 1px solid rgba(255,250,242,0.07);
  flex-shrink: 0;
}
.mobile-menu-close {
  width: 36px; height: 36px;
  background: rgba(255,250,242,0.06);
  border: 1px solid rgba(255,250,242,0.12);
  border-radius: 8px;
  color: rgba(255,250,242,0.7);
  font-size: 1.2rem;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: var(--transition);
}
.mobile-menu-close:hover { background: rgba(255,250,242,0.12); color: white; }

.mobile-nav-links {
  list-style: none;
  padding: 1rem 0;
  flex: 1;
}
.mobile-nav-links li a {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 0.9rem 1.5rem;
  color: rgba(255,250,242,0.7);
  text-decoration: none;
  font-size: 0.9rem;
  font-weight: 500;
  letter-spacing: 0.04em;
  transition: all 0.2s;
  border-left: 2px solid transparent;
}
.mobile-nav-links li a:hover,
.mobile-nav-links li a.active {
  color: var(--terra-light);
  background: rgba(196,99,58,0.07);
  border-left-color: var(--terra);
}
.mobile-menu-actions {
  padding: 1rem 1.5rem 2rem;
  display: flex;
  flex-direction: column;
  gap: 10px;
  border-top: 1px solid rgba(255,250,242,0.07);
  flex-shrink: 0;
}
.mobile-menu-actions .btn-ghost-sm,
.mobile-menu-actions .btn-primary-sm {
  width: 100%;
  justify-content: center;
  text-align: center;
  padding: 13px 20px;
  font-size: 0.88rem;
}

/* ═══════════════════════════════════════════════
   GLOBAL RESPONSIVE
   ═══════════════════════════════════════════════ */

/* Disable custom cursor on touch devices */
@media (hover: none) {
  #roamaio-cursor, #roamaio-ring { display: none !important; }
  body { cursor: auto !important; }
  * { cursor: auto !important; }
}

@media (max-width: 900px) {
  /* Nav */
  .nav-links { display: none; }
  .nav-actions { display: none; }
  .mobile-menu-btn { display: flex; }
  .mobile-menu { display: block; }
  .roamaio-nav { padding: 0 1.2rem; }

  /* Footer */
  .footer-grid { grid-template-columns: 1fr 1fr; }

  /* Section padding */
  .section-pad { padding: 5rem 5%; }

  /* Hide scroll hint on tablets */
  .scroll-hint { display: none; }
}

@media (max-width: 600px) {
  /* Footer */
  .footer-grid { grid-template-columns: 1fr; }
  .footer-bottom { flex-direction: column; gap: 0.75rem; text-align: center; }

  /* Nav */
  .roamaio-nav { padding: 0 1rem; height: 64px; }

  /* Typography scale down */
  .h-display { font-size: clamp(2rem, 8vw, 3.5rem) !important; }
  .h-section { font-size: clamp(1.6rem, 6vw, 2.2rem) !important; }

  /* Stats strip */
  .stats-strip { grid-template-columns: 1fr 1fr !important; }

  /* Testimonials */
  .testi-grid { grid-template-columns: 1fr !important; }

  /* Toast */
  #roamaio-toast { width: calc(100vw - 2rem); white-space: normal; text-align: center; font-size: 0.8rem; }

  /* Chips rows */
  .chips-row { gap: 8px; }
  .chips-row .chip { font-size: 0.68rem; padding: 7px 14px; }

  /* Email row */
  .email-row { flex-direction: column !important; }
  .email-row input { width: 100%; }
  .email-row .btn-primary { width: 100%; justify-content: center; }

  /* Mood strip: fix card overflow */
  .mood-strip { padding: 2rem 1rem; gap: 12px; }
  .mood-card { flex: 0 0 160px !important; height: 220px !important; }

  /* Section padding mobile */
  section, .section-pad { padding-left: 1.2rem !important; padding-right: 1.2rem !important; }
}