/* ============================================================
   TOURIXA — Premium Travel Design System
   style.css  v2.0.0
   ============================================================
   Architecture : Token-based · RTL-ready · A11y-compliant
   Refactor     : JS-injected CSS merged → zero runtime injection
   ============================================================

   TABLE OF CONTENTS
   ─────────────────────────────────────────────────────────────
   01. ROOT VARIABLES        — Design tokens, light/dark modes
   02. RESET & BASE          — Box-model, body, focus
   03. TYPOGRAPHY            — Fonts, scale, utilities
   04. LAYOUT SYSTEM         — Container, grid, flex, spacing
   05. HEADER & NAVIGATION   — Sticky bar, mega menu, mobile
   06. FOOTER                — Multi-column, newsletter, social
   07. COMPONENTS            — Buttons, cards, forms, badges,
                               stats, reviews
   08. PAGE LOADER           — All loader variants (globe,
                               compass, dots, progress, wave,
                               logo) + particles
   09. PAGE TRANSITION       — Inter-page overlay
   10. TRAVEL VISUAL FX      — Clouds, routes, atmosphere
   11. ANIMATIONS & KEYFRAMES— All @keyframes consolidated
   12. UTILITIES             — Helper classes
   13. RESPONSIVE BREAKPOINTS— Mobile-first overrides
   14. ACCESSIBILITY         — Reduced-motion, focus states
   15. RTL SUPPORT           — Logical property overrides
   ============================================================ */


/* ============================================================
   01. ROOT VARIABLES
   ============================================================ */

:root {
  /* ── Primary Palette ── */
  --color-primary:          #0A2540;
  --color-primary-hover:    #0D3260;
  --color-primary-light:    #1A4A7A;
  --color-secondary:        #D4A96A;
  --color-secondary-hover:  #C49055;
  --color-secondary-light:  #EDD8A8;
  --color-accent:           #F4622A;
  --color-accent-hover:     #D94E1A;
  --color-accent-glow:      rgba(244, 98, 42, 0.35);

  /* ── Extended Travel Palette ── */
  --color-safari:           #8B5E3C;
  --color-safari-light:     #C49A6C;
  --color-jungle:           #1A4D2E;
  --color-jungle-light:     #2D7A4F;
  --color-sky:              #C8E6F5;
  --color-sky-deep:         #5BA3D4;
  --color-night:            #060D1A;
  --color-dusk:             #1C2B4A;
  --color-dawn:             #FFB347;

  /* ── Neutrals ── */
  --color-bg:               #FAFAF8;
  --color-surface:          #FFFFFF;
  --color-surface-2:        #F5F3EE;
  --color-border:           rgba(10, 37, 64, 0.12);
  --color-border-strong:    rgba(10, 37, 64, 0.24);
  --color-muted:            #9A9B9E;

  /* ── Text ── */
  --color-text-primary:     #0A2540;
  --color-text-secondary:   #4A5568;
  --color-text-muted:       #8A9AB2;
  --color-text-inverse:     #FFFFFF;
  --color-text-accent:      #F4622A;

  /* ── Gradients ── */
  --gradient-hero:          linear-gradient(160deg, #0A2540 0%, #1A3C6E 45%, #0D2B50 100%);
  --gradient-sunset:        linear-gradient(135deg, #F4622A 0%, #D4A96A 50%, #FFD89B 100%);
  --gradient-ocean:         linear-gradient(180deg, #0A2540 0%, #0D5986 60%, #1A8FBF 100%);
  --gradient-safari:        linear-gradient(135deg, #8B5E3C 0%, #D4A96A 60%, #F5E6C8 100%);
  --gradient-card-overlay:  linear-gradient(to top, rgba(6,13,26,0.85) 0%, rgba(6,13,26,0.3) 60%, transparent 100%);
  --gradient-cinematic:     linear-gradient(180deg, transparent 0%, rgba(6,13,26,0.6) 100%);

  /* ── Shadows ── */
  --shadow-xs:    0 1px 3px rgba(10,37,64,0.08);
  --shadow-sm:    0 2px 8px rgba(10,37,64,0.10);
  --shadow-md:    0 4px 20px rgba(10,37,64,0.12);
  --shadow-lg:    0 8px 40px rgba(10,37,64,0.16);
  --shadow-xl:    0 16px 60px rgba(10,37,64,0.22);
  --shadow-2xl:   0 30px 90px rgba(10,37,64,0.28);
  --shadow-glow:  0 0 40px rgba(244,98,42,0.30);
  --shadow-blue:  0 0 40px rgba(10,37,64,0.40);

  /* ── Border Radius ── */
  --radius-xs:    4px;
  --radius-sm:    8px;
  --radius-md:    12px;
  --radius-lg:    16px;
  --radius-xl:    24px;
  --radius-2xl:   32px;
  --radius-full:  9999px;
  --radius-card:  20px;

  /* ── Z-Index Scale ── */
  --z-base:       1;
  --z-raised:     10;
  --z-dropdown:   100;
  --z-sticky:     200;
  --z-overlay:    300;
  --z-modal:      400;
  --z-toast:      500;

  /* ── Easing & Transitions ── */
  --ease-smooth:  cubic-bezier(0.19, 1, 0.22, 1);
  --ease-bounce:  cubic-bezier(0.34, 1.56, 0.64, 1);
  --ease-in:      cubic-bezier(0.4, 0, 1, 1);
  --ease-out:     cubic-bezier(0, 0, 0.2, 1);
  --ease-spring:  cubic-bezier(0.175, 0.885, 0.32, 1.275);

  --transition-fast:  0.18s var(--ease-smooth);
  --transition-base:  0.35s var(--ease-smooth);
  --transition-slow:  0.65s var(--ease-smooth);
  --transition-hero:  1.00s var(--ease-smooth);

  /* ── Header ── */
  --nav-h:         80px;
  --nav-h-scrolled: 62px;
  --menu-w:        820px;
  --blur-glass:    blur(24px) saturate(180%);
  --perspective:   1200px;

  /* ── Fonts ── */
  --font-display: 'Manrope', 'Poppins', system-ui, sans-serif;
  --font-heading: 'Poppins', 'Manrope', system-ui, sans-serif;
  --font-body:    'Inter', system-ui, sans-serif;
  --font-mono:    'JetBrains Mono', monospace;
  --font-ui:      var(--font-heading);

  /* ── Type Scale ── */
  --text-xs:    0.70rem;
  --text-sm:    0.825rem;
  --text-base:  1rem;
  --text-md:    1.125rem;
  --text-lg:    1.25rem;
  --text-xl:    1.5rem;
  --text-2xl:   1.875rem;
  --text-3xl:   2.25rem;
  --text-4xl:   3rem;
  --text-5xl:   4rem;
  --text-hero:      clamp(3rem, 7vw, 6rem);
  --text-display:   clamp(2.5rem, 6vw, 5.5rem);
  --text-cinematic: clamp(3.5rem, 8vw, 7rem);

  /* ── Line Heights ── */
  --leading-tight:   1.15;
  --leading-snug:    1.30;
  --leading-normal:  1.50;
  --leading-relaxed: 1.70;
  --leading-loose:   2.00;

  /* ── Letter Spacing ── */
  --tracking-tight:   -0.04em;
  --tracking-snug:    -0.02em;
  --tracking-normal:   0;
  --tracking-wide:     0.04em;
  --tracking-wider:    0.08em;
  --tracking-widest:   0.16em;

  /* ── Font Weights ── */
  --weight-light:     300;
  --weight-regular:   400;
  --weight-medium:    500;
  --weight-semibold:  600;
  --weight-bold:      700;
  --weight-extrabold: 800;
  --weight-black:     900;

  /* ── Spacing (8-pt grid) ── */
  --space-0:   0;
  --space-1:   0.25rem;
  --space-2:   0.5rem;
  --space-3:   1rem;
  --space-4:   1.5rem;
  --space-5:   2rem;
  --space-6:   3rem;
  --space-7:   4rem;
  --space-8:   6rem;
  --space-9:   8rem;
  --space-10:  12rem;
  --space-section: clamp(5rem, 10vw, 9rem);

  /* ── Containers ── */
  --container-sm:  640px;
  --container-md:  768px;
  --container-lg:  1024px;
  --container-xl:  1280px;
  --container-2xl: 1440px;
  --gutter-sm:  var(--space-3);
  --gutter-md:  var(--space-4);
  --gutter-lg:  var(--space-5);
  --gutter-xl:  var(--space-6);

  /* ── Loader-specific tokens ── */
  --loader-bg-deep:   #060D1A;
  --loader-bg-mid:    #0A1628;
  --loader-bg-upper:  #0D1F3C;
  --loader-gold:      rgba(212, 169, 106, 0.35);   /* secondary tinted */
  --loader-gold-soft: rgba(212, 169, 106, 0.12);
  --loader-gold-glow: rgba(212, 169, 106, 0.07);
}


/* ── DARK MODE ── */
[data-theme="dark"],
.dark-mode {
  --color-primary:         #2A82CC;
  --color-primary-hover:   #3A9AE8;
  --color-primary-light:   #1A6FB5;
  --color-accent:          #FF7A45;
  --color-accent-hover:    #FF9060;
  --color-accent-glow:     rgba(255, 122, 69, 0.40);
  --color-bg:              #070E1B;
  --color-surface:         #0D1A2E;
  --color-surface-2:       #122040;
  --color-border:          rgba(255, 255, 255, 0.08);
  --color-border-strong:   rgba(255, 255, 255, 0.16);
  --color-muted:           #5A6880;
  --color-text-primary:    #EEF2F8;
  --color-text-secondary:  #8FA4C0;
  --color-text-muted:      #4A607A;
  --color-text-inverse:    #070E1B;
  --color-text-accent:     #FF7A45;
  --gradient-hero:         linear-gradient(160deg, #060D1A 0%, #0A1F3A 45%, #070E1B 100%);
  --gradient-card-overlay: linear-gradient(to top, rgba(6,13,26,0.95) 0%, rgba(6,13,26,0.5) 60%, transparent 100%);
  --shadow-xs:   0 1px 3px rgba(0,0,0,0.30);
  --shadow-sm:   0 2px 8px rgba(0,0,0,0.40);
  --shadow-md:   0 4px 20px rgba(0,0,0,0.50);
  --shadow-lg:   0 8px 40px rgba(0,0,0,0.60);
  --shadow-xl:   0 16px 60px rgba(0,0,0,0.70);
  --shadow-glow: 0 0 50px rgba(255, 122, 69, 0.40);
  --shadow-blue: 0 0 50px rgba(42, 130, 204, 0.40);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --color-primary:        #2A82CC;
    --color-accent:         #FF7A45;
    --color-accent-glow:    rgba(255, 122, 69, 0.40);
    --color-bg:             #070E1B;
    --color-surface:        #0D1A2E;
    --color-surface-2:      #122040;
    --color-border:         rgba(255, 255, 255, 0.08);
    --color-border-strong:  rgba(255, 255, 255, 0.16);
    --color-text-primary:   #EEF2F8;
    --color-text-secondary: #8FA4C0;
    --color-text-muted:     #4A607A;
    --color-text-inverse:   #070E1B;
    --gradient-hero:        linear-gradient(160deg, #060D1A 0%, #0A1F3A 45%, #070E1B 100%);
    --shadow-glow:          0 0 50px rgba(255, 122, 69, 0.40);
  }
}


/* ============================================================
   02. RESET & BASE
   ============================================================ */

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html {
  font-size: 16px;
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  font-family: var(--font-body);
  font-size: var(--text-base);
  font-weight: var(--weight-regular);
  line-height: var(--leading-normal);
  color: var(--color-text-primary);
  background-color: var(--color-bg);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  overflow-x: hidden;
}

img    { max-width: 100%; height: auto; display: block; }
a      { color: inherit; text-decoration: none; }
ul     { list-style: none; }
button { cursor: pointer; border: none; background: none; font: inherit; }

:focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 3px;
  border-radius: var(--radius-xs);
}


/* ============================================================
   03. TYPOGRAPHY
   ============================================================ */

@font-face {
  font-family: 'Manrope';
  src: url('./assets/fonts/Manrope/Manrope-Regular.woff2') format('woff2');
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Manrope';
  src: url('./assets/fonts/Manrope/Manrope-Medium.woff2') format('woff2');
  font-weight: 500; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Manrope';
  src: url('./assets/fonts/Manrope/Manrope-Bold.woff2') format('woff2');
  font-weight: 700; font-style: normal; font-display: swap;
}

h1, .h1, h2, .h2, h3, .h3,
h4, .h4, h5, .h5, h6, .h6 {
  font-family: var(--font-heading);
  line-height: var(--leading-tight);
  letter-spacing: var(--tracking-snug);
  color: var(--color-text-primary);
  font-weight: var(--weight-bold);
}

h1, .h1 { font-family:var(--font-display); font-size:var(--text-hero);    font-weight:var(--weight-black);     letter-spacing:var(--tracking-tight); }
h2, .h2 { font-size:var(--text-display);   font-weight:var(--weight-extrabold); letter-spacing:var(--tracking-snug); }
h3, .h3 { font-size:var(--text-2xl);       font-weight:var(--weight-bold); }
h4, .h4 { font-size:var(--text-xl);        font-weight:var(--weight-semibold); }
h5, .h5 { font-size:var(--text-lg);        font-weight:var(--weight-semibold); }
h6, .h6 { font-size:var(--text-md);        font-weight:var(--weight-medium); }

p { font-size:var(--text-base); line-height:var(--leading-relaxed); color:var(--color-text-secondary); }

/* ── Typographic Utilities ── */
.text-cinematic { font-family:var(--font-display); font-size:var(--text-cinematic); font-weight:var(--weight-black);     letter-spacing:var(--tracking-tight);  line-height:1.0; }
.text-display   { font-family:var(--font-display); font-size:var(--text-display);   font-weight:var(--weight-extrabold); letter-spacing:var(--tracking-tight);  line-height:var(--leading-tight); }
.text-hero      { font-family:var(--font-display); font-size:var(--text-hero);      font-weight:var(--weight-black);     letter-spacing:var(--tracking-tight);  line-height:var(--leading-tight); }
.text-overline  { font-size:var(--text-xs);  font-weight:var(--weight-semibold); letter-spacing:var(--tracking-widest); text-transform:uppercase; color:var(--color-accent); }
.text-lead      { font-size:var(--text-lg);  line-height:var(--leading-relaxed); font-weight:var(--weight-medium); color:var(--color-text-secondary); }
.text-label     { font-size:var(--text-sm);  font-weight:var(--weight-medium);   letter-spacing:var(--tracking-wide); color:var(--color-text-secondary); }
.text-large     { font-size:var(--text-md); }
.text-small     { font-size:var(--text-sm); }
.text-xs        { font-size:var(--text-xs); }

.text-primary   { color:var(--color-text-primary); }
.text-secondary { color:var(--color-text-secondary); }
.text-muted     { color:var(--color-text-muted); }
.text-accent    { color:var(--color-accent); }
.text-inverse   { color:var(--color-text-inverse); }
.text-gradient  { background:var(--gradient-sunset); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }


/* ============================================================
   04. LAYOUT SYSTEM
   ============================================================ */

.container     { width:100%; max-width:var(--container-xl);  margin-inline:auto; padding-inline:var(--gutter-lg); }
.container-sm  { max-width:var(--container-sm);  margin-inline:auto; padding-inline:var(--gutter-md); }
.container-md  { max-width:var(--container-md);  margin-inline:auto; padding-inline:var(--gutter-md); }
.container-lg  { max-width:var(--container-lg);  margin-inline:auto; padding-inline:var(--gutter-lg); }
.container-2xl { max-width:var(--container-2xl); margin-inline:auto; padding-inline:var(--gutter-xl); }
.container-full{ width:100%; padding-inline:var(--gutter-lg); }

.grid    { display:grid; gap:var(--gutter-lg); }
.grid-1  { grid-template-columns:repeat(1, 1fr); }
.grid-2  { grid-template-columns:repeat(2, 1fr); }
.grid-3  { grid-template-columns:repeat(3, 1fr); }
.grid-4  { grid-template-columns:repeat(4, 1fr); }
.grid-12 { grid-template-columns:repeat(12, 1fr); }
.grid-auto-fill-sm { grid-template-columns:repeat(auto-fill, minmax(240px, 1fr)); }
.grid-auto-fill-md { grid-template-columns:repeat(auto-fill, minmax(300px, 1fr)); }
.grid-auto-fill-lg { grid-template-columns:repeat(auto-fill, minmax(360px, 1fr)); }
.grid-auto-fit-sm  { grid-template-columns:repeat(auto-fit,  minmax(240px, 1fr)); }
.grid-auto-fit-md  { grid-template-columns:repeat(auto-fit,  minmax(300px, 1fr)); }

.flex            { display:flex; }
.flex-col        { display:flex; flex-direction:column; }
.flex-wrap       { flex-wrap:wrap; }
.items-center    { align-items:center; }
.items-start     { align-items:flex-start; }
.items-end       { align-items:flex-end; }
.justify-center  { justify-content:center; }
.justify-between { justify-content:space-between; }
.justify-end     { justify-content:flex-end; }
.gap-1 { gap:var(--space-1); } .gap-2 { gap:var(--space-2); }
.gap-3 { gap:var(--space-3); } .gap-4 { gap:var(--space-4); }
.gap-5 { gap:var(--space-5); } .gap-6 { gap:var(--space-6); }

.py-section { padding-block:var(--space-section); }
.py-8       { padding-block:var(--space-8); }
.py-7       { padding-block:var(--space-7); }
.py-6       { padding-block:var(--space-6); }


/* ============================================================
   05. HEADER & NAVIGATION
   ============================================================ */

/* ── Site Header ── */
.site-header {
  position:fixed; top:0; left:0; right:0;
  z-index:9000; height:var(--nav-h);
  perspective:var(--perspective);
  transition:height 0.5s var(--ease-smooth), background 0.5s var(--ease-smooth);
}

.site-header__bar {
  position:relative; height:100%;
  display:flex; align-items:center; justify-content:center;
  max-width:1200px; margin:0 auto; padding:0 20px;
  border-bottom:1px solid transparent;
  transition:
    background      0.5s var(--ease-smooth),
    border-color    0.5s var(--ease-smooth),
    backdrop-filter 0.5s var(--ease-smooth),
    box-shadow      0.5s var(--ease-smooth),
    border-radius   0.5s var(--ease-smooth),
    margin-top      0.5s var(--ease-smooth);
}

.site-header.is-scrolled .site-header__bar {
  background: var(--color-primary-light);
  border-color: var(--color-border);
  backdrop-filter: var(--blur-glass);
  -webkit-backdrop-filter: var(--blur-glass);
  border-radius: var(--radius-2xl);
  margin-top: 10px;
  box-shadow: 0 1px 60px rgba(0,0,0,0.4), 0 0 0 1px var(--color-border);
}
[data-theme="dark"] .site-header.is-scrolled .site-header__bar { background:rgba(7,14,27,0.92); }
.site-header.is-scrolled { height:var(--nav-h-scrolled); }

/* ── Logo ── */
.site-logo { flex-shrink:0; margin-right:auto; text-decoration:none; display:flex; align-items:center; gap:10px; user-select:none; }
.site-logo__mark { display:none; }
.site-logo__mark svg { width:100%; height:100%; }
.site-logo__wordmark { font-family:var(--font-ui); font-size:20px; font-weight:800; letter-spacing:0.04em; text-transform:uppercase; color:var(--color-text-inverse); transition:color 0.3s; }
.site-logo__wordmark span { color:var(--color-accent); }

/* ── Primary Nav ── */
.primary-nav { display:flex; align-items:center; gap:0; list-style:none; }
.primary-nav__item { position:static; }

.primary-nav__link {
  display:flex; align-items:center; gap:4px; padding:8px 14px;
  font-family:var(--font-body); font-size:13.5px; font-weight:400;
  letter-spacing:0.01em; color:rgba(255,255,255,0.75); text-decoration:none;
  cursor:pointer; background:none; border:none;
  position:relative; white-space:nowrap;
  transition:color 0.25s var(--ease-smooth);
}
.primary-nav__link a { display:flex; align-items:center; gap:4px; font-family:var(--font-body); font-size:13.5px; font-weight:400; color:rgba(255,255,255,0.75); text-decoration:none; }
.primary-nav__link::after { content:''; position:absolute; bottom:0; left:14px; right:14px; height:1.5px; background:var(--color-accent); transform:scaleX(0); transition:transform 0.35s var(--ease-smooth); transform-origin:center; border-radius:2px; }
.primary-nav__item:hover .primary-nav__link,
.primary-nav__item.is-active .primary-nav__link { color:#fff; background:none; }
.primary-nav__item:hover .primary-nav__link::after,
.primary-nav__item.is-active .primary-nav__link::after { transform:scaleX(1); }
.primary-nav__chevron { display:none; }

/* ── Nav Actions ── */
.nav-actions { display:flex; align-items:center; margin-left:auto; gap:8px; }

.btn-icon { width:36px; height:36px; border:1px solid var(--color-border); border-radius:50%; background:rgba(255,255,255,0.04); color:var(--color-text-secondary); cursor:pointer; display:flex; align-items:center; justify-content:center; transition:all 0.3s var(--ease-smooth); backdrop-filter:blur(8px); }
.btn-icon:hover { color:var(--color-text-inverse); border-color:var(--color-accent); background:rgba(244,98,42,0.12); box-shadow:0 0 20px var(--color-accent-glow); }
.btn-icon svg { width:15px; height:15px; }

.btn-cta { position:relative; overflow:hidden; padding:9px 22px; font-family:var(--font-body); font-size:13.5px; font-weight:500; color:#fff; background:var(--color-accent); border:none; border-radius:var(--radius-full); cursor:pointer; text-decoration:none; will-change:transform; transition:transform 0.3s var(--ease-bounce), box-shadow 0.3s, background 0.3s; }
.btn-cta::before { content:''; position:absolute; inset:0; background:rgba(255,255,255,0.18); transform:translateX(-100%) skewX(-15deg); transition:transform 0.5s var(--ease-smooth); }
.btn-cta:hover::before { transform:translateX(100%) skewX(-15deg); }
.btn-cta:hover { background:#c94234; box-shadow:0 8px 32px rgba(224,92,75,0.45), 0 2px 12px rgba(0,0,0,0.3); transform:translateY(-1px); }

.btn-hamburger { display:none; flex-direction:column; justify-content:center; gap:5px; width:40px; height:40px; background:none; border:none; cursor:pointer; padding:8px; }
.btn-hamburger__line { display:block; height:1.5px; background:var(--color-text-inverse); border-radius:2px; transition:transform 0.4s var(--ease-smooth), opacity 0.3s, width 0.4s var(--ease-smooth); transform-origin:center; }
.btn-hamburger__line:nth-child(1) { width:24px; }
.btn-hamburger__line:nth-child(2) { width:16px; margin-left:auto; }
.btn-hamburger__line:nth-child(3) { width:20px; }
.btn-hamburger.is-open .btn-hamburger__line:nth-child(1) { transform:translateY(6.5px) rotate(45deg); width:22px; }
.btn-hamburger.is-open .btn-hamburger__line:nth-child(2) { opacity:0; transform:scaleX(0); }
.btn-hamburger.is-open .btn-hamburger__line:nth-child(3) { transform:translateY(-6.5px) rotate(-45deg); width:22px; }

/* ── Scroll Progress Bar ── */
.scroll-progress { position:fixed; top:0; inset-inline-start:0; height:3px; background:var(--gradient-sunset); z-index:var(--z-toast); transform-origin:left; transform:scaleX(0); will-change:transform; }

/* ── Cursor Glow ── */
.cursor-glow { position:fixed; width:300px; height:300px; border-radius:var(--radius-full); background:radial-gradient(circle, rgba(244,98,42,0.10) 0%, transparent 65%); pointer-events:none; z-index:var(--z-overlay); transform:translate(-50%,-50%); will-change:transform; }

/* ── Mega Menu Overlay ── */
.mega-overlay { position:fixed; top:0; left:0; right:0; bottom:0; z-index:8998; background:rgba(0,0,0,0.5); backdrop-filter:blur(2px); opacity:0; pointer-events:none; transition:opacity 0.4s var(--ease-smooth); }
.mega-overlay.is-visible { opacity:1; pointer-events:all; }

/* ── Mega Menu Panel ── */
.mega-menu {
  position:fixed; top:var(--nav-h); left:50%;
  transform:translateX(-50%) translateY(-20px) rotateX(-6deg);
  transform-origin:top center;
  width:min(var(--menu-w), 94vw);
  background:var(--color-primary-light);
  border:1px solid var(--color-border);
  border-radius:var(--radius-lg);
  backdrop-filter:var(--blur-glass);
  -webkit-backdrop-filter:var(--blur-glass);
  box-shadow:0 4px 6px rgba(0,0,0,0.2), 0 20px 80px rgba(0,0,0,0.5), 0 0 0 1px rgba(255,255,255,0.03), inset 0 1px 0 rgba(255,255,255,0.06);
  overflow:hidden; opacity:0; pointer-events:none;
  z-index:8999; perspective:800px;
  transition:opacity 0.45s var(--ease-smooth), transform 0.55s var(--ease-smooth);
  will-change:transform, opacity;
}
.mega-menu.for-scrolled { top:var(--nav-h-scrolled); }
.mega-menu.is-open { opacity:1; pointer-events:all; transform:translateX(-50%) translateY(0) rotateX(0deg); }

.mega-menu__inner { display:grid; grid-template-columns:1fr 280px; min-height:360px; }
.mega-menu__left  { padding:36px 40px; display:flex; flex-direction:column; gap:8px; position:relative; z-index:1; }
.mega-menu__category { font-family:var(--font-ui); font-size:9.5px; letter-spacing:0.25em; text-transform:uppercase; color:var(--color-accent); margin-bottom:12px; opacity:0.8; }
.mega-menu__links { list-style:none; display:flex; flex-direction:column; gap:2px; }

.mega-menu__link-item { opacity:0; transform:translateX(-12px); transition:opacity 0.4s var(--ease-smooth), transform 0.5s var(--ease-smooth); }
.mega-menu.is-open .mega-menu__link-item { opacity:1; transform:translateX(0); }
.mega-menu.is-open .mega-menu__link-item:nth-child(1) { transition-delay:0.04s; }
.mega-menu.is-open .mega-menu__link-item:nth-child(2) { transition-delay:0.08s; }
.mega-menu.is-open .mega-menu__link-item:nth-child(3) { transition-delay:0.12s; }
.mega-menu.is-open .mega-menu__link-item:nth-child(4) { transition-delay:0.16s; }
.mega-menu.is-open .mega-menu__link-item:nth-child(5) { transition-delay:0.20s; }
.mega-menu.is-open .mega-menu__link-item:nth-child(6) { transition-delay:0.24s; }

.mega-menu__link { display:flex; align-items:center; gap:14px; padding:12px 14px; border-radius:var(--radius-sm); text-decoration:none; position:relative; overflow:hidden; transition:background 0.3s, transform 0.3s var(--ease-bounce), box-shadow 0.3s; }
.mega-menu__link::before { content:''; position:absolute; left:0; top:50%; transform:translateY(-50%) scaleY(0); width:2px; height:70%; background:var(--color-accent); border-radius:2px; transition:transform 0.3s var(--ease-bounce); }
.mega-menu__link:hover { background:rgba(255,255,255,0.04); transform:translateX(4px); box-shadow:inset 0 0 0 1px var(--color-border); }
.mega-menu__link:hover::before { transform:translateY(-50%) scaleY(1); }

.mega-menu__link-icon { width:36px; height:36px; border-radius:var(--radius-sm); background:rgba(255,255,255,0.04); border:1px solid var(--color-border); display:flex; align-items:center; justify-content:center; font-size:16px; flex-shrink:0; transition:background 0.3s, transform 0.3s var(--ease-bounce), box-shadow 0.3s; }
.mega-menu__link:hover .mega-menu__link-icon { background:rgba(244,98,42,0.12); border-color:var(--color-accent); transform:scale(1.08) rotate(-3deg); box-shadow:0 0 16px var(--color-accent-glow); }

.mega-menu__link-text  { display:flex; flex-direction:column; gap:2px; }
.mega-menu__link-title { font-family:var(--font-ui); font-size:13px; font-weight:500; color:var(--color-text-inverse); letter-spacing:0.04em; transition:color 0.3s; }
.mega-menu__link:hover .mega-menu__link-title { color:var(--color-accent); }
.mega-menu__link-desc  { font-family:var(--font-body); font-size:11.5px; color:var(--color-text-muted); font-weight:300; transition:color 0.3s; }
.mega-menu__link:hover .mega-menu__link-desc { color:var(--color-text-secondary); }

.mega-menu__footer { border-top:1px solid var(--color-border); padding:16px 40px; display:flex; align-items:center; justify-content:space-between; opacity:0; transform:translateY(8px); transition:opacity 0.4s 0.3s var(--ease-smooth), transform 0.4s 0.3s var(--ease-smooth); }
.mega-menu.is-open .mega-menu__footer { opacity:1; transform:translateY(0); }
.mega-menu__footer-tag  { font-family:var(--font-ui); font-size:10px; letter-spacing:0.2em; text-transform:uppercase; color:var(--color-text-muted); }
.mega-menu__footer-link { font-family:var(--font-ui); font-size:11px; font-weight:500; letter-spacing:0.1em; color:var(--color-accent); text-decoration:none; display:flex; align-items:center; gap:6px; transition:gap 0.3s; }
.mega-menu__footer-link:hover { gap:10px; }

.mega-menu__right { position:relative; overflow:hidden; border-left:1px solid var(--color-border); }
.mega-menu__visual { position:absolute; inset:0; background-size:cover; background-position:center; transform:scale(1.08); transition:transform 0.8s var(--ease-smooth); will-change:transform; }
.mega-menu.is-open .mega-menu__visual { transform:scale(1.0); }
.mega-menu__visual-overlay { position:absolute; inset:0; background:linear-gradient(to right, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.3) 50%, rgba(0,0,0,0.1) 100%); }
.mega-menu__visual-label { position:absolute; bottom:24px; left:20px; font-family:var(--font-display); font-size:22px; font-weight:300; font-style:italic; color:rgba(255,255,255,0.7); line-height:1.2; opacity:0; transform:translateY(10px); transition:opacity 0.5s 0.35s var(--ease-smooth), transform 0.5s 0.35s var(--ease-smooth); }
.mega-menu.is-open .mega-menu__visual-label { opacity:1; transform:translateY(0); }
.mega-menu__glow-line { position:absolute; top:0; bottom:0; width:1px; background:linear-gradient(to bottom, transparent, var(--color-accent), transparent); opacity:0; transition:opacity 0.4s; }
.mega-menu__glow-line--left { left:0; }
.mega-menu.is-open .mega-menu__glow-line { opacity:0.4; }

#mega-particles { position:absolute; inset:0; pointer-events:none; opacity:0; transition:opacity 0.4s; z-index:0; }
.mega-menu--open #mega-particles { opacity:1; }

/* ── Mobile Menu ── */
/* ============================================================
       MOBILE MENU — SHELL
       ============================================================ */

      .mobile-menu__backdrop {
      position: fixed;
      inset: 0;
      z-index: 8999;
      background: rgba(6,13,26,0.65);
      backdrop-filter: blur(5px);
      -webkit-backdrop-filter: blur(5px);
      opacity: 0;
      pointer-events: none;
      transition: opacity 0.45s var(--ease-smooth);
    }
    .mobile-menu__backdrop.is-visible {
      opacity: 1;
      pointer-events: all;
    }
    .mobile-menu {
      position: fixed;
      top: 0; right: 0; bottom: 0;
      width: min(420px, 100vw);
      z-index: 9000;
      display: flex;
      flex-direction: column;
      background: var(--color-bg);
      transform: translateX(100%);
      transition: transform 0.55s var(--ease-smooth);
      will-change: transform;
      overflow: hidden;
    }
    .mobile-menu.is-open {
      transform: translateX(0);
    }

    /* Left-edge accent stripe */
    .mobile-menu::before {
      content: '';
      position: absolute;
      top: 0; left: 0;
      width: 3px; height: 100%;
      background: linear-gradient(
        to bottom,
        transparent 0%,
        var(--color-accent) 20%,
        var(--color-secondary) 55%,
        var(--color-accent) 82%,
        transparent 100%
      );
      opacity: 0;
      transition: opacity 0.55s 0.2s;
      z-index: 3;
    }
    .mobile-menu.is-open::before { opacity: 0.7; }

    /* Ambient glows (decorative) */
    .mobile-menu__glow {
      position: absolute;
      top: -100px; right: -100px;
      width: 320px; height: 320px;
      border-radius: 50%;
      background: radial-gradient(circle, var(--color-accent-glow) 0%, transparent 70%);
      pointer-events: none;
      z-index: 0;
      opacity: 0.45;
    }
    .mobile-menu__glow-2 {
      position: absolute;
      bottom: 15%; left: -70px;
      width: 240px; height: 240px;
      border-radius: 50%;
      background: radial-gradient(circle, rgba(212,169,106,0.07) 0%, transparent 70%);
      pointer-events: none;
      z-index: 0;
    }

    /* Scrollable inner wrapper */
    .mobile-menu__inner {
      position: relative;
      z-index: 1;
      display: flex;
      flex-direction: column;
      height: 100%;
      overflow-y: auto;
      overflow-x: hidden;
      scrollbar-width: thin;
      scrollbar-color: var(--color-border) transparent;
    }
    .mobile-menu__inner::-webkit-scrollbar { width: 4px; }
    .mobile-menu__inner::-webkit-scrollbar-track { background: transparent; }
    .mobile-menu__inner::-webkit-scrollbar-thumb {
      background: var(--color-border);
      border-radius: 4px;
    }

    /* ── HEADER ── */
    .mobile-menu__header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 20px 24px;
      border-bottom: 1px solid var(--color-border);
      flex-shrink: 0;
      position: relative;
      z-index: 2;
      background: var(--color-bg);
      transition: background 0.4s var(--ease-smooth), border-color 0.4s var(--ease-smooth);
    }

    /* Logo */
    .site-logo {
      display: flex;
      align-items: center;
      gap: 9px;
      text-decoration: none;
      user-select: none;
    }
    .site-logo__mark { width: 28px; height: 28px; flex-shrink: 0; }
    .site-logo__mark svg { width: 100%; height: 100%; }
    .site-logo__wordmark {
      font-family: var(--font-display);
      font-size: 19px;
      font-weight: 800;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      color: var(--color-text-primary);
      transition: color 0.3s;
    }
    .site-logo__wordmark span { color: var(--color-accent); }

    /* Header action buttons cluster */
    .mobile-menu__header-actions {
      display: flex;
      align-items: center;
      gap: 8px;
    }

    /* ── Theme toggle button ── */
    .btn-theme-toggle {
      position: relative;
      width: 36px; height: 36px;
      border: 1px solid var(--color-border);
      border-radius: 50%;
      background: var(--color-surface-2);
      color: var(--color-text-secondary);
      display: flex;
      align-items: center;
      justify-content: center;
      transition: all 0.3s var(--ease-smooth);
      overflow: hidden;
    }
    .btn-theme-toggle:hover {
      border-color: var(--color-accent);
      color: var(--color-accent);
      background: rgba(244,98,42,0.06);
      box-shadow: 0 0 16px var(--color-accent-glow);
    }
    .btn-theme-toggle .icon-sun,
    .btn-theme-toggle .icon-moon {
      position: absolute;
      width: 16px; height: 16px;
      transition: transform 0.4s var(--ease-bounce), opacity 0.3s;
    }
    /* Light mode defaults: sun visible */
    .btn-theme-toggle .icon-sun  { opacity: 1;  transform: translateY(0) rotate(0deg); }
    .btn-theme-toggle .icon-moon { opacity: 0;  transform: translateY(20px) rotate(90deg); }
    /* Dark mode: moon visible */
    [data-theme="dark"] .btn-theme-toggle .icon-sun  { opacity: 0;  transform: translateY(-20px) rotate(-90deg); }
    [data-theme="dark"] .btn-theme-toggle .icon-moon { opacity: 1;  transform: translateY(0) rotate(0deg); }

    /* ── Close button ── */
    .btn-menu-close {
      width: 36px; height: 36px;
      border: 1px solid var(--color-border);
      border-radius: 50%;
      background: var(--color-surface-2);
      color: var(--color-text-secondary);
      display: flex;
      align-items: center;
      justify-content: center;
      transition: all 0.35s var(--ease-smooth);
    }
    .btn-menu-close svg { width: 16px; height: 16px; }
    .btn-menu-close:hover {
      border-color: var(--color-accent);
      color: var(--color-accent);
      background: rgba(244,98,42,0.06);
      box-shadow: 0 0 16px var(--color-accent-glow);
      transform: rotate(90deg);
    }

    /* ── NAVIGATION BODY ── */
    .mobile-menu__body {
      flex: 1;
      padding: 8px 0 0;
      position: relative;
      z-index: 2;
    }

    /* ── ACCORDION ITEM ── */
    .mobile-nav__item {
      border-bottom: 1px solid var(--color-border);
      overflow: hidden;
    }

    /* Row = clickable label + arrow trigger side-by-side */
    .mobile-nav__row {
      display: flex;
      align-items: stretch;
    }

    /* Navigable label (href) */
    .mobile-nav__label {
      flex: 1;
      display: flex;
      align-items: center;
      padding: 18px 24px;
      font-family: var(--font-display);
      font-size: 12.5px;
      font-weight: 700;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: var(--color-text-primary);
      text-decoration: none;
      transition: color 0.25s, padding-left 0.3s var(--ease-smooth), background 0.25s;
    }
    .mobile-nav__label:hover {
      color: var(--color-accent);
      padding-left: 30px;
      background: rgba(244,98,42,0.02);
    }

    /* Arrow-only toggle (accordion) */
    .mobile-nav__trigger {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 54px;
      flex-shrink: 0;
      border-left: 1px solid var(--color-border);
      background: none;
      color: var(--color-text-muted);
      transition: color 0.25s, background 0.25s;
    }
    .mobile-nav__trigger:hover {
      color: var(--color-accent);
      background: rgba(244,98,42,0.04);
    }
    .mobile-nav__trigger:focus-visible {
      outline: 2px solid var(--color-accent);
      outline-offset: -3px;
    }
    .mobile-nav__arrow {
      width: 16px; height: 16px;
      stroke: currentColor;
      fill: none;
      stroke-width: 1.8;
      stroke-linecap: round;
      stroke-linejoin: round;
      transition: transform 0.4s var(--ease-smooth);
    }
    /* Rotate arrow when item is open */
    .mobile-nav__item.is-open .mobile-nav__arrow {
      transform: rotate(180deg);
    }
    /* Accent label when section open */
    .mobile-nav__item.is-open > .mobile-nav__row > .mobile-nav__label {
      color: var(--color-accent);
    }

    /* Subnav collapse panel */
    .mobile-nav__subnav {
      max-height: 0;
      overflow: hidden;
      transition: max-height 0.5s var(--ease-smooth);
    }
    .mobile-nav__item.is-open .mobile-nav__subnav {
      max-height: 600px;
    }

    /* Subnav links */
    .mobile-nav__sublinks {
      padding: 4px 0 14px;
    }
    .mobile-nav__sublink {
      display: flex;
      align-items: center;
      gap: 12px;
      padding: 11px 24px 11px 42px;
      font-family: var(--font-body);
      font-size: 13.5px;
      color: var(--color-text-secondary);
      text-decoration: none;
      position: relative;
      transition: color 0.25s, padding-left 0.3s var(--ease-smooth), background 0.25s;
    }
    /* Hover sliding line */
    .mobile-nav__sublink::before {
      content: '';
      position: absolute;
      left: 24px;
      top: 50%;
      width: 12px; height: 1px;
      background: var(--color-accent);
      border-radius: 2px;
      transform: translateY(-50%) scaleX(0);
      transform-origin: left;
      opacity: 0;
      transition: transform 0.3s var(--ease-smooth), opacity 0.25s;
    }
    .mobile-nav__sublink:hover {
      color: var(--color-text-primary);
      padding-left: 50px;
      background: rgba(244,98,42,0.03);
    }
    .mobile-nav__sublink:hover::before {
      transform: translateY(-50%) scaleX(1);
      opacity: 1;
    }
    .mobile-nav__sublink-dot {
      width: 4px; height: 4px;
      border-radius: 50%;
      background: var(--color-accent);
      flex-shrink: 0;
      opacity: 0.5;
      transition: opacity 0.25s, transform 0.3s var(--ease-bounce);
    }
    .mobile-nav__sublink:hover .mobile-nav__sublink-dot {
      opacity: 1;
      transform: scale(1.5);
    }

    /* Stagger animation for subnav links when accordion opens */
    .mobile-nav__item.is-open .mobile-nav__sublink {
      animation: sublink-slide-in 0.4s var(--ease-smooth) both;
    }
    .mobile-nav__item.is-open .mobile-nav__sublinks li:nth-child(1) .mobile-nav__sublink { animation-delay: 0.04s; }
    .mobile-nav__item.is-open .mobile-nav__sublinks li:nth-child(2) .mobile-nav__sublink { animation-delay: 0.09s; }
    .mobile-nav__item.is-open .mobile-nav__sublinks li:nth-child(3) .mobile-nav__sublink { animation-delay: 0.14s; }
    .mobile-nav__item.is-open .mobile-nav__sublinks li:nth-child(4) .mobile-nav__sublink { animation-delay: 0.19s; }
    .mobile-nav__item.is-open .mobile-nav__sublinks li:nth-child(5) .mobile-nav__sublink { animation-delay: 0.24s; }
    .mobile-nav__item.is-open .mobile-nav__sublinks li:nth-child(6) .mobile-nav__sublink { animation-delay: 0.29s; }

    @keyframes sublink-slide-in {
      from { opacity: 0; transform: translateX(-12px); }
      to   { opacity: 1; transform: translateX(0); }
    }

    /* ── DIRECT LINKS ── */
    .mobile-nav__direct {
      display: flex;
      align-items: center;
      padding: 18px 24px;
      font-family: var(--font-display);
      font-size: 12.5px;
      font-weight: 700;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: var(--color-text-primary);
      border-bottom: 1px solid var(--color-border);
      text-decoration: none;
      transition: color 0.25s, padding-left 0.3s var(--ease-smooth), background 0.25s;
    }
    .mobile-nav__direct:hover {
      color: var(--color-accent);
      padding-left: 32px;
      background: rgba(244,98,42,0.02);
    }
    .mobile-nav__direct--cta {
      color: var(--color-accent);
      font-size: 12px;
      letter-spacing: 0.18em;
    }
    .mobile-nav__direct--cta .arrow-icon {
      margin-left: auto;
      font-size: 15px;
      display: inline-block;
      transition: transform 0.25s var(--ease-bounce);
    }
    .mobile-nav__direct--cta:hover .arrow-icon {
      transform: translateX(5px);
    }

    /* ── Menu open: stagger items in ── */
    .mobile-menu.is-open .mobile-nav__item,
    .mobile-menu.is-open .mobile-nav__direct,
    .mobile-menu.is-open .mobile-menu__footer {
      animation: menu-item-enter 0.5s var(--ease-smooth) both;
    }
    .mobile-menu.is-open .mobile-nav__item:nth-child(1)  { animation-delay: 0.07s; }
    .mobile-menu.is-open .mobile-nav__item:nth-child(2)  { animation-delay: 0.12s; }
    .mobile-menu.is-open .mobile-nav__item:nth-child(3)  { animation-delay: 0.17s; }
    .mobile-menu.is-open .mobile-nav__direct:nth-child(1){ animation-delay: 0.22s; }
    .mobile-menu.is-open .mobile-nav__direct:nth-child(2){ animation-delay: 0.27s; }
    .mobile-menu.is-open .mobile-nav__direct:nth-child(3){ animation-delay: 0.32s; }
    .mobile-menu.is-open .mobile-menu__footer            { animation-delay: 0.37s; }

    @keyframes menu-item-enter {
      from { opacity: 0; transform: translateX(18px); }
      to   { opacity: 1; transform: translateX(0); }
    }

    /* ── FOOTER ── */
    .mobile-menu__footer {
      padding: 28px 24px 38px;
      border-top: 1px solid var(--color-border);
      display: flex;
      flex-direction: column;
      gap: 20px;
      flex-shrink: 0;
      position: relative;
      z-index: 2;
    }
    .mobile-menu__tagline {
      font-family: var(--font-display);
      font-size: 22px;
      font-weight: 300;
      font-style: italic;
      color: var(--color-text-secondary);
      line-height: 1.35;
    }
    .mobile-menu__tagline strong {
      font-style: normal;
      font-weight: 700;
      color: var(--color-accent);
    }
    .mobile-menu__social {
      display: flex;
      gap: 10px;
    }
    .mobile-menu__social-link {
      width: 36px; height: 36px;
      border-radius: 50%;
      border: 1px solid var(--color-border);
      display: flex;
      align-items: center;
      justify-content: center;
      font-family: var(--font-display);
      font-size: 11px;
      font-weight: 700;
      color: var(--color-text-secondary);
      text-decoration: none;
      transition: all 0.3s var(--ease-smooth);
    }
    .mobile-menu__social-link:hover {
      border-color: var(--color-accent);
      color: var(--color-accent);
      box-shadow: 0 0 14px var(--color-accent-glow);
      transform: translateY(-2px);
    }

    /* ============================================================
       REDUCED MOTION
       ============================================================ */
    @media (prefers-reduced-motion: reduce) {
      .mobile-menu,
      .mobile-menu__backdrop,
      .mobile-nav__subnav,
      .btn-menu-close,
      .btn-theme-toggle .icon-sun,
      .btn-theme-toggle .icon-moon {
        transition-duration: 0.01ms !important;
      }
      .mobile-menu.is-open .mobile-nav__item,
      .mobile-menu.is-open .mobile-nav__direct,
      .mobile-menu.is-open .mobile-menu__footer,
      .mobile-nav__item.is-open .mobile-nav__sublink {
        animation: none !important;
        opacity: 1;
        transform: none;
      }
    }


/* ============================================================
   06. FOOTER
   ============================================================ */

.site-footer { position:relative; background:var(--gradient-hero); color:var(--color-text-inverse); overflow:hidden; isolation:isolate; }
.site-footer::before { content:''; position:absolute; inset-inline:0; top:0; height:1px; background:linear-gradient(90deg, transparent 0%, var(--color-secondary) 20%, var(--color-accent) 50%, var(--color-secondary) 80%, transparent 100%); opacity:0.4; z-index:2; }
.site-footer::after  { content:''; position:absolute; inset-inline:0; bottom:0; height:60%; background:radial-gradient(ellipse 80% 60% at 50% 100%, rgba(244,98,42,0.04) 0%, transparent 70%); pointer-events:none; z-index:0; }
[data-theme="dark"] .site-footer,
.dark-mode .site-footer { background:linear-gradient(160deg, #040810 0%, #060D1A 40%, #0A1428 70%, #070E1B 100%); }

.footer-grid { position:relative; z-index:1; display:grid; grid-template-columns:1.5fr 1fr 1fr 1fr; gap:var(--space-7); padding-block:var(--space-8) var(--space-7); }
.footer-grid > :nth-child(n+2) { position:relative; }
.footer-grid > :nth-child(2)::before,
.footer-grid > :nth-child(3)::before { content:''; position:absolute; inset-block:10% 10%; inset-inline-start:calc(var(--space-7) / -2); width:1px; background:linear-gradient(to bottom, transparent, rgba(255,255,255,0.08) 30%, rgba(255,255,255,0.08) 70%, transparent); }

/* ── Brand Column ── */
.footer-brand { display:flex; flex-direction:column; gap:var(--space-4); padding-inline-end:var(--space-4); opacity:0; transform:translateY(30px); transition:opacity 0.8s var(--ease-smooth), transform 0.8s var(--ease-smooth); }
.footer-brand.is-visible { opacity:1; transform:translateY(0); }
.footer-brand .site-logo { display:inline-flex; align-items:center; gap:10px; text-decoration:none; user-select:none; transition:opacity var(--transition-fast), transform var(--transition-fast); }
.footer-brand .site-logo:hover { opacity:0.85; transform:translateY(-1px); }
.footer-brand .site-logo__wordmark { font-family:var(--font-display); font-size:var(--text-2xl); font-weight:var(--weight-extrabold); letter-spacing:var(--tracking-snug); text-transform:uppercase; color:var(--color-surface); }
.footer-brand .site-logo__wordmark span { color:var(--color-accent); }
.footer-brand p { font-size:var(--text-sm); line-height:var(--leading-relaxed); color:var(--color-dawn); max-width:320px; }

/* ── Social Links ── */
.footer-social { display:flex; align-items:center; gap:var(--space-2); margin-block-start:var(--space-2); }
.footer-social__link { display:inline-flex; align-items:center; justify-content:center; width:40px; height:40px; border-radius:var(--radius-full); border:1px solid rgba(255,255,255,0.1); background:rgba(255,255,255,0.04); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); color:rgba(255,255,255,0.6); font-family:var(--font-display); font-size:var(--text-xs); font-weight:var(--weight-bold); text-decoration:none; will-change:transform; transition:color var(--transition-base), border-color var(--transition-base), background var(--transition-base), transform var(--transition-base), box-shadow var(--transition-base); }
.footer-social__link:hover { color:#fff; border-color:var(--color-accent); background:rgba(244,98,42,0.15); transform:translateY(-3px) scale(1.05); box-shadow:0 0 20px var(--color-accent-glow), 0 4px 16px rgba(0,0,0,0.3); }
.footer-social__link:active { transform:translateY(-1px) scale(0.98); }

/* ── Footer Columns ── */
.footer-col { display:flex; flex-direction:column; gap:var(--space-3); opacity:0; transform:translateY(30px); transition:opacity 0.7s var(--ease-smooth), transform 0.7s var(--ease-smooth); }
.footer-col.is-visible { opacity:1; transform:translateY(0); }
.footer-grid > .footer-col:nth-child(2) { transition-delay:0.1s; }
.footer-grid > .footer-col:nth-child(3) { transition-delay:0.2s; }
.footer-grid > .footer-col:nth-child(4) { transition-delay:0.3s; }

.footer-col h4 { font-family:var(--font-display); font-size:var(--text-sm); font-weight:var(--weight-bold); letter-spacing:var(--tracking-widest); text-transform:uppercase; color:var(--color-text-inverse); margin-block-end:var(--space-2); position:relative; padding-block-end:var(--space-3); }
.footer-col h4::after { content:''; position:absolute; inset-inline-start:0; bottom:0; width:24px; height:2px; background:var(--color-accent); border-radius:var(--radius-full); transition:width var(--transition-base); }
.footer-col:hover h4::after { width:40px; }

.footer-col ul { list-style:none; display:flex; flex-direction:column; gap:var(--space-1); }
.footer-col ul li a { display:inline-flex; align-items:center; gap:var(--space-2); padding:var(--space-1) 0; font-family:var(--font-body); font-size:var(--text-sm); color:rgba(255,255,255,0.5); text-decoration:none; transition:color var(--transition-base), transform var(--transition-base); }
.footer-col ul li a::before { content:'→'; font-size:10px; opacity:0; transform:translateX(-6px); transition:opacity var(--transition-base), transform var(--transition-base); color:var(--color-accent); flex-shrink:0; }
.footer-col ul li a:hover { color:var(--color-text-inverse); transform:translateX(4px); }
.footer-col ul li a:hover::before { opacity:1; transform:translateX(0); }

.footer-col address p { display:flex; align-items:flex-start; gap:var(--space-2); font-size:var(--text-sm); color:rgba(255,255,255,0.5); line-height:var(--leading-relaxed); transition:color var(--transition-base); font-style:normal; }
.footer-col address p:hover { color:rgba(255,255,255,0.75); }
.footer-col address a { color:rgba(255,255,255,0.5); text-decoration:none; transition:color var(--transition-base); }
.footer-col address a:hover { color:var(--color-accent); }

.footer-col .btn-footer { display:inline-flex; align-items:center; gap:var(--space-2); margin-block-start:var(--space-4); padding:var(--space-2) var(--space-4); font-family:var(--font-body); font-size:var(--text-sm); font-weight:var(--weight-semibold); letter-spacing:var(--tracking-wide); color:#fff; background:var(--color-accent); border:none; border-radius:var(--radius-full); text-decoration:none; cursor:pointer; transition:background var(--transition-fast), transform var(--transition-fast), box-shadow var(--transition-fast); }
.footer-col .btn-footer:hover { background:var(--color-accent-hover); transform:translateY(-2px); box-shadow:0 6px 24px var(--color-accent-glow); }

/* ── Newsletter CTA ── */
.footer-cta { position:relative; z-index:1; display:flex; align-items:center; justify-content:space-between; gap:var(--space-6); padding-block:var(--space-5); border-block:1px solid rgba(255,255,255,0.06); margin-block:0 var(--space-5); opacity:0; transform:translateY(20px); transition:opacity 0.7s var(--ease-smooth) 0.35s, transform 0.7s var(--ease-smooth) 0.35s; }
.footer-cta.is-visible { opacity:1; transform:translateY(0); }
.footer-cta__text { font-family:var(--font-display); font-size:var(--text-lg); font-weight:var(--weight-bold); color:var(--color-text-inverse); max-width:400px; }
.footer-cta__text span { color:var(--color-accent); }
.footer-cta__form  { display:flex; align-items:center; gap:var(--space-2); flex-shrink:0; }
.footer-cta__input { width:280px; padding:var(--space-2) var(--space-4); background:rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.12); border-radius:var(--radius-full); font-family:var(--font-body); font-size:var(--text-sm); color:#fff; outline:none; transition:border-color var(--transition-fast), background var(--transition-fast), box-shadow var(--transition-fast); }
.footer-cta__input::placeholder { color:rgba(255,255,255,0.3); }
.footer-cta__input:focus { border-color:var(--color-accent); background:rgba(255,255,255,0.1); box-shadow:0 0 0 3px var(--color-accent-glow); }
.footer-cta__btn { display:inline-flex; align-items:center; justify-content:center; gap:var(--space-2); padding:var(--space-2) var(--space-5); background:var(--color-accent); color:#fff; font-family:var(--font-body); font-size:var(--text-sm); font-weight:var(--weight-semibold); border:none; border-radius:var(--radius-full); cursor:pointer; white-space:nowrap; transition:background var(--transition-fast), transform var(--transition-fast), box-shadow var(--transition-fast); }
.footer-cta__btn:hover { background:var(--color-accent-hover); transform:translateY(-2px); box-shadow:0 6px 24px var(--color-accent-glow); }
.footer-cta__form.is-success .footer-cta__btn { background:#22C55E; pointer-events:none; }

/* ── Bottom Bar ── */
.footer-bottom { position:relative; z-index:1; display:flex; align-items:center; justify-content:space-between; padding-block:var(--space-4) var(--space-5); border-block-start:1px solid rgba(255,255,255,0.06); opacity:0; transform:translateY(16px); transition:opacity 0.6s var(--ease-smooth) 0.4s, transform 0.6s var(--ease-smooth) 0.4s; }
.footer-bottom.is-visible { opacity:1; transform:translateY(0); }
.footer-bottom p { font-size:var(--text-xs); color:rgba(255,255,255,0.35); letter-spacing:var(--tracking-wide); }
.footer-bottom__links { display:flex; align-items:center; gap:var(--space-5); }
.footer-bottom__links a { font-size:var(--text-xs); font-weight:var(--weight-medium); color:rgba(255,255,255,0.4); text-decoration:none; letter-spacing:var(--tracking-wide); transition:color var(--transition-fast), transform var(--transition-fast); }
.footer-bottom__links a:hover { color:var(--color-text-inverse); transform:translateY(-1px); }
.footer-bottom__links a + a::before { content:'·'; margin-inline-end:var(--space-5); color:rgba(255,255,255,0.15); }

/* ── Back to Top ── */
.footer-back-to-top { position:absolute; inset-inline-end:var(--space-7); top:calc(var(--space-8) + var(--space-7)); z-index:2; width:44px; height:44px; border-radius:var(--radius-full); border:1px solid rgba(255,255,255,0.1); background:rgba(255,255,255,0.05); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); color:rgba(255,255,255,0.5); cursor:pointer; display:flex; align-items:center; justify-content:center; opacity:0; transform:translateY(8px); transition:color var(--transition-base), border-color var(--transition-base), background var(--transition-base), transform var(--transition-base), box-shadow var(--transition-base), opacity var(--transition-base); }
.footer-back-to-top.is-visible { opacity:1; transform:translateY(0); }
.footer-back-to-top:hover { color:#fff; border-color:var(--color-accent); background:rgba(244,98,42,0.15); transform:translateY(-3px); box-shadow:0 0 20px var(--color-accent-glow); }
.footer-back-to-top svg { width:18px; height:18px; animation:back-to-top-bounce 2s ease-in-out infinite; }

/* ── Footer Particles ── */
.footer-particles { position:absolute; inset:0; pointer-events:none; overflow:hidden; z-index:0; }
.footer-particle  { position:absolute; border-radius:var(--radius-full); pointer-events:none; will-change:transform, opacity; width:2px; height:2px; background:rgba(212,169,106,0.25); animation:footer-particle-float var(--dur, 12s) ease-in-out infinite var(--delay, 0s); left:var(--x, 50%); top:var(--y, 50%); opacity:0; }
.footer-particles .fp1 { --x:10%; --y:30%; --dur:14s; --delay:0s;  --dx:8px;   --dy:-25px; }
.footer-particles .fp2 { --x:30%; --y:60%; --dur:11s; --delay:-3s; --dx:-6px;  --dy:-20px; }
.footer-particles .fp3 { --x:55%; --y:40%; --dur:16s; --delay:-7s; --dx:12px;  --dy:-35px; }
.footer-particles .fp4 { --x:75%; --y:70%; --dur:13s; --delay:-2s; --dx:-10px; --dy:-28px; }
.footer-particles .fp5 { --x:90%; --y:25%; --dur:10s; --delay:-5s; --dx:6px;   --dy:-18px; }
.footer-particles .fp6 { --x:45%; --y:80%; --dur:15s; --delay:-4s; --dx:-8px;  --dy:-32px; }


/* ============================================================
   07. COMPONENTS
   ============================================================ */

/* ── Buttons ── */
.btn {
  display:inline-flex; align-items:center; justify-content:center;
  gap:var(--space-2); padding:var(--space-2) var(--space-5);
  border:none; border-radius:var(--radius-full);
  font-family:var(--font-body); font-size:var(--text-sm);
  font-weight:var(--weight-semibold); letter-spacing:var(--tracking-wide);
  text-decoration:none; cursor:pointer; position:relative;
  overflow:hidden; white-space:nowrap; isolation:isolate;
  -webkit-user-select:none; user-select:none;
  transition:
    background-color var(--transition-fast),
    color            var(--transition-fast),
    transform        var(--transition-fast),
    box-shadow       var(--transition-fast),
    border-color     var(--transition-fast);
}

.btn-primary { background:var(--color-accent); color:#fff; box-shadow:0 4px 20px var(--color-accent-glow); }
.btn-primary:hover:not(:disabled) { background:var(--color-accent-hover); transform:translateY(-2px) scale(1.02); box-shadow:0 8px 32px var(--color-accent-glow), var(--shadow-glow); }
.btn-primary:active:not(:disabled){ transform:translateY(0) scale(0.98); }

.btn-secondary { background:var(--color-primary); color:#fff; box-shadow:var(--shadow-md); }
.btn-secondary:hover:not(:disabled){ background:var(--color-primary-hover); transform:translateY(-2px); box-shadow:var(--shadow-lg), var(--shadow-blue); }
.btn-secondary:active:not(:disabled){ transform:translateY(0) scale(0.98); }

.btn-outline { background:transparent; color:var(--color-text-primary); border:1.5px solid var(--color-border-strong); }
.btn-outline:hover:not(:disabled){ background:var(--color-surface-2); border-color:var(--color-primary); color:var(--color-primary); transform:translateY(-2px); box-shadow:var(--shadow-sm); }

.btn-outline-accent { background:transparent; color:var(--color-accent); border:1.5px solid var(--color-accent); }
.btn-outline-accent:hover:not(:disabled){ background:var(--color-accent); color:#fff; transform:translateY(-2px); box-shadow:var(--shadow-glow); }

.btn-outline-white { background:transparent; color:#fff; border:1.5px solid rgba(255,255,255,0.5); }
.btn-outline-white:hover:not(:disabled){ background:rgba(255,255,255,0.15); border-color:#fff; transform:translateY(-2px); }

.btn-ghost { background:transparent; color:var(--color-text-primary); padding-inline:var(--space-3); }
.btn-ghost:hover:not(:disabled){ background:var(--color-surface-2); }

.btn-glow { background:var(--gradient-sunset); color:#fff; box-shadow:var(--shadow-glow), 0 4px 20px rgba(244,98,42,0.4); }
.btn-glow:hover:not(:disabled){ transform:translateY(-3px) scale(1.03); box-shadow:var(--shadow-glow), 0 8px 40px rgba(244,98,42,0.55); filter:brightness(1.08); }

.btn-sm   { padding:var(--space-1) var(--space-3); font-size:var(--text-xs); }
.btn-lg   { padding:var(--space-3) var(--space-6); font-size:var(--text-md); }
.btn-xl   { padding:var(--space-4) var(--space-8); font-size:var(--text-lg); font-weight:var(--weight-bold); }
.btn-icon-sm { width:36px; height:36px; padding:0; border-radius:var(--radius-full); }

.btn:disabled,
.btn[aria-disabled="true"] { opacity:0.42; cursor:not-allowed; pointer-events:none; }

.btn.is-loading { pointer-events:none; color:transparent; }
.btn.is-loading::after { content:''; position:absolute; inset:50% auto auto 50%; transform:translate(-50%,-50%); width:16px; height:16px; border:2px solid rgba(255,255,255,0.3); border-top-color:#fff; border-radius:var(--radius-full); animation:spin 0.6s linear infinite; }

.btn .ripple { position:absolute; border-radius:var(--radius-full); background:rgba(255,255,255,0.35); transform:scale(0); animation:ripple-expand 0.55s var(--ease-smooth) forwards; pointer-events:none; }

/* ── Cards ── */
.card { background:var(--color-surface); border-radius:var(--radius-card); overflow:hidden; box-shadow:var(--shadow-md); position:relative; isolation:isolate; transition:transform var(--transition-base), box-shadow var(--transition-base); }

/* Destination Card */
.card-destination { position:relative; overflow:hidden; border-radius:var(--radius-card); cursor:pointer; isolation:isolate; }
.card-destination .card-media { position:relative; overflow:hidden; aspect-ratio:3/4; }
.card-destination .card-media img { width:100%; height:100%; object-fit:cover; transition:transform var(--transition-slow); will-change:transform; }
.card-destination:hover .card-media img { transform:scale(1.08); }
.card-destination .card-overlay { position:absolute; inset:0; background:var(--gradient-card-overlay); transition:opacity var(--transition-base); }
.card-destination:hover .card-overlay { opacity:0.88; }
.card-destination .card-body { position:absolute; inset-inline:0; bottom:0; padding:var(--space-4); color:#fff; }
.card-destination .card-tag { display:inline-flex; align-items:center; gap:var(--space-1); background:rgba(255,255,255,0.18); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); border:1px solid rgba(255,255,255,0.25); padding:var(--space-1) var(--space-2); border-radius:var(--radius-full); font-size:var(--text-xs); font-weight:var(--weight-semibold); letter-spacing:var(--tracking-wider); text-transform:uppercase; margin-block-end:var(--space-2); color:#fff; }
.card-destination .card-title { font-family:var(--font-display); font-size:var(--text-xl); font-weight:var(--weight-bold); color:#fff; margin-block-end:var(--space-2); }
.card-destination .card-meta  { display:flex; align-items:center; justify-content:space-between; font-size:var(--text-sm); color:rgba(255,255,255,0.8); }
.card-destination .card-price { font-family:var(--font-display); font-weight:var(--weight-bold); font-size:var(--text-lg); color:#fff; }

/* Tour Card */
.card-tour { background:var(--color-surface); border-radius:var(--radius-card); overflow:hidden; box-shadow:var(--shadow-md); border:1px solid var(--color-border); cursor:pointer; transition:transform var(--transition-base), box-shadow var(--transition-base); }
.card-tour:hover { transform:translateY(-6px); box-shadow:var(--shadow-xl); border-color:transparent; }
.card-tour .card-media { position:relative; overflow:hidden; aspect-ratio:16/10; }
.card-tour .card-media img { width:100%; height:100%; object-fit:cover; transition:transform var(--transition-slow); }
.card-tour:hover .card-media img { transform:scale(1.07); }
.card-tour .card-badge    { position:absolute; top:var(--space-3); inset-inline-end:var(--space-3); background:var(--color-accent); color:#fff; padding:var(--space-1) var(--space-2); border-radius:var(--radius-full); font-size:var(--text-xs); font-weight:var(--weight-bold); letter-spacing:var(--tracking-wide); text-transform:uppercase; }
.card-tour .card-body     { padding:var(--space-4); }
.card-tour .card-category { font-size:var(--text-xs); font-weight:var(--weight-semibold); letter-spacing:var(--tracking-widest); text-transform:uppercase; color:var(--color-accent); margin-block-end:var(--space-1); }
.card-tour .card-title    { font-size:var(--text-lg); font-weight:var(--weight-bold); line-height:var(--leading-snug); margin-block-end:var(--space-2); }
.card-tour .card-info     { display:flex; gap:var(--space-3); font-size:var(--text-sm); color:var(--color-text-muted); flex-wrap:wrap; margin-block-end:var(--space-3); }
.card-tour .card-info-item{ display:flex; align-items:center; gap:var(--space-1); }
.card-tour .card-footer   { display:flex; align-items:center; justify-content:space-between; padding-block-start:var(--space-3); border-block-start:1px solid var(--color-border); }
.card-tour .card-rating   { display:flex; align-items:center; gap:var(--space-1); font-size:var(--text-sm); font-weight:var(--weight-semibold); }
.card-tour .card-rating .star { color:#F5C842; }

/* Hotel Card */
.card-hotel { display:grid; grid-template-columns:280px 1fr; border-radius:var(--radius-card); overflow:hidden; background:var(--color-surface); box-shadow:var(--shadow-md); cursor:pointer; transition:transform var(--transition-base), box-shadow var(--transition-base); }
.card-hotel:hover { transform:translateY(-4px); box-shadow:var(--shadow-xl); }
.card-hotel .card-media img { width:100%; height:100%; object-fit:cover; transition:transform var(--transition-slow); }
.card-hotel:hover .card-media img { transform:scale(1.06); }
.card-hotel .card-body  { padding:var(--space-4) var(--space-5); display:flex; flex-direction:column; gap:var(--space-2); }
.card-hotel .card-stars { display:flex; gap:2px; color:#F5C842; }
.card-hotel .card-title { font-size:var(--text-xl); font-weight:var(--weight-bold); }
.card-hotel .card-price { font-family:var(--font-display); font-size:var(--text-2xl); font-weight:var(--weight-extrabold); color:var(--color-accent); }

.card-save-btn { position:absolute; top:var(--space-3); inset-inline-start:var(--space-3); width:36px; height:36px; border-radius:var(--radius-full); background:rgba(255,255,255,0.2); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); border:1px solid rgba(255,255,255,0.3); display:flex; align-items:center; justify-content:center; cursor:pointer; color:#fff; transition:background var(--transition-fast), transform var(--transition-fast); }
.card-save-btn:hover  { background:rgba(255,255,255,0.35); transform:scale(1.1); }
.card-save-btn.active { background:var(--color-accent); border-color:var(--color-accent); }

.tilt-card, .card-tilt { transform-style:preserve-3d; transition:transform 0.1s ease; }
.tilt-depth    { transform:translateZ(30px); }
.tilt-depth-sm { transform:translateZ(15px); }
.tilt-depth-lg { transform:translateZ(50px); }

/* ── Booking Form ── */
.booking-form { background:var(--color-surface); border-radius:var(--radius-xl); padding:var(--space-5) var(--space-6); box-shadow:var(--shadow-xl); border:1px solid var(--color-border); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px); }
.booking-form-glass { background:rgba(255,255,255,0.12); border:1px solid rgba(255,255,255,0.2); backdrop-filter:blur(24px); -webkit-backdrop-filter:blur(24px); }
.booking-form-grid  { display:grid; grid-template-columns:repeat(auto-fit, minmax(180px, 1fr)); gap:var(--space-3); align-items:end; }

.form-group  { display:flex; flex-direction:column; gap:var(--space-1); position:relative; }
.form-label  { font-size:var(--text-xs); font-weight:var(--weight-semibold); letter-spacing:var(--tracking-wider); text-transform:uppercase; color:var(--color-text-secondary); display:flex; align-items:center; gap:var(--space-1); }
.form-input, .form-select, .form-textarea {
  width:100%; background:var(--color-surface-2); border:1.5px solid var(--color-border);
  border-radius:var(--radius-md); padding:var(--space-2) var(--space-3);
  font-family:var(--font-body); font-size:var(--text-base); color:var(--color-text-primary);
  outline:none; appearance:none; -webkit-appearance:none;
  transition:border-color var(--transition-fast), box-shadow var(--transition-fast), background var(--transition-fast);
}
.form-input::placeholder, .form-textarea::placeholder { color:var(--color-text-muted); }
.form-input:focus, .form-select:focus, .form-textarea:focus { border-color:var(--color-accent); box-shadow:0 0 0 3px var(--color-accent-glow); background:var(--color-surface); }
.form-input:hover:not(:focus), .form-select:hover:not(:focus) { border-color:var(--color-border-strong); }
.form-select { cursor:pointer; padding-inline-end:var(--space-6); background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%239A9B9E' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right var(--space-2) center; }
.form-input-icon { position:relative; }
.form-input-icon .form-input { padding-inline-start:var(--space-6); }
.form-input-icon .icon { position:absolute; inset-inline-start:var(--space-2); top:50%; transform:translateY(-50%); color:var(--color-text-muted); pointer-events:none; width:18px; height:18px; }

/* ── Badges ── */
.badge { display:inline-flex; align-items:center; gap:4px; padding:3px var(--space-2); border-radius:var(--radius-full); font-size:var(--text-xs); font-weight:var(--weight-semibold); letter-spacing:var(--tracking-wide); white-space:nowrap; }
.badge-primary   { background:var(--color-primary);   color:#fff; }
.badge-accent    { background:var(--color-accent);    color:#fff; }
.badge-secondary { background:var(--color-secondary); color:var(--color-primary); }
.badge-safari    { background:var(--color-safari);    color:#fff; }
.badge-jungle    { background:var(--color-jungle);    color:#fff; }
.badge-outline   { background:transparent; border:1px solid var(--color-border-strong); color:var(--color-text-secondary); }
.badge-glass     { background:rgba(255,255,255,0.18); border:1px solid rgba(255,255,255,0.25); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); color:#fff; }

/* ── Section Headers ── */
.section-header { text-align:center; max-width:680px; margin-inline:auto; margin-block-end:var(--space-7); }
.section-header .overline { display:inline-flex; align-items:center; gap:var(--space-2); margin-block-end:var(--space-2); }
.section-header .overline::before,
.section-header .overline::after { content:''; display:block; width:24px; height:1.5px; background:var(--color-accent); }
.section-header h2 { margin-block-end:var(--space-3); }
.section-header p  { font-size:var(--text-lg); line-height:var(--leading-relaxed); }

/* ── Stats ── */
.stat-item { text-align:center; padding:var(--space-4); }
.stat-item .stat-number { font-family:var(--font-display); font-size:var(--text-4xl); font-weight:var(--weight-black); letter-spacing:var(--tracking-tight); background:var(--gradient-sunset); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; line-height:1; margin-block-end:var(--space-1); }
.stat-item .stat-label  { font-size:var(--text-sm); color:var(--color-text-muted); font-weight:var(--weight-medium); letter-spacing:var(--tracking-wide); text-transform:uppercase; }

/* ── Review Card ── */
.review-card { background:var(--color-surface); border:1px solid var(--color-border); border-radius:var(--radius-xl); padding:var(--space-5); box-shadow:var(--shadow-sm); transition:transform var(--transition-base), box-shadow var(--transition-base); }
.review-card:hover { transform:translateY(-4px); box-shadow:var(--shadow-lg); }
.review-card .review-stars { display:flex; gap:3px; color:#F5C842; margin-block-end:var(--space-3); }
.review-card blockquote { font-size:var(--text-md); line-height:var(--leading-relaxed); font-style:italic; margin-block-end:var(--space-4); }
.review-card .reviewer { display:flex; align-items:center; gap:var(--space-3); }
.review-card .reviewer-avatar { width:48px; height:48px; border-radius:var(--radius-full); object-fit:cover; border:2px solid var(--color-border); }
.review-card .reviewer-info .name   { font-weight:var(--weight-semibold); font-size:var(--text-sm); }
.review-card .reviewer-info .origin { font-size:var(--text-xs); color:var(--color-text-muted); }

/* ── Interaction Utilities ── */
.hover-scale       { transition:transform var(--transition-base); }
.hover-scale:hover { transform:scale(1.04); }
.hover-lift        { transition:transform var(--transition-base), box-shadow var(--transition-base); }
.hover-lift:hover  { transform:translateY(-6px); box-shadow:var(--shadow-xl); }
.hover-lift-sm       { transition:transform var(--transition-base), box-shadow var(--transition-base); }
.hover-lift-sm:hover { transform:translateY(-3px); box-shadow:var(--shadow-lg); }
.hover-zoom { overflow:hidden; }
.hover-zoom img, .hover-zoom .zoom-target { transition:transform var(--transition-slow); will-change:transform; }
.hover-zoom:hover img, .hover-zoom:hover .zoom-target { transform:scale(1.08); }
.hover-underline { position:relative; text-decoration:none; }
.hover-underline::after { content:''; position:absolute; inset-inline:0; bottom:-2px; height:1px; background:currentColor; transform:scaleX(0); transform-origin:right; transition:transform 0.3s var(--ease-smooth); }
.hover-underline:hover::after { transform:scaleX(1); transform-origin:left; }


/* ============================================================
   08. PAGE LOADER
   ============================================================
   Covers: base shell, type switching, all six variants
   (globe, compass, dots, progress, wave, logo), particles,
   and shared UI elements (accent line, text label).
   ============================================================ */

/* ── Shell ── */
.tourixa-loader {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 48px;
  background-image:
    radial-gradient(ellipse 70% 50% at 50% 110%, var(--loader-gold-glow) 0%, transparent 70%),
    radial-gradient(ellipse 40% 35% at 20% 20%, rgba(244, 98, 42, 0.04) 0%, transparent 60%),
    linear-gradient(170deg, var(--loader-bg-deep) 0%, var(--loader-bg-mid) 30%, var(--loader-bg-upper) 55%, var(--color-primary) 100%);
  overflow: hidden;
}

.tourixa-loader::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 70% 65% at 50% 50%, transparent 40%, rgba(6, 13, 26, 0.55) 100%);
  pointer-events: none;
  z-index: 0;
}

.tourixa-loader.is-exiting {
  animation: loader-exit 0.85s var(--ease-smooth) forwards;
  pointer-events: none;
}

.tourixa-loader.is-hidden {
  display: none;
  visibility: hidden;
}

/* ── Content wrapper ── */
.loader-content {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 32px;
}

/* ── Type switching — CSS-only, zero JS needed ── */
.loader-style { display: none; }

.tourixa-loader[data-loader-type="globe"]    .loader-globe,
.tourixa-loader[data-loader-type="compass"]  .loader-compass,
.tourixa-loader[data-loader-type="dots"]     .loader-dots,
.tourixa-loader[data-loader-type="progress"] .loader-progress,
.tourixa-loader[data-loader-type="wave"]     .loader-wave,
.tourixa-loader[data-loader-type="logo"]     .loader-logo {
  display: flex;
}

/* ── Shared UI: text label ── */
.loader-text {
  font-size: 11px;
  font-weight: var(--weight-regular);
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.3);
  font-family: var(--font-body);
  animation: text-fade-in 0.8s ease 1.2s both;
}

/* ── Shared UI: accent line ── */
.loader-accent-line {
  position: absolute;
  bottom: 40px;
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(212, 169, 106, 0.3), transparent);
  animation: accent-line-grow 1.5s var(--ease-smooth) 0.8s both;
}

/* ─────────────────────────────────────────
   GLOBE Variant
   ───────────────────────────────────────── */

.loader-globe__scene {
  position: relative;
  width: 120px;
  height: 120px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.loader-globe__sphere {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  border: 1.5px solid var(--loader-gold);
  position: relative;
  background:
    radial-gradient(circle at 35% 35%, rgba(212, 169, 106, 0.08), transparent 70%),
    radial-gradient(circle at 70% 70%, rgba(10, 37, 64, 0.3), transparent 70%);
  box-shadow:
    inset 0 0 30px rgba(10, 37, 64, 0.5),
    0 0 40px rgba(212, 169, 106, 0.1);
  animation: globe-spin 8s linear infinite;
}

.loader-globe__meridian {
  position: absolute;
  inset: -1px;
  border-radius: 50%;
  border: 1px solid var(--loader-gold-soft);
  transform: rotateY(var(--rotate));
}

.loader-globe__parallel {
  position: absolute;
  left: 5%;
  right: 5%;
  height: 1px;
  background: var(--loader-gold-soft);
  top: calc(50% + var(--offset));
  border-radius: 50%;
}

.loader-globe__orbit {
  position: absolute;
  inset: -12px;
  border-radius: 50%;
  border: 1.5px solid transparent;
  border-top-color: var(--color-accent);
  border-right-color: rgba(244, 98, 42, 0.3);
  animation: orbit-spin 2s linear infinite;
}

.loader-globe__pin {
  position: absolute;
  top: 8px;
  right: 14px;
  color: var(--color-accent);
  filter: drop-shadow(0 0 6px rgba(244, 98, 42, 0.5));
  animation: pin-float 2.5s ease-in-out infinite;
}

.loader-globe__glow {
  position: absolute;
  inset: -20px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(212, 169, 106, 0.06) 0%, transparent 70%);
  animation: glow-breathe 3s ease-in-out infinite;
}

/* ─────────────────────────────────────────
   COMPASS Variant
   ───────────────────────────────────────── */

.loader-compass__body {
  position: relative;
  width: 110px;
  height: 110px;
  border-radius: 50%;
  background: radial-gradient(circle at 30% 30%, rgba(212, 169, 106, 0.1), rgba(10, 37, 64, 0.8));
  border: 1.5px solid var(--loader-gold);
  box-shadow: 0 0 30px rgba(212, 169, 106, 0.08), inset 0 0 20px rgba(0, 0, 0, 0.3);
}

.loader-compass__ring {
  position: absolute;
  inset: 6px;
  border-radius: 50%;
  border: 1px solid rgba(212, 169, 106, 0.2);
}

.loader-compass__tick {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 1px;
  height: 6px;
  background: rgba(212, 169, 106, 0.4);
  transform-origin: 0 -42px;
  transform: translateX(-50%) rotate(var(--tick-rotate));
}

.loader-compass__needle {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  animation: compass-spin 4s ease-in-out infinite;
}

.loader-compass__needle-n,
.loader-compass__needle-s {
  display: block;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;
}

.loader-compass__needle-n {
  bottom: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-bottom: 34px solid var(--color-accent);
  filter: drop-shadow(0 0 4px rgba(244, 98, 42, 0.5));
}

.loader-compass__needle-s {
  top: 0;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 28px solid rgba(212, 169, 106, 0.6);
}

.loader-compass__center {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 0 8px rgba(255, 255, 255, 0.5);
  z-index: 1;
}

.loader-compass__label {
  position: absolute;
  font-size: 9px;
  font-weight: var(--weight-bold);
  letter-spacing: 0.1em;
  color: rgba(212, 169, 106, 0.8);
  font-family: sans-serif;
}

.loader-compass__label--n { top:10px; left:50%; transform:translateX(-50%); color:var(--color-accent); }
.loader-compass__label--s { bottom:10px; left:50%; transform:translateX(-50%); }
.loader-compass__label--e { right:10px; top:50%; transform:translateY(-50%); }
.loader-compass__label--w { left:10px;  top:50%; transform:translateY(-50%); }

/* ─────────────────────────────────────────
   DOTS / ROUTE Variant
   ───────────────────────────────────────── */

.loader-dots__scene {
  position: relative;
  width: 200px;
  height: 60px;
}

.loader-dots__path {
  width: 100%;
  height: 100%;
  overflow: visible;
}

.loader-dots__path-glow { animation: draw-dots-path 2s ease-in-out infinite alternate; }

.loader-dots__point {
  position: absolute;
  left: var(--dot-x);
  top: var(--dot-y);
  transform: translate(-50%, -50%);
}

.loader-dots__dot {
  display: block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--color-accent);
  box-shadow: 0 0 8px rgba(244, 98, 42, 0.5);
}

.loader-dots__pulse {
  display: block;
  position: absolute;
  inset: -4px;
  border-radius: 50%;
  border: 1.5px solid rgba(244, 98, 42, 0.4);
  animation: dot-pulse 2s ease-out infinite;
}

.loader-dots__traveler {
  position: absolute;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 0 10px rgba(255, 255, 255, 0.8);
  top: 20px;
  animation: traveler-move 3s ease-in-out infinite;
}

/* ─────────────────────────────────────────
   PROGRESS BAR Variant
   ───────────────────────────────────────── */

.loader-progress__wrapper {
  position: relative;
  width: 240px;
  overflow: hidden;
  border-radius: var(--radius-md);
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.06);
}

.loader-progress__scene     { position: relative; height: 40px; overflow: hidden; }
.loader-progress__mountains { position: absolute; inset: 0; width: 100%; height: 100%; }

.loader-progress__track {
  position: relative;
  margin: 0 16px 12px;
  height: 3px;
  background: rgba(255, 255, 255, 0.06);
  border-radius: 3px;
  overflow: hidden;
}

.loader-progress__fill {
  height: 100%;
  width: 0;
  border-radius: 3px;
  background: linear-gradient(90deg, var(--color-accent), var(--color-secondary));
  transition: width 0.15s linear;
  box-shadow: 0 0 10px rgba(244, 98, 42, 0.5);
}

.loader-progress__shimmer {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.4), transparent);
  background-size: 200% 100%;
  animation: shimmer 1.5s ease infinite;
}

.loader-progress__glow {
  position: absolute;
  bottom: 11px;
  left: 16px;
  height: 8px;
  width: 20px;
  background: radial-gradient(ellipse, rgba(244, 98, 42, 0.5), transparent 70%);
  filter: blur(3px);
  transition: left 0.15s linear;
}

.loader-progress__info    { display:flex; align-items:center; justify-content:space-between; padding:10px 16px 14px; }
.loader-progress__percent { font-size:11px; font-weight:var(--weight-semibold); letter-spacing:0.1em; color:var(--color-accent); font-variant-numeric:tabular-nums; }

/* ─────────────────────────────────────────
   WAVE / BOAT Variant
   ───────────────────────────────────────── */

.loader-wave__scene {
  position: relative;
  width: 200px;
  height: 80px;
  border-radius: var(--radius-sm);
  overflow: hidden;
}

.loader-wave__svg { position:absolute; inset:0; width:100%; height:100%; }

.loader-wave__path    { animation: wave-shift 2.5s ease-in-out infinite; }
.loader-wave__path--1 { fill:rgba(10, 37, 64, 0.4); animation-delay:0s; }
.loader-wave__path--2 { fill:rgba(10, 37, 64, 0.6); animation-delay:-0.8s; }
.loader-wave__path--3 { fill:rgba(10, 37, 64, 0.8); animation-delay:-1.6s; }

.loader-wave__boat {
  position: absolute;
  top: 20px;
  left: 50%;
  transform: translateX(-50%);
  animation: boat-float 3s ease-in-out infinite;
  z-index: 2;
}

/* ─────────────────────────────────────────
   LOGO Variant
   ───────────────────────────────────────── */

.loader-logo__wordmark {
  display: flex;
  gap: 4px;
  font-size: 42px;
  font-weight: var(--weight-black);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-family: var(--font-display);
}

.loader-logo__letter {
  display: inline-block;
  color: rgba(255, 255, 255, 0.9);
  opacity: 0;
  transform: translateY(30px);
  animation: letter-rise 0.6s var(--ease-smooth) both;
  animation-delay: calc(0.3s + var(--letter-index) * 0.07s);
}

.loader-logo__letter--accent {
  color: var(--color-accent);
  text-shadow: 0 0 20px rgba(244, 98, 42, 0.5);
}

.loader-logo__underline {
  width: 100%;
  height: 2px;
  background: rgba(255, 255, 255, 0.08);
  border-radius: 2px;
  margin-top: 8px;
  overflow: hidden;
}

.loader-logo__underline-fill {
  height: 100%;
  width: 0;
  background: linear-gradient(90deg, var(--color-accent), var(--color-secondary));
  border-radius: 2px;
  animation: underline-draw 0.8s var(--ease-smooth) 1s both;
}

/* ─────────────────────────────────────────
   LOADER PARTICLES
   ───────────────────────────────────────── */

.loader-particles { position:absolute; inset:0; pointer-events:none; z-index:1; overflow:hidden; }

/* Shared base */
.lp { position:absolute; border-radius:50%; pointer-events:none; will-change:transform, opacity; }

.lp-dust  { width:var(--s, 3px); height:var(--s, 3px); background:rgba(212, 169, 106, 0.45); animation:lp-dust  var(--d, 10s) ease-in-out infinite var(--dl, 0s); left:var(--x, 50%); top:var(--y, 80%); opacity:0; }
.lp-spark { width:var(--s, 2px); height:var(--s, 2px); background:rgba(244, 98, 42, 0.7); box-shadow:0 0 6px rgba(244, 98, 42, 0.4); animation:lp-spark var(--d, 6s) ease-in-out infinite var(--dl, 0s); left:var(--x, 50%); top:var(--y, 60%); opacity:0; }
.lp-star  { width:2px; height:2px; background:rgba(255, 255, 255, 0.6); animation:lp-star  var(--d, 4s) ease-in-out infinite var(--dl, 0s); left:var(--x, 50%); top:var(--y, 20%); }
.lp-fog   { width:300px; height:150px; border-radius:50%; filter:blur(60px); background:rgba(212, 169, 106, 0.04); animation:lp-fog var(--d, 20s) ease-in-out infinite alternate var(--dl, 0s); left:var(--x, 10%); top:var(--y, 50%); opacity:0; }

/* Position tokens — dust */
.lp.d1 { --x:5%;  --y:85%; --d:11s; --dl:0s;  --dx:12px;  --dy:-90px;  --s:3px;   }
.lp.d2 { --x:15%; --y:70%; --d:13s; --dl:-3s; --dx:-8px;  --dy:-70px;  --s:2.5px; }
.lp.d3 { --x:25%; --y:90%; --d:9s;  --dl:-5s; --dx:20px;  --dy:-100px; --s:3.5px; }
.lp.d4 { --x:35%; --y:75%; --d:12s; --dl:-2s; --dx:-15px; --dy:-85px;  --s:2px;   }
.lp.d5 { --x:48%; --y:88%; --d:10s; --dl:-7s; --dx:10px;  --dy:-95px;  --s:3px;   }
.lp.d6 { --x:58%; --y:80%; --d:14s; --dl:-4s; --dx:-12px; --dy:-75px;  --s:2.5px; }
.lp.d7 { --x:68%; --y:92%; --d:11s; --dl:-1s; --dx:18px;  --dy:-110px; --s:3px;   }
.lp.d8 { --x:88%; --y:78%; --d:13s; --dl:-3s; --dx:14px;  --dy:-80px;  --s:3.5px; }

/* Position tokens — sparks */
.lp.s1 { --x:20%; --y:55%; --d:7s; --dl:-1s; --dx:10px; --dy:-35px; --s:2px;   }
.lp.s2 { --x:50%; --y:45%; --d:5s; --dl:-3s; --dx:-8px; --dy:-25px; --s:2.5px; }
.lp.s3 { --x:75%; --y:60%; --d:8s; --dl:-5s; --dx:12px; --dy:-40px; --s:2px;   }

/* Position tokens — stars */
.lp.st1 { --x:12%; --y:15%; --d:3.5s; --dl:-1s;   }
.lp.st2 { --x:45%; --y:10%; --d:4s;   --dl:-2.5s; }
.lp.st3 { --x:82%; --y:22%; --d:3s;   --dl:-0.5s; }

/* Position tokens — fog */
.lp.fog1 { --x:5%;  --y:55%; --d:22s; --dl:0s;  }
.lp.fog2 { --x:55%; --y:25%; --d:26s; --dl:-8s; }


/* ============================================================
   09. PAGE TRANSITION
   ============================================================ */

.tourixa-page-transition { position:fixed; inset:0; z-index:9998; pointer-events:none; overflow:hidden; }

.tourixa-page-transition__fill {
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, var(--color-primary) 0%, var(--loader-bg-deep) 100%);
  transform: translateY(100%);
  transition: transform 0.55s var(--ease-smooth);
}

.tourixa-page-transition.is-entering .tourixa-page-transition__fill { transform:translateY(0); }
.tourixa-page-transition.is-exiting  .tourixa-page-transition__fill { transform:translateY(-100%); }

.tourixa-page-transition__line {
  position: absolute;
  inset-inline: 0;
  top: 50%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(244, 98, 42, 0.4), transparent);
  transform: scaleX(0);
  transition: transform 0.4s 0.15s var(--ease-smooth);
}

.tourixa-page-transition.is-entering .tourixa-page-transition__line { transform:scaleX(1); }


/* ============================================================
   10. TRAVEL VISUAL FX
   ============================================================ */

/* ── Cloud Layer ── */
.cloud-layer { position:absolute; inset:0; pointer-events:none; overflow:hidden; z-index:var(--z-base); }
.cloud { position:absolute; background:rgba(255,255,255,0.08); border-radius:50%; filter:blur(40px); animation:cloud-drift linear infinite; will-change:transform; }
.cloud-1 { width:600px; height:200px; top:8%;  inset-inline-start:-200px; animation-duration:60s; opacity:0.6; }
.cloud-2 { width:800px; height:240px; top:22%; inset-inline-start:-400px; animation-duration:90s; animation-delay:-30s; opacity:0.4; }
.cloud-3 { width:500px; height:160px; top:40%; inset-inline-start:-300px; animation-duration:75s; animation-delay:-20s; opacity:0.3; }

/* ── Atmosphere ── */
.atmosphere-overlay  { position:absolute; inset:0; pointer-events:none; z-index:2; }
.atmosphere-glow     { background:radial-gradient(ellipse at 50% 100%, rgba(244,98,42,0.25) 0%, transparent 65%); }
.atmosphere-vignette { background:radial-gradient(ellipse at 50% 50%, transparent 40%, rgba(6,13,26,0.50) 100%); }
.atmosphere-top      { background:linear-gradient(to bottom, rgba(6,13,26,0.5) 0%, transparent 40%); }
.atmosphere-bottom   { background:linear-gradient(to top, rgba(6,13,26,0.7) 0%, transparent 50%); }

/* ── Light Rays ── */
.light-rays { position:absolute; inset:0; overflow:hidden; pointer-events:none; z-index:1; }
.light-ray  { position:absolute; top:-20%; width:1px; height:140%; background:linear-gradient(to bottom, rgba(255,255,255,0.08), transparent); transform-origin:top center; animation:ray-sweep 8s ease-in-out infinite alternate; }
.light-ray:nth-child(1) { inset-inline-start:20%; transform:rotate(-15deg); animation-delay:0s; }
.light-ray:nth-child(2) { inset-inline-start:35%; transform:rotate(-8deg);  animation-delay:-2s; }
.light-ray:nth-child(3) { inset-inline-start:55%; transform:rotate(5deg);   animation-delay:-4s; }
.light-ray:nth-child(4) { inset-inline-start:75%; transform:rotate(12deg);  animation-delay:-1s; }

.horizon-glow { position:absolute; inset-inline:0; bottom:0; height:200px; background:linear-gradient(to top, rgba(244,98,42,0.18) 0%, rgba(212,169,106,0.10) 40%, transparent 100%); pointer-events:none; }
.route-path   { stroke-dasharray:1500; stroke-dashoffset:1500; animation:draw-route 3s var(--ease-smooth) forwards; }

/* ── Travel Particles ── */
.travel-particles { position:absolute; inset:0; pointer-events:none; overflow:hidden; z-index:1; }
.particle         { position:absolute; border-radius:var(--radius-full); pointer-events:none; will-change:transform, opacity; }
.particle-dust    { width:3px; height:3px; background:rgba(212,169,106,0.5); animation:particle-drift var(--dur, 8s) ease-in-out infinite var(--delay, 0s); inset-inline-start:var(--x, 50%); top:var(--y, 50%); }

.travel-particles .p1 { --x:5%;  --y:20%; --dur:7s;  --delay:0s;  --dx:15px;  --dy:-30px; }
.travel-particles .p2 { --x:15%; --y:60%; --dur:9s;  --delay:-2s; --dx:-10px; --dy:-50px; }
.travel-particles .p3 { --x:25%; --y:35%; --dur:6s;  --delay:-4s; --dx:25px;  --dy:-20px; }
.travel-particles .p4 { --x:40%; --y:75%; --dur:8s;  --delay:-1s; --dx:10px;  --dy:-60px; }
.travel-particles .p5 { --x:55%; --y:15%; --dur:10s; --delay:-5s; --dx:-20px; --dy:-35px; }
.travel-particles .p6 { --x:65%; --y:55%; --dur:7s;  --delay:-3s; --dx:30px;  --dy:-25px; }
.travel-particles .p7 { --x:75%; --y:30%; --dur:9s;  --delay:-6s; --dx:-15px; --dy:-45px; }
.travel-particles .p8 { --x:85%; --y:70%; --dur:6s;  --delay:-2s; --dx:20px;  --dy:-30px; }

/* ── Parallax System ── */
.parallax-wrapper { position:relative; overflow:hidden; isolation:isolate; }
.parallax-layer   { position:absolute; inset:-20%; will-change:transform; background-size:cover; background-position:center; background-repeat:no-repeat; }
.parallax-depth-1 { --parallax-speed:0.08; }
.parallax-depth-2 { --parallax-speed:0.15; }
.parallax-depth-3 { --parallax-speed:0.25; }
.parallax-depth-4 { --parallax-speed:0.40; }

.hero-parallax { height:100vh; min-height:600px; position:relative; overflow:hidden; display:flex; align-items:center; }
.hero-parallax .parallax-bg { position:absolute; inset:-15%; background-size:cover; background-position:center; will-change:transform; }
.hero-parallax .hero-content { position:relative; z-index:5; width:100%; }
.img-parallax-wrapper { overflow:hidden; border-radius:var(--radius-card); }
.img-parallax-wrapper img { width:100%; height:120%; object-fit:cover; will-change:transform; display:block; }

/* ── Scroll Sections ── */
.section-hero { min-height:100vh; position:relative; display:flex; align-items:center; background:var(--gradient-hero); overflow:hidden; isolation:isolate; }
.section-hero::after { content:''; position:absolute; inset:0; background:var(--gradient-cinematic); pointer-events:none; z-index:2; }
.section-hero .hero-content { position:relative; z-index:5; }
.section-destinations { padding-block:var(--space-section); background:var(--color-bg); position:relative; }
.section-tours        { padding-block:var(--space-section); background:var(--color-surface-2); position:relative; }
.section-tours::before { content:''; position:absolute; inset-block-start:0; inset-inline:0; height:1px; background:linear-gradient(to right, transparent, var(--color-border), transparent); }
.section-booking      { padding-block:var(--space-section); background:var(--gradient-hero); position:relative; isolation:isolate; }
.section-testimonials { padding-block:var(--space-section); background:var(--color-surface-2); position:relative; }
.section-gallery      { padding-block:var(--space-section); background:var(--color-night); position:relative; overflow:hidden; }

.gallery-grid { display:grid; grid-template-columns:repeat(4, 1fr); grid-template-rows:repeat(2, 240px); gap:var(--space-2); }
.gallery-item { overflow:hidden; border-radius:var(--radius-md); cursor:pointer; position:relative; }
.gallery-item.large { grid-column:span 2; grid-row:span 2; }
.gallery-item img { width:100%; height:100%; object-fit:cover; transition:transform var(--transition-slow); }
.gallery-item:hover img { transform:scale(1.08); }
.gallery-item .gallery-overlay { position:absolute; inset:0; background:rgba(6,13,26,0.5); opacity:0; transition:opacity var(--transition-base); display:flex; align-items:center; justify-content:center; }
.gallery-item:hover .gallery-overlay { opacity:1; }

.section-divider { height:1px; background:linear-gradient(to right, transparent, var(--color-border), transparent); }

.scroll-indicator { position:absolute; bottom:var(--space-5); inset-inline-start:50%; transform:translateX(-50%); z-index:10; display:flex; flex-direction:column; align-items:center; gap:var(--space-2); color:rgba(255,255,255,0.6); animation:float 2.5s ease-in-out infinite; }
.scroll-indicator .mouse { width:24px; height:38px; border:2px solid currentColor; border-radius:12px; position:relative; }
.scroll-indicator .mouse-dot { width:4px; height:8px; background:currentColor; border-radius:var(--radius-full); position:absolute; top:6px; inset-inline-start:50%; transform:translateX(-50%); animation:mouse-scroll 2s ease-in-out infinite; }


/* ============================================================
   11. ANIMATIONS & KEYFRAMES
   ============================================================
   All @keyframes consolidated in one place. No duplicates.
   ============================================================ */

/* ── Reveal Animations — initial hidden states ── */
.anim-fade-up, .anim-fade-in, .anim-scale-in,
.anim-slide-left, .anim-slide-right, .anim-blur-in {
  opacity: 0;
  will-change: transform, opacity, filter;
}
.anim-fade-up    { transform:translateY(40px); }
.anim-scale-in   { transform:scale(0.88); }
.anim-slide-left { transform:translateX(-50px); }
.anim-slide-right{ transform:translateX(50px); }
.anim-blur-in    { filter:blur(12px); }

.anim-fade-up.is-visible     { animation:anim-fade-up     0.8s var(--ease-smooth) forwards; }
.anim-fade-in.is-visible     { animation:anim-fade-in     0.7s var(--ease-smooth) forwards; }
.anim-scale-in.is-visible    { animation:anim-scale-in    0.7s var(--ease-bounce)  forwards; }
.anim-slide-left.is-visible  { animation:anim-slide-left  0.8s var(--ease-smooth)  forwards; }
.anim-slide-right.is-visible { animation:anim-slide-right 0.8s var(--ease-smooth)  forwards; }
.anim-blur-in.is-visible     { animation:anim-blur-in     0.9s var(--ease-smooth)  forwards; }

/* Delay helpers */
.anim-delay-100 { animation-delay:0.10s; } .anim-delay-200 { animation-delay:0.20s; }
.anim-delay-300 { animation-delay:0.30s; } .anim-delay-400 { animation-delay:0.40s; }
.anim-delay-500 { animation-delay:0.50s; } .anim-delay-600 { animation-delay:0.60s; }
.anim-delay-700 { animation-delay:0.70s; } .anim-delay-800 { animation-delay:0.80s; }

/* ── Stagger System ── */
.anim-stagger > * { opacity:0; transform:translateY(30px); }
.anim-stagger.is-visible > * { animation:anim-fade-up 0.7s var(--ease-smooth) both; }
.anim-stagger.is-visible > *:nth-child(1) { animation-delay:0.00s; }
.anim-stagger.is-visible > *:nth-child(2) { animation-delay:0.10s; }
.anim-stagger.is-visible > *:nth-child(3) { animation-delay:0.20s; }
.anim-stagger.is-visible > *:nth-child(4) { animation-delay:0.30s; }
.anim-stagger.is-visible > *:nth-child(5) { animation-delay:0.40s; }
.anim-stagger.is-visible > *:nth-child(6) { animation-delay:0.50s; }
.anim-stagger.is-visible > *:nth-child(7) { animation-delay:0.60s; }
.anim-stagger.is-visible > *:nth-child(8) { animation-delay:0.70s; }
.anim-stagger.is-visible > *:nth-child(n+9) { animation-delay:0.80s; }

.anim-cascade > * { opacity:0; transform:translateX(-20px); }
.anim-cascade.is-visible > * { animation:anim-slide-left 0.6s var(--ease-smooth) both; }
.anim-cascade.is-visible > *:nth-child(1) { animation-delay:0.00s; }
.anim-cascade.is-visible > *:nth-child(2) { animation-delay:0.08s; }
.anim-cascade.is-visible > *:nth-child(3) { animation-delay:0.16s; }
.anim-cascade.is-visible > *:nth-child(4) { animation-delay:0.24s; }
.anim-cascade.is-visible > *:nth-child(5) { animation-delay:0.32s; }

/* ── Hero word reveal ── */
.hero-title-word       { display:inline-block; overflow:hidden; }
.hero-title-word-inner { display:inline-block; animation:word-reveal 0.8s var(--ease-smooth) both; }
.hero-title-word:nth-child(1) .hero-title-word-inner { animation-delay:0.10s; }
.hero-title-word:nth-child(2) .hero-title-word-inner { animation-delay:0.22s; }
.hero-title-word:nth-child(3) .hero-title-word-inner { animation-delay:0.34s; }
.hero-title-word:nth-child(4) .hero-title-word-inner { animation-delay:0.46s; }

/* ── Convenience animation classes ── */
.animate-float       { animation:float        4s ease-in-out infinite; }
.animate-float-slow  { animation:float-slow   6s ease-in-out infinite; }
.animate-pulse       { animation:pulse        2s ease-in-out infinite; }
.animate-spin        { animation:spin         1s linear     infinite; }
.animate-glow-pulse  { animation:glow-pulse   2.5s ease-in-out infinite; }
.animate-breathe     { animation:scale-breathe 3s ease-in-out infinite; }
.animate-plane       { animation:plane-fly    6s var(--ease-smooth) infinite; }

.hero-entrance { animation:hero-enter 1.2s var(--ease-smooth) both; }
.skeleton { background:linear-gradient(90deg, var(--color-surface-2) 0%, var(--color-border) 50%, var(--color-surface-2) 100%); background-size:200% 100%; animation:shimmer 1.5s ease infinite; border-radius:var(--radius-sm); }

/* ═══════════════════════════════════════
   @keyframes — CONSOLIDATED MASTER LIST
   ═══════════════════════════════════════ */

/* Reveal */
@keyframes anim-fade-up    { from { opacity:0; transform:translateY(40px); } to { opacity:1; transform:translateY(0); } }
@keyframes anim-fade-in    { from { opacity:0; }                             to { opacity:1; } }
@keyframes anim-scale-in   { from { opacity:0; transform:scale(0.88); }      to { opacity:1; transform:scale(1); } }
@keyframes anim-slide-left { from { opacity:0; transform:translateX(-50px); }to { opacity:1; transform:translateX(0); } }
@keyframes anim-slide-right{ from { opacity:0; transform:translateX(50px); } to { opacity:1; transform:translateX(0); } }
@keyframes anim-blur-in    { from { opacity:0; filter:blur(12px); }          to { opacity:1; filter:blur(0); } }
@keyframes word-reveal     { from { transform:translateY(110%); opacity:0; } to { transform:translateY(0); opacity:1; } }
@keyframes hero-enter      { from { opacity:0; transform:translateY(60px) scale(0.95); filter:blur(8px); } to { opacity:1; transform:translateY(0) scale(1); filter:blur(0); } }

/* Loader — shell */
@keyframes loader-exit { 0% { opacity:1; transform:scale(1); } 60% { opacity:0.3; } 100% { opacity:0; transform:scale(1.03); } }

/* Loader — Globe */
@keyframes globe-spin   { to { transform:rotateY(360deg); } }
@keyframes orbit-spin   { to { transform:rotate(360deg); } }
@keyframes pin-float    { 0%,100% { transform:translateY(0); }    50% { transform:translateY(-6px); } }
@keyframes glow-breathe { 0%,100% { opacity:0.5; }               50% { opacity:1; } }

/* Loader — Compass */
@keyframes compass-spin {
  0%   { transform:translate(-50%,-50%) rotate(0deg); }
  15%  { transform:translate(-50%,-50%) rotate(-25deg); }
  30%  { transform:translate(-50%,-50%) rotate(10deg); }
  45%  { transform:translate(-50%,-50%) rotate(-8deg); }
  60%  { transform:translate(-50%,-50%) rotate(3deg); }
  75%  { transform:translate(-50%,-50%) rotate(-2deg); }
  100% { transform:translate(-50%,-50%) rotate(360deg); }
}

/* Loader — Dots */
@keyframes draw-dots-path { 0% { stroke-dashoffset:200; } 100% { stroke-dashoffset:0; } }
@keyframes dot-pulse      { 0% { transform:scale(1); opacity:0.8; }    100% { transform:scale(2.5); opacity:0; } }
@keyframes traveler-move  { 0% { left:5px; top:30px; } 50% { left:95px; top:18px; } 100% { left:185px; top:8px; } }

/* Loader — Wave / Boat */
@keyframes wave-shift  { 0%,100% { transform:translateX(0); }                              50% { transform:translateX(-15px); } }
@keyframes boat-float  { 0%,100% { transform:translateX(-50%) translateY(0) rotate(-2deg); } 50% { transform:translateX(-50%) translateY(-5px) rotate(2deg); } }

/* Loader — Logo */
@keyframes letter-rise    { from { opacity:0; transform:translateY(30px); } to { opacity:1; transform:translateY(0); } }
@keyframes underline-draw { from { width:0; } to { width:100%; } }

/* Loader — Shared UI */
@keyframes text-fade-in    { from { opacity:0; transform:translateY(6px); } to { opacity:1; transform:translateY(0); } }
@keyframes accent-line-grow{ from { width:0; } to { width:min(300px, 60vw); } }

/* Loader — Particles */
@keyframes lp-dust  {
  0%   { transform:translate(0,0) scale(0.6); opacity:0; }
  8%   { opacity:0.7; }
  50%  { transform:translate(var(--dx, 15px), var(--dy, -80px)) scale(1); opacity:0.5; }
  90%  { opacity:0.1; }
  100% { transform:translate(calc(var(--dx, 15px)*1.8), calc(var(--dy, -80px)*1.5)) scale(0.7); opacity:0; }
}
@keyframes lp-spark {
  0%   { transform:scale(0); opacity:0; }
  15%  { transform:scale(1.2); opacity:0.9; }
  50%  { transform:scale(0.8) translate(var(--dx, 8px), var(--dy, -30px)); opacity:0.5; }
  100% { transform:scale(0) translate(calc(var(--dx, 8px)*2.5), calc(var(--dy, -30px)*2)); opacity:0; }
}
@keyframes lp-star  { 0%,100% { opacity:0.2; transform:scale(0.8); } 50% { opacity:0.9; transform:scale(1.4); } }
@keyframes lp-fog   { 0% { opacity:0; transform:translateX(-20px) scale(1); } 30% { opacity:0.5; } 70% { opacity:0.4; } 100% { opacity:0; transform:translateX(20px) scale(1.1); } }

/* General purpose */
@keyframes spin          { to { transform:rotate(360deg); } }
@keyframes ripple-expand { to { transform:scale(4); opacity:0; } }
@keyframes pulse         { 0%,100% { opacity:1; }      50% { opacity:0.4; } }
@keyframes float         { 0%,100% { transform:translateY(0); }       50% { transform:translateY(-12px); } }
@keyframes float-slow    { 0%,100% { transform:translateY(0) rotate(0deg); } 33% { transform:translateY(-8px) rotate(1deg); } 66% { transform:translateY(-4px) rotate(-1deg); } }
@keyframes shimmer       { from { background-position:-200% 0; } to { background-position:200% 0; } }
@keyframes glow-pulse    { 0%,100% { box-shadow:0 0 20px var(--color-accent-glow); } 50% { box-shadow:0 0 45px var(--color-accent-glow), 0 0 80px rgba(244,98,42,0.2); } }
@keyframes scale-breathe { 0%,100% { transform:scale(1); }            50% { transform:scale(1.04); } }
@keyframes plane-fly     { 0% { transform:translate(-60px,30px) rotate(-10deg); opacity:0; } 15% { opacity:1; } 85% { opacity:1; } 100% { transform:translate(calc(100vw + 80px),-40px) rotate(5deg); opacity:0; } }
@keyframes cloud-drift   { from { transform:translateX(0); } to { transform:translateX(calc(100vw + 800px)); } }
@keyframes ray-sweep     { from { opacity:0.3; } to { opacity:0.7; } }
@keyframes draw-route    { to { stroke-dashoffset:0; } }
@keyframes particle-drift{ 0% { transform:translate(0,0) scale(1); opacity:0; } 10% { opacity:0.8; } 50% { transform:translate(var(--dx,20px),var(--dy,-40px)) scale(1.2); opacity:0.6; } 90% { opacity:0.2; } 100% { transform:translate(calc(var(--dx,20px)*2),calc(var(--dy,-40px)*2)) scale(0.8); opacity:0; } }
@keyframes mouse-scroll  { 0% { opacity:1; transform:translateX(-50%) translateY(0); } 60% { opacity:0; transform:translateX(-50%) translateY(12px); } 100% { opacity:0; transform:translateX(-50%) translateY(0); } }
@keyframes back-to-top-bounce { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-2px); } }
@keyframes footer-particle-float { 0% { transform:translate(0,0) scale(0.8); opacity:0; } 15% { opacity:0.5; } 50% { transform:translate(var(--dx,10px),var(--dy,-30px)) scale(1); opacity:0.3; } 85% { opacity:0.1; } 100% { transform:translate(calc(var(--dx,10px)*2),calc(var(--dy,-30px)*1.5)) scale(0.6); opacity:0; } }


/* ============================================================
   12. UTILITIES
   ============================================================ */

.hidden       { display:none !important; }
.block        { display:block; }
.inline-block { display:inline-block; }
.inline-flex  { display:inline-flex; }
.sr-only      { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border-width:0; }

.relative { position:relative; } .absolute { position:absolute; } .fixed { position:fixed; } .sticky { position:sticky; }
.inset-0  { inset:0; }
.overflow-hidden { overflow:hidden; } .overflow-x-auto { overflow-x:auto; }
.w-full { width:100%; } .h-full { height:100%; } .min-h-screen { min-height:100vh; }

.object-cover    { object-fit:cover; } .object-contain { object-fit:contain; } .object-center { object-position:center; }
.aspect-square   { aspect-ratio:1/1; } .aspect-video { aspect-ratio:16/9; } .aspect-portrait { aspect-ratio:3/4; } .aspect-wide { aspect-ratio:21/9; }

.rounded-sm   { border-radius:var(--radius-sm); } .rounded-md   { border-radius:var(--radius-md); }
.rounded-lg   { border-radius:var(--radius-lg); } .rounded-xl   { border-radius:var(--radius-xl); }
.rounded-card { border-radius:var(--radius-card); } .rounded-full { border-radius:var(--radius-full); }

.opacity-0  { opacity:0; } .opacity-25 { opacity:0.25; } .opacity-50 { opacity:0.5; } .opacity-75 { opacity:0.75; } .opacity-100 { opacity:1; }
.pointer-events-none { pointer-events:none; } .pointer-events-auto { pointer-events:auto; }

.bg-primary         { background-color:var(--color-primary); }
.bg-accent          { background-color:var(--color-accent); }
.bg-surface         { background-color:var(--color-surface); }
.bg-surface-2       { background-color:var(--color-surface-2); }
.bg-night           { background-color:var(--color-night); }
.bg-gradient-hero   { background:var(--gradient-hero); }
.bg-gradient-sunset { background:var(--gradient-sunset); }
.bg-gradient-safari { background:var(--gradient-safari); }

.text-left    { text-align:start; } .text-center { text-align:center; } .text-right { text-align:end; }
.truncate     { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.line-clamp-2 { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.line-clamp-3 { display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }

.glass      { background:rgba(255,255,255,0.10); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px); border:1px solid rgba(255,255,255,0.15); }
.glass-dark { background:rgba(6,13,26,0.60);    backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px); border:1px solid rgba(255,255,255,0.10); }

.divider          { height:1px; background:var(--color-border); margin-block:var(--space-5); }
.divider-vertical { width:1px; height:auto; background:var(--color-border); margin-inline:var(--space-4); align-self:stretch; }
.overlay-dark     { background:rgba(6,13,26,0.50); }
.overlay-darker   { background:rgba(6,13,26,0.75); }
.overlay-gradient { background:var(--gradient-card-overlay); }
.img-cover        { width:100%; height:100%; object-fit:cover; }

/* Margin */
.mt-0{margin-block-start:var(--space-0)} .mt-1{margin-block-start:var(--space-1)} .mt-2{margin-block-start:var(--space-2)}
.mt-3{margin-block-start:var(--space-3)} .mt-4{margin-block-start:var(--space-4)} .mt-5{margin-block-start:var(--space-5)}
.mt-6{margin-block-start:var(--space-6)} .mt-7{margin-block-start:var(--space-7)} .mt-8{margin-block-start:var(--space-8)}
.mb-0{margin-block-end:var(--space-0)}   .mb-1{margin-block-end:var(--space-1)}   .mb-2{margin-block-end:var(--space-2)}
.mb-3{margin-block-end:var(--space-3)}   .mb-4{margin-block-end:var(--space-4)}   .mb-5{margin-block-end:var(--space-5)}
.mb-6{margin-block-end:var(--space-6)}   .mb-7{margin-block-end:var(--space-7)}   .mb-8{margin-block-end:var(--space-8)}

/* Padding */
.p-1{padding:var(--space-1)} .p-2{padding:var(--space-2)} .p-3{padding:var(--space-3)}
.p-4{padding:var(--space-4)} .p-5{padding:var(--space-5)} .p-6{padding:var(--space-6)}


/* ============================================================
   13. RESPONSIVE BREAKPOINTS
   ============================================================ */

/* ── ≥1440px ── */
@media (min-width:1440px) {
  .container { max-width:var(--container-2xl); padding-inline:var(--gutter-xl); }
  h1, .h1 { font-size:var(--text-cinematic); }
}

/* ── ≤1024px ── */
@media (max-width:1024px) {
  :root {
    --text-hero:    clamp(2.5rem, 6vw, 4rem);
    --text-display: clamp(2rem, 5vw, 3.5rem);
    --space-section:clamp(4rem, 8vw, 7rem);
  }
  .grid-4, .grid-3 { grid-template-columns:repeat(2, 1fr); }
  .container { padding-inline:var(--gutter-md); }
  .booking-form-grid { grid-template-columns:repeat(2, 1fr); }
  .card-hotel  { grid-template-columns:220px 1fr; }
  .gallery-grid { grid-template-columns:repeat(2, 1fr); grid-template-rows:auto; }
  .gallery-item.large { grid-column:span 2; grid-row:span 1; }

  /* Footer */
  .footer-grid { grid-template-columns:1fr 1fr; gap:var(--space-6) var(--space-5); padding-block:var(--space-7) var(--space-6); }
  .footer-grid > :nth-child(2)::before,
  .footer-grid > :nth-child(3)::before { display:none; }
  .footer-brand { grid-column:1/-1; padding-inline-end:0; text-align:center; align-items:center; }
  .footer-brand p { max-width:480px; text-align:center; }
  .footer-social { justify-content:center; }
  .footer-bottom { flex-direction:column; gap:var(--space-3); text-align:center; }
  .footer-cta { flex-direction:column; text-align:center; gap:var(--space-4); }
  .footer-cta__text { max-width:100%; }
  .footer-cta__form { width:100%; max-width:420px; justify-content:center; }
  .footer-cta__input { flex:1; width:auto; }
}

/* ── ≤768px ── */
@media (max-width:768px) {
  :root {
    --text-hero:    clamp(2.2rem, 8vw, 3.2rem);
    --text-display: clamp(1.8rem, 7vw, 2.8rem);
    --space-section:clamp(3rem, 10vw, 5rem);
    --gutter-lg:    var(--space-3);
  }
  .grid-4, .grid-3, .grid-2 { grid-template-columns:1fr; }
  .container { padding-inline:var(--gutter-sm); }
  .booking-form-grid { grid-template-columns:1fr; }
  .booking-form { padding:var(--space-4); border-radius:var(--radius-xl); }
  .card-hotel { grid-template-columns:1fr; }
  .card-hotel .card-media { aspect-ratio:16/9; height:auto; }
  .section-header { margin-block-end:var(--space-5); }
  .anim-fade-up { transform:translateY(20px); }
  .anim-slide-left, .anim-slide-right { transform:translateY(20px); }
  .anim-stagger.is-visible > *:nth-child(n) { animation-delay:0s; }
  .anim-stagger.is-visible > * { animation-duration:0.5s; }
  .cloud-layer, .light-rays, .travel-particles, .cursor-glow { display:none; }

  /* Footer */
  .footer-grid { grid-template-columns:1fr; gap:var(--space-6); padding-block:var(--space-6) var(--space-5); }
  .footer-brand { text-align:center; }
  .footer-brand .site-logo { justify-content:center; }
  .footer-col h4 { cursor:pointer; user-select:none; -webkit-user-select:none; display:flex; align-items:center; justify-content:space-between; }
  .footer-col h4::after { content:''; display:block; width:8px; height:8px; border-inline-end:1.5px solid rgba(255,255,255,0.4); border-block-end:1.5px solid rgba(255,255,255,0.4); transform:rotate(45deg) translateY(-3px); transition:transform var(--transition-base); flex-shrink:0; }
  .footer-col.is-open h4::after { transform:rotate(-135deg) translateY(-3px); }
  .footer-col ul,
  .footer-col address { max-height:0; overflow:hidden; opacity:0; transition:max-height 0.5s var(--ease-smooth), opacity 0.4s var(--ease-smooth), margin 0.3s; margin-block-start:0; }
  .footer-col.is-open ul,
  .footer-col.is-open address { max-height:300px; opacity:1; margin-block-start:var(--space-2); }
  .footer-social { flex-wrap:wrap; justify-content:center; }
  .footer-particles { display:none; }
  .footer-cta__form { flex-direction:column; width:100%; }
  .footer-cta__input,
  .footer-cta__btn { width:100%; }
}

/* ── ≤479px ── */
@media (max-width:479px) {
  :root { --text-hero:clamp(1.9rem, 9vw, 2.8rem); }
  .btn-xl { padding:var(--space-3) var(--space-5); font-size:var(--text-base); }
  .container { padding-inline:var(--space-3); }
  .footer-brand .site-logo__wordmark { font-size:var(--text-xl); }
  .footer-bottom__links { flex-direction:column; gap:var(--space-2); align-items:center; }
  .footer-bottom__links a + a::before { display:none; }
}


/* ============================================================
   14. ACCESSIBILITY — Reduced Motion
   ============================================================ */

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration:      0.01ms !important;
    animation-iteration-count: 1   !important;
    transition-duration:     0.01ms !important;
    scroll-behavior:         auto  !important;
  }

  /* Reveal animations: show immediately */
  .anim-fade-up, .anim-fade-in, .anim-scale-in,
  .anim-slide-left, .anim-slide-right, .anim-blur-in,
  .anim-stagger > *, .anim-cascade > * {
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
  }

  /* Footer reveal: show immediately */
  .footer-brand, .footer-col, .footer-bottom, .footer-cta {
    opacity: 1 !important;
    transform: none !important;
    transition-duration: 0.01ms !important;
  }

  /* Disable decorative animations */
  .animate-float, .animate-float-slow, .animate-pulse,
  .animate-glow-pulse, .animate-breathe, .animate-plane,
  .hero-entrance { animation: none; }

  /* Disable parallax transforms */
  .parallax-layer, .hero-parallax .parallax-bg { transform: none !important; }

  /* Disable card hover zoom */
  .card-destination:hover .card-media img,
  .card-hotel:hover .card-media img,
  .card-tour:hover .card-media img { transform: none; }

  /* Disable button lift */
  .btn:hover { transform: none; }

  /* Disable clouds and particles */
  .cloud { animation: none; opacity: 0.4; }
  .travel-particles, .loader-particles { display: none; }
  .lp, .footer-particle { animation: none !important; display: none !important; }
}


/* ============================================================
   15. RTL SUPPORT
   ============================================================ */

[dir="rtl"] .anim-slide-left  { transform:translateX(50px); }
[dir="rtl"] .anim-slide-right { transform:translateX(-50px); }
[dir="rtl"] .footer-col ul li a::before { content:'←'; }
[dir="rtl"] .footer-col ul li a:hover   { transform:translateX(-4px); }
[dir="rtl"] .footer-brand { padding-inline-end:0; padding-inline-start:var(--space-4); }
[dir="rtl"] .form-select  { background-position:left var(--space-2) center; padding-inline-end:var(--space-3); padding-inline-start:var(--space-6); }
[dir="rtl"] .nav-logo     { letter-spacing:0; }


/* ============================================================
   END — TOURIXA DESIGN SYSTEM v2.0.0
   style.css — Single unified source of truth
   ============================================================ */