/* =========================================================
   BAGHDAD INTERNATIONAL GROUP — CORE DESIGN SYSTEM & STYLES
   ========================================================= */

@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@400;500;600;700;800&family=IBM+Plex+Sans+Arabic:wght@400;500;600;700&family=JetBrains+Mono:wght@500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');

:root {
  --ink: #08233d;
  --ink-2: #103b63;
  --gold: #c59a4a;
  --gold-light: #e4c47d;
  --paper: #fbf8f1;
  --cream: #f1eadc;
  --text: #152231;
  --muted: #4e5d72;
  --line: rgba(8, 35, 61, 0.14);
  --shadow: 0 18px 50px rgba(8, 35, 61, 0.12);
  
  --font-ar: "IBM Plex Sans Arabic", "Cairo", sans-serif;
  --font-en: "Manrope", sans-serif;
  --font-mono: "JetBrains Mono", monospace;
  
  --header-bg: rgba(251, 248, 241, 0.95);
  --card-bg: var(--paper);
}

body.dark {
  --paper: #071827;
  --cream: #0b2135;
  --text: #f5f4ef;
  --muted: #c1cbd7;
  --line: rgba(228, 196, 125, 0.18);
  --shadow: 0 24px 60px rgba(0, 0, 0, 0.36);
  --header-bg: rgba(7, 24, 39, 0.95);
  --card-bg: #0b2033;
}

html, body {
  width: 100%;
  max-width: 100vw;
  overflow-x: hidden !important;
  margin: 0;
  padding: 0;
}

html {
  scroll-behavior: smooth;
  scroll-padding-top: 90px;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

* {
  box-sizing: border-box;
}

body {
  background: var(--paper);
  color: var(--text);
  font-family: var(--font-ar);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  transition: background-color 0.3s ease, color 0.3s ease;
  letter-spacing: normal;
  position: relative;
}

/* Global Full-Page Ultra-Luxurious Islamic Geometric Pattern Background */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  background-image: url("data:image/svg+xml;utf8,<svg width='84' height='84' viewBox='0 0 84 84' xmlns='http://www.w3.org/2000/svg'><g fill='none' stroke='%23c59a4a' stroke-width='0.75' stroke-opacity='0.16'><path d='M42 0 L50.4 16.8 L67.2 8.4 L58.8 25.2 L75.6 33.6 L58.8 42 L75.6 50.4 L58.8 58.8 L67.2 75.6 L50.4 67.2 L42 84 L33.6 67.2 L16.8 75.6 L25.2 58.8 L8.4 50.4 L25.2 42 L8.4 33.6 L25.2 25.2 L16.8 8.4 L33.6 16.8 Z'/><polygon points='42,21 47.25,28.35 56.7,26.25 52.5,34.65 59.85,42 52.5,49.35 56.7,57.75 47.25,55.65 42,63 36.75,55.65 27.3,57.75 31.5,49.35 24.15,42 31.5,34.65 27.3,26.25 36.75,28.35'/><circle cx='42' cy='42' r='10.5'/></g></svg>");
  background-repeat: repeat;
  background-size: 84px 84px;
  opacity: 0.28;
  pointer-events: none;
  z-index: 0;
  will-change: transform;
  transform: translate3d(0, 0, 0);
  animation: globalPatternShift 95s linear infinite;
}

@keyframes globalPatternShift {
  0% { background-position: 0 0; }
  100% { background-position: 84px 84px; }
}

/* 60FPS GPU Hardware Acceleration & Fast Rendering */
header, main, section, footer,
.hero, .subsidiary-card, .service-card, .modal-card, .sub-modal-card {
  position: relative;
  z-index: 1;
}

body.lang-en {
  font-family: var(--font-en);
}

/* Guarantee NO letter spacing breaking Arabic cursive text */
body:not(.lang-en) *, 
body:not(.lang-en) h1, 
body:not(.lang-en) h2, 
body:not(.lang-en) h3, 
body:not(.lang-en) h4, 
body:not(.lang-en) p, 
body:not(.lang-en) span, 
body:not(.lang-en) button, 
body:not(.lang-en) label {
  letter-spacing: normal !important;
}

img, svg, video {
  max-width: 100%;
  height: auto;
}

button, a, input, textarea, select {
  font: inherit;
}

button {
  border: 0;
  background: none;
}

:focus-visible {
  outline: 2px solid var(--gold);
  outline-offset: 3px;
}

/* Layout Container — Dynamic scaling for all screen sizes & zoom levels */
.container {
  width: min(1320px, calc(100% - 48px));
  margin-inline: auto;
}

@media (min-width: 1600px) {
  .container {
    width: min(1520px, calc(100% - 64px));
  }
}

@media (min-width: 2200px) {
  .container {
    width: min(1780px, calc(100% - 80px));
  }
}

.section {
  padding: 105px 0;
  position: relative;
  overflow: hidden;
}

/* LUXURY GOLD GLOW DIVIDERS */
.gold-glow-divider {
  width: 100%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(197, 154, 74, 0.45) 50%, transparent);
  position: relative;
  margin: 0 auto;
}

.gold-glow-divider::after {
  content: "";
  position: absolute;
  top: -12px;
  left: 50%;
  transform: translateX(-50%);
  width: 140px;
  height: 24px;
  background: radial-gradient(ellipse at center, rgba(197, 154, 74, 0.35), transparent 70%);
  pointer-events: none;
}

/* Dynamic Page Background Gradients */
.page-bg {
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: -1;
  background: 
    radial-gradient(circle at 90% 5%, rgba(197, 154, 74, 0.09), transparent 25%),
    radial-gradient(circle at 5% 55%, rgba(16, 59, 99, 0.08), transparent 30%);
  transition: opacity 0.3s ease, background 0.3s ease;
}

body.dark .page-bg {
  background: 
    radial-gradient(circle at 90% 5%, rgba(197, 154, 74, 0.12), transparent 27%),
    radial-gradient(circle at 5% 55%, rgba(16, 59, 99, 0.22), transparent 32%),
    radial-gradient(circle at 50% 100%, rgba(162, 60, 46, 0.04), transparent 35%);
}

/* Header — PERMANENT LUXURY DARK BAR IN ALL MODES */
.site-header {
  position: fixed;
  inset: 0 0 auto;
  z-index: 100;
  width: 100%;
  max-width: 100vw;
  background: rgba(7, 24, 39, 0.96);
  border-bottom: 1px solid rgba(228, 196, 125, 0.22);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.35);
  transition: background-color 0.3s ease, border-color 0.3s ease;
}

.nav-wrap {
  height: 82px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
  gap: 20px;
}

.brand {
  display: flex;
  align-items: center;
  gap: 11px;
  text-decoration: none;
  color: #ffffff;
  min-width: 0;
  flex: none;
}

.brand-mark {
  width: 46px;
  height: 46px;
  border-radius: 50%;
  overflow: hidden;
  border: 1.5px solid var(--gold);
  background: var(--ink);
  flex: none;
  display: grid;
  place-items: center;
}

.brand-mark img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

.brand-copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  line-height: 1.05;
  min-width: 0;
}

.brand-copy strong {
  font-family: var(--font-en);
  font-size: 15px;
  font-weight: 800;
  white-space: nowrap;
  color: #ffffff;
}

body:not(.lang-en) .brand-copy strong {
  font-family: var(--font-ar);
}

.brand-copy small {
  font-family: var(--font-mono);
  font-size: 10.5px;
  letter-spacing: 2px !important;
  color: var(--gold-light);
  text-transform: uppercase;
  margin-top: 4px;
  font-weight: 700;
}

.main-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: clamp(6px, 1.1vw, 18px);
  background: transparent;
  flex: 1 1 auto;
}

.mobile-nav-socials {
  display: none;
}

.main-nav a {
  position: relative;
  color: #e4ebf2;
  text-decoration: none;
  font-size: clamp(11.5px, 0.88vw, 13.5px);
  font-weight: 700;
  white-space: nowrap;
  transition: color 0.2s ease;
}

.main-nav a::after {
  content: "";
  position: absolute;
  inset: auto 0 -7px auto;
  width: 0;
  height: 2px;
  background: var(--gold);
  transition: width 0.2s ease;
}

.main-nav a:hover {
  color: var(--gold-light);
}

.main-nav a:hover::after {
  width: 100%;
}

.header-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: none;
}

.social-links {
  display: flex;
  align-items: center;
  gap: 8px;
}

.social, .control-btn {
  position: relative !important;
  width: 40px;
  height: 40px;
  border: 1px solid rgba(228, 196, 125, 0.35);
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.1);
  color: #ffffff;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  font-size: 14.5px;
  text-decoration: none;
  overflow: hidden !important;
  transition: transform 0.25s ease, background 0.25s ease, color 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;
  -webkit-tap-highlight-color: transparent;
  flex: none;
}

.menu-btn {
  position: relative !important;
  width: 40px;
  height: 40px;
  border: 1px solid rgba(228, 196, 125, 0.35);
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.1);
  color: #ffffff;
  cursor: pointer;
  display: none;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  font-size: 14.5px;
  text-decoration: none;
  overflow: hidden !important;
  transition: transform 0.25s ease, background 0.25s ease, color 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;
  -webkit-tap-highlight-color: transparent;
  flex: none;
}

.social i, .control-btn i, .menu-btn i,
.social span, .control-btn span, .menu-btn span {
  position: absolute !important;
  inset: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1 !important;
  transform: none !important;
  top: 0 !important;
  left: 0 !important;
  text-align: center !important;
}

.facebook i { color: #58a6ff; }
.instagram i { color: #ff7b88; }
.whatsapp i { color: #34d399; }

.facebook { color: #58a6ff; }
.instagram { color: #ff7b88; }
.whatsapp { color: #34d399; }

.social:hover, .control-btn:hover, .menu-btn:hover {
  transform: translateY(-2px);
  border-color: var(--gold);
  box-shadow: 0 4px 14px rgba(197, 154, 74, 0.35);
  background: var(--gold);
  color: #071827;
}

.facebook:hover { border-color: #58a6ff; background: #1877F2; color: #fff; }
.facebook:hover i { color: #fff; }
.instagram:hover { border-color: #ff7b88; background: #E1306C; color: #fff; }
.instagram:hover i { color: #fff; }
.whatsapp:hover { border-color: #34d399; background: #25D366; color: #fff; }
.whatsapp:hover i { color: #fff; }

.theme-toggle .sun { display: flex !important; color: var(--gold-light); font-size: 15px; }
.theme-toggle .moon { display: none !important; color: var(--gold-light); font-size: 15px; }
body.dark .theme-toggle .sun { display: none !important; }
body.dark .theme-toggle .moon { display: flex !important; color: var(--gold-light); font-size: 15px; }

#langToggle { color: var(--gold-light); }
#langToggle .lang-ar { display: flex !important; }
#langToggle .lang-en { display: none !important; }
body.lang-en #langToggle .lang-ar { display: none !important; }
body.lang-en #langToggle .lang-en { display: flex !important; }

.menu-btn { display: none; }

/* Buttons */
.btn {
  min-height: 54px;
  padding: 0 26px;
  border-radius: 15px;
  text-decoration: none;
  border: 1px solid transparent;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 11px;
  font-weight: 800;
  font-size: 14px;
  cursor: pointer;
  transition: transform 0.2s ease, background 0.2s ease, border-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
  -webkit-tap-highlight-color: transparent;
}

.btn-primary {
  background: var(--ink);
  color: #fff;
  box-shadow: 0 14px 32px rgba(8, 35, 61, 0.18);
}

.btn-primary:hover {
  transform: translateY(-2px);
  background: var(--ink-2);
  box-shadow: 0 18px 40px rgba(8, 35, 61, 0.25);
}

body.dark .btn-primary {
  background: #103b63;
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.32);
}

body.dark .btn-primary:hover {
  background: #154a79;
}

.btn-ghost {
  border-color: var(--line);
  color: var(--text);
  background: transparent;
}

.btn-ghost:hover {
  border-color: var(--gold);
  color: var(--gold);
}

/* Typography Hierarchy */
h1, h2, h3, h4, p { margin-top: 0; }
h1, h2, h3, h4 { font-family: var(--font-en); }
body:not(.lang-en) h1, body:not(.lang-en) h2, body:not(.lang-en) h3, body:not(.lang-en) h4 {
  font-family: var(--font-ar);
}

h1 {
  font-size: clamp(44px, 5.5vw, 76px);
  line-height: 1.15;
  margin: 20px 0 24px;
  font-weight: 800;
}

h1 span, h2 span {
  color: var(--gold);
  font-style: normal;
  display: inline-block;
}

.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  color: var(--gold);
  font: 700 11px var(--font-mono);
  letter-spacing: 2.4px !important;
  text-transform: uppercase;
}

.eyebrow::before {
  content: "";
  width: 28px;
  height: 1px;
  background: var(--gold);
  flex: none;
}

/* Hero Section */
.hero {
  padding-top: 150px;
  padding-bottom: 75px;
  min-height: 720px;
  display: flex;
  align-items: center;
  overflow: hidden;
  position: relative;
}

/* Hero Section Background & Radiant Orbs */
.hero-bg-watermark {
  position: absolute;
  inset: 0;
  pointer-events: none;
  overflow: hidden;
  z-index: 0;
}

/* Modern Ultra-Luxurious Islamic Geometric Mesh Pattern */
.islamic-pattern-layer {
  position: absolute;
  inset: 0;
  background-image: url("data:image/svg+xml;utf8,<svg width='80' height='80' viewBox='0 0 80 80' xmlns='http://www.w3.org/2000/svg'><g fill='none' stroke='%23c59a4a' stroke-width='0.8' stroke-opacity='0.22'><path d='M40 0 L48 16 L64 8 L56 24 L72 32 L56 40 L72 48 L56 56 L64 72 L48 64 L40 80 L32 64 L16 72 L24 56 L8 48 L24 40 L8 32 L24 24 L16 8 L32 16 Z'/><polygon points='40,20 45,27 54,25 50,33 57,40 50,47 54,55 45,53 40,60 35,53 26,55 30,47 23,40 30,33 26,25 35,27'/><circle cx='40' cy='40' r='10'/></g></svg>");
  background-repeat: repeat;
  background-size: 80px 80px;
  opacity: 0.45;
  mask-image: radial-gradient(circle at 50% 50%, rgba(0,0,0,0.95) 0%, rgba(0,0,0,0.2) 75%, rgba(0,0,0,0) 100%);
  -webkit-mask-image: radial-gradient(circle at 50% 50%, rgba(0,0,0,0.95) 0%, rgba(0,0,0,0.2) 75%, rgba(0,0,0,0) 100%);
  pointer-events: none;
  animation: islamicPatternShift 80s linear infinite;
}

@keyframes islamicPatternShift {
  0% { background-position: 0 0; }
  100% { background-position: 80px 80px; }
}

.hero-bg-watermark .watermark-orb {
  position: absolute;
  border-radius: 50%;
  filter: blur(90px);
  pointer-events: none;
}

.hero-bg-watermark .orb-1 {
  top: -15%;
  left: 10%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(197, 154, 74, 0.28) 0%, rgba(197, 154, 74, 0) 70%);
  animation: orbPulse 9s ease-in-out infinite alternate;
}

.hero-bg-watermark .orb-2 {
  bottom: -20%;
  right: 5%;
  width: 550px;
  height: 550px;
  background: radial-gradient(circle, rgba(8, 35, 61, 0.75) 0%, rgba(8, 35, 61, 0) 70%);
  animation: orbPulse 11s ease-in-out infinite alternate-reverse;
}

@keyframes watermarkFloat {
  0% {
    transform: translateY(-50%) rotate(-4deg) scale(1);
    opacity: 0.055;
  }
  100% {
    transform: translateY(-54%) rotate(-1deg) scale(1.05);
    opacity: 0.095;
  }
}

@keyframes orbPulse {
  0% { transform: scale(1); opacity: 0.2; }
  100% { transform: scale(1.2); opacity: 0.38; }
}

.hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(380px, 0.9fr);
  gap: 60px;
  align-items: center;
  position: relative;
  z-index: 1;
}

.hero-copy {
  max-width: 650px;
}

.hero-copy > p {
  font-size: clamp(16px, 1.35vw, 18px);
  line-height: 1.95;
  color: var(--muted);
  max-width: 610px;
  font-weight: 500;
}

.hero-actions {
  display: flex;
  gap: 12px;
  margin: 30px 0;
}

.hero-stats {
  display: flex;
  gap: 34px;
  margin-top: 35px;
  font-family: var(--font-mono);
}

.hero-stats div {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 110px;
}

.hero-stats strong {
  color: var(--gold);
  font-size: 16px;
  font-weight: 800;
}

.hero-stats span {
  font-size: 13px;
  color: var(--muted);
  font-weight: 700;
  white-space: nowrap;
}

/* Boarding Pass Hero Ticket Visual */
.hero-visual {
  min-height: 490px;
  position: relative;
  display: grid;
  place-items: center;
  overflow: visible;
}

.boarding-pass {
  position: relative;
  z-index: 2;
  width: min(100%, 390px);
  background: linear-gradient(155deg, var(--ink), #0f3159 70%, var(--ink-2));
  color: #fff;
  border-radius: 22px;
  box-shadow: 0 25px 55px rgba(5, 17, 29, 0.28);
  transform: rotate(-2deg);
  border: 1px solid rgba(228, 196, 125, 0.25);
  overflow: visible;
  transition: box-shadow 0.3s ease, transform 0.3s ease;
}

.bp-main { padding: 30px 30px 22px; }

.bp-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 25px;
  direction: ltr;
}

.hero-logo {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  overflow: hidden;
  border: 2px solid rgba(228, 196, 125, 0.8);
  background: var(--gold);
  flex: none;
}

.hero-logo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.bp-code {
  font: 700 13px var(--font-mono);
  letter-spacing: 2px !important;
  color: var(--gold-light);
  opacity: 0.95;
}

.bp-label {
  display: block;
  font: 700 12px var(--font-mono);
  letter-spacing: 2px !important;
  color: var(--gold-light);
  text-transform: uppercase;
  margin-bottom: 10px;
}

.boarding-pass h3 {
  font-size: 26px;
  line-height: 1.32;
  margin: 0 0 20px;
  font-weight: 800;
}

.bp-route {
  display: flex;
  align-items: center;
  gap: 10px;
  font: 800 14px var(--font-mono);
  letter-spacing: 1px !important;
  color: #dce6f0;
  direction: ltr;
}

.bp-route i {
  flex: 1;
  height: 1px;
  background: repeating-linear-gradient(90deg, rgba(228, 196, 125, 0.6) 0 6px, transparent 6px 11px);
}

.bp-perf {
  position: relative;
  height: 0;
  border-top: 2px dashed rgba(255, 255, 255, 0.22);
}

.bp-perf::before, .bp-perf::after {
  content: "";
  position: absolute;
  top: -11px;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--paper);
  transition: background-color 0.3s ease;
}

.bp-perf::before { left: -11px; }
.bp-perf::after { right: -11px; }

.bp-stub {
  padding: 22px 30px 28px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.bp-stub p {
  margin: 0;
  font: 600 13px var(--font-mono);
  color: #dce6f0;
  line-height: 1.6;
}

.bp-stamp {
  position: relative;
  width: 58px;
  height: 58px;
  flex: none;
  display: grid;
  place-items: center;
  color: var(--gold-light);
  opacity: 0.9;
}

.bp-stamp svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  fill: var(--gold-light);
}

.bp-stamp b {
  font: 700 12px var(--font-mono);
  letter-spacing: 1px !important;
  color: var(--gold-light);
}

/* Continuous 360 Smooth Airplane Orbit Animation Ring */
.hero-orbit {
  position: absolute;
  width: min(440px, 85vw);
  aspect-ratio: 1;
  border: 1.5px dashed rgba(197, 154, 74, 0.4);
  border-radius: 50%;
  pointer-events: none;
  animation: orbitRotate 20s linear infinite;
  display: flex;
  align-items: center;
  justify-content: center;
}

@keyframes orbitRotate {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

.orbit-plane {
  position: absolute;
  top: -14px;
  left: 50%;
  transform: translateX(-50%) rotate(90deg);
  color: var(--gold-light);
  font-size: 18px;
  filter: drop-shadow(0 0 10px rgba(197, 154, 74, 0.9));
}

.floating-chip {
  position: absolute;
  z-index: 4;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 11px 15px;
  box-shadow: var(--shadow);
  font: 700 10px var(--font-mono);
  color: var(--text);
  transition: background-color 0.3s ease, border-color 0.3s ease;
}

.chip-one { top: 10%; right: -1%; }
.chip-two { bottom: 10%; left: -3%; }

/* Ticker Bar */
.ticker {
  width: 100%;
  max-width: 100%;
  overflow: hidden;
  position: relative;
  background: var(--ink);
  padding: 16px 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  direction: ltr !important;
  text-align: left !important;
}

.ticker-track {
  display: flex;
  align-items: center;
  width: max-content;
  will-change: transform;
  animation: ticker 24s linear infinite;
  font: 700 12px var(--font-mono);
  letter-spacing: 3px !important;
  color: var(--gold-light);
  direction: ltr !important;
  text-align: left !important;
}

.ticker-unit {
  display: flex;
  align-items: center;
  gap: 30px;
  flex: none;
  padding-inline-end: 30px;
  direction: ltr !important;
}

.ticker i {
  font-style: normal;
  color: var(--gold);
}

@keyframes ticker {
  0% { transform: translate3d(0, 0, 0); }
  100% { transform: translate3d(-50%, 0, 0); }
}

/* OFFICIAL TRUST BADGES & ACCREDITATIONS BAR */
.trust-bar {
  padding: 24px 0;
  background: var(--card-bg);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.trust-inner {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}

.trust-item {
  display: flex;
  align-items: center;
  gap: 14px;
}

.trust-item i {
  font-size: 26px;
  color: var(--gold);
  flex: none;
}

.trust-item strong {
  display: block;
  font-size: 15.5px;
  font-weight: 800;
  color: var(--text);
}

.trust-item small {
  display: block;
  font-size: 13px;
  color: var(--muted);
  margin-top: 2px;
  font-weight: 600;
}

/* Group Subsidiaries Section */
.subsidiary-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

.subsidiary-card {
  padding: 28px 24px;
  border: 1px solid var(--line);
  border-radius: 24px;
  background: var(--card-bg);
  transition: transform 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;
  display: flex;
  flex-direction: column;
}

.subsidiary-card:hover {
  transform: translateY(-5px);
  border-color: var(--gold);
  box-shadow: var(--shadow);
}

.sub-header {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 14px;
}

.sub-logo-img {
  width: 52px;
  height: 52px;
  object-fit: cover;
  border-radius: 50%;
  border: 2px solid var(--gold);
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.25);
  flex: none;
}

.sub-icon {
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(197, 154, 74, 0.12);
  border: 1px solid var(--gold);
  font-size: 22px;
  color: var(--gold);
  flex: none;
}

.subsidiary-card h3 {
  font-size: 18px;
  margin: 0 0 2px;
  font-weight: 800;
}

.sub-tag {
  display: block;
  font: 800 12px var(--font-mono);
  color: var(--gold);
  letter-spacing: 0.5px !important;
}

.subsidiary-card p {
  font-size: 14.5px;
  line-height: 1.7;
  color: var(--muted);
  font-weight: 500;
  margin: 0;
  flex: 1;
}

.sub-fb-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 16px;
  font-size: 14px;
  font-weight: 700;
  color: var(--gold);
  text-decoration: none;
  transition: color 0.2s ease, transform 0.2s ease;
}

.sub-fb-link:hover {
  color: var(--gold-light);
  transform: translateX(-3px);
}

/* General Two-Column Layout */
.two-col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 75px;
}

.section-heading h2, .section-top h2, .why-content h2, .contact-box h2 {
  font-size: clamp(38px, 4.4vw, 60px);
  line-height: 1.15;
  margin: 17px 0 0;
  font-weight: 800;
}

/* About Section */
.about-copy { padding-top: 40px; }
.about-copy .lead {
  font-size: 22px;
  line-height: 1.8;
  font-weight: 700;
}
.about-copy > p:not(.lead) {
  color: var(--muted);
  font-size: 15px;
  line-height: 2;
  font-weight: 500;
}

.signature {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-top: 30px;
}

.signature span {
  font: 700 23px var(--font-mono);
  color: var(--gold);
  letter-spacing: 1px !important;
}

.signature small {
  color: var(--muted);
  font: 600 11px var(--font-en);
  letter-spacing: 1px !important;
}

.years-badge {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-top: 24px;
  padding-top: 24px;
  border-top: 1px solid var(--line);
}

.years-badge strong {
  font: 800 42px var(--font-en);
  color: var(--gold);
  line-height: 1;
}

.years-badge span {
  color: var(--muted);
  font-size: 13px;
  line-height: 1.7;
  max-width: 180px;
  font-weight: 600;
}

/* Showcase Section & Slider */
.showcase {
  background: var(--cream);
  transition: background-color 0.3s ease;
}

.section-top {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 35px;
  margin-bottom: 32px;
}

.slider {
  position: relative;
}

.slides {
  position: relative;
  height: 560px;
  overflow: hidden;
  border-radius: 24px;
  box-shadow: var(--shadow);
  background: #0d2a48;
  touch-action: pan-y;
  user-select: none;
  cursor: grab;
}

.slides.dragging {
  cursor: grabbing;
}

.slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  transform: scale(1.02);
  transition: opacity 0.45s ease, transform 0.55s ease;
  pointer-events: none;
}

.slide.active {
  opacity: 1;
  transform: none;
  pointer-events: auto;
}

.slide img, .slide video, .slide-media {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.slide::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg, rgba(5, 16, 28, 0.88), rgba(5, 16, 28, 0.08) 58%, transparent 78%);
}

.slide-overlay {
  position: absolute;
  z-index: 2;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 34px;
  display: flex;
  align-items: flex-end;
  gap: 22px;
  color: #fff;
  direction: inherit;
}

.slide-overlay > span {
  font: 700 29px var(--font-mono);
  color: var(--gold-light);
  opacity: 0.7;
}

.slide-overlay h3 {
  font-size: 27px;
  margin: 0 0 8px;
  font-weight: 800;
}

.slide-overlay p {
  margin: 0;
  color: #e4ebf2;
  font-size: 14px;
  line-height: 1.8;
  max-width: 640px;
}

/* Slider Controls */
.slider-btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: rgba(7, 24, 39, 0.5);
  border: 1px solid rgba(228, 196, 125, 0.4);
  color: #ffffff;
  display: grid;
  place-items: center;
  font-size: 16px;
  cursor: pointer;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.28);
  transition: background 0.25s ease, border-color 0.25s ease, transform 0.25s ease, color 0.25s ease, box-shadow 0.25s ease;
  direction: ltr !important;
}

.slider-btn-prev {
  left: 20px;
}

.slider-btn-next {
  right: 20px;
}

.slider-btn:hover {
  background: var(--gold);
  color: #071827;
  border-color: var(--gold);
  transform: translateY(-50%) scale(1.12);
  box-shadow: 0 14px 35px rgba(0, 0, 0, 0.38);
}

body.dark .slider-btn {
  background: rgba(7, 24, 39, 0.7);
  border-color: rgba(228, 196, 125, 0.45);
}

.dots {
  display: flex;
  justify-content: center;
  gap: 8px;
  margin-top: 18px;
  direction: ltr;
}

.dot {
  width: 32px;
  height: 4px;
  background: var(--line);
  cursor: pointer;
  border-radius: 20px;
  border: 0;
  padding: 0;
  transition: background-color 0.3s ease, width 0.3s ease;
}

.dot.active {
  background: var(--gold);
  width: 44px;
}

/* Services Section */
.services {
  background: var(--paper);
  transition: background-color 0.3s ease;
}

.service-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

.service-card {
  position: relative;
  min-height: 330px;
  padding: 32px;
  border: 1px solid var(--line);
  border-radius: 24px;
  background: var(--card-bg);
  color: var(--text);
  transition: transform 0.25s ease, background 0.25s ease, color 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;
}

.service-card:hover {
  transform: translateY(-5px);
  box-shadow: var(--shadow);
  border-color: var(--ink);
  background: var(--ink);
  color: #fff;
}

body.dark .service-card:hover {
  background: #102f4c;
  border-color: var(--gold);
}

.service-icon {
  font-size: 32px;
  color: var(--gold);
  margin-bottom: 22px;
}

.service-card h3 {
  font-size: 21px;
  margin-bottom: 14px;
  font-weight: 800;
}

.service-card p {
  font-size: 14px;
  line-height: 1.9;
  color: var(--muted);
  transition: color 0.2s ease;
  font-weight: 500;
}

.service-card:hover p {
  color: #c9d5e2;
}

.service-card > a {
  color: var(--gold);
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
  display: inline-block;
  margin-top: 10px;
}

/* Section Note Typography Upgrade */
.section-note {
  max-width: 520px;
  color: var(--muted);
  font-size: 16px;
  line-height: 1.95;
  font-weight: 600;
  margin: 0;
}

/* Education & Training Section */
.education {
  background: var(--cream);
  transition: background-color 0.3s ease;
}

.program-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

.program-item {
  min-height: 270px;
  padding: 32px;
  border: 1px solid var(--line);
  border-radius: 24px;
  background: var(--card-bg);
  box-shadow: 0 14px 38px rgba(8, 35, 61, 0.07);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.program-item:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow);
}

.program-item > span {
  display: inline-block;
  margin-bottom: 24px;
  font: 800 14px var(--font-mono);
  color: var(--gold);
}

.program-item h3 {
  margin-bottom: 14px;
  font-size: 22px;
  font-weight: 800;
}

.program-item p {
  margin: 0;
  color: var(--muted);
  font-size: 15px;
  line-height: 1.85;
  font-weight: 500;
}

/* INTERACTIVE COUNTER STATS & KEY FIGURES SECTION */
.stats-counter-section {
  background: var(--ink);
  color: #fff;
  padding: 60px 0;
}

.stats-counter-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 30px;
  text-align: center;
}

.counter-card {
  padding: 24px;
  border: 1px solid rgba(228, 196, 125, 0.2);
  border-radius: 22px;
  background: rgba(255, 255, 255, 0.03);
}

.counter-num {
  font: 800 clamp(36px, 4.5vw, 54px) var(--font-mono);
  color: var(--gold-light);
  line-height: 1;
  margin-bottom: 8px;
}

.counter-card span {
  font-size: 13px;
  font-weight: 700;
  color: #c9d5e2;
}

/* INTERACTIVE DESTINATIONS & ULTRA-LUXURY MAP SECTION */
.destinations {
  background: var(--paper);
  transition: background-color 0.3s ease;
}

.destinations-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

.destination-card {
  border: 1px solid var(--line);
  border-radius: 20px;
  background: var(--card-bg);
  padding: 22px 24px;
  transition: transform 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease, background 0.25s ease;
  position: relative;
}

.destination-card:hover, .destination-card.active {
  border-color: var(--gold);
  box-shadow: 0 16px 40px rgba(8, 35, 61, 0.1);
  background: rgba(197, 154, 74, 0.05);
}

.dest-card-header {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 10px;
}

.dest-flag-img {
  width: 28px;
  height: 18px;
  object-fit: cover;
  border-radius: 4px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.25);
  flex: none;
  display: inline-block;
  vertical-align: middle;
}

.node-flag-img {
  width: 24px;
  height: 16px;
  object-fit: cover;
  border-radius: 3px;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.35);
  flex: none;
  display: inline-block;
  vertical-align: middle;
}

.inline-flag {
  width: 20px;
  height: 14px;
  object-fit: cover;
  border-radius: 3px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
  vertical-align: middle;
  margin-inline-end: 6px;
  display: inline-block;
}

.dest-flag {
  font-size: 32px;
  line-height: 1;
  flex: none;
}

.dest-card-header h3 {
  margin: 0;
  font-size: 18px;
  font-weight: 800;
}

.dest-card-header small {
  display: block;
  color: var(--muted);
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.5px !important;
  margin-top: 2px;
}

.dest-badge {
  margin-inline-start: auto;
  font-size: 12px;
  font-weight: 800;
  padding: 5px 12px;
  border-radius: 999px;
  background: var(--ink);
  color: var(--gold-light);
  white-space: nowrap;
}

body.dark .dest-badge {
  background: var(--gold);
  color: #071827;
}

.destination-card p {
  margin: 0 0 14px;
  font-size: 14.5px;
  line-height: 1.8;
  color: var(--muted);
}

.dest-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

/* INTERACTIVE TAG BUTTONS */
.dest-tag-btn {
  font-size: 12.5px;
  font-weight: 800;
  padding: 6px 13px;
  border-radius: 10px;
  background: rgba(8, 35, 61, 0.07);
  color: var(--ink);
  border: 1px solid var(--line);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  transition: transform 0.2s ease, background 0.2s ease, border-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
  -webkit-tap-highlight-color: transparent;
}

.dest-tag-btn:hover {
  transform: translateY(-2px);
  background: var(--gold);
  border-color: var(--gold);
  color: #071827;
  box-shadow: 0 6px 16px rgba(197, 154, 74, 0.3);
}

body.dark .dest-tag-btn {
  background: rgba(228, 196, 125, 0.12);
  color: var(--gold-light);
  border-color: rgba(228, 196, 125, 0.25);
}

body.dark .dest-tag-btn:hover {
  background: var(--gold);
  color: #071827;
  border-color: var(--gold);
}

/* ULTRA-LUXURY MAP WIDGET CONTAINER */
.destinations-map-wrap {
  position: relative;
  min-height: 520px;
  border: 1px solid rgba(228, 196, 125, 0.35);
  border-radius: 28px;
  background: radial-gradient(circle at 45% 55%, #0e2d4a 0%, #061726 100%);
  overflow: hidden;
  box-shadow: 0 25px 65px rgba(5, 17, 29, 0.45);
}

.map-grid-overlay {
  position: absolute;
  inset: 0;
  background-image: radial-gradient(circle, rgba(228, 196, 125, 0.18) 1.2px, transparent 1.2px);
  background-size: 26px 26px;
  pointer-events: none;
  opacity: 0.7;
}

.map-glow-bg {
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 46% 56%, rgba(197, 154, 74, 0.32), transparent 55%);
  pointer-events: none;
}

.map-routes-svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 2;
}

.map-routes-svg svg {
  width: 100%;
  height: 100%;
}

.route-line {
  fill: none;
  stroke: url(#goldGradient);
  stroke-width: 2.5;
  stroke-dasharray: 6 6;
  animation: dashTravel 25s linear infinite;
  opacity: 0.85;
}

@keyframes dashTravel {
  to { stroke-dashoffset: -200; }
}

/* Flying Jet Plane Indicators along exact curved paths (Outbound & Inbound Round-Trips) */
.map-flying-planes {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 4;
}

.flying-jet {
  position: absolute;
  color: var(--gold-light);
  font-size: 15px;
  filter: drop-shadow(0 0 8px var(--gold));
}

/* CAIRO ROUND-TRIP FLIGHTS */
.jet-egypt-out {
  top: 54%;
  left: 40%;
  transform: rotate(-155deg);
  animation: jetFlyEgyptOut 7s linear infinite;
}

.jet-egypt-in {
  top: 65%;
  left: 14%;
  transform: rotate(25deg);
  animation: jetFlyEgyptIn 7s linear infinite 3.5s;
}

@keyframes jetFlyEgyptOut {
  0% { transform: translate(0, 0) scale(0.9) rotate(-155deg); opacity: 0; }
  15% { opacity: 1; }
  85% { opacity: 1; }
  100% { transform: translate(-165px, 75px) scale(0.9) rotate(-155deg); opacity: 0; }
}

@keyframes jetFlyEgyptIn {
  0% { transform: translate(0, 0) scale(0.9) rotate(25deg); opacity: 0; }
  15% { opacity: 1; }
  85% { opacity: 1; }
  100% { transform: translate(165px, -75px) scale(0.9) rotate(25deg); opacity: 0; }
}

/* TURKEY ROUND-TRIP FLIGHTS */
.jet-turkey-out {
  top: 48%;
  left: 39%;
  transform: rotate(-135deg);
  animation: jetFlyTurkeyOut 6.5s linear infinite;
}

.jet-turkey-in {
  top: 24%;
  left: 30%;
  transform: rotate(45deg);
  animation: jetFlyTurkeyIn 6.5s linear infinite 3.25s;
}

@keyframes jetFlyTurkeyOut {
  0% { transform: translate(0, 0) scale(0.9) rotate(-135deg); opacity: 0; }
  15% { opacity: 1; }
  85% { opacity: 1; }
  100% { transform: translate(-80px, -150px) scale(0.9) rotate(-135deg); opacity: 0; }
}

@keyframes jetFlyTurkeyIn {
  0% { transform: translate(0, 0) scale(0.9) rotate(45deg); opacity: 0; }
  15% { opacity: 1; }
  85% { opacity: 1; }
  100% { transform: translate(80px, 150px) scale(0.9) rotate(45deg); opacity: 0; }
}

/* IRAN ROUND-TRIP FLIGHTS */
.jet-iran-out {
  top: 52%;
  left: 44%;
  transform: rotate(10deg);
  animation: jetFlyIranOut 6s linear infinite;
}

.jet-iran-in {
  top: 55%;
  left: 68%;
  transform: rotate(-170deg);
  animation: jetFlyIranIn 6s linear infinite 3s;
}

@keyframes jetFlyIranOut {
  0% { transform: translate(0, 0) scale(0.9) rotate(10deg); opacity: 0; }
  15% { opacity: 1; }
  85% { opacity: 1; }
  100% { transform: translate(160px, 18px) scale(0.9) rotate(10deg); opacity: 0; }
}

@keyframes jetFlyIranIn {
  0% { transform: translate(0, 0) scale(0.9) rotate(-170deg); opacity: 0; }
  15% { opacity: 1; }
  85% { opacity: 1; }
  100% { transform: translate(-160px, -18px) scale(0.9) rotate(-170deg); opacity: 0; }
}

/* RUSSIA ROUND-TRIP FLIGHTS */
.jet-russia-out {
  top: 46%;
  left: 44%;
  transform: rotate(-50deg);
  animation: jetFlyRussiaOut 7.5s linear infinite;
}

.jet-russia-in {
  top: 16%;
  left: 65%;
  transform: rotate(130deg);
  animation: jetFlyRussiaIn 7.5s linear infinite 3.75s;
}

@keyframes jetFlyRussiaOut {
  0% { transform: translate(0, 0) scale(0.9) rotate(-50deg); opacity: 0; }
  15% { opacity: 1; }
  85% { opacity: 1; }
  100% { transform: translate(150px, -180px) scale(0.9) rotate(-50deg); opacity: 0; }
}

@keyframes jetFlyRussiaIn {
  0% { transform: translate(0, 0) scale(0.9) rotate(130deg); opacity: 0; }
  15% { opacity: 1; }
  85% { opacity: 1; }
  100% { transform: translate(-150px, 180px) scale(0.9) rotate(130deg); opacity: 0; }
}

/* Map Nodes & Glass Cards Layout */
.map-interactive-nodes {
  position: absolute;
  inset: 0;
  z-index: 5;
}

.map-node {
  position: absolute;
  display: flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  transition: transform 0.3s ease;
  user-select: none;
}

.map-node:hover, .map-node.active {
  transform: scale(1.08);
  z-index: 10;
}

.beacon-pin {
  position: relative;
  width: 20px;
  height: 20px;
  display: grid;
  place-items: center;
  flex: none;
}

.beacon-pin .pulse-ring {
  position: absolute;
  inset: -4px;
  border-radius: 50%;
  border: 1.5px solid var(--gold);
  animation: hqBeaconPulse 2.4s infinite ease-out;
}

.node-baghdad {
  top: 52%;
  left: 42%;
  flex-direction: column;
  align-items: center;
}

.node-cairo {
  top: 67%;
  left: 12%;
}

.node-turkey {
  top: 21%;
  left: 28%;
}

.node-iran {
  top: 56%;
  left: 71%;
}

.node-moscow {
  top: 13%;
  left: 68%;
}

/* Dot indicator */
.node-dot {
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: var(--gold);
  border: 3px solid #071827;
  box-shadow: 0 0 12px var(--gold);
  flex: none;
}

.map-node:hover .node-dot, .map-node.active .node-dot {
  background: #fff;
  box-shadow: 0 0 20px var(--gold-light);
}

/* HQ Beacon Animation */
.hq-beacon {
  position: relative;
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  margin-bottom: 4px;
}

.pulse-core {
  font-size: 14px;
  color: var(--gold-light);
  z-index: 2;
}

.pulse-ring {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  border: 1.5px solid var(--gold);
  animation: hqBeaconPulse 2s infinite ease-out;
}

.pulse-ring.r2 {
  animation-delay: 0.6s;
}

@keyframes hqBeaconPulse {
  0% { transform: scale(0.4); opacity: 1; }
  100% { transform: scale(2.2); opacity: 0; }
}

/* Glass Card Badge */
.node-glass-card {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 14px;
  background: rgba(10, 32, 53, 0.86);
  border: 1px solid rgba(228, 196, 125, 0.35);
  border-radius: 14px;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.35);
  color: #fff;
  transition: border-color 0.3s ease, background 0.3s ease, box-shadow 0.3s ease;
  white-space: nowrap;
}

.hq-card {
  background: linear-gradient(135deg, rgba(197, 154, 74, 0.3), rgba(10, 32, 53, 0.95));
  border: 1.5px solid var(--gold);
  box-shadow: 0 12px 30px rgba(197, 154, 74, 0.35);
}

.map-node:hover .node-glass-card, .map-node.active .node-glass-card {
  border-color: var(--gold);
  background: rgba(16, 50, 80, 0.95);
  box-shadow: 0 12px 32px rgba(197, 154, 74, 0.4);
}

.node-flag {
  font-size: 20px;
  flex: none;
}

.node-glass-card strong {
  display: block;
  font-size: 14.5px;
  font-weight: 800;
  color: #ffffff;
  line-height: 1.2;
}

.hq-star {
  font-size: 11.5px;
  font-weight: 800;
  color: var(--gold-light);
  background: rgba(197, 154, 74, 0.25);
  padding: 2px 7px;
  border-radius: 6px;
  margin-inline-start: 4px;
  vertical-align: middle;
}

.node-glass-card small {
  display: block;
  font-size: 11.5px;
  font-weight: 700;
  color: var(--gold-light);
  font-family: var(--font-mono);
  margin-top: 2px;
  opacity: 0.9;
}

/* SERVICE QUICK REQUEST MODAL */
.modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 999;
  background: rgba(7, 24, 39, 0.75);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  display: grid;
  place-items: center;
  padding: 20px;
  opacity: 1;
  transition: opacity 0.3s ease;
}

.modal-backdrop.hidden {
  display: none !important;
  opacity: 0;
  pointer-events: none;
}

/* Hide floating WhatsApp button and Back to Top button when ANY modal is open */
body.modal-open .floating-whatsapp,
body.modal-open #floatingTop,
body.modal-open .floating-top,
.modal-backdrop:not(.hidden) ~ .floating-whatsapp,
.modal-backdrop:not(.hidden) ~ #floatingTop,
.modal-backdrop:not(.hidden) ~ .floating-top {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* Service Quick Request Modal Styling (Unified Dark Navy & Gold) */
.modal-card {
  position: relative;
  width: min(540px, 92vw) !important;
  max-height: min(620px, 78vh) !important;
  overflow-y: auto;
  overflow-x: hidden;
  background: #081a29 !important;
  color: #ffffff !important;
  border: 1.5px solid var(--gold, #c59a4a) !important;
  border-radius: 20px;
  padding: 20px 18px !important;
  box-shadow: 0 30px 90px rgba(0, 0, 0, 0.85), 0 0 40px rgba(197, 154, 74, 0.2);
  transform: translateY(0);
  transition: transform 0.3s ease;
  box-sizing: border-box !important;
  margin: auto !important;
}

/* Custom Slim Scrollbar for Modal Card */
.modal-card::-webkit-scrollbar {
  width: 6px;
}

.modal-card::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0.03);
  border-radius: 10px;
  margin: 12px 0;
}

.modal-card::-webkit-scrollbar-thumb {
  background: rgba(197, 154, 74, 0.5);
  border-radius: 10px;
}

.modal-card::-webkit-scrollbar-thumb:hover {
  background: var(--gold);
}

/* Explicit Close Button Position */
.modal-close {
  position: absolute;
  top: 22px !important;
  left: 22px !important;
  right: auto !important;
  z-index: 999 !important;
  width: 38px !important;
  height: 38px !important;
  border-radius: 50%;
  border: 1px solid rgba(197, 154, 74, 0.5);
  background: rgba(255, 255, 255, 0.12);
  color: #ffffff !important;
  font-size: 16px;
  font-weight: 700;
  cursor: pointer !important;
  display: grid;
  place-items: center;
  transition: all 0.2s ease;
  pointer-events: auto !important;
}

body.lang-en .modal-close {
  left: auto !important;
  right: 22px !important;
}

.modal-close:hover {
  background: var(--gold, #c59a4a);
  color: #071827 !important;
  transform: scale(1.1);
}

/* Header Padding Fix: In RTL, close button is at LEFT: 22px. In LTR (English), close button is at RIGHT: 22px */
.modal-header {
  margin-bottom: 22px !important;
  padding-left: 56px !important;
  padding-right: 0 !important;
  position: relative;
}

body.lang-en .modal-header {
  padding-left: 0 !important;
  padding-right: 56px !important;
  text-align: left !important;
}

.modal-header h3 {
  font-size: 20px !important;
  margin: 0 0 6px !important;
  font-weight: 800 !important;
  color: #ffffff !important;
  line-height: 1.35 !important;
  word-break: break-word !important;
  overflow-wrap: break-word !important;
}

.modal-header h3 span {
  color: var(--gold-light, #e4c47d) !important;
}

.modal-header p {
  margin: 0 !important;
  font-size: 13.5px !important;
  color: #94a3b8 !important;
  line-height: 1.5 !important;
}

.modal-form {
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: 100%;
  box-sizing: border-box !important;
}

.form-row {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
  width: 100%;
  box-sizing: border-box !important;
}

@media (max-width: 640px) {
  .modal-backdrop {
    padding: 75px 10px 20px !important;
  }
  .form-row {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }
  .modal-card {
    padding: 18px 14px !important;
    width: 92vw !important;
    max-height: calc(82vh - 60px) !important;
  }
  .sub-modal-card {
    width: 92vw !important;
    max-height: calc(82vh - 60px) !important;
    border-radius: 18px !important;
  }
  .sub-modal-hero {
    padding: 32px 14px 10px !important;
  }
  .sub-modal-hero-meta h3 {
    font-size: 15.5px !important;
  }
  .sub-modal-body-scroll {
    padding: 12px 14px !important;
    gap: 10px !important;
  }
  .sub-modal-services-grid,
  .sub-modal-phones-grid {
    grid-template-columns: 1fr !important;
  }
  .sub-modal-footer {
    padding: 10px 14px !important;
    flex-direction: column !important;
    gap: 6px !important;
  }
}

.modal-form label {
  display: flex;
  flex-direction: column;
  gap: 6px;
  width: 100%;
  box-sizing: border-box !important;
}

.modal-form label span {
  font-size: 13px !important;
  font-weight: 700 !important;
  color: var(--gold-light, #e4c47d) !important;
  word-break: break-word;
}

.modal-form input, 
.modal-form textarea, 
.modal-form select {
  width: 100% !important;
  box-sizing: border-box !important;
  border: 1.5px solid rgba(197, 154, 74, 0.4) !important;
  background: #092136 !important;
  color: #ffffff !important;
  border-radius: 14px !important;
  padding: 12px 16px !important;
  font: 600 14px var(--font-ar) !important;
  outline: 0;
  transition: all 0.25s ease;
  box-shadow: inset 0 2px 6px rgba(0, 0, 0, 0.25);
  height: 48px;
}

body.lang-en .modal-form input,
body.lang-en .modal-form textarea,
body.lang-en .modal-form select {
  font-family: var(--font-en) !important;
}

.modal-form textarea {
  height: auto !important;
  min-height: 80px !important;
  padding: 12px 16px !important;
  resize: vertical;
}

/* Custom Golden Chevron (fa-chevron-down) for Select Inputs */
.modal-form select,
select.form-control {
  appearance: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23c59a4a' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'></polyline></svg>") !important;
  background-repeat: no-repeat !important;
  background-position: left 16px center !important;
  background-size: 16px 16px !important;
  padding-left: 44px !important;
  padding-right: 16px !important;
  cursor: pointer !important;
}

body.lang-en .modal-form select,
body.lang-en select.form-control {
  background-position: right 16px center !important;
  padding-right: 44px !important;
  padding-left: 16px !important;
}

.modal-form select option {
  background: #071827 !important;
  color: #ffffff !important;
  padding: 12px;
  font-weight: 600;
}

.modal-form input:focus, 
.modal-form textarea:focus, 
.modal-form select:focus {
  border-color: var(--gold, #c59a4a) !important;
  box-shadow: 0 0 0 4px rgba(197, 154, 74, 0.22), 0 6px 18px rgba(0, 0, 0, 0.4) !important;
  background: #0d2c47 !important;
}

.modal-actions {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  margin-top: 10px !important;
  width: 100%;
  box-sizing: border-box !important;
}

@media (max-width: 520px) {
  .modal-actions {
    flex-direction: column !important;
    gap: 10px !important;
  }
}

.modal-actions .btn-primary {
  flex: 1 !important;
  height: 48px !important;
  background: linear-gradient(135deg, var(--gold), #d4aa59) !important;
  color: #071827 !important;
  font-weight: 800 !important;
  font-size: 14.5px !important;
  border: none !important;
  border-radius: 14px !important;
  box-shadow: 0 4px 16px rgba(197, 154, 74, 0.35) !important;
  cursor: pointer !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-decoration: none !important;
}

.modal-actions .btn-primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 22px rgba(197, 154, 74, 0.5) !important;
}

.modal-wa-btn {
  flex: 1 !important;
  height: 48px !important;
  background: #25D366 !important;
  color: #ffffff !important;
  border: none !important;
  font-weight: 800 !important;
  font-size: 14.5px !important;
  border-radius: 14px !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  gap: 8px !important;
}

.modal-wa-btn:hover {
  background: #20b858 !important;
  transform: translateY(-2px);
}

/* SERVICE QUICK REQUEST MODAL & SUB DETAILS MODAL BACKDROP */
.modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 9999999 !important;
  background: rgba(7, 24, 39, 0.88);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 85px 16px 30px !important;
  opacity: 1;
  transition: opacity 0.3s ease;
  overflow-y: auto;
  box-sizing: border-box !important;
}

.modal-backdrop.hidden {
  display: none !important;
  opacity: 0;
  pointer-events: none;
}

/* Hide floating WhatsApp button and Back to Top button when ANY modal is open */
body.modal-open .floating-whatsapp,
body.modal-open #floatingTop,
body.modal-open .floating-top,
.modal-backdrop:not(.hidden) ~ .floating-whatsapp,
.modal-backdrop:not(.hidden) ~ #floatingTop,
.modal-backdrop:not(.hidden) ~ .floating-top {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* Ultra-Premium Glassmorphic Subsidiary Details Modal v3 */
.sub-modal-card {
  position: relative;
  width: min(540px, 92vw) !important;
  max-height: min(620px, 78vh) !important;
  background: #081a29 !important;
  color: #ffffff !important;
  border: 1.5px solid var(--gold, #c59a4a) !important;
  border-radius: 20px;
  box-shadow: 0 30px 90px rgba(0, 0, 0, 0.85), 0 0 40px rgba(197, 154, 74, 0.2);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  animation: subModalScaleUp 0.3s cubic-bezier(0.16, 1, 0.3, 1);
  box-sizing: border-box !important;
  margin: auto !important;
}

@keyframes subModalScaleUp {
  0% { transform: scale(0.94) translateY(14px); opacity: 0; }
  100% { transform: scale(1) translateY(0); opacity: 1; }
}

/* Explicit High-Z-Index Close Button */
.sub-modal-close-btn {
  position: absolute;
  top: 10px !important;
  left: 10px !important;
  right: auto !important;
  z-index: 99999 !important;
  width: 32px !important;
  height: 32px !important;
  border-radius: 50%;
  border: 1px solid rgba(197, 154, 74, 0.6);
  background: rgba(7, 24, 39, 0.95);
  color: #ffffff !important;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer !important;
  display: grid;
  place-items: center;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.5);
  transition: all 0.2s ease;
  pointer-events: auto !important;
}

body.lang-en .sub-modal-close-btn {
  left: auto !important;
  right: 10px !important;
}

.sub-modal-close-btn:hover {
  background: var(--gold, #c59a4a);
  color: #071827 !important;
  transform: scale(1.08);
}

/* Modal Hero Top Header */
.sub-modal-hero {
  position: relative;
  padding: 34px 16px 12px !important;
  background: linear-gradient(135deg, rgba(197, 154, 74, 0.22), #071827);
  border-bottom: 1px solid rgba(197, 154, 74, 0.3);
  flex-shrink: 0;
}

.sub-modal-hero-content {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
}

.sub-modal-logo-wrapper {
  position: relative;
  flex-shrink: 0;
}

.sub-modal-logo {
  width: 50px;
  height: 50px;
  border-radius: 14px;
  object-fit: cover;
  border: 2px solid var(--gold);
  background: #000;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.5);
}

.logo-verified-badge {
  position: absolute;
  bottom: -3px;
  right: -3px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: var(--gold);
  color: #071827;
  display: grid;
  place-items: center;
  font-size: 9px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.4);
}

body.lang-en .logo-verified-badge {
  right: auto;
  left: -3px;
}

.sub-modal-hero-meta {
  display: flex;
  flex-direction: column;
  gap: 3px;
  flex: 1;
  min-width: 0;
  padding-left: 32px;
}

body.lang-en .sub-modal-hero-meta {
  padding-left: 0;
  padding-right: 32px;
}

.sub-modal-hero-meta h3 {
  margin: 0 !important;
  font-size: 16px !important;
  font-weight: 800 !important;
  color: #ffffff !important;
  line-height: 1.3 !important;
  word-break: break-word !important;
}

.sub-modal-sub-tag {
  font-size: 12.5px !important;
  color: var(--gold-light, #e4c47d) !important;
  font-weight: 600 !important;
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

.sub-modal-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 6px !important;
}

.sub-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 3px 9px;
  border-radius: 12px;
  background: rgba(197, 154, 74, 0.18);
  border: 1px solid rgba(197, 154, 74, 0.4);
  color: var(--gold-light, #e4c47d) !important;
  font-size: 11px;
  font-weight: 700;
}

/* Modal Body Scroll Container */
.sub-modal-body-scroll {
  padding: 18px 22px !important;
  overflow-y: auto !important;
  display: flex;
  flex-direction: column;
  gap: 16px;
  flex: 1 1 auto;
  min-height: 0 !important;
  background: #081a29 !important;
}

.sub-modal-body-scroll::-webkit-scrollbar {
  width: 6px;
}

.sub-modal-body-scroll::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0.03);
  border-radius: 10px;
  margin: 12px 0;
}

.sub-modal-body-scroll::-webkit-scrollbar-thumb {
  background: rgba(197, 154, 74, 0.5);
  border-radius: 10px;
}

.sub-modal-body-scroll::-webkit-scrollbar-thumb:hover {
  background: var(--gold);
}

.sub-modal-block {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.block-title-row {
  display: flex;
  align-items: center;
  gap: 8px;
}

.block-icon-i {
  color: var(--gold, #c59a4a) !important;
  font-size: 15px;
}

.block-title-row h4 {
  margin: 0;
  font-size: 14px;
  font-weight: 800;
  color: var(--gold-light, #e4c47d) !important;
}

.sub-modal-desc-text {
  font-size: 13.5px;
  line-height: 1.8;
  color: #e4ebf5 !important;
  margin: 0;
  background: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid rgba(197, 154, 74, 0.25) !important;
  border-radius: 14px;
  padding: 12px 16px;
}

/* Core Services Feature Cards */
.sub-modal-services-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 8px;
}

.sub-service-feature-card {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding: 10px 12px;
  background: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid rgba(197, 154, 74, 0.2) !important;
  border-radius: 12px;
  color: #ffffff !important;
  font-size: 12.5px;
  line-height: 1.55;
  transition: border-color 0.2s ease, background 0.2s ease;
}

.sub-service-feature-card:hover {
  background: rgba(197, 154, 74, 0.1) !important;
  border-color: rgba(197, 154, 74, 0.45) !important;
}

.sub-service-feature-card i {
  color: var(--gold, #c59a4a) !important;
  font-size: 13px;
  margin-top: 2px;
  flex-shrink: 0;
}

/* Address Card */
.sub-address-card {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 12px 16px;
  background: linear-gradient(135deg, rgba(197, 154, 74, 0.12), rgba(8, 35, 61, 0.6)) !important;
  border: 1px solid rgba(197, 154, 74, 0.35) !important;
  border-radius: 14px;
}

.address-icon-i {
  color: var(--gold, #c59a4a) !important;
  font-size: 18px;
  margin-top: 2px;
  flex-shrink: 0;
}

.address-content strong {
  display: block;
  font-size: 12.5px;
  color: var(--gold-light, #e4c47d) !important;
  margin-bottom: 2px;
}

.address-content p {
  margin: 0;
  font-size: 13px;
  color: #ffffff !important;
  line-height: 1.65;
}

/* Phone Cards Grid */
.sub-modal-phones-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 10px;
}

.sub-phone-card-v2 {
  padding: 12px 14px;
  border-radius: 14px;
  background: rgba(37, 211, 102, 0.08) !important;
  border: 1px solid rgba(37, 211, 102, 0.3) !important;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.sub-phone-meta strong {
  font-size: 11.5px;
  color: #25D366 !important;
  display: block;
  margin-bottom: 2px;
}

.sub-phone-num {
  font-family: var(--font-mono);
  font-size: 13.5px;
  font-weight: 700;
  color: #ffffff !important;
}

.sub-phone-actions {
  display: flex;
  gap: 6px;
}

.phone-act-btn {
  flex: 1;
  padding: 6px 8px;
  border-radius: 8px;
  font-size: 11.5px;
  font-weight: 700;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  transition: opacity 0.2s ease;
}

.phone-act-btn:hover {
  opacity: 0.9;
}

.phone-act-btn.wa {
  background: #25D366 !important;
  color: #ffffff !important;
}

.phone-act-btn.call {
  background: var(--gold, #c59a4a) !important;
  color: #071827 !important;
}

/* Modal Footer */
.sub-modal-footer {
  padding: 14px 24px;
  background: #051422 !important;
  border-top: 1px solid rgba(197, 154, 74, 0.25);
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
}

.sub-footer-btn {
  flex: 1;
  padding: 11px 16px;
  border-radius: 12px;
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  cursor: pointer;
  border: none;
  transition: all 0.2s ease;
}

.sub-footer-btn.fb-btn {
  background: rgba(24, 119, 242, 0.15) !important;
  border: 1px solid rgba(24, 119, 242, 0.4) !important;
  color: #2196f3 !important;
}

.sub-footer-btn.fb-btn:hover {
  background: #1877f2 !important;
  color: #ffffff !important;
}

.sub-footer-btn.cta-btn {
  background: linear-gradient(135deg, var(--gold), #d4aa59) !important;
  color: #071827 !important;
  box-shadow: 0 4px 16px rgba(197, 154, 74, 0.35);
}

.sub-footer-btn.cta-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 22px rgba(197, 154, 74, 0.5);
}

/* Social Banner */
.social-banner {
  padding: 34px 0;
  background: var(--ink);
  color: #fff;
}

.social-banner-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  min-height: 150px;
  border: 1px solid rgba(228, 196, 125, 0.28);
  border-radius: 22px;
  padding: 30px;
  background:
    linear-gradient(135deg, rgba(197, 154, 74, 0.16), transparent 45%),
    linear-gradient(155deg, #08233d, #103b63);
}

.social-banner-inner span {
  display: block;
  margin-bottom: 10px;
  font: 700 10px var(--font-mono);
  letter-spacing: 2.2px !important;
  color: var(--gold-light);
}

.social-banner-inner strong {
  display: block;
  font-size: clamp(24px, 4vw, 42px);
  line-height: 1.25;
  font-weight: 800;
}

.social-banner-inner small {
  display: block;
  margin-top: 12px;
  color: #c9d5e2;
  font-size: 14px;
  line-height: 1.8;
}

.social-banner-inner img {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  border: 2px solid rgba(228, 196, 125, 0.75);
  flex: none;
}

/* Why Section */
.why {
  background: var(--ink);
  color: #fff;
  overflow: hidden;
  transition: background-color 0.3s ease;
}

body.dark .why {
  background: #061521;
}

.why-grid {
  display: grid;
  grid-template-columns: 0.85fr 1.15fr;
  gap: 90px;
  align-items: center;
}

.why-visual {
  height: 480px;
  position: relative;
  display: grid;
  place-items: center;
}

.big-number {
  font: 700 190px var(--font-mono);
  color: rgba(228, 196, 125, 0.08);
  line-height: 1;
}

.why-ring {
  position: absolute;
  width: 330px;
  height: 330px;
  border: 1px solid rgba(228, 196, 125, 0.5);
  border-radius: 50%;
}

.why-ring::before {
  content: "";
  position: absolute;
  inset: 23px;
  border: 1px dashed rgba(228, 196, 125, 0.22);
  border-radius: 50%;
}

.why-caption {
  position: absolute;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}

.why-caption span {
  font: 700 30px var(--font-mono);
  color: var(--gold-light);
}

.why-caption small {
  font: 700 12px var(--font-en);
  letter-spacing: 1.5px !important;
  color: #aebdcc;
}

.why-content h2 {
  margin-bottom: 45px;
}

.why-list {
  display: grid;
  gap: 25px;
}

.why-list > div {
  display: grid;
  grid-template-columns: 50px 1fr;
  gap: 18px;
  padding-bottom: 21px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

.why-list b {
  font: 800 14px var(--font-mono);
  color: var(--gold);
}

.why-list h4 {
  margin: 0 0 5px;
  font-size: 18px;
  font-weight: 800;
}

.why-list p {
  margin: 0;
  color: #aebdcc;
  font-size: 14.5px;
  line-height: 1.85;
}

/* Contact Section */
.contact {
  background: var(--cream);
  transition: background-color 0.3s ease;
}

.contact-box {
  background: var(--card-bg);
  border: 1px solid var(--line);
  border-radius: 26px;
  padding: 50px;
  display: grid;
  grid-template-columns: 0.9fr 1.1fr;
  gap: 60px;
  box-shadow: var(--shadow);
  transition: background-color 0.3s ease, border-color 0.3s ease;
}

.contact-box h2 { margin-bottom: 18px; }
.contact-box > div > p {
  color: var(--muted);
  font-size: 15px;
  line-height: 1.9;
  max-width: 450px;
  font-weight: 500;
}

.contact-address {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  margin-top: 24px;
  padding-top: 22px;
  border-top: 1px solid var(--line);
  max-width: 480px;
}

.contact-address i {
  color: var(--gold);
  font-size: 22px;
  margin-top: 4px;
  flex: none;
}

.contact-address span {
  display: block;
  font-family: var(--font-ar);
  font-size: 16px;
  font-weight: 800;
  color: var(--gold);
  margin-bottom: 6px;
  letter-spacing: normal;
}

.contact-address p {
  margin: 0 0 8px;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.85;
  color: var(--text);
}

.contact-address a {
  font-size: 14px;
  font-weight: 800;
  color: var(--gold);
  text-decoration: none;
  display: inline-block;
  margin-top: 4px;
}

.contact-address a:hover {
  text-decoration: underline;
  color: var(--gold-light);
}

.contact-channels {
  max-width: 420px;
  margin-top: 24px;
  padding: 22px 24px;
  border: 1px solid var(--gold);
  border-radius: 20px;
  background: rgba(197, 154, 74, 0.08);
}

.contact-channels span {
  display: block;
  margin-bottom: 10px;
  font-size: 12px;
  font-weight: 800;
  color: var(--gold);
}

.contact-channels p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.8;
}

.country-phones {
  display: grid;
  gap: 12px;
  margin-top: 12px;
  font-size: 13.5px;
}

.country-phones > div {
  line-height: 1.6;
}

.country-phones a {
  color: var(--ink);
  font-weight: 800;
  text-decoration: none;
  font-family: var(--font-mono);
}

body.dark .country-phones a {
  color: var(--gold-light);
}

/* Premium Glassmorphic Form Card Styling */
.contact-form-card,
.contact-form {
  display: flex;
  flex-direction: column;
  gap: 20px;
  background: var(--card-bg, #ffffff);
  border: 1px solid rgba(197, 154, 74, 0.25);
  border-radius: 22px;
  padding: 32px 28px;
  box-shadow: 0 12px 36px rgba(0, 0, 0, 0.05);
  transition: all 0.3s ease;
  align-self: start;
  height: fit-content;
}

body.dark .contact-form-card,
body.dark .contact-form {
  background: rgba(18, 26, 38, 0.85);
  backdrop-filter: blur(12px);
  border-color: rgba(197, 154, 74, 0.3);
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.4);
}

.form-card-head {
  display: flex;
  align-items: center;
  gap: 14px;
  padding-bottom: 18px;
  border-bottom: 1px dashed var(--line, rgba(197, 154, 74, 0.2));
  margin-bottom: 4px;
}

.form-head-icon {
  width: 46px;
  height: 46px;
  border-radius: 14px;
  background: linear-gradient(135deg, rgba(197, 154, 74, 0.15), rgba(228, 196, 125, 0.25));
  border: 1px solid rgba(197, 154, 74, 0.3);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--gold, #c59a4a);
  font-size: 20px;
  flex-shrink: 0;
}

.form-card-head h3 {
  font-size: 18px;
  font-weight: 800;
  color: var(--text, #0f172a);
  margin: 0 0 4px 0;
  font-family: var(--font-ar);
}

.form-card-head small {
  font-size: 14px;
  color: var(--muted, #64748b);
  font-weight: 500;
  display: block;
}

.form-field-group {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.form-field-group label,
.contact-form label {
  font-size: 14.5px;
  font-weight: 700;
  color: var(--text, #1e293b);
  display: flex;
  align-items: center;
  gap: 6px;
}

body.dark .form-field-group label,
body.dark .contact-form label {
  color: #e2e8f0;
}

.input-icon-wrap {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
}

.input-icon-wrap .input-icon {
  position: absolute;
  right: 16px; /* RTL placement default */
  color: var(--gold, #c59a4a);
  font-size: 16px;
  pointer-events: none;
  z-index: 2;
  transition: color 0.2s ease;
}

[dir="ltr"] .input-icon-wrap .input-icon,
body.lang-en .input-icon-wrap .input-icon {
  right: auto;
  left: 16px;
}

.input-icon-wrap .input-icon.icon-textarea {
  top: 16px;
}

.input-icon-wrap input[type="text"],
.input-icon-wrap input[type="tel"],
.input-icon-wrap input[type="email"],
.contact-form input {
  width: 100%;
  height: 50px !important; /* Fixed height for clean inputs */
  padding: 0 46px 0 16px; /* RTL spacing */
  background: var(--bg-surface, rgba(248, 250, 252, 0.9));
  border: 1.5px solid var(--line, rgba(203, 213, 225, 0.8));
  border-radius: 14px;
  font-size: 14.5px;
  font-weight: 600;
  font-family: var(--font-ar);
  color: var(--text, #0f172a);
  outline: none;
  transition: all 0.25s ease;
  box-sizing: border-box;
}

.input-icon-wrap textarea,
.contact-form textarea {
  width: 100%;
  min-height: 100px;
  padding: 14px 46px 14px 16px; /* RTL spacing */
  background: var(--bg-surface, rgba(248, 250, 252, 0.9));
  border: 1.5px solid var(--line, rgba(203, 213, 225, 0.8));
  border-radius: 14px;
  font-size: 14.5px;
  font-weight: 500;
  font-family: var(--font-ar);
  color: var(--text, #0f172a);
  outline: none;
  resize: vertical;
  line-height: 1.6;
  transition: all 0.25s ease;
  box-sizing: border-box;
}

[dir="ltr"] .input-icon-wrap input[type="text"],
[dir="ltr"] .input-icon-wrap input[type="tel"],
[dir="ltr"] .input-icon-wrap input[type="email"],
[dir="ltr"] .input-icon-wrap textarea,
[dir="ltr"] .contact-form input,
[dir="ltr"] .contact-form textarea,
body.lang-en .input-icon-wrap input[type="text"],
body.lang-en .input-icon-wrap input[type="tel"],
body.lang-en .input-icon-wrap input[type="email"],
body.lang-en .input-icon-wrap textarea,
body.lang-en .contact-form input,
body.lang-en .contact-form textarea {
  padding: 0 16px 0 46px;
  font-family: var(--font-en);
}

[dir="ltr"] .input-icon-wrap textarea,
body.lang-en .input-icon-wrap textarea {
  padding: 14px 16px 14px 46px;
}

body.dark .input-icon-wrap input,
body.dark .input-icon-wrap textarea,
body.dark .contact-form input,
body.dark .contact-form textarea {
  background: rgba(15, 23, 42, 0.65);
  border-color: rgba(255, 255, 255, 0.12);
  color: #f8fafc;
}

.input-icon-wrap input:focus,
.input-icon-wrap textarea:focus,
.contact-form input:focus,
.contact-form textarea:focus {
  border-color: var(--gold, #c59a4a) !important;
  background: #ffffff !important;
  box-shadow: 0 0 0 4px rgba(197, 154, 74, 0.18) !important;
}

body.dark .input-icon-wrap input:focus,
body.dark .input-icon-wrap textarea:focus,
body.dark .contact-form input:focus,
body.dark .contact-form textarea:focus {
  background: rgba(15, 23, 42, 0.95) !important;
  border-color: #e4c47d !important;
  box-shadow: 0 0 0 4px rgba(228, 196, 125, 0.25) !important;
}

.input-icon-wrap input::placeholder,
.input-icon-wrap textarea::placeholder,
.contact-form input::placeholder,
.contact-form textarea::placeholder {
  color: #94a3b8;
  font-size: 13.5px;
  opacity: 0.85;
}

/* Luxury Gold Submit Button for Forms */
.contact-form button[type="submit"],
.modal-actions button[type="submit"],
.submit-btn-gold {
  background: linear-gradient(135deg, #c59a4a 0%, #e4c47d 50%, #b88a38 100%) !important;
  color: #071827 !important;
  font-weight: 800 !important;
  font-size: 15.5px !important;
  padding: 14px 24px !important;
  border-radius: 14px !important;
  border: 1px solid rgba(228, 196, 125, 0.7) !important;
  box-shadow: 0 10px 26px rgba(197, 154, 74, 0.3) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  cursor: pointer !important;
  transition: transform 0.25s ease, box-shadow 0.25s ease, filter 0.25s ease !important;
  width: 100% !important;
  min-height: 52px !important;
}

.contact-form button[type="submit"]:hover,
.modal-actions button[type="submit"]:hover,
.submit-btn-gold:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 14px 34px rgba(197, 154, 74, 0.45) !important;
  filter: brightness(1.05) !important;
}

.contact-form button[type="submit"]:active,
.modal-actions button[type="submit"]:active,
.submit-btn-gold:active {
  transform: translateY(0) !important;
}

.form-status {
  font-size: 13px;
  font-weight: 700;
  min-height: 20px;
  color: var(--gold);
}

.form-status.success { color: #25D366; }
.form-status.error { color: #e54d4d; }

/* Footer */
.footer {
  padding: 32px 0 95px;
  border-top: 1px solid var(--line);
  background: var(--paper);
  transition: background-color 0.3s ease;
}

.footer-grid {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  flex-wrap: wrap;
}

.footer-brand .brand-mark { width: 38px; height: 38px; }
.footer-brand .brand-copy strong { font-size: 12px; }

.footer-socials {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 22px;
}

.footer-copyright {
  font-size: 12px;
  color: var(--muted);
  font-family: var(--font-mono);
  white-space: nowrap;
}

/* PERFECT CLEAN FLOATING WHATSAPP BUTTON (NO OVERLAP BUG) */
.floating-whatsapp {
  position: fixed !important;
  z-index: 9999 !important;
  left: max(24px, env(safe-area-inset-left)) !important;
  right: auto !important;
  bottom: max(24px, env(safe-area-inset-bottom)) !important;
  width: 56px !important;
  height: 56px !important;
  border-radius: 50% !important;
  background: #25D366 !important;
  color: #ffffff !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: 0 8px 24px rgba(37, 211, 102, 0.35) !important;
  text-decoration: none !important;
  transition: transform 0.25s ease, box-shadow 0.25s ease !important;
  overflow: visible !important;
  line-height: 1 !important;
  -webkit-tap-highlight-color: transparent;
}

.floating-whatsapp::before, .floating-whatsapp::after {
  display: none !important;
}

.floating-whatsapp i {
  font-size: 32px !important;
  color: #ffffff !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1 !important;
  display: block !important;
  width: auto !important;
  height: auto !important;
}

.floating-whatsapp:hover {
  transform: translateY(-3px) scale(1.05) !important;
  box-shadow: 0 12px 28px rgba(37, 211, 102, 0.45) !important;
}

.floating-top {
  position: fixed;
  z-index: 90;
  right: max(16px, env(safe-area-inset-right));
  bottom: max(16px, env(safe-area-inset-bottom));
  width: 52px;
  height: 52px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  text-decoration: none;
  color: #fff;
  background: var(--ink);
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.16);
  opacity: 0;
  pointer-events: none;
  transform: translateY(10px);
  transition: transform 0.2s ease, opacity 0.2s ease, box-shadow 0.2s ease;
  -webkit-tap-highlight-color: transparent;
}

.floating-top.show {
  opacity: 1;
  pointer-events: auto;
  transform: none;
}

.floating-top:hover {
  transform: translateY(-3px);
  box-shadow: 0 16px 32px rgba(0, 0, 0, 0.24);
}

.floating-top i { font-size: 21px; }

/* Reveal Animations - GUARANTEED 100% INSTANT VISIBILITY ON ALL DEVICES */
.reveal {
  opacity: 1 !important;
  transform: none !important;
  transition: opacity 0.3s ease, transform 0.3s ease;
}

.reveal.visible {
  opacity: 1 !important;
  transform: none !important;
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    transition-duration: 0.001ms !important;
  }
  .reveal { opacity: 1; transform: none; }
}

/* UNIVERSAL BIDI LTR PROTECTION FOR PHONE NUMBERS & METRICS */
.phone-num,
.country-phones a,
.phone-chip,
.years-badge strong,
.counter-num,
.ltr-num,
a[href^="tel:"],
input[type="tel"] {
  direction: ltr !important;
  unicode-bidi: isolate !important;
  display: inline-block;
  text-align: left;
}

bdi {
  direction: ltr !important;
  unicode-bidi: isolate !important;
  display: inline-block;
}

/* Country Phone Cards in Contact Section */
.channels-title {
  font-size: 16px;
  font-weight: 800;
  color: var(--gold);
  margin-bottom: 14px;
  display: flex;
  align-items: center;
  gap: 8px;
}

.country-phones-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-top: 14px;
}

.country-phone-item {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 12px 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  transition: border-color 0.25s ease, transform 0.25s ease;
}

.country-phone-item:hover {
  border-color: var(--gold);
  transform: translateY(-2px);
}

.c-phone-info {
  display: flex;
  align-items: center;
  gap: 10px;
}

.c-phone-info strong {
  display: block;
  font-size: 14.5px;
  font-weight: 800;
  color: var(--text);
}

.c-phone-info small {
  display: block;
  font-size: 11px;
  color: var(--gold);
  font-weight: 600;
}

.c-phone-btns {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.phone-chip {
  padding: 6px 14px;
  border-radius: 20px;
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  transition: transform 0.2s ease, background 0.2s ease, border-color 0.2s ease;
  border: 1px solid var(--line);
  background: var(--card-bg);
  color: var(--text);
}

.phone-chip.wa {
  color: #25D366;
  border-color: rgba(37, 211, 102, 0.3);
}

.phone-chip.wa:hover {
  background: #25D366;
  color: #ffffff;
  border-color: #25D366;
}

.phone-chip.tel {
  color: var(--gold);
  border-color: rgba(197, 154, 74, 0.3);
}

.phone-chip.tel:hover {
  background: var(--gold);
  color: #071827;
  border-color: var(--gold);
}

/* ==========================================
   LUXURY GRAND FOOTER SYSTEM
   ========================================== */
.footer {
  background: var(--ink, #08233d);
  color: #e2e8f0;
  position: relative;
  overflow: hidden;
  border-top: 1px solid rgba(228, 196, 125, 0.25);
  font-family: var(--font-ar);
  padding: 0;
}

body.dark .footer {
  background: #040e17;
  border-top-color: rgba(228, 196, 125, 0.3);
}

.footer-top-line {
  width: 100%;
  height: 2px;
  background: linear-gradient(90deg, transparent, #c59a4a 30%, #e4c47d 50%, #c59a4a 70%, transparent);
}

.footer-main {
  display: grid;
  grid-template-columns: 1.3fr 0.8fr 1fr 1.1fr;
  gap: 40px;
  padding: 60px 0 45px;
}

@media (max-width: 1024px) {
  .footer-main {
    grid-template-columns: 1fr 1fr;
    gap: 36px;
  }
  .subsidiary-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
  }
  .service-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
  }
  .two-col {
    grid-template-columns: 1fr;
    gap: 40px;
  }
}

@media (max-width: 768px) {
  .subsidiary-grid {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }
  .service-grid {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }
  .destinations-grid {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }
  .two-col {
    grid-template-columns: 1fr !important;
    gap: 28px !important;
  }
  .reveal {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
  .slides, .slider {
    touch-action: pan-y !important;
  }
}

@media (max-width: 640px) {
  .footer-main {
    grid-template-columns: 1fr;
    gap: 30px;
    padding: 45px 0 30px;
  }
}

.footer-col {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.footer-brand {
  margin-bottom: 4px;
}

.footer-brand .brand-mark {
  width: 44px;
  height: 44px;
  border-color: var(--gold);
}

.footer-brand .brand-copy strong {
  font-size: 15px;
  font-weight: 800;
  color: #ffffff !important;
}

.footer-brand .brand-copy small {
  color: var(--gold-light);
}

.footer-desc {
  font-size: 14.5px;
  line-height: 1.85;
  color: #94a3b8;
  margin: 0;
  max-width: 340px;
}

.footer-contacts-quick {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 6px;
}

.footer-contact-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-weight: 700;
  color: var(--gold-light, #e4c47d);
  text-decoration: none;
  background: rgba(228, 196, 125, 0.08);
  padding: 8px 14px;
  border-radius: 10px;
  border: 1px solid rgba(228, 196, 125, 0.18);
  width: fit-content;
  transition: all 0.25s ease;
}

.footer-contact-chip i {
  color: #25D366;
  font-size: 14px;
}

.footer-contact-chip:hover {
  background: rgba(228, 196, 125, 0.18);
  border-color: var(--gold);
  color: #ffffff;
  transform: translateX(-3px);
}

[dir="ltr"] .footer-contact-chip:hover,
body.lang-en .footer-contact-chip:hover {
  transform: translateX(3px);
}

.footer-title {
  font-size: 16px;
  font-weight: 800;
  color: #ffffff;
  position: relative;
  padding-bottom: 12px;
  margin: 0 0 4px;
}

.footer-title::after {
  content: "";
  position: absolute;
  bottom: 0;
  right: 0;
  width: 36px;
  height: 2.5px;
  background: var(--gold, #c59a4a);
  border-radius: 2px;
}

[dir="ltr"] .footer-title::after,
body.lang-en .footer-title::after {
  right: auto;
  left: 0;
}

.footer-links {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 11px;
}

.footer-links a {
  color: #cbd5e1;
  text-decoration: none;
  font-size: 14.5px;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  transition: color 0.2s ease, transform 0.2s ease;
}

.footer-links a i {
  color: var(--gold, #c59a4a);
  font-size: 12px;
}

.footer-links a:hover {
  color: var(--gold-light, #e4c47d);
  transform: translateX(-4px);
}

[dir="ltr"] .footer-links a:hover,
body.lang-en .footer-links a:hover {
  transform: translateX(4px);
}

.footer-hq-info {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.hq-item {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}

.hq-item i {
  color: var(--gold, #c59a4a);
  font-size: 16px;
  margin-top: 3px;
  flex-shrink: 0;
}

.hq-item strong {
  display: block;
  font-size: 14.5px;
  color: #f1f5f9;
  margin-bottom: 3px;
}

.hq-item p {
  margin: 0;
  font-size: 13.5px;
  color: #94a3b8;
  line-height: 1.6;
}

.footer-bottom {
  background: rgba(0, 0, 0, 0.4);
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  padding: 18px 0;
}

.footer-bottom-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  flex-wrap: wrap;
}

.copyright-text {
  margin: 0;
  font-size: 14px;
  color: #94a3b8;
  font-weight: 500;
}

.copyright-text strong {
  color: #e2e8f0;
}

.footer-socials {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 12px;
}

.footer-socials .social {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid rgba(255, 255, 255, 0.15) !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.25s ease, background 0.25s ease, border-color 0.25s ease;
}

.footer-socials .facebook i { color: #1877F2 !important; font-size: 16px; }
.footer-socials .instagram i { color: #E1306C !important; font-size: 16px; }
.footer-socials .whatsapp i { color: #25D366 !important; font-size: 16px; }

.footer-socials .facebook:hover { background: #1877F2 !important; border-color: #1877F2 !important; transform: translateY(-3px); }
.footer-socials .facebook:hover i { color: #ffffff !important; }

.footer-socials .instagram:hover { background: #E1306C !important; border-color: #E1306C !important; transform: translateY(-3px); }
.footer-socials .instagram:hover i { color: #ffffff !important; }

.footer-socials .whatsapp:hover { background: #25D366 !important; border-color: #25D366 !important; transform: translateY(-3px); }
.footer-socials .whatsapp:hover i { color: #ffffff !important; }

/* ==========================================================================
   Bottom Animated Group Companies Ticker Carousel — PERMANENT DARK BAR IN ALL MODES
   ========================================================================== */
.ticker-section {
  padding: 60px 0 50px;
  background: #071827 !important;
  border-top: 1px solid rgba(228, 196, 125, 0.25);
  border-bottom: 1px solid rgba(228, 196, 125, 0.25);
  overflow: hidden;
  position: relative;
}

.ticker-header {
  text-align: center;
  margin-bottom: 30px;
}

.ticker-header .eyebrow {
  color: var(--gold-light) !important;
}

.ticker-header h2 {
  font-size: 24px;
  font-weight: 800;
  color: #ffffff !important;
  margin-top: 6px;
}

.ticker-wrapper {
  width: 100%;
  overflow: hidden;
  white-space: nowrap;
  position: relative;
  direction: ltr !important;
  mask-image: linear-gradient(to right, transparent, black 8%, black 92%, transparent);
  -webkit-mask-image: linear-gradient(to right, transparent, black 8%, black 92%, transparent);
  padding: 16px 0; /* Padding for unclipped 3D Pop Out */
}

.ticker-track {
  display: inline-flex;
  align-items: center;
  gap: 22px;
  direction: ltr !important;
  animation: marqueeScroll 28s linear infinite;
  will-change: transform;
  padding: 12px 0; /* Breathing space for translateY pop */
}

.ticker-wrapper:hover .ticker-track {
  animation-play-state: paused;
}

.ticker-card {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  padding: 14px 24px;
  border-radius: 18px;
  background: rgba(11, 33, 53, 0.95) !important;
  border: 1px solid rgba(228, 196, 125, 0.25) !important;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.3);
  transition: transform 0.35s cubic-bezier(0.34, 1.56, 0.64, 1), border-color 0.3s ease, box-shadow 0.3s ease, background 0.3s ease !important;
  flex: none;
  cursor: pointer;
  position: relative;
  z-index: 1;
}

.ticker-card:hover {
  transform: translateY(-8px) scale(1.05) !important;
  background: rgba(16, 44, 71, 0.98) !important;
  border-color: #e4c47d !important;
  box-shadow: 0 16px 36px rgba(197, 154, 74, 0.45), 0 0 20px rgba(228, 196, 125, 0.25) !important;
  z-index: 10;
}

.ticker-logo {
  width: 48px;
  height: 48px;
  object-fit: cover;
  border-radius: 50%;
  border: 2px solid var(--gold);
  flex: none;
  background: #ffffff;
}

.ticker-icon {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: rgba(197, 154, 74, 0.12);
  border: 1.5px solid var(--gold);
  display: grid;
  place-items: center;
  font-size: 20px;
  color: var(--gold);
  flex: none;
}

.ticker-info {
  display: flex;
  flex-direction: column;
  text-align: right;
  line-height: 1.35;
}

[dir="ltr"] .ticker-info,
body.lang-en .ticker-info {
  text-align: left;
}

.ticker-info strong {
  font-size: 14.5px;
  font-weight: 800;
  color: #ffffff !important;
  white-space: nowrap;
  font-family: var(--font-ar);
}

body.lang-en .ticker-info strong {
  font-family: var(--font-en);
  letter-spacing: 0.15px;
}

body.dark .ticker-info strong {
  color: #ffffff !important;
}

.ticker-info span {
  font-size: 11.5px;
  font-weight: 600;
  color: var(--gold-light) !important;
  white-space: nowrap;
  font-family: var(--font-ar);
  margin-top: 2px;
}

body.lang-en .ticker-info span {
  font-family: var(--font-en);
  letter-spacing: 0.15px;
}

body.dark .ticker-info span {
  color: var(--gold-light) !important;
}

@keyframes marqueeScroll {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}