/* ================================================================
   FAS HOLDING COMPANY — fas.css
================================================================ */

:root {
  --fas-dark      : #090909;
  --fas-dark-2    : #0f1115;
  --fas-dark-3    : #161b24;
  --fas-gold      : #d4af37;
  --fas-gold-rgb  : 212, 175, 55;
  --fas-silver    : #8c95a0;
  --fas-text      : rgba(255,255,255,.62);
  --nav-height    : 82px;
  --container-w   : 1200px;
  --section-pad   : 100px 0;
  --radius        : 6px;
}

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

/* ================================================================
   SIGNATURE TOUCHES — visual differentiators from WazNet
================================================================ */

/* 1. Thin gold accent rule pinned to the very top of the viewport */
body::before {
  content        : '';
  position       : fixed;
  top            : 0; left: 0; right: 0;
  height         : 2px;
  background     : linear-gradient(90deg, transparent 0%, var(--fas-gold) 18%, var(--fas-gold) 82%, transparent 100%);
  z-index        : 9999;
  pointer-events : none;
}

/* 2. Oversized faded section counter behind headings */
.fas-section[data-num] { position: relative; overflow: hidden; }
.fas-section[data-num]::before {
  content        : attr(data-num);
  position       : absolute;
  top            : 8px; right: -24px;
  font-family    : 'Manrope', sans-serif;
  font-size      : clamp(140px, 22vw, 260px);
  font-weight    : 900;
  letter-spacing : -20px;
  color          : rgba(var(--fas-gold-rgb), .042);
  line-height    : 1;
  user-select    : none;
  pointer-events : none;
  z-index        : 0;
}
.fas-section[data-num] > .fas-container { position: relative; z-index: 1; }

/* 3. Brand card hover glint sweep */
.fas-brand-card { position: relative; }
.fas-brand-card::after {
  content    : '';
  position   : absolute;
  top        : 0; left: -75%;
  width      : 55%;
  height     : 100%;
  background : linear-gradient(115deg, transparent 0%, rgba(255,255,255,.07) 50%, transparent 100%);
  z-index    : 2;
  transition : left .65s ease;
  pointer-events: none;
}
.fas-brand-card:hover::after { left: 130%; }

/* Screen-reader-only (SEO h1 hidden visually) */
.fas-sr-only {
  position: absolute;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
  border: 0;
}
html  { scroll-behavior: smooth; }
body  {
  background  : var(--fas-dark);
  color       : var(--fas-text);
  font-family : 'Manrope', sans-serif;
  line-height : 1.75;
  overflow-x  : hidden;
}
img   { display: block; max-width: 100%; }
a     { text-decoration: none; color: inherit; }
ul    { list-style: none; }

/* ── UTILITIES ── */
.fas-container {
  max-width : var(--container-w);
  margin    : 0 auto;
  padding   : 0 32px;
}
.z-1          { position: relative; z-index: 1; }
.text-center  { text-align: center; }
.fas-section  { padding: var(--section-pad); }

/* Background canvas */
#fas-bg-canvas {
  position  : fixed;
  inset     : 0;
  width     : 100%;
  height    : 100%;
  z-index   : 0;
  pointer-events: none;
}

.fas-overlay {
  position  : absolute;
  inset     : 0;
  background: rgba(9,9,9,.55);
}

/* ── TYPOGRAPHY ── */
h1, h2, h3, h4 {
  font-family   : 'Manrope', sans-serif;
  font-weight   : 700;
  color         : #fff;
  line-height   : 1.12;
  letter-spacing: -.5px;
}
h1 { font-size: clamp(38px,5vw,66px); letter-spacing: -2px; }
h2 { font-size: clamp(26px,3.2vw,44px); letter-spacing: -1px; }
h3 { font-size: clamp(17px,1.8vw,21px); }

p {
  font-size    : 15px;
  color        : rgba(255,255,255,.58);
  line-height  : 1.88;
  margin-bottom: 16px;
}
p:last-child { margin-bottom: 0; }

.fas-gold-text { color: var(--fas-gold); }

/* label chip */
.fas-label {
  display       : inline-flex;
  align-items   : center;
  gap           : 10px;
  font-size     : 10.5px;
  font-weight   : 700;
  letter-spacing: 3px;
  text-transform: uppercase;
  color         : var(--fas-gold);
  margin-bottom : 14px;
}
.fas-label::before {
  content   : '';
  display   : block;
  width     : 26px;
  height    : 2px;
  background: var(--fas-gold);
  flex-shrink: 0;
}

/* gold divider */
.fas-divider {
  width : 52px;
  height: 2px;
  background: linear-gradient(90deg, var(--fas-gold), transparent);
  margin: 18px 0 30px;
}

/* ── BUTTONS ── */
.fas-btn-main {
  display       : inline-flex;
  align-items   : center;
  gap           : 8px;
  padding       : 13px 30px;
  background    : var(--fas-gold);
  color         : #0a0a0a;
  font-size     : 11.5px;
  font-weight   : 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  border-radius : var(--radius);
  border        : 1px solid var(--fas-gold);
  cursor        : pointer;
  transition    : background .25s, box-shadow .25s, color .25s;
}
.fas-btn-main:hover {
  background: #fff;
  box-shadow: 0 6px 28px rgba(var(--fas-gold-rgb),.28);
}
.fas-btn-outline {
  display       : inline-flex;
  align-items   : center;
  padding       : 13px 30px;
  background    : transparent;
  color         : rgba(255,255,255,.8);
  font-size     : 11.5px;
  font-weight   : 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  border-radius : var(--radius);
  border        : 1px solid rgba(255,255,255,.22);
  cursor        : pointer;
  transition    : border-color .25s, color .25s;
}
.fas-btn-outline:hover {
  border-color: var(--fas-gold);
  color       : var(--fas-gold);
}

/* ── PRELOADER ── */
#preloader {
  position       : fixed;
  inset          : 0;
  background     : var(--fas-dark);
  z-index        : 9999;
  display        : flex;
  align-items    : center;
  justify-content: center;
}
.pre-dots { display: flex; gap: 8px; }
.pre-dots span {
  width        : 8px;
  height       : 8px;
  border-radius: 50%;
  background   : var(--fas-gold);
  animation    : dot-pulse 1.2s ease-in-out infinite;
}
.pre-dots span:nth-child(2) { animation-delay: .2s; }
.pre-dots span:nth-child(3) { animation-delay: .4s; }
@keyframes dot-pulse {
  0%, 100% { opacity: .2; transform: scale(.8); }
  50%      { opacity: 1;  transform: scale(1.2); }
}

/* ================================================================
   HEADER
================================================================ */
#fas-header {
  position  : fixed;
  top       : 0; left: 0; right: 0;
  height    : var(--nav-height);
  z-index   : 1000;
  transition: background .35s, box-shadow .35s, border-color .35s;
  border-bottom: 1px solid transparent;
}
#fas-header.scrolled {
  background   : rgba(9,9,9,.95);
  box-shadow   : 0 2px 32px rgba(0,0,0,.55);
  border-color : rgba(var(--fas-gold-rgb),.1);
  backdrop-filter: blur(12px);
}
.fas-nav-inner {
  display        : flex;
  align-items    : center;
  justify-content: space-between;
  max-width      : var(--container-w);
  margin         : 0 auto;
  padding        : 0 32px;
  height         : 100%;
}
.fas-logo-wrap { display: flex; align-items: center; }
.fas-nav-logo  { height: 44px; width: auto; }

#fas-nav {
  display    : flex;
  align-items: center;
  gap        : 34px;
}
#fas-nav-close { display: none; }
#fas-nav a {
  font-size     : 12.5px;
  font-weight   : 600;
  letter-spacing: 1px;
  text-transform: uppercase;
  color         : rgba(255,255,255,.7);
  position      : relative;
  transition    : color .2s;
}
#fas-nav a::after {
  content   : '';
  position  : absolute;
  bottom    : -4px; left: 0; right: 100%;
  height    : 1px;
  background: var(--fas-gold);
  transition: right .25s;
}
#fas-nav a:hover          { color: #fff; }
#fas-nav a:hover::after   { right: 0; }

.fas-hdr-cta { font-size: 11px; padding: 10px 22px; }

#fas-menu-btn {
  display       : none;
  flex-direction: column;
  gap           : 5px;
  background    : none;
  border        : none;
  cursor        : pointer;
  padding       : 4px;
}
#fas-menu-btn span { display: block; width: 22px; height: 2px; background: #fff; transition: .25s; }

/* ── Nav dropdown (grouped links) ── */
.fas-nav-drop { position: relative; }
.fas-nav-drop-trigger {
  display    : inline-flex;
  align-items: center;
  gap        : 6px;
}
.fas-nav-drop-trigger svg { transition: transform .25s; }
.fas-nav-drop:hover .fas-nav-drop-trigger svg { transform: rotate(180deg); }
.fas-nav-drop-menu {
  position   : absolute;
  top        : 100%;
  left       : 0;
  padding-top: 16px;           /* hover bridge between trigger and panel */
  opacity    : 0;
  visibility : hidden;
  transform  : translateY(8px);
  transition : opacity .22s, transform .22s, visibility .22s;
  z-index    : 1010;
}
.fas-nav-drop:hover .fas-nav-drop-menu {
  opacity   : 1;
  visibility: visible;
  transform : none;
}
.fas-nav-drop-panel {
  min-width    : 216px;
  background   : #0f1115;
  border       : 1px solid rgba(var(--fas-gold-rgb), .22);
  border-top   : 2px solid var(--fas-gold);
  border-radius: 0 0 6px 6px;
  padding      : 10px 0;
  box-shadow   : 0 18px 44px rgba(0,0,0,.5);
}
#fas-nav .fas-nav-drop-panel a {
  display   : block;
  padding   : 10px 20px;
  transition: color .2s, background .2s;
}
#fas-nav .fas-nav-drop-panel a::after { display: none; }
#fas-nav .fas-nav-drop-panel a:hover {
  color     : var(--fas-gold);
  background: rgba(var(--fas-gold-rgb), .07);
}
[dir="rtl"] .fas-nav-drop-menu { left: auto; right: 0; }
[dir="rtl"] .fas-nav-drop-panel a { text-align: right; }

/* Contact link: hidden on desktop (header CTA covers it), shown in mobile menu */
.fas-nav-contact { display: none; }

/* ── Scroll-spy: active link + progress underline ── */
#fas-nav a.nav-active { color: #fff; }
#fas-nav a.nav-active::after {
  left            : 0;
  right           : 0;
  transform-origin: left center;
  transform       : scaleX(var(--nav-progress, 0));
  transition      : transform .12s linear;
}
[dir="rtl"] #fas-nav a.nav-active::after { transform-origin: right center; }
#fas-nav .fas-nav-drop-panel a.nav-active { color: var(--fas-gold); }

/* ================================================================
   SCROLL REVEAL
   IntersectionObserver-driven — premium easing, restrained motion
================================================================ */

/* hidden states */
[data-reveal] {
  opacity            : 0;
  transition-property: opacity, transform;
  transition-duration: 1s;
  transition-timing-function: cubic-bezier(0.16, 1, 0.3, 1);
}
[data-reveal="up"]    { transform: translateY(52px); }
[data-reveal="left"]  { transform: translateX(-60px); }
[data-reveal="right"] { transform: translateX(60px); }
[data-reveal="scale"] { transform: scale(0.92) translateY(28px); }
[data-reveal="fade"]  { /* opacity only */ }

/* revealed */
[data-reveal].revealed {
  opacity  : 1;
  transform: none;
}

/* divider line draw */
[data-reveal="line"] {
  opacity            : 1;
  transform-origin   : left center;
  transform          : scaleX(0);
  transition-property: transform;
  transition-duration: 0.7s;
  transition-timing-function: cubic-bezier(0.16, 1, 0.3, 1);
}
[dir="rtl"] [data-reveal="line"] { transform-origin: right center; }
[data-reveal="line"].revealed { transform: scaleX(1); }

/* hero — plays on page load, no observer */
.fas-hero-anim {
  animation      : fas-hero-enter 0.88s cubic-bezier(0.16, 1, 0.3, 1) both;
  animation-delay: var(--anim-delay, 0s);
}
@keyframes fas-hero-enter {
  from { opacity: 0; transform: translateY(18px); }
  to   { opacity: 1; transform: none; }
}

/* ================================================================
   HERO
================================================================ */
#section-hero {
  position       : relative;
  /* leave room for the facts band inside the first viewport */
  min-height     : calc(100vh - 118px);
  display        : flex;
  align-items    : center;
  justify-content: flex-start;
  text-align     : left;
  overflow       : hidden;
}
.jarallax-img {
  position  : absolute;
  inset     : 0;
  width     : 100%;
  height    : 100%;
  object-fit: cover;
}

.hero-inner {
  padding   : calc(var(--nav-height) + 64px) 0 72px;
  max-width : 640px;
  width     : 100%;
  margin-left: calc((100vw - var(--container-w)) / 2);
  padding-left: 20px;
  padding-right: 20px;
}

.hero-eyebrow {
  display       : inline-block;
  font-size     : 10.5px;
  font-weight   : 700;
  letter-spacing: 3.5px;
  text-transform: uppercase;
  color         : var(--fas-gold);
  padding       : 7px 18px;
  border        : 1px solid rgba(var(--fas-gold-rgb),.3);
  border-radius : 2px;
  margin-bottom : 32px;
}
.hero-main-logo {
  height : 80px;
  width  : auto;
  margin : 0 0 32px;
  filter : drop-shadow(0 4px 32px rgba(0,0,0,.7));
}
.hero-tagline {
  font-size     : clamp(13px,1.5vw,16px);
  color         : rgba(255,255,255,.65);
  max-width     : 540px;
  margin        : 0 0 44px;
  line-height   : 1.8;
}
.hero-btns {
  display        : flex;
  justify-content: flex-start;
  gap            : 14px;
  flex-wrap      : wrap;
}

.hero-scroll {
  position  : absolute;
  bottom    : 36px;
  left      : 50%;
  transform : translateX(-50%);
  display   : flex;
  flex-direction: column;
  align-items: center;
  gap       : 10px;
  font-size : 9.5px;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color     : rgba(255,255,255,.35);
  text-decoration: none;
  z-index   : 2;
  cursor    : pointer;
}
.hero-scroll-circle {
  width        : 42px;
  height       : 42px;
  border-radius: 50%;
  border       : 1px solid rgba(var(--fas-gold-rgb), .35);
  display      : flex;
  align-items  : center;
  justify-content: center;
  transition   : border-color .3s, transform .3s;
}
.hero-scroll:hover .hero-scroll-circle {
  border-color: var(--fas-gold);
  transform   : translateY(3px);
}
.hero-scroll-circle svg {
  width    : 15px;
  height   : 15px;
  color    : var(--fas-gold);
  animation: hero-chevron-bounce 1.8s ease-in-out infinite;
}
@keyframes hero-chevron-bounce {
  0%, 100% { transform: translateY(-2px); opacity: .55; }
  50%      { transform: translateY(3px);  opacity: 1; }
}

/* ================================================================
   SCROLL PROGRESS RING
================================================================ */
#fas-scroll-ring {
  position       : fixed;
  bottom         : 28px;
  right          : 28px;
  width          : 48px;
  height         : 48px;
  border-radius  : 50%;
  border         : none;
  background     : rgba(9,9,9,.75);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  cursor         : pointer;
  z-index        : 200;
  display        : flex;
  align-items    : center;
  justify-content: center;
  opacity        : 0;
  visibility     : hidden;
  transform      : translateY(12px);
  transition     : opacity .4s ease, visibility .4s ease, transform .4s ease, background .25s;
  box-shadow     : 0 4px 24px rgba(0,0,0,.45);
}
#fas-scroll-ring.visible {
  opacity   : 1;
  visibility: visible;
  transform : translateY(0);
}
#fas-scroll-ring:hover { background: rgba(var(--fas-gold-rgb), .15); }

.fas-ring-svg {
  position : absolute;
  inset    : 0;
  width    : 100%;
  height   : 100%;
  transform: rotate(-90deg);
}
.fas-ring-track {
  fill        : none;
  stroke      : rgba(255,255,255,.08);
  stroke-width: 2;
}
.fas-ring-fill {
  fill              : none;
  stroke            : var(--fas-gold);
  stroke-width      : 2;
  stroke-linecap    : round;
  /* circumference = 2π × 20 ≈ 125.66 */
  stroke-dasharray  : 125.66;
  stroke-dashoffset : 125.66;
  transition        : stroke-dashoffset .1s linear;
  filter            : drop-shadow(0 0 4px rgba(var(--fas-gold-rgb), .6));
}
.fas-ring-icon {
  position : relative;
  z-index  : 1;
  width    : 16px;
  height   : 16px;
  color    : var(--fas-gold);
  transition: transform .25s;
}
#fas-scroll-ring:hover .fas-ring-icon { transform: translateY(-2px); }

/* ================================================================
   MARQUEE
================================================================ */
.fas-marquee-wrap {
  overflow    : hidden;
  background  : var(--fas-dark-2);
  border-top  : 1px solid rgba(var(--fas-gold-rgb),.1);
  border-bottom: 1px solid rgba(var(--fas-gold-rgb),.1);
  padding     : 13px 0;
  white-space : nowrap;
}
.fas-marquee-track {
  display  : inline-flex;
  animation: fas-marquee 32s linear infinite;
}
.fas-marquee-item {
  display       : inline-flex;
  align-items   : center;
  gap           : 12px;
  padding       : 0 36px;
  font-size     : 10.5px;
  font-weight   : 600;
  letter-spacing: 2px;
  text-transform: uppercase;
  color         : rgba(255,255,255,.38);
}
.fas-marquee-item .dot {
  width        : 4px; height: 4px;
  border-radius: 50%;
  background   : var(--fas-gold);
  opacity      : .7;
  flex-shrink  : 0;
}
@keyframes fas-marquee {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

/* ================================================================
   ABOUT
================================================================ */
.fas-two-col {
  display              : grid;
  grid-template-columns: 1fr 1fr;
  gap                  : 72px;
  align-items          : center;
}
.fas-img-frame {
  position     : relative;
  border-radius: var(--radius);
  overflow     : hidden;
  border       : 1px solid rgba(var(--fas-gold-rgb),.12);
}
.fas-img-frame img {
  width       : 100%;
  aspect-ratio: 4/3;
  object-fit  : cover;
  display     : block;
  transition  : transform .5s;
}
.fas-img-frame:hover img { transform: scale(1.03); }

.fas-stats {
  display   : flex;
  gap       : 36px;
  margin-top: 40px;
  flex-wrap : wrap;
}
.fas-stat { display: flex; flex-direction: column; gap: 4px; }
.fas-stat-n {
  font-size     : 40px;
  font-weight   : 800;
  color         : var(--fas-gold);
  line-height   : 1;
  letter-spacing: -1.5px;
}
.fas-stat-l {
  font-size     : 10px;
  font-weight   : 600;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color         : rgba(255,255,255,.35);
}

/* ================================================================
   VISION & MISSION
================================================================ */
#section-vm {
  position: relative;
  overflow: hidden;
}
.fas-vm-grid {
  display              : grid;
  grid-template-columns: 1fr 1fr;
  gap                  : 22px;
  margin-top           : 52px;
}
.fas-vm-card {
  background   : rgba(255,255,255,.022);
  border       : none;
  border-left  : 3px solid var(--fas-gold);
  border-radius: 0;
  padding      : 42px 38px 42px 42px;
  box-shadow   : -3px 0 20px rgba(var(--fas-gold-rgb),.08);
  transition   : transform .4s cubic-bezier(0.16,1,0.3,1), box-shadow .4s, background .3s;
}
.fas-vm-card:hover {
  transform  : translateX(7px);
  box-shadow : -3px 0 36px rgba(var(--fas-gold-rgb),.2);
  background : rgba(var(--fas-gold-rgb),.04);
}
.fas-vm-icon {
  width          : 48px; height: 48px;
  border-radius  : 4px;
  background     : rgba(var(--fas-gold-rgb),.1);
  display        : flex;
  align-items    : center;
  justify-content: center;
  margin-bottom  : 24px;
  color          : var(--fas-gold);
}
.fas-vm-icon svg { width: 22px; height: 22px; }
.fas-vm-card h3  { margin-bottom: 14px; }

/* ================================================================
   THE FAS APPROACH
================================================================ */
.fas-approach-grid {
  display              : grid;
  grid-template-columns: 1fr 1fr;
  gap                  : 0;
  max-width            : 980px;
  margin               : 0 auto;
}
.fas-approach-item {
  padding      : 48px 52px 48px 0;
  border-bottom: 1px solid rgba(255,255,255,.1);
}
.fas-approach-item:nth-child(odd) {
  border-right : 1px solid rgba(255,255,255,.1);
}
.fas-approach-item:nth-child(even) {
  padding-left : 52px;
  padding-right: 0;
}
.fas-approach-item:nth-last-child(-n+2) { border-bottom: none; }

/* RTL: swap padding sides so the gap falls between columns, not outside them */
[dir="rtl"] .fas-approach-item          { padding: 48px 0 48px 52px; }
[dir="rtl"] .fas-approach-item:nth-child(odd)  { border-right: none; border-left: 1px solid rgba(255,255,255,.1); }
[dir="rtl"] .fas-approach-item:nth-child(even) { padding-right: 52px; padding-left: 0; }
.fas-approach-num {
  display       : block;
  font-size     : 10px;
  font-weight   : 800;
  letter-spacing: 3px;
  text-transform: uppercase;
  color         : var(--fas-gold);
  margin-bottom : 18px;
  opacity       : .8;
}
.fas-approach-item h3 {
  font-size    : clamp(18px, 1.8vw, 22px);
  font-weight  : 700;
  margin-bottom: 14px;
  line-height  : 1.25;
}
.fas-approach-item p {
  font-size  : 15px;
  line-height: 1.8;
  color      : rgba(255,255,255,.78);
  margin     : 0;
}

/* ================================================================
   BRANDS
================================================================ */
#section-brands { background: transparent; }

.fas-brands-grid {
  display              : grid;
  grid-template-columns: repeat(3,1fr);
  gap                  : 22px;
}
.fas-brand-card {
  background   : var(--fas-dark-3);
  border       : 1px solid rgba(255,255,255,.07);
  border-radius: 8px;
  overflow     : hidden;
  transition   : border-color .3s, transform .35s, box-shadow .35s, background .3s;
}
.fas-brand-card:hover {
  border-color: rgba(var(--fas-gold-rgb),.32);
  transform   : translateY(-6px);
  background  : #1a2029;
  box-shadow  : 0 24px 56px rgba(0,0,0,.34);
}

/* logo zone */
.fas-brand-logo-zone {
  height         : 170px;
  display        : flex;
  align-items    : center;
  justify-content: center;
  padding        : 28px;
  background     : rgba(0,0,0,.35);
  border-bottom  : 1px solid rgba(255,255,255,.05);
}
.fas-brand-img { max-height: 110px; max-width: 85%; object-fit: contain; }
.waznet-img    { filter: brightness(0) invert(.65); max-height: 120px; }
.ppm-img       { max-height: 70px; }

/* card body */
.fas-brand-body { padding: 26px 28px 32px; }
.fas-brand-tags {
  display   : flex;
  flex-wrap : wrap;
  gap       : 6px;
  margin-bottom: 14px;
}
.fas-brand-tags span {
  font-size     : 9px;
  font-weight   : 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color         : var(--fas-gold);
  background    : rgba(var(--fas-gold-rgb),.1);
  border        : 1px solid rgba(var(--fas-gold-rgb),.2);
  padding       : 3px 9px;
  border-radius : 2px;
}
.fas-brand-body h3 { font-size: 19px; margin-bottom: 10px; }
.fas-brand-cta {
  display       : inline-flex;
  align-items   : center;
  gap           : 6px;
  margin-top    : 16px;
  font-size     : 11.5px;
  font-weight   : 700;
  letter-spacing: 1px;
  color         : var(--fas-gold);
  transition    : gap .2s, letter-spacing .2s;
}
.fas-brand-cta:hover { gap: 10px; }

/* ================================================================
   PARTNERSHIPS
================================================================ */
.fas-partners-grid {
  display              : grid;
  grid-template-columns: repeat(4, 1fr);
  gap                  : 20px;
}
.fas-partner-card {
  background    : var(--fas-dark-3);
  border        : 1px solid rgba(255,255,255,.07);
  border-radius : 8px;
  overflow      : hidden;
  display       : flex;
  flex-direction: column;
  transition    : border-color .3s, transform .35s, box-shadow .35s;
}
.fas-partner-card:hover {
  border-color: rgba(var(--fas-gold-rgb),.32);
  transform   : translateY(-6px);
  box-shadow  : 0 24px 56px rgba(0,0,0,.34);
}
.fas-partner-logo-zone {
  height         : 155px;
  display        : flex;
  align-items    : center;
  justify-content: center;
  padding        : 24px;
  background     : #f7f7f7;
  border-bottom  : 1px solid rgba(255,255,255,.05);
}
.fas-partner-logo-dark { background: #1c0040; }
.fas-partner-img { max-height: 95px; max-width: 88%; object-fit: contain; }
.fas-partner-body {
  padding       : 22px 22px 28px;
  flex          : 1;
  display       : flex;
  flex-direction: column;
}
.fas-partner-body h3 { font-size: 16px; margin-bottom: 8px; }
.fas-partner-body p  { font-size: 13.5px; color: rgba(255,255,255,.55); flex: 1; line-height: 1.6; margin: 0; }
.fas-partner-link {
  display       : inline-flex;
  align-items   : center;
  gap           : 5px;
  margin-top    : 14px;
  font-size     : 11px;
  font-weight   : 700;
  letter-spacing: .8px;
  color         : var(--fas-gold);
  opacity       : .75;
  text-decoration: none;
  transition    : opacity .2s;
}
.fas-partner-link:hover { opacity: 1; }

/* ================================================================
   LEADERSHIP
================================================================ */
#section-leadership { position: relative; overflow: hidden; }

.fas-team-grid {
  display              : grid;
  grid-template-columns: 1fr 1.25fr 1fr;
  gap                  : 20px;
  align-items          : stretch;
  max-width            : 1020px;
  margin               : 0 auto;
}

/* flanking cards */
.fas-team-card {
  background     : rgba(255,255,255,.03);
  border         : 1px solid rgba(255,255,255,.07);
  border-radius  : 6px;
  padding        : 36px 24px;
  text-align     : center;
  display        : flex;
  flex-direction : column;
  align-items    : center;
  transition     : border-color .3s, transform .35s, box-shadow .35s, background .3s;
}
.fas-team-card p { flex: 1; }
.fas-team-card:hover {
  border-color: rgba(var(--fas-gold-rgb),.3);
  transform   : translateY(-5px);
  background  : rgba(var(--fas-gold-rgb),.045);
  box-shadow  : 0 20px 48px rgba(0,0,0,.28);
}

/* featured center card */
.fas-team-card:nth-child(2) {
  background   : rgba(var(--fas-gold-rgb),.055);
  border-color : rgba(var(--fas-gold-rgb),.32);
  border-radius: 8px;
  padding      : 52px 32px;
  box-shadow   : 0 8px 48px rgba(0,0,0,.35);
}
.fas-team-card:nth-child(2):hover {
  border-color : rgba(var(--fas-gold-rgb),.55);
  transform    : translateY(-6px);
}
.fas-team-card:nth-child(2) .fas-team-photo {
  width : 116px;
  height: 116px;
  border: 2px solid rgba(var(--fas-gold-rgb),.5);
}

.fas-team-photo {
  width        : 86px;
  height       : 86px;
  border-radius: 50%;
  overflow     : hidden;
  margin       : 0 auto 20px;
  border       : 1px solid rgba(var(--fas-gold-rgb),.25);
}
.fas-team-photo img {
  width      : 100%;
  height     : 100%;
  object-fit : cover;
  display    : block;
}
.fas-team-card h3 { font-size: 18px; margin-bottom: 5px; }
.fas-team-card:nth-child(2) h3 { font-size: 21px; }
.fas-team-role {
  display       : block;
  font-size     : 9.5px;
  font-weight   : 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color         : var(--fas-gold);
  margin-bottom : 14px;
  line-height   : 1.5;
}

/* ================================================================
   CONTACT
================================================================ */
#section-contact { background: transparent; }

.fas-contact-grid {
  display              : grid;
  grid-template-columns: 1fr 1fr;
  gap                  : 72px;
  align-items          : start;
}
.fas-contact-list {
  display   : flex;
  flex-direction: column;
  gap       : 18px;
  margin-top: 32px;
}
.fas-contact-row {
  display    : flex;
  align-items: center;
  gap        : 14px;
  font-size  : 14px;
  color      : rgba(255,255,255,.68);
}
.fas-contact-row svg { width: 18px; height: 18px; fill: var(--fas-gold); flex-shrink: 0; }
.fas-contact-row a:hover { color: var(--fas-gold); }

.fas-contact-btns { display: flex; gap: 14px; flex-wrap: wrap; margin-top: 36px; }

.fas-map-frame {
  border-radius: 8px;
  overflow     : hidden;
  border       : 1px solid rgba(var(--fas-gold-rgb),.14);
  height       : 380px;
}
.fas-map-frame iframe {
  width  : 100%;
  height : 100%;
  border : none;
  display: block;
  filter : grayscale(1) brightness(.8);
}

/* ================================================================
   FOOTER
================================================================ */
#fas-footer {
  background  : #040404;
  border-top  : 1px solid rgba(var(--fas-gold-rgb),.1);
  padding     : 60px 0 0;
}
.fas-footer-grid {
  display              : grid;
  grid-template-columns: 2fr 1fr 1fr;
  gap                  : 60px;
  padding-bottom       : 48px;
  border-bottom        : 1px solid rgba(255,255,255,.05);
}
.fas-footer-logo { height: 42px; width: auto; margin-bottom: 16px; }
.fas-footer-desc { font-size: 13px; color: rgba(255,255,255,.35); max-width: 320px; line-height: 1.75; margin: 0; }
.fas-footer-col h5 {
  font-size     : 10.5px;
  font-weight   : 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  color         : var(--fas-gold);
  margin-bottom : 18px;
}
.fas-footer-col ul { display: flex; flex-direction: column; gap: 10px; }
.fas-footer-col li a {
  font-size : 13px;
  color     : rgba(255,255,255,.4);
  transition: color .2s;
}
.fas-footer-col li a:hover { color: var(--fas-gold); }
.fas-footer-bottom {
  padding   : 22px 0;
  text-align: center;
}
.fas-footer-bottom p { font-size: 12px; color: rgba(255,255,255,.22); margin: 0; }

/* ================================================================
   RESPONSIVE
================================================================ */
@media (max-width: 1024px) {
  /* backdrop-filter traps position:fixed children — remove it on mobile so the nav overlay covers the full viewport */
  #fas-header.scrolled { backdrop-filter: none; -webkit-backdrop-filter: none; background: rgba(9,9,9,.98); }

  .fas-nav-inner  { padding: 0 24px; }
  .fas-container  { padding: 0 24px; }
  .hero-inner     { margin-left: 0; padding-left: 24px; padding-right: 24px; }
  .fas-two-col    { grid-template-columns: 1fr; gap: 44px; }
  .fas-contact-grid { grid-template-columns: 1fr; gap: 48px; }
  .fas-footer-grid  { grid-template-columns: 1fr 1fr; }
  .fas-brands-grid   { grid-template-columns: repeat(2,1fr); }
  .fas-partners-grid { grid-template-columns: repeat(2,1fr); }
  .fas-approach-item { padding: 40px 40px 40px 0; }
  .fas-approach-item:nth-child(even) { padding-left: 40px; }
}
@media (max-width: 768px) {
  :root { --nav-height: 64px; --section-pad: 70px 0; }

  #fas-nav {
    display        : none;
    position       : fixed;
    inset          : 0;
    background     : rgba(9,9,9,.97);
    flex-direction : column;
    align-items    : center;
    justify-content: center;
    gap            : 28px;
    z-index        : 1100;
  }
  #fas-nav.open         { display: flex; }
  #fas-nav-close {
    display        : flex !important;
    position       : absolute;
    top            : 20px; right: 24px;
    background     : none;
    border         : none;
    cursor         : pointer;
    width          : 32px; height: 32px;
    align-items    : center;
    justify-content: center;
  }
  #fas-nav-close span {
    display   : block;
    width     : 20px; height: 2px;
    background: #fff;
    position  : absolute;
  }
  #fas-nav-close span:first-child { transform: rotate(45deg); }
  #fas-nav-close span:last-child  { transform: rotate(-45deg); }
  #fas-nav a      { font-size: 18px; }
  #fas-menu-btn   { display: flex; }
  .fas-hdr-cta    { display: none; }

  /* dropdown flattens into the overlay menu */
  .fas-nav-drop,
  .fas-nav-drop-menu,
  .fas-nav-drop-panel { display: contents; }
  .fas-nav-drop-menu  { visibility: visible; }
  .fas-nav-drop-trigger { display: none; }
  #fas-nav .fas-nav-drop-panel a { padding: 0; background: none; }

  /* contact link returns in the mobile menu (header CTA is hidden here) */
  .fas-nav-contact { display: block; }

  .fas-brands-grid { grid-template-columns: 1fr; }
  .fas-vm-grid     { grid-template-columns: 1fr; }
  .fas-team-grid              { grid-template-columns: 1fr; max-width: 380px; }
  .fas-team-card:nth-child(2) { order: -1; padding: 40px 24px; }
  .fas-footer-grid { grid-template-columns: 1fr; gap: 36px; }
  .fas-footer-desc { max-width: 100%; }
  .hero-main-logo  { height: 60px; }
  .hero-inner      { margin-left: 0; }
}
@media (max-width: 480px) {
  .hero-btns { flex-direction: column; align-items: flex-start; }
  .fas-stats         { gap: 24px; }
  .fas-partners-grid { grid-template-columns: 1fr; }
}
@media (max-width: 768px) {
  .fas-approach-grid { grid-template-columns: 1fr; }
  .fas-approach-item {
    padding     : 36px 0;
    border-right: none !important;
    border-bottom: 1px solid rgba(255,255,255,.1);
  }
  .fas-approach-item:nth-child(even) { padding-left: 0; }
  .fas-approach-item:last-child { border-bottom: none; }
}

/* ================================================================
   LANGUAGE SWITCHER
================================================================ */
.lang-switcher {
  position     : relative;
  display      : inline-flex;
  align-items  : center;
  background   : rgba(255,255,255,.03);
  border       : 1px solid rgba(var(--fas-gold-rgb), .35);
  border-radius: 999px;
  padding      : 3px;
}
.lang-switcher-thumb {
  position     : absolute;
  top          : 3px;
  left         : 3px;
  width        : calc(50% - 3px);
  height       : calc(100% - 6px);
  background   : var(--fas-gold);
  border-radius: 999px;
  transition   : transform .3s cubic-bezier(.4,0,.2,1);
  z-index      : 1;
}
.lang-switcher.ar-active .lang-switcher-thumb {
  transform: translateX(100%);
}
.lang-opt {
  position      : relative;
  z-index       : 2;
  background    : none;
  border        : none;
  color         : rgba(255,255,255,.5);
  font-family   : 'Manrope', sans-serif;
  font-size     : 10.5px;
  font-weight   : 800;
  cursor        : pointer;
  padding       : 5px 12px;
  border-radius : 999px;
  letter-spacing: 1px;
  transition    : color .25s;
  line-height   : 1;
  min-width     : 34px;
}
.lang-opt.active { color: #0c0c0c; }
.lang-opt:hover:not(.active) { color: rgba(255,255,255,.85); }

/* ================================================================
   ARABIC / RTL OVERRIDES
   Applied when <html dir="rtl"> is set by fas-i18n.js
================================================================ */
[dir="rtl"] body,
[dir="rtl"] h1,
[dir="rtl"] h2,
[dir="rtl"] h3,
[dir="rtl"] h4,
[dir="rtl"] p,
[dir="rtl"] span,
[dir="rtl"] a,
[dir="rtl"] li {
  font-family: 'Cairo', Helvetica, Arial, sans-serif;
}
[dir="rtl"] h1, [dir="rtl"] h2, [dir="rtl"] h3 { letter-spacing: 0; }

/* Arabic is a connected script — any letter-spacing severs letter joins */
[dir="rtl"] * { letter-spacing: 0 !important; }

[dir="rtl"] .fas-label { flex-direction: row-reverse; }
[dir="rtl"] .fas-label::before { margin: 0; }

[dir="rtl"] .fas-divider { margin-left: auto; }
[dir="rtl"] #section-about .fas-divider,
[dir="rtl"] #section-contact .fas-divider { margin-left: 0; }

[dir="rtl"] .fas-brand-cta,
[dir="rtl"] #fas-nav-close span,
[dir="rtl"] .hero-btns,
[dir="rtl"] .fas-contact-btns,
[dir="rtl"] .fas-stats {
  direction: ltr;
}
[dir="rtl"] .fas-brand-cta { flex-direction: row-reverse; }
[dir="rtl"] .fas-brand-cta svg { transform: scaleX(-1); }

[dir="rtl"] .fas-stats { justify-content: flex-start; }
[dir="rtl"] .fas-stat { direction: rtl; }

[dir="rtl"] .fas-phone-num { unicode-bidi: isolate; }

/* RTL mobile overrides — placed after global RTL rules so they win */
@media (max-width: 480px) {
  [dir="rtl"] .hero-btns { align-items: flex-end; }
}
@media (max-width: 768px) {
  [dir="rtl"] .fas-approach-item             { padding: 36px 0; }
  [dir="rtl"] .fas-approach-item:nth-child(odd)  { border-left: none; border-bottom: 1px solid rgba(255,255,255,.1); }
  [dir="rtl"] .fas-approach-item:nth-child(even) { padding-right: 0; }
  [dir="rtl"] .fas-approach-item:last-child  { border-bottom: none; }
}

/* Hero RTL alignment */
[dir="rtl"] #section-hero { text-align: right; }
[dir="rtl"] .hero-inner {
  margin-left : 0;
  margin-right: max(0px, calc((100vw - var(--container-w)) / 2));
  padding-left: 20px;
  padding-right: 20px;
}
[dir="rtl"] .hero-btns { justify-content: flex-end; }

/* Eyebrow: larger + no letter-spacing for Arabic */
[dir="rtl"] .hero-eyebrow {
  font-size     : 14px;
  letter-spacing: 0.5px;
  padding       : 9px 22px;
}

/* ================================================================
   HERO FACTS BAND — group figures strip under the hero
================================================================ */
.fas-hero-band {
  position      : relative;
  z-index       : 2;
  background    : var(--fas-dark-2);
  border-top    : 1px solid rgba(var(--fas-gold-rgb), .3);
}
.fas-band-grid {
  display              : grid;
  grid-template-columns: repeat(4, 1fr);
}
.fas-band-item {
  padding        : 32px 18px 28px;
  text-align     : center;
  display        : flex;
  flex-direction : column;
  gap            : 5px;
  border-inline-end: 1px solid rgba(255,255,255,.07);
}
.fas-band-item:last-child { border-inline-end: none; }
.fas-band-num {
  font-family : 'Manrope', sans-serif;
  font-size   : clamp(30px, 3vw, 38px);
  font-weight : 800;
  color       : var(--fas-gold);
  line-height : 1.1;
}
.fas-band-lbl {
  font-size      : 11.5px;
  font-weight    : 600;
  letter-spacing : 1.6px;
  text-transform : uppercase;
  color          : rgba(255,255,255,.55);
}
@media (max-width: 768px) {
  .fas-band-grid { grid-template-columns: 1fr 1fr; }
  .fas-band-item { border-bottom: 1px solid rgba(255,255,255,.07); padding: 26px 14px 22px; }
  .fas-band-item:nth-child(even) { border-inline-end: none; }
  .fas-band-item:nth-last-child(-n+2) { border-bottom: none; }
  .fas-band-lbl { font-size: 10.5px; letter-spacing: 1.2px; }
}

/* ================================================================
   MARQUEE — scrolling brands & sectors strip
================================================================ */
.fas-marquee {
  position      : relative;
  z-index       : 2;
  background    : rgba(9,9,9,.65);
  border-top    : 1px solid rgba(255,255,255,.06);
  border-bottom : 1px solid rgba(255,255,255,.06);
  padding       : 17px 0;
  overflow      : hidden;
}
.fas-marquee-track {
  display     : flex;
  gap         : 58px;
  width       : max-content;
  white-space : nowrap;
  animation   : fas-mq-scroll 38s linear infinite;
}
.fas-marquee:hover .fas-marquee-track { animation-play-state: paused; }
.fas-marquee-item {
  display        : flex;
  align-items    : center;
  gap            : 15px;
  font-size      : 11px;
  font-weight    : 700;
  letter-spacing : 2.5px;
  text-transform : uppercase;
  color          : rgba(255,255,255,.35);
}
.fas-marquee-item .fas-mq-diamond {
  width       : 6px;
  height      : 6px;
  background  : rgba(var(--fas-gold-rgb), .6);
  transform   : rotate(45deg);
  flex-shrink : 0;
}
@keyframes fas-mq-scroll {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}
