/* ======================================================
   FORLIFE ILAÇ DESIGN SYSTEM & THEMES
   Supports dynamic switching between:
   1) Pure Clean White Theme (Default / Light)
   2) Deep Oceanic Navy Theme (Dark / Previous)
====================================================== */

:root{
  /* Light Theme Tokens */
  --pearl:#FFFFFF;
  --pearl-deep:#F4F8FB;
  --silver-mist:#E8F1F6;
  --ink:#0A233C;
  --ink-soft:#43617D;
  --cyan:#00A8BE;
  --cyan-deep:#007B8E;
  --cyan-bright:#00CDE0;
  --accent-rgb:0,205,224;
  --accent-deep-rgb:0,123,142;
  --navy-deep:#071B2F;
  --navy-mid:#0D3357;
  --gold:#00B4D8;
  --gold-soft:#90E0EF;
  --blush:#E3F2F7;
  --white:#FFFFFF;
  --card-bg:#FFFFFF;
  --navbar-bg:rgba(255,255,255,0.88);
  --line:rgba(10,35,60,0.08);
  --shadow-soft:0 24px 60px -20px rgba(10,35,60,0.10);
  --shadow-tight:0 8px 24px -10px rgba(10,35,60,0.08);
  --shadow-cyan:0 12px 30px -8px rgba(var(--accent-deep-rgb),0.30);
  --radius-lg:28px;
  --radius-pill:999px;
  --ease:cubic-bezier(.16,.8,.24,1);
  --maxw:1280px;
  --font-display:'Manrope', 'Segoe UI', sans-serif;
  --font-body:'Inter', 'Segoe UI', sans-serif;

  /* Specific Section Backgrounds (Light) */
  --hero-bg: radial-gradient(1000px 600px at 80% 20%, rgba(var(--accent-rgb),0.12), transparent 60%), radial-gradient(900px 600px at 15% 85%, rgba(13,51,87,0.06), transparent 55%), linear-gradient(180deg, #FFFFFF 0%, #F5FAFD 100%);
  --about-bg: #FFFFFF;
  --companies-bg: #F6FAFC;
  --industries-bg: linear-gradient(180deg, #EEF6FA 0%, #F8FBFD 100%);
  --products-bg: linear-gradient(180deg, #F4F9FC 0%, #FFFFFF 100%);
  --products-text: var(--ink);
  --products-card-bg: #FFFFFF;
  --brands-bg: #FFFFFF;
  --why-bg: #F6FAFC;
  --global-bg: linear-gradient(160deg, #FFFFFF 0%, #F0F7FB 100%);
  --global-text: var(--ink);
  --quality-bg: #FFFFFF;
  --news-bg: #F6FAFC;
  --contact-bg: linear-gradient(160deg, #F5FAFD 0%, #FFFFFF 100%);
  --contact-text: var(--ink);
  --contact-card-bg: #FFFFFF;
  --footer-bg: #FFFFFF;
  --footer-text: var(--ink-soft);
  --globe-stroke: rgba(10,35,60,0.12);
}

/* ============ DEEP NAVY / PREVIOUS THEME ============ */
[data-theme="deep"]{
  --pearl:#071D33;
  --pearl-deep:#040F1D;
  --silver-mist:#0C2844;
  --ink:#F0F7FA;
  --ink-soft:#9EC1D9;
  --cyan:#00C7DE;
  --cyan-deep:#008A9E;
  --cyan-bright:#00F0FF;
  --accent-rgb:0,240,255;
  --accent-deep-rgb:0,138,158;
  --navy-deep:#051424;
  --navy-mid:#0B2A48;
  --gold:#00B4D8;
  --gold-soft:#90E0EF;
  --blush:#163A5C;
  --white:#0B253F;
  --card-bg:#092138;
  --navbar-bg:rgba(7,29,51,0.85);
  --line:rgba(var(--accent-rgb),0.14);
  --shadow-soft:0 30px 80px -30px rgba(0,0,0,0.5);
  --shadow-tight:0 10px 30px -12px rgba(0,0,0,0.35);
  --shadow-cyan:0 10px 30px -8px rgba(var(--accent-rgb),0.35);

  /* Specific Section Backgrounds (Deep Theme) */
  --hero-bg: radial-gradient(1200px 700px at 78% 18%, rgba(var(--accent-rgb),0.18), transparent 60%), radial-gradient(900px 600px at 15% 85%, rgba(var(--accent-deep-rgb),0.15), transparent 55%), linear-gradient(180deg, #071D33 0%, #040F1D 100%);
  --about-bg: #071D33;
  --companies-bg: #05182B;
  --industries-bg: linear-gradient(180deg, #040F1D 0%, #061829 100%);
  --products-bg: linear-gradient(180deg, #040F1D 0%, #071D33 100%);
  --products-text: #FFFFFF;
  --products-card-bg: rgba(255,255,255,0.04);
  --brands-bg: #071D33;
  --why-bg: #05182B;
  --global-bg: linear-gradient(160deg, #040F1D 0%, #071F36 100%);
  --global-text: #FFFFFF;
  --quality-bg: #071D33;
  --news-bg: #05182B;
  --contact-bg: linear-gradient(160deg, #040F1D 0%, #0A2642 100%);
  --contact-text: #FFFFFF;
  --contact-card-bg: rgba(255,255,255,0.05);
  --footer-bg: #030C17;
  --footer-text: rgba(240,247,250,0.65);
  --globe-stroke: rgba(var(--accent-rgb),0.18);
}

html[dir="rtl"]{
  --font-display:'Tajawal','Manrope', sans-serif;
  --font-body:'Tajawal','Inter', sans-serif;
}

*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
@media (prefers-reduced-motion: reduce){ html{scroll-behavior:auto;} *{animation-duration:0.001ms !important; transition-duration:0.001ms !important;} }
body{
  background:var(--pearl);
  color:var(--ink);
  font-family:var(--font-body);
  font-weight:400;
  line-height:1.6;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  transition:background .4s ease, color .4s ease;
}
img{max-width:100%; display:block;}
a{color:inherit; text-decoration:none;}
button{font-family:inherit; cursor:pointer; border:none; background:none; color:inherit;}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 clamp(20px,5vw,64px);}
section{position:relative;}
/* 3D perspective on section wrappers for scroll reveals */
#companies .wrap, #products .wrap, #industries .wrap,
#why .wrap, #about .wrap,
#news .wrap, #global .wrap, #quality .wrap, #contact .wrap{
  perspective: 1200px;
  perspective-origin: 50% 40%;
}

h1,h2,h3,h4{font-family:var(--font-display); font-weight:700; letter-spacing:-0.01em; color:var(--ink);}
.eyebrow{
  font-size:13px; font-weight:700; letter-spacing:0.05em; color:var(--cyan-deep);
  display:inline-flex; align-items:center; gap:10px; margin-bottom:18px; text-transform:uppercase;
}
[data-theme="deep"] .eyebrow{ color:var(--cyan-bright); }
.eyebrow::before{content:""; width:22px; height:2.5px; background:linear-gradient(90deg, var(--cyan-deep), var(--cyan-bright)); border-radius:2px;}
.lead{font-size:clamp(16px,1.6vw,19px); color:var(--ink-soft); max-width:560px;}

/* Buttons */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  padding:16px 32px; border-radius:var(--radius-pill); font-size:15px; font-weight:600;
  transition:transform .5s var(--ease), box-shadow .5s var(--ease), background .4s ease;
  white-space:nowrap;
}
.btn-primary{ 
  background:linear-gradient(135deg, var(--navy-mid) 0%, var(--cyan-deep) 100%); 
  color:#FFFFFF; 
  box-shadow:var(--shadow-cyan); 
}
.btn-primary:hover{ transform:translateY(-3px); box-shadow:0 20px 40px -10px rgba(var(--accent-deep-rgb),0.45); }
.btn-ghost{ background:var(--white); color:var(--ink); border:1.5px solid var(--line); box-shadow:var(--shadow-tight); }
.btn-ghost:hover{ border-color:var(--cyan); color:var(--cyan-deep); transform:translateY(-3px); }
.btn-light{ background:#FFFFFF; color:var(--navy-mid); box-shadow:var(--shadow-tight); font-weight:700;}
.btn-light:hover{ transform:translateY(-3px); }
.btn-outline-light{ border:1.5px solid var(--cyan-deep); color:var(--cyan-deep); background:rgba(var(--accent-deep-rgb),0.06); }
[data-theme="deep"] .btn-outline-light{ border-color:var(--cyan-bright); color:#FFFFFF; background:rgba(var(--accent-rgb),0.12); }
.btn-outline-light:hover{ background:var(--cyan-deep); color:#FFFFFF; transform:translateY(-3px); }

/* ============ NAV ============ */
#navbar{
  position:fixed; top:0; left:0; right:0; z-index:900;
  padding:16px 0; transition:padding .4s var(--ease), background .4s ease, box-shadow .4s ease;
  background:var(--navbar-bg); backdrop-filter:blur(18px);
}
#navbar .wrap{ display:flex; align-items:center; justify-content:space-between; }
#navbar.scrolled{
  padding:10px 0; background:var(--navbar-bg); backdrop-filter:blur(20px) saturate(160%);
  -webkit-backdrop-filter:blur(20px) saturate(160%); box-shadow:0 1px 0 var(--line), 0 10px 30px -10px rgba(0,0,0,0.06);
}

/* Brand Logo */
.brand-logo-wrap{ display:flex; align-items:center; gap:12px; text-decoration:none; }
.brand-logo-img{ 
  height:44px; width:44px; object-fit:contain; border-radius:10px; 
  box-shadow:0 4px 12px rgba(0,0,0,0.08); 
  background:#FFFFFF; padding:2px; border:1px solid rgba(0,0,0,0.06);
  transition:transform .3s var(--ease);
}
.brand-logo-wrap:hover .brand-logo-img{ transform:scale(1.05); }
.brand-name-text{
  font-family:var(--font-display); font-weight:800; font-size:20px; 
  letter-spacing:-0.02em; color:var(--ink);
  display:flex; flex-direction:column; line-height:1.1;
}
.brand-name-text small{
  font-size:11px; font-weight:700; letter-spacing:0.1em; text-transform:uppercase;
  color:var(--cyan-deep);
}
[data-theme="deep"] .brand-name-text small{ color:var(--cyan-bright); }

.navlinks{ display:flex; align-items:center; gap:32px; }
.navlinks a{ font-size:14.5px; font-weight:600; color:var(--ink-soft); position:relative; padding:4px 0; transition:color .3s ease;}
.navlinks a:hover{ color:var(--cyan); }
.navlinks a::after{content:""; position:absolute; left:0; bottom:-2px; width:0; height:2px; background:linear-gradient(90deg, var(--cyan-deep), var(--cyan-bright)); transition:width .35s var(--ease); border-radius:2px;}
.navlinks a:hover::after{ width:100%; }
.nav-right{ display:flex; align-items:center; gap:14px; }

/* THEME TOGGLE SWITCH */
.theme-toggle{
  display:inline-flex; align-items:center; gap:8px;
  padding:7px 14px; border-radius:var(--radius-pill);
  border:1.5px solid var(--line); background:var(--white);
  color:var(--ink); font-size:13px; font-weight:700;
  cursor:pointer; transition:all .3s ease; box-shadow:var(--shadow-tight);
}
.theme-toggle:hover{ border-color:var(--cyan); transform:translateY(-2px); }
.theme-icon{ font-size:14px; line-height:1; }
[data-theme="deep"] .light-icon{ display:none; }
[data-theme="deep"] .dark-icon{ display:inline-block; }
:root:not([data-theme="deep"]) .dark-icon{ display:none; }
:root:not([data-theme="deep"]) .light-icon{ display:inline-block; }

/* LANGUAGE DROPDOWN */
.lang-dd{ position:relative; }
.lang-dd-btn{
  display:inline-flex; align-items:center; gap:8px;
  font-size:13px; font-weight:700; border:1.5px solid var(--line); border-radius:var(--radius-pill);
  padding:7px 14px; color:var(--ink-soft); background:var(--white);
  cursor:pointer; transition:all .3s ease; box-shadow:var(--shadow-tight);
}
.lang-dd-btn:hover{ border-color:var(--cyan); color:var(--cyan); }
.lang-dd-flag{ width:20px; height:14px; flex:0 0 auto; display:inline-flex; align-items:center; justify-content:center; overflow:hidden; border-radius:3px; box-shadow:0 0 0 1px rgba(4,18,31,0.12); }
.lang-dd-flag svg{ width:100%; height:100%; display:block; }
.lang-dd-code{ letter-spacing:0.05em; }
.lang-dd-caret{ transition:transform .3s ease; opacity:.65; }
.lang-dd.open .lang-dd-caret{ transform:rotate(180deg); }
.lang-dd-menu{
  position:absolute; top:calc(100% + 8px); inset-inline-end:0;
  min-width:168px; padding:6px; margin:0; list-style:none;
  background:var(--white); border:1px solid var(--line); border-radius:14px;
  box-shadow:0 20px 44px -16px rgba(4,18,31,0.30);
  opacity:0; visibility:hidden; transform:translateY(-6px); pointer-events:none;
  transition:opacity .22s ease, transform .22s ease, visibility .22s;
  z-index:120;
}
.lang-dd.open .lang-dd-menu{ opacity:1; visibility:visible; transform:translateY(0); pointer-events:auto; }
.lang-dd-item{
  display:flex; align-items:center; gap:10px;
  padding:9px 12px; border-radius:9px; cursor:pointer;
  font-size:13.5px; font-weight:600; color:var(--ink-soft);
  transition:background .2s ease, color .2s ease;
}
.lang-dd-item:hover{ background:rgba(var(--accent-rgb),0.10); color:var(--ink); }
.lang-dd-item.is-active{ background:rgba(var(--accent-rgb),0.14); color:var(--cyan-deep); }
[data-theme="deep"] .lang-dd-item.is-active{ color:var(--cyan-bright); }
.nav-cta{ 
  display:inline-flex; padding:12px 24px; border-radius:var(--radius-pill); 
  background:linear-gradient(135deg, var(--navy-mid), var(--cyan-deep)); 
  color:#FFFFFF; font-size:14px; font-weight:600; 
  box-shadow:var(--shadow-cyan);
  transition:transform .4s var(--ease), box-shadow .4s var(--ease);
}
.nav-cta:hover{ transform:translateY(-2px); box-shadow:0 14px 28px -8px rgba(var(--accent-deep-rgb),0.45); }
.burger{ display:none; flex-direction:column; gap:5px; width:26px; }
.burger span{ height:2px; background:var(--ink); border-radius:2px; transition:transform .3s ease, opacity .3s ease; }

/* ============ HERO (CENTERED & CLEAN ARCHITECTURE) ============ */
#hero{
  position:relative; min-height:92vh; display:flex; align-items:center; justify-content:center;
  padding-top:130px; padding-bottom:70px;
  background:transparent;
  overflow:hidden; text-align:center;
}
.hero-video-bg, .section-video-bg{
  position:absolute; inset:0; width:100%; height:100%; overflow:hidden; z-index:0; pointer-events:none;
}
.bg-video{
  width:100%; height:100%; object-fit:cover; opacity:0.75;
  filter:contrast(105%) brightness(1.02);
  transition:opacity .5s ease;
}
[data-theme="deep"] .bg-video{ 
  opacity:0.65; filter:contrast(110%) brightness(0.95); 
}

.video-overlay{
  position:absolute; inset:0;
  background:radial-gradient(ellipse at center, rgba(255,255,255,0.42) 0%, rgba(255,255,255,0.76) 85%);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}
[data-theme="deep"] .video-overlay{
  background:radial-gradient(ellipse at center, rgba(7,29,51,0.48) 0%, rgba(4,15,29,0.84) 85%);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}

.contact-overlay{
  position:absolute; inset:0;
  background:linear-gradient(180deg, 
    rgba(255,255,255,0.42) 0%, 
    rgba(240,247,251,0.58) 55%, 
    rgba(240,247,251,0.88) 82%, 
    var(--footer-bg) 100%
  );
  backdrop-filter:blur(2px);
  -webkit-backdrop-filter:blur(2px);
  pointer-events:none;
}
[data-theme="deep"] .contact-overlay{
  background:linear-gradient(180deg, 
    rgba(4,15,29,0.46) 0%, 
    rgba(7,24,44,0.62) 55%, 
    rgba(7,19,33,0.90) 82%, 
    var(--footer-bg) 100%
  );
  backdrop-filter:blur(2px);
  -webkit-backdrop-filter:blur(2px);
}

#contact .bg-video{
  object-fit:cover;
  object-position:center 28%;
  opacity:0.88;
}
[data-theme="deep"] #contact .bg-video{
  opacity:0.75;
}

#contact ~ footer{
  border-top:none;
}

#hero .wrap, #contact .wrap{ position:relative; z-index:2; }
.hero-centered{
  max-width:920px; margin:0 auto; display:flex; flex-direction:column; align-items:center;
  background:none; padding:0; border:none; box-shadow:none;
}
[data-theme="deep"] .hero-centered{
  background:none; border:none; box-shadow:none;
}
.hero-copy .eyebrow{ opacity:0; }
.hero-title{
  font-size:clamp(44px, 6.2vw, 82px); line-height:1.06; letter-spacing:-0.025em; margin-bottom:28px;
}
.hero-title .line{ display:block; overflow:hidden; }
.hero-title .line span{ display:inline-block; transform:translateY(110%); }
.hero-title .accent{ 
  background:linear-gradient(110deg, var(--navy-mid) 0%, var(--cyan-deep) 60%, var(--cyan-bright) 100%); 
  -webkit-background-clip:text; background-clip:text; color:transparent; 
}
[data-theme="deep"] .hero-title .accent{
  background:linear-gradient(110deg, #FFFFFF 0%, var(--cyan-bright) 60%, var(--cyan) 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.hero-sub{ 
  font-size:clamp(17px,1.6vw,20px); color:var(--ink-soft); max-width:680px; 
  margin:0 auto 44px; opacity:0; line-height:1.65;
}
.hero-ctas{ display:flex; gap:16px; justify-content:center; flex-wrap:wrap; opacity:0; }
.hero-stats-mini{ 
  display:grid; grid-template-columns:repeat(3, 1fr); gap:24px; 
  margin-top:56px; opacity:0; width:100%; max-width:640px;
}
.hero-stat-box{
  background:var(--card-bg); border-radius:20px; padding:22px 18px;
  border:1px solid var(--line); box-shadow:var(--shadow-tight);
  transition:transform .3s var(--ease), box-shadow .3s var(--ease);
}
.hero-stat-box:hover{
  transform:translateY(-3px); box-shadow:var(--shadow-soft); border-color:var(--cyan);
}
.hero-stat-box b{ 
  display:block; font-family:var(--font-display); font-size:32px; font-weight:800; margin-bottom:4px;
  background:linear-gradient(135deg, var(--navy-mid), var(--cyan-deep));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
[data-theme="deep"] .hero-stat-box b{
  background:linear-gradient(135deg, #FFFFFF, var(--cyan-bright));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.hero-stat-box span{ font-size:13.5px; color:var(--ink-soft); font-weight:600;}

.scroll-indicator{
  position:absolute; bottom:22px; left:50%; transform:translateX(-50%);
  display:flex; flex-direction:column; align-items:center; gap:10px; opacity:0.75;
}
.scroll-indicator .dash{ width:2px; height:38px; background:linear-gradient(180deg, var(--cyan-deep), transparent); position:relative; overflow:hidden; border-radius:2px;}
.scroll-indicator .dash::after{ content:""; position:absolute; top:-38px; left:0; width:100%; height:38px; background:var(--cyan-bright); animation:scrolldash 2.2s ease-in-out infinite; }
@keyframes scrolldash{ 0%{top:-38px;} 60%{top:38px;} 100%{top:38px;} }
.scroll-indicator span{ font-size:11px; letter-spacing:0.12em; color:var(--cyan-deep); font-weight:700;}
[data-theme="deep"] .scroll-indicator span{ color:var(--cyan-bright); }

/* ============ GENERIC SECTION HEADS ============ */
.section-pad{ padding:120px 0; }
.section-head{ max-width:640px; margin-bottom:68px; }
.section-head.center{ margin-left:auto; margin-right:auto; text-align:center; }
.section-title{ font-size:clamp(30px,4vw,48px); line-height:1.15; margin-bottom:20px; color:var(--ink);}
.split-line{ display:inline-block; overflow:hidden; vertical-align:top; }
.split-line > span{ display:inline-block; transform:translateY(110%); will-change:transform; }

/* ============ ABOUT / STATS ============ */
#about{ background:var(--about-bg); }
.about-grid{ display:grid; grid-template-columns:1fr 1fr; gap:70px; align-items:center; }
.about-feature-card{
  position:relative;
  border-radius:24px;
  overflow:hidden;
  border:1px solid var(--line);
  background:var(--card-bg);
  box-shadow:var(--shadow-soft);
  transition:transform 0.4s var(--ease), box-shadow 0.4s var(--ease), border-color 0.4s var(--ease);
}
.about-feature-card:hover{
  transform:translateY(-5px);
  border-color:rgba(var(--accent-rgb),0.4);
  box-shadow:0 24px 48px -12px rgba(0,30,60,0.14);
}
[data-theme="deep"] .about-feature-card:hover{
  box-shadow:0 24px 48px -12px rgba(0,0,0,0.45);
}
.about-card-glow{
  position:absolute; top:0; right:0; width:260px; height:260px;
  background:radial-gradient(circle, rgba(var(--accent-rgb),0.18) 0%, transparent 70%);
  pointer-events:none; filter:blur(40px);
}
.about-card-inner{
  position:relative; z-index:1; padding:38px 34px;
  display:flex; flex-direction:column; gap:26px;
}
.about-card-header{
  display:flex; align-items:center; justify-content:space-between;
  padding-bottom:18px; border-bottom:1px solid var(--line);
}
.about-card-badge{
  display:inline-flex; align-items:center; gap:8px;
  font-size:12px; font-weight:700; color:var(--cyan-deep);
  background:rgba(var(--accent-rgb),0.1); border:1px solid rgba(var(--accent-rgb),0.25);
  padding:6px 14px; border-radius:30px;
}
[data-theme="deep"] .about-card-badge{
  color:var(--cyan-bright); background:rgba(var(--accent-rgb),0.15);
}
.about-card-badge .badge-dot{
  width:7px; height:7px; border-radius:50%; background:var(--cyan-bright);
  box-shadow:0 0 8px var(--cyan-bright);
}
.about-card-tag{
  font-size:11px; font-weight:700; letter-spacing:0.08em; color:var(--ink-soft);
}
.about-highlights-list{
  display:flex; flex-direction:column; gap:20px;
}
.about-hl-item{
  display:flex; align-items:flex-start; gap:16px;
  padding:14px; border-radius:14px; background:rgba(var(--accent-deep-rgb),0.03);
  border:1px solid rgba(var(--accent-deep-rgb),0.06);
  transition:background 0.3s ease, border-color 0.3s ease, transform 0.3s ease;
}
.about-hl-item:hover{
  background:rgba(var(--accent-rgb),0.07);
  border-color:rgba(var(--accent-rgb),0.22);
  transform:translateX(4px);
}
[dir="rtl"] .about-hl-item:hover{
  transform:translateX(-4px);
}
.about-hl-icon{
  width:44px; height:44px; min-width:44px; border-radius:12px;
  background:linear-gradient(135deg, rgba(var(--accent-rgb),0.15), rgba(11,42,72,0.1));
  display:flex; align-items:center; justify-content:center;
  color:var(--cyan-deep); border:1px solid rgba(var(--accent-rgb),0.25);
}
[data-theme="deep"] .about-hl-icon{
  color:var(--cyan-bright); background:linear-gradient(135deg, rgba(var(--accent-rgb),0.25), rgba(6,22,38,0.6));
}
.about-hl-text h4{
  font-size:15px; font-weight:700; color:var(--ink); margin-bottom:4px;
}
.about-hl-text p{
  font-size:13px; color:var(--ink-soft); line-height:1.45; margin:0;
}
.about-card-footer{
  padding-top:18px; border-top:1px solid var(--line);
}
.about-trust-stamp{
  display:flex; align-items:center; gap:14px;
  padding:12px 16px; border-radius:14px;
  background:linear-gradient(135deg, rgba(var(--accent-rgb),0.08), rgba(var(--accent-deep-rgb),0.04));
  border:1px solid rgba(var(--accent-rgb),0.18);
}
.stamp-icon{ font-size:24px; }
.stamp-text strong{
  display:block; font-size:13px; font-weight:800; color:var(--ink);
}
.stamp-text small{
  display:block; font-size:11.5px; color:var(--ink-soft); margin-top:2px;
}

.stat-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:26px; margin-top:44px; }
.stat-card{ 
  padding:28px 26px; background:var(--card-bg); border-radius:20px; 
  box-shadow:var(--shadow-tight); border:1px solid var(--line);
  transition:transform .4s var(--ease), box-shadow .4s var(--ease);
}
.stat-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow-soft); border-color:var(--cyan); }
.stat-num{ 
  font-family:var(--font-display); font-weight:800; font-size:clamp(30px,3vw,42px); 
  background:linear-gradient(120deg, var(--navy-mid) 0%, var(--cyan-deep) 60%, var(--cyan) 100%); 
  -webkit-background-clip:text; background-clip:text; color:transparent; 
}
[data-theme="deep"] .stat-num{
  background:linear-gradient(120deg, #FFFFFF 0%, var(--cyan-bright) 70%, var(--cyan) 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.stat-label{ font-size:13.5px; color:var(--ink-soft); margin-top:6px; font-weight:600;}

/* ============ COMPANIES ============ */
#companies{ background:var(--companies-bg); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.company-grid{ display:grid; grid-template-columns:repeat(5,1fr); gap:16px; perspective:1400px; }
.company-card{
  position:relative; background:var(--card-bg); border-radius:20px; padding:0;
  border:1px solid var(--line); overflow:hidden; transition:transform .5s var(--ease), box-shadow .5s var(--ease), border-color .5s var(--ease);
  transform-style:preserve-3d; box-shadow:var(--shadow-tight); display:flex; flex-direction:column;
}
.company-card::before{
  content:""; position:absolute; inset:0; opacity:0; transition:opacity .5s ease; z-index:1;
  background:radial-gradient(500px 300px at var(--mx,50%) var(--my,50%), rgba(var(--accent-rgb),0.14), transparent 60%);
  pointer-events:none;
}
.company-card:hover::before{ opacity:1; }
.company-card:hover{ box-shadow:var(--shadow-soft); border-color:var(--cyan); }

/* Company Card Hero Cover - Fully Visible Logo Without Any Cropping */
.co-cover-wrap{
  position:relative;
  width:100%;
  height:175px;
  background:#FFFFFF;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
  border-bottom:1px solid rgba(0, 0, 0, 0.06);
}
[data-theme="deep"] .co-cover-wrap{
  background:#FFFFFF;
  border-bottom:1px solid rgba(255, 255, 255, 0.08);
}
.co-cover-gg{
  background:#0277bd !important;
}
.co-full-cover-img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
  display:block;
  padding:14px 20px;
  box-sizing:border-box;
  image-rendering:-webkit-optimize-contrast;
  transition:transform 0.4s ease;
}
.company-card:hover .co-full-cover-img{
  transform:scale(1.04);
}
.co-mark-lg{
  font-size:38px;
  font-weight:900;
  color:#FFFFFF;
  letter-spacing:2px;
  z-index:2;
  text-shadow:0 6px 18px rgba(0,0,0,0.5);
}

.co-cover-badge{
  position:absolute;
  bottom:10px;
  right:12px;
  left:12px;
  z-index:2;
  display:flex;
  align-items:center;
  justify-content:flex-start;
}
[dir="rtl"] .co-cover-badge{
  justify-content:flex-start;
}
.co-partner-tag{
  position:absolute;
  top:12px;
  right:12px;
  z-index:2;
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:4px 10px;
  border-radius:var(--radius-pill);
  background:rgba(5, 24, 43, 0.75);
  border:1px solid rgba(0, 229, 255, 0.35);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  color:#FFFFFF;
  font-size:10px;
  font-weight:700;
  letter-spacing:0.02em;
  box-shadow:0 4px 12px rgba(0,0,0,0.3);
}
[dir="rtl"] .co-partner-tag{
  right:auto;
  left:12px;
}
.co-partner-dot{
  width:6px;
  height:6px;
  border-radius:50%;
  background:#10B981;
  box-shadow:0 0 8px #10B981;
  display:inline-block;
  animation:coPartnerPulse 2s infinite ease-in-out;
}
@keyframes coPartnerPulse{
  0%, 100%{ transform:scale(1); opacity:1; }
  50%{ transform:scale(1.4); opacity:0.6; }
}

.co-mark-banner{
  height:170px;
  display:flex;
  align-items:center;
  justify-content:center;
}
.co-mark-lg{
  font-size:42px;
  font-weight:900;
  font-family:var(--font-display);
  color:#FFFFFF;
  letter-spacing:2px;
  text-shadow:0 8px 24px rgba(0,0,0,0.4);
}

.co-body{
  position:relative;
  z-index:2;
  display:flex;
  flex-direction:column;
  flex:1;
  padding:14px 14px 18px;
}
.co-header-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:8px;
}
.co-meta-pill{
  display:inline-flex;
  align-items:center;
  gap:4px;
  font-size:11px;
  font-weight:700;
  padding:3px 9px;
  border-radius:var(--radius-pill);
  background:rgba(var(--accent-rgb),0.1);
  color:var(--cyan-deep);
  border:1px solid rgba(var(--accent-rgb),0.2);
  white-space:nowrap;
  flex-shrink:0;
}
[data-theme="deep"] .co-meta-pill{
  color:var(--cyan-bright);
  background:rgba(var(--accent-rgb),0.15);
  border-color:rgba(var(--accent-rgb),0.3);
}
.co-trust-row{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:6px;
  margin-bottom:12px;
}
.co-cert-pill{
  display:inline-flex;
  align-items:center;
  gap:4px;
  font-size:10.5px;
  font-weight:700;
  padding:2px 8px;
  border-radius:6px;
  background:var(--silver-mist);
  color:var(--ink-soft);
  border:1px solid var(--line);
}
[data-theme="deep"] .co-cert-pill{
  background:rgba(255,255,255,0.06);
  border-color:rgba(255,255,255,0.12);
  color:rgba(235,244,250,0.85);
}
.co-subspec-pill{
  font-size:10.5px;
  font-weight:600;
  padding:2px 8px;
  border-radius:6px;
  background:rgba(16, 185, 129, 0.08);
  color:#059669;
  border:1px solid rgba(16, 185, 129, 0.2);
}
[data-theme="deep"] .co-subspec-pill{
  background:rgba(16, 185, 129, 0.15);
  color:#34D399;
  border-color:rgba(16, 185, 129, 0.3);
}

.co-tag{ 
  font-size:11px; 
  font-weight:700; 
  letter-spacing:0.03em; 
  padding:5px 12px; 
  border-radius:var(--radius-pill); 
  background:rgba(255,255,255,0.94); 
  color:var(--cyan-deep); 
  display:inline-block; 
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  box-shadow:0 4px 14px rgba(0,0,0,0.22);
}
[data-theme="deep"] .co-tag{ 
  color:#FFFFFF; 
  background:rgba(12,43,75,0.92); 
  border:1px solid rgba(var(--accent-rgb),0.35);
}
.co-name{ font-size:20px; font-weight:800; color:var(--ink); font-family:var(--font-display); margin:0; }
.co-desc{ font-size:13px; line-height:1.6; color:var(--ink-soft); margin-bottom:16px; flex-grow:1; }
.co-more{ max-height:0; overflow:hidden; transition:max-height .5s var(--ease), margin .5s var(--ease); }
.company-card:hover .co-more{ max-height:60px; margin-bottom:14px; }
.co-more p{ font-size:12px; line-height:1.45; color:var(--ink-soft); }
.co-actions{ display:flex; flex-direction:column; gap:6px; margin-top:auto; }
.co-actions button, .co-actions span { width:100%; min-width:0; font-size:11.5px; font-weight:700; padding:8px 10px; border-radius:var(--radius-pill); transition:all .3s ease; text-align:center; white-space:nowrap; cursor:pointer; display:inline-flex; align-items:center; justify-content:center; gap:6px; box-sizing:border-box; }
.co-actions .primary{ background:linear-gradient(135deg, var(--navy-mid), var(--cyan-deep)); color:#FFFFFF; border:none; box-shadow:0 4px 12px rgba(var(--accent-deep-rgb),0.25); }
.co-actions .primary:hover{ transform:translateY(-2px); box-shadow:0 8px 20px -4px rgba(var(--accent-deep-rgb),0.5); }
.co-action-arrow{ transition:transform 0.3s ease; }
.company-card:hover .co-action-arrow{ transform:translateX(3px); }
[dir="rtl"] .company-card:hover .co-action-arrow{ transform:translateX(-3px) rotate(180deg); }
[dir="rtl"] .co-action-arrow{ transform:rotate(180deg); }
.co-actions .secondary{ border:1.5px solid var(--line); background:var(--white); color:var(--ink); }
.co-actions .secondary:hover{ border-color:var(--cyan); color:var(--cyan); background:rgba(var(--accent-rgb),0.05); }
.company-card{ transition:transform 0.35s var(--ease), box-shadow 0.35s ease, border-color 0.35s ease; }
.company-card:hover{ color:inherit; }

/* ============ INDUSTRIES ============ */
#industries{
  background:var(--industries-bg);
  border-top: 2px solid var(--line);
  position: relative;
}
#industries::before{
  content: '';
  display: block;
  width: 80px;
  height: 4px;
  background: linear-gradient(90deg, var(--cyan), var(--cyan-bright));
  border-radius: 999px;
  margin: 0 auto;
  position: absolute;
  top: -3px;
  left: 50%;
  transform: translateX(-50%);
}
.industry-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
.industry-card{ 
  position:relative; border-radius:24px; padding:34px 26px; min-height:280px; 
  display:flex; flex-direction:column; justify-content:flex-end; overflow:hidden; 
  border:1px solid var(--line); box-shadow:var(--shadow-tight);
}
.industry-card .glyph{ position:absolute; top:28px; right:28px; width:54px; height:54px; }
.industry-card h3{ font-size:20px; margin-bottom:10px; position:relative; z-index:2; color:var(--ink);}
.industry-card p{ font-size:13.5px; color:var(--ink-soft); position:relative; z-index:2; }
.industry-card::before{ content:""; position:absolute; inset:0; opacity:0.95; transition:opacity .4s ease; }
.industry-card:hover::before{ opacity:1; }
.ind-medical::before{ background:linear-gradient(160deg,#F0F9FB,#E2F3F7); }
.ind-cosmetics::before{ background:linear-gradient(160deg,#F2F8FC,#E4EFF7); }
.ind-skincare::before{ background:linear-gradient(160deg,#EFF7FA,#DFEEF5); }
.ind-healthcare::before{ background:linear-gradient(160deg,#F1FAF9,#E3F4F3); }
[data-theme="deep"] .ind-medical::before{ background:linear-gradient(160deg,#092742,#071E33); }
[data-theme="deep"] .ind-cosmetics::before{ background:linear-gradient(160deg,#0C2E4E,#082036); }
[data-theme="deep"] .ind-skincare::before{ background:linear-gradient(160deg,#0A2946,#061A2C); }
[data-theme="deep"] .ind-healthcare::before{ background:linear-gradient(160deg,#0B2C4B,#082138); }

/* Industry card — clickable link state */
a.industry-card{ color:inherit; display:flex; }
.industry-card{ transition:transform 0.35s var(--ease), box-shadow 0.35s ease, border-color 0.35s ease; }
.industry-card:hover{ transform:translateY(-8px); border-color:rgba(var(--accent-rgb),0.45); box-shadow:0 24px 50px -12px rgba(var(--accent-deep-rgb),0.18); }
[data-theme="deep"] .industry-card:hover{ border-color:rgba(var(--accent-rgb),0.45); box-shadow:0 24px 50px -12px rgba(var(--accent-rgb),0.22); }

/* Real product image inside industry card */
.ind-img-frame{
  position:absolute; top:18px; right:18px;
  width:110px; height:110px;
  border-radius:20px; overflow:hidden;
  box-shadow:0 8px 24px -6px rgba(0,20,40,0.22), 0 0 0 1px rgba(var(--accent-rgb),0.25);
  background:rgba(255,255,255,0.85);
  transition:transform 0.4s var(--ease), box-shadow 0.4s ease;
  z-index:3;
}
[data-theme="deep"] .ind-img-frame{
  background:rgba(7,29,51,0.9);
  box-shadow:0 8px 24px -6px rgba(0,0,0,0.5), 0 0 0 1px rgba(var(--accent-rgb),0.3);
}
.ind-card-img{
  width:100%; height:100%; object-fit:cover; display:block;
  transition:transform 0.5s var(--ease);
}
.industry-card:hover .ind-img-frame{
  transform:scale(1.06) translateY(-3px);
  box-shadow:0 14px 32px -8px rgba(var(--accent-deep-rgb),0.35), 0 0 0 1px rgba(var(--accent-rgb),0.4);
}
.industry-card:hover .ind-card-img{ transform:scale(1.08); }

.ind-explore-btn{
  display:inline-flex; align-items:center; gap:6px; margin-top:16px;
  font-size:12.5px; font-weight:700; color:var(--cyan-deep);
  letter-spacing:0.3px; position:relative; z-index:2;
  transition:gap 0.25s ease, color 0.25s ease;
}
[data-theme="deep"] .ind-explore-btn{ color:var(--cyan-bright); }
.industry-card:hover .ind-explore-btn{ gap:10px; }

/* ============ PRODUCTS SHOWCASE ============ */
#products{ 
  background:var(--products-bg); 
  color:var(--products-text); overflow:hidden; padding-top:120px; padding-bottom:120px; 
  border-top:1px solid var(--line); border-bottom:1px solid var(--line);
  position:relative;
  z-index:2;
}
#products::after{
  content:""; position:absolute; bottom:0; left:0; right:0; height:90px;
  background:linear-gradient(180deg, transparent 0%, rgba(var(--accent-rgb),0.03) 60%, var(--line) 100%);
  pointer-events:none;
}
#products .section-head h2{ color:var(--products-text); }
#products .eyebrow{ color:var(--cyan-deep); }
[data-theme="deep"] #products .eyebrow{ color:var(--cyan-bright); }
#products .lead{ color:var(--ink-soft); }
.product-track-outer{ 
  overflow-x:auto;
  overflow-y:hidden;
  margin-top:50px;
  padding:20px 4vw 30px;
  scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
}
.product-track-outer::-webkit-scrollbar{
  display:none;
}
.product-track{ 
  display:flex; 
  gap:32px; 
  width:max-content; 
}
/* Solo slide — when only 1 product is visible after filtering */
.product-track.track-solo{
  width:100%; justify-content:center;
}
.product-track.track-solo .product-slide:not(.p-slide-hidden){
  width:min(600px, 90%); max-width:600px; min-width:0; flex:0 0 auto;
  grid-template-columns:0.85fr 1.15fr;
}
/* Product Toolbar & Category Filtering */
.product-toolbar{
  display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:16px;
  margin-top:36px; padding-bottom:18px; border-bottom:1px solid var(--line);
}
.product-cat-filters{
  display:flex; flex-wrap:wrap; gap:8px; align-items:center;
}
.p-filter-btn{
  background:transparent; border:1px solid var(--line); border-radius:999px;
  padding:8px 18px; font-size:13.5px; font-weight:600; color:var(--ink-soft);
  cursor:pointer; transition:all 0.3s var(--ease); font-family:inherit;
}
.p-filter-btn:hover{
  color:var(--cyan-deep); border-color:rgba(var(--accent-deep-rgb),0.4);
  background:rgba(var(--accent-deep-rgb),0.05); transform:translateY(-1px);
}
.p-filter-btn.active{
  background:linear-gradient(135deg, var(--cyan-deep), var(--cyan-bright));
  color:#FFFFFF; border-color:transparent;
  box-shadow:0 6px 18px -4px rgba(var(--accent-deep-rgb),0.4);
}
[data-theme="deep"] .p-filter-btn{
  color:var(--ink-soft); border-color:rgba(var(--accent-rgb),0.18);
}
[data-theme="deep"] .p-filter-btn:hover{
  color:#FFFFFF; border-color:rgba(var(--accent-rgb),0.45);
  background:rgba(var(--accent-rgb),0.08);
}
[data-theme="deep"] .p-filter-btn.active{
  background:linear-gradient(135deg, var(--cyan-deep), var(--cyan-bright));
  color:#071B2F; font-weight:700;
  box-shadow:0 0 20px rgba(var(--accent-rgb),0.45);
}

.product-view-controls{
  display:flex; align-items:center; gap:12px;
}
.p-view-toggle{
  display:inline-flex; align-items:center; background:var(--silver-mist);
  padding:4px; border-radius:999px; border:1px solid var(--line);
}
[data-theme="deep"] .p-view-toggle{
  background:rgba(12,40,68,0.7); border-color:rgba(var(--accent-rgb),0.2);
}
.p-view-btn{
  display:inline-flex; align-items:center; gap:6px; background:transparent;
  border:none; border-radius:999px; padding:6px 14px; font-size:12.5px;
  font-weight:600; color:var(--ink-soft); cursor:pointer; transition:all 0.25s ease; font-family:inherit;
}
.p-view-btn svg{ stroke-width:2.2; }
.p-view-btn.active{
  background:var(--pearl); color:var(--ink);
  box-shadow:0 4px 12px rgba(10,35,60,0.08);
}
[data-theme="deep"] .p-view-btn.active{
  background:var(--navy-mid); color:#FFFFFF;
  box-shadow:0 4px 16px rgba(0,0,0,0.4);
}

.p-view-all-btn{
  display:inline-flex; align-items:center; gap:7px;
  padding:9px 16px; border-radius:999px;
  background:linear-gradient(135deg, var(--cyan-deep), var(--cyan-bright));
  color:#FFFFFF; font-size:13px; font-weight:700;
  text-decoration:none; transition:all 0.3s var(--ease);
  box-shadow:0 8px 20px -6px rgba(var(--accent-deep-rgb),0.45); white-space:nowrap;
}
.p-view-all-btn svg{ stroke-width:2.2; }
.p-view-all-btn:hover{
  transform:translateY(-2px);
  box-shadow:0 12px 26px -6px rgba(var(--accent-deep-rgb),0.6); color:#FFFFFF;
}
[data-theme="deep"] .p-view-all-btn{ color:#071B2F; }
[data-theme="deep"] .p-view-all-btn:hover{ color:#071B2F; }

.p-autoplay-toggle{
  display:inline-flex; align-items:center; justify-content:center; position:relative;
  width:36px; height:36px; border-radius:50%; border:1px solid var(--line);
  background:var(--card-bg); cursor:pointer; color:var(--ink-soft);
  transition:all 0.3s ease; font-size:12px;
}
.p-autoplay-toggle:hover{
  border-color:var(--cyan); color:var(--cyan); transform:scale(1.05);
}
.p-autoplay-dot{
  position:absolute; top:4px; right:4px; width:7px; height:7px; border-radius:50%;
  background:#10B981; box-shadow:0 0 8px #10B981; transition:all 0.3s ease;
}
.p-autoplay-toggle.paused .p-autoplay-dot{
  background:#F59E0B; box-shadow:0 0 6px #F59E0B;
}

/* Product Slide Styles */
.product-slide{
  width:calc(50% - 16px); max-width:580px; min-width:420px; flex:none; display:grid; grid-template-columns:0.85fr 1.15fr; gap:28px; align-items:center;
  background:var(--products-card-bg); border:1px solid rgba(var(--accent-deep-rgb),0.18); border-radius:32px; padding:32px;
  scroll-snap-align:center; box-shadow:var(--shadow-soft); transition:transform 0.4s ease, opacity 0.3s ease, border-color 0.3s ease;
}
[data-theme="deep"] .product-slide{
  background:linear-gradient(150deg, rgba(14,35,58,0.7), rgba(7,20,34,0.85));
  border-color:rgba(var(--accent-rgb),0.2); backdrop-filter:blur(16px);
  box-shadow:0 25px 50px -15px rgba(0,0,0,0.5);
}
.product-slide.p-slide-hidden{
  display:none;
}
.product-slide-content{
  display:flex; flex-direction:column; justify-content:center;
}
.p-meta-bar{
  display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:12px;
}
.p-company-badge{
  display:inline-flex; align-items:center; gap:5px; font-size:11.5px; font-weight:700;
  padding:3px 10px; border-radius:999px; background:rgba(var(--accent-deep-rgb),0.12); color:var(--cyan-deep);
  border:1px solid rgba(var(--accent-deep-rgb),0.25); text-transform:uppercase; letter-spacing:0.5px;
}
[data-theme="deep"] .p-company-badge{
  background:rgba(var(--accent-rgb),0.15); color:var(--cyan-bright); border-color:rgba(var(--accent-rgb),0.3);
}
.p-badge-tag{
  display:inline-flex; font-size:11px; font-weight:600; padding:3px 9px;
  border-radius:999px; background:var(--silver-mist); color:var(--ink-soft);
}
[data-theme="deep"] .p-badge-tag{
  background:rgba(255,255,255,0.08); color:var(--ink-soft);
}
.p-slide-title{
  font-size:22px; font-weight:800; line-height:1.3; margin-bottom:12px; color:var(--ink);
  font-family:var(--font-display);
}
[data-theme="deep"] .p-slide-title{
  color:#FFFFFF;
}
.p-slide-desc{
  font-size:14px; color:var(--ink-soft); line-height:1.65; margin-bottom:20px;
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
  text-overflow:ellipsis;
  min-height:calc(1.65em * 3);
}
.p-slide-title{
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  text-overflow:ellipsis;
}
[data-theme="deep"] .p-slide-desc{
  color:rgba(240,247,250,0.72);
}
.p-slide-footer{
  display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px;
}
.p-category-indicator{
  font-size:12px; font-weight:600; color:var(--cyan-deep); display:inline-flex; align-items:center; gap:4px;
}
[data-theme="deep"] .p-category-indicator{
  color:var(--cyan-bright);
}

.product-stage3d{ position:relative; height:300px; display:flex; align-items:center; justify-content:center; perspective:1200px; }
.p-showcase-halo{
  position:absolute; width:220px; height:220px; border-radius:50%;
  background:radial-gradient(circle, rgba(var(--accent-rgb),0.22) 0%, rgba(var(--accent-deep-rgb),0.08) 50%, transparent 75%);
  filter:blur(24px); pointer-events:none; z-index:1;
}
.p-scene{ position:relative; width:100%; height:100%; transform-style:preserve-3d; animation:pFloat 6s ease-in-out infinite; cursor:grab; touch-action:pan-y; z-index:2; display:flex; align-items:center; justify-content:center;}
.p-scene:active{ cursor:grabbing; }
@keyframes pFloat{ 0%,100%{ transform:translateY(0);} 50%{ transform:translateY(-14px);} }
.p-shadow{ position:absolute; bottom:6px; left:50%; width:160px; height:24px; background:radial-gradient(ellipse, rgba(0,0,0,0.35), transparent 70%); transform:translateX(-50%); filter:blur(5px); z-index:1;}

/* Real Product Card in 3D Stage */
.p-real-card{
  position:relative; width:260px; height:260px; aspect-ratio:1/1; border-radius:24px; overflow:hidden;
  box-shadow:0 25px 50px -12px rgba(0,20,40,0.45), 0 0 0 1px rgba(var(--accent-rgb),0.2);
  background:transparent;
  transition:box-shadow 0.4s ease;
  user-select:none;
  display:flex; align-items:center; justify-content:center;
}
[data-theme="deep"] .p-real-card{
  background:transparent;
  box-shadow:0 25px 50px -12px rgba(0,0,0,0.7), 0 0 0 1px rgba(var(--accent-rgb),0.3), 0 0 35px -5px rgba(var(--accent-rgb),0.25);
}
.p-real-img{
  width:100%; height:100%; object-fit:contain; display:block;
  padding:14px; margin:0;
  box-sizing:border-box;
  border-radius:inherit;
  pointer-events:none; -webkit-user-drag:none;
  transition:transform 0.5s cubic-bezier(0.2, 0.8, 0.2, 1);
}
.p-real-card:hover .p-real-img{
  transform:scale(1.05);
}
.p-real-glare{
  position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(125deg, rgba(255,255,255,0.35) 0%, rgba(255,255,255,0) 45%, rgba(var(--accent-rgb),0.15) 100%);
  border-radius:inherit;
}

/* capsule bottle */
.p-capsule .p-body{ position:absolute; left:50%; top:22%; width:150px; height:220px; transform:translateX(-50%); border-radius:24px 24px 46px 46px;
  background:linear-gradient(155deg, rgba(255,255,255,0.85), rgba(var(--accent-deep-rgb),0.3) 45%, rgba(13,51,87,0.2));
  border:1.5px solid rgba(var(--accent-rgb),0.45); box-shadow:inset 0 0 30px rgba(255,255,255,0.7), 0 20px 40px -15px rgba(0,0,0,0.2); overflow:hidden;}
.p-capsule .p-pills{ position:absolute; inset:14px 20px; display:grid; grid-template-columns:1fr 1fr; gap:6px; opacity:0.95;}
.p-capsule .pill{ height:14px; border-radius:8px; background:linear-gradient(90deg, var(--cyan-bright), var(--cyan)); }
.p-capsule .pill:nth-child(3n){ background:linear-gradient(90deg, var(--navy-mid), var(--cyan-deep)); }
.p-capsule .p-cap{ position:absolute; left:50%; top:0%; width:80px; height:56px; transform:translateX(-50%); border-radius:12px 12px 4px 4px;
  background:linear-gradient(160deg, var(--cyan-deep), var(--navy-mid)); box-shadow:0 10px 22px -8px rgba(var(--accent-deep-rgb),0.4); border:1px solid rgba(var(--accent-rgb),0.3);}

/* dropper serum bottle */
.p-serum .p-body{ position:absolute; left:50%; bottom:16%; width:110px; height:170px; transform:translateX(-50%); border-radius:14px;
  background:linear-gradient(160deg, rgba(255,255,255,0.8), rgba(var(--accent-deep-rgb),0.25) 50%, rgba(10,35,60,0.2));
  border:1.5px solid rgba(var(--accent-rgb),0.35); box-shadow:inset 0 0 26px rgba(255,255,255,0.7), 0 20px 40px -15px rgba(0,0,0,0.2); overflow:hidden;}
.p-serum .p-liquid{ position:absolute; left:6%; right:6%; bottom:6%; height:55%; border-radius:10px; background:linear-gradient(180deg, rgba(var(--accent-deep-rgb),0.6), rgba(var(--accent-deep-rgb),0.85)); }
.p-serum .p-bubble{ position:absolute; width:6px; height:6px; border-radius:50%; background:rgba(255,255,255,0.9); animation:bubbleUp 3s ease-in infinite; }
@keyframes bubbleUp{ 0%{ transform:translateY(0); opacity:0;} 15%{opacity:1;} 100%{ transform:translateY(-70px); opacity:0;} }
.p-serum .p-neck{ position:absolute; left:50%; bottom:65%; width:26px; height:34px; transform:translateX(-50%); background:rgba(255,255,255,0.8); border-radius:4px; }
.p-serum .p-dropper-cap{ position:absolute; left:50%; bottom:96%; width:44px; height:70px; transform:translateX(-50%); border-radius:8px 8px 3px 3px;
  background:linear-gradient(160deg, var(--navy-mid), var(--navy-deep)); box-shadow:0 10px 20px -8px rgba(0,0,0,0.3); border:1px solid rgba(var(--accent-rgb),0.2);}

/* cream jar */
.p-jar .p-body{ position:absolute; left:50%; bottom:14%; width:170px; height:120px; transform:translateX(-50%); border-radius:22px;
  background:linear-gradient(160deg, rgba(255,255,255,0.85), rgba(227,242,247,0.55) 55%, rgba(var(--accent-deep-rgb),0.2));
  border:1.5px solid rgba(var(--accent-rgb),0.35); box-shadow:inset 0 0 26px rgba(255,255,255,0.7), 0 20px 40px -15px rgba(0,0,0,0.2); }
.p-jar .p-lid{ position:absolute; left:50%; bottom:62%; width:180px; height:46px; transform:translateX(-50%); border-radius:16px;
  background:linear-gradient(160deg, var(--cyan-deep), var(--navy-mid)); box-shadow:0 12px 24px -10px rgba(var(--accent-deep-rgb),0.4); border:1px solid rgba(var(--accent-rgb),0.3);}
.p-jar .p-lid::after{ content:""; position:absolute; inset:8px 30px; border-radius:10px; background:rgba(255,255,255,0.35); }
.p-jar .p-cream{ position:absolute; left:8%; right:8%; top:8%; height:26px; border-radius:50%; background:rgba(255,255,255,0.85); filter:blur(1px);}

.product-nav-dots{ display:flex; gap:10px; margin-top:20px; justify-content:center; }
.pn-dot{ width:8px; height:8px; border-radius:50%; background:rgba(10,35,60,0.18); transition:all .4s ease; cursor:pointer; }
[data-theme="deep"] .pn-dot{ background:rgba(255,255,255,0.25); }
.pn-dot.active{ width:28px; border-radius:6px; background:linear-gradient(90deg, var(--cyan-deep), var(--cyan-bright)); box-shadow:0 0 12px rgba(var(--accent-rgb),0.5); }
.product-progress{ height:3px; background:rgba(10,35,60,0.08); margin-top:20px; border-radius:2px; overflow:hidden; }
[data-theme="deep"] .product-progress{ background:rgba(255,255,255,0.1); }
.product-progress-bar{ height:100%; width:0%; background:linear-gradient(90deg, var(--navy-mid), var(--cyan-bright)); }

/* ============ PRODUCT CATALOG GRID (ALTERNATIVE VIEW) ============ */
.product-catalog-grid{
  display:grid; grid-template-columns:repeat(2, 1fr); gap:28px;
  margin-top:10px;
}
.catalog-card{
  background:var(--products-card-bg); border:1px solid rgba(var(--accent-deep-rgb),0.18); border-radius:28px;
  overflow:hidden; box-shadow:var(--shadow-soft); transition:all 0.4s var(--ease);
  display:flex; flex-direction:column; position:relative;
}
.catalog-card:hover{
  transform:translateY(-8px); border-color:rgba(var(--accent-rgb),0.45);
  box-shadow:0 30px 60px -15px rgba(var(--accent-deep-rgb),0.22);
}
[data-theme="deep"] .catalog-card{
  background:linear-gradient(160deg, rgba(14,35,58,0.85), rgba(7,20,34,0.92));
  border-color:rgba(var(--accent-rgb),0.2); box-shadow:0 20px 40px -15px rgba(0,0,0,0.5);
}
[data-theme="deep"] .catalog-card:hover{
  border-color:rgba(var(--accent-rgb),0.45); box-shadow:0 25px 60px -15px rgba(var(--accent-rgb),0.25);
}
.catalog-card.p-grid-hidden{
  display:none;
}
.catalog-card-media{
  position:relative; width:100%; aspect-ratio:1/1; overflow:hidden;
  background:linear-gradient(135deg, rgba(244,248,251,0.9), rgba(227,242,247,0.7));
  display:flex; align-items:center; justify-content:center;
  padding:0; margin:0;
}
[data-theme="deep"] .catalog-card-media{
  background:linear-gradient(135deg, rgba(7,29,51,0.9), rgba(4,15,29,0.95));
}
.catalog-card-img{
  width:100%; height:100%; object-fit:contain; display:block; padding:12px; box-sizing:border-box; transition:transform 0.6s var(--ease);
}
.catalog-card:hover .catalog-card-img{
  transform:scale(1.05);
}
.catalog-card-company-tag{
  position:absolute; top:16px; left:16px; z-index:2;
  font-size:11px; font-weight:700; padding:4px 12px; border-radius:999px;
  background:rgba(255,255,255,0.92); color:var(--ink);
  box-shadow:0 4px 12px rgba(0,0,0,0.12); backdrop-filter:blur(8px);
  border:1px solid rgba(var(--accent-deep-rgb),0.2); letter-spacing:0.5px;
}
[data-theme="deep"] .catalog-card-company-tag{
  background:rgba(7,29,51,0.9); color:var(--cyan-bright);
  border-color:rgba(var(--accent-rgb),0.3);
}
.catalog-card-badge-tag{
  position:absolute; top:16px; right:16px; z-index:2;
  font-size:11px; font-weight:600; padding:4px 10px; border-radius:999px;
  background:linear-gradient(135deg, var(--cyan-deep), var(--cyan-bright));
  color:#FFFFFF; box-shadow:0 4px 12px rgba(var(--accent-deep-rgb),0.35);
}
.catalog-card-body{
  padding:24px; display:flex; flex-direction:column; flex:1; justify-content:space-between;
}
.catalog-card-cat{
  font-size:12px; font-weight:700; color:var(--cyan-deep); text-transform:uppercase; letter-spacing:0.8px; margin-bottom:6px;
}
[data-theme="deep"] .catalog-card-cat{
  color:var(--cyan-bright);
}
.catalog-card-title{
  font-size:18px; font-weight:700; line-height:1.35; color:var(--ink); margin-bottom:10px;
  font-family:var(--font-display);
}
[data-theme="deep"] .catalog-card-title{
  color:#FFFFFF;
}
.catalog-card-desc{
  font-size:13.5px; color:var(--ink-soft); line-height:1.6; margin-bottom:18px; flex:1;
}
[data-theme="deep"] .catalog-card-desc{
  color:rgba(240,247,250,0.7);
}
.catalog-card-footer{
  display:flex; align-items:center; justify-content:space-between; pt:14px;
  border-top:1px solid var(--line); padding-top:14px;
}
.catalog-card-action{
  font-size:12px; font-weight:700; color:var(--cyan-deep); display:inline-flex; align-items:center; gap:6px;
}
[data-theme="deep"] .catalog-card-action{
  color:var(--cyan-bright);
}
html[dir="rtl"] .catalog-card-company-tag{
  left:auto; right:16px;
}
html[dir="rtl"] .catalog-card-badge-tag{
  right:auto; left:16px;
}

/* ============ WHY CHOOSE US ============ */
#why{ background:var(--why-bg); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.why-grid{ display:grid; grid-template-columns:repeat(5,1fr); gap:20px; }
.why-card{ background:var(--card-bg); border-radius:22px; padding:32px 22px; box-shadow:var(--shadow-tight); border:1px solid var(--line); transition:transform .5s var(--ease), box-shadow .5s var(--ease); }
.why-card:hover{ transform:translateY(-8px); box-shadow:var(--shadow-soft); border-color:var(--cyan); }
.why-icon{ width:52px; height:52px; margin-bottom:22px; }
.why-card h3{ font-size:17px; margin-bottom:10px; color:var(--ink);}
.why-card p{ font-size:13.5px; color:var(--ink-soft); }

/* ============ GLOBAL PRESENCE ============ */
#global{ 
  background:var(--global-bg); 
  color:var(--global-text); border-bottom:1px solid var(--line);
}
#global .eyebrow{ color:var(--cyan-deep); }
[data-theme="deep"] #global .eyebrow{ color:var(--cyan-bright); }
#global .lead{ color:var(--ink-soft); }
.globe-wrap{ position:relative; margin-top:20px; display:grid; grid-template-columns:1.2fr 0.8fr; gap:60px; align-items:center; }
.globe-svg{ width:100%; height:auto; }
.globe-stats{ display:flex; flex-direction:column; gap:34px; }
.globe-stats div b{ 
  display:block; font-family:var(--font-display); font-size:36px; font-weight:800; 
  background:linear-gradient(90deg, var(--navy-mid), var(--cyan-deep));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
[data-theme="deep"] .globe-stats div b{
  background:linear-gradient(90deg, var(--cyan-bright), #FFFFFF);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.globe-stats div span{ font-size:13.5px; color:var(--ink-soft); font-weight:600;}
.gdot{ animation:pulse 2.6s ease-in-out infinite; }
@keyframes pulse{ 0%,100%{ opacity:0.5; r:2.5; } 50%{ opacity:1; r:4.0; } }

/* ============ QUALITY ============ */
#quality{ background:var(--quality-bg); }
.cert-grid{ display:grid; grid-template-columns:repeat(5,1fr); gap:20px; }
.cert-card{
  padding:30px 20px; text-align:center; border-radius:20px;
  background:var(--card-bg); box-shadow:var(--shadow-tight);
  border:1px solid var(--line); transition:all .4s var(--ease);
}
.cert-card:hover{ transform:translateY(-6px); box-shadow:var(--shadow-soft); border-color:var(--cyan); }
.cert-icon{ width:44px; height:44px; margin:0 auto 18px; }
.cert-card b{ display:block; font-size:14px; margin-bottom:6px; color:var(--ink); }
.cert-card span{ font-size:11.5px; color:var(--ink-soft); }

/* ============ NEWS ============ */
#news{ background:var(--news-bg); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.news-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
.news-card{ background:var(--card-bg); border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-tight); border:1px solid var(--line); transition:transform .5s var(--ease), box-shadow .5s var(--ease); cursor:pointer; text-decoration:none; color:inherit; display:block; }
.news-card:hover{ transform:translateY(-8px); box-shadow:var(--shadow-soft); border-color:var(--cyan); }
.news-card:focus-visible{ outline:2px solid var(--cyan); outline-offset:3px; }
.news-media{ height:190px; position:relative; overflow:hidden; background:var(--silver-mist); }
.news-media img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .7s var(--ease); }
.news-card:hover .news-media img{ transform:scale(1.06); }
.news-body{ padding:26px 24px 30px; }
.news-tag{ font-size:11.5px; font-weight:700; color:var(--cyan-deep); letter-spacing:0.04em; margin-bottom:10px; display:block; text-transform:uppercase;}
[data-theme="deep"] .news-tag{ color:var(--cyan-bright); }
.news-card h3{ font-size:18px; margin-bottom:10px; line-height:1.3; color:var(--ink);}
.news-card p{ font-size:13.5px; color:var(--ink-soft); margin-bottom:16px; }
.news-foot{ display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; }
.news-date{ font-size:12px; color:var(--ink-soft); font-weight:600;}
.news-more{ display:inline-flex; align-items:center; gap:6px; font-size:12.5px; font-weight:700; color:var(--cyan-deep); transition:gap .3s var(--ease); }
[data-theme="deep"] .news-more{ color:var(--cyan-bright); }
.news-card:hover .news-more{ gap:10px; }

/* ============ CONTACT ============ */
#contact{
  background:transparent;
  color:var(--contact-text); position:relative; overflow:hidden; border-top:1px solid var(--line);
}
.contact-grid{ display:grid; grid-template-columns:1fr 1fr; gap:70px; align-items:start; }
.contact-title{ font-size:clamp(30px,4vw,50px); line-height:1.1; margin-bottom:22px; color:var(--contact-text); }
.contact-lead{ color:var(--ink-soft); max-width:440px; margin-bottom:36px; }
.contact-info{ margin-top:44px; display:flex; flex-direction:column; gap:14px; }
.contact-info div{ font-size:14.5px; color:var(--ink-soft); }
.contact-info b{ color:var(--navy-mid); font-weight:700; }
[data-theme="deep"] .contact-info b{ color:var(--cyan-bright); }
.social-row{ display:flex; gap:14px; margin-top:26px; }
.social-row a{ 
  width:40px; height:40px; border-radius:50%; border:1.5px solid var(--line); 
  display:flex; align-items:center; justify-content:center; transition:all .3s ease; 
  font-size:13px; color:var(--ink); background:var(--white); box-shadow:var(--shadow-tight);
}
.social-row a:hover{ background:var(--cyan-deep); color:#FFFFFF; border-color:var(--cyan-deep); transform:translateY(-2px); }
.contact-form{ background:var(--contact-card-bg); border:1px solid var(--line); border-radius:24px; padding:38px; box-shadow:var(--shadow-soft); }
.form-row{ display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-bottom:16px; }
.form-field{ display:flex; flex-direction:column; gap:8px; }
.form-field label{ font-size:12.5px; color:var(--ink-soft); font-weight:600;}
.form-field input, .form-field textarea{
  background:rgba(120,150,180,0.08); border:1.5px solid var(--line); border-radius:12px; padding:13px 16px;
  color:var(--ink); font-family:inherit; font-size:14px; outline:none; transition:border-color .3s ease, box-shadow .3s ease;
}
.form-field input:focus, .form-field textarea:focus{ border-color:var(--cyan); box-shadow:0 0 10px rgba(var(--accent-deep-rgb),0.18); }
.form-field.full{ margin-bottom:16px; }
.form-submit{ 
  width:100%; margin-top:6px; padding:16px; border-radius:var(--radius-pill); 
  background:linear-gradient(100deg, var(--navy-mid), var(--cyan-deep)); 
  color:#FFFFFF; font-weight:700; font-size:15px; 
  box-shadow:var(--shadow-cyan); transition:transform .4s var(--ease), box-shadow .4s var(--ease); 
}
.form-submit:hover{ transform:translateY(-3px); box-shadow:0 16px 32px -8px rgba(var(--accent-deep-rgb),0.4); }
.form-success{ display:none; text-align:center; padding:20px; font-size:14px; color:var(--cyan-deep); font-weight:700;}

/* ============ FOOTER ============ */
footer{ background:var(--footer-bg); color:var(--footer-text); padding:80px 0 30px; border-top:1px solid var(--line); }
.footer-grid{ display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:50px; margin-bottom:70px; }
.footer-brand p{ font-size:14px; color:var(--footer-text); margin-top:16px; max-width:280px; }
footer h4{ color:var(--ink); font-size:14px; margin-bottom:20px; letter-spacing:0.02em; font-weight:700;}
footer ul{ list-style:none; display:flex; flex-direction:column; gap:12px; }
footer ul a{ font-size:14px; color:var(--footer-text); transition:color .3s ease; font-weight:500;}
footer ul a:hover{ color:var(--cyan); }
.footer-bottom{ border-top:1px solid var(--line); padding-top:26px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px; font-size:12.5px; color:var(--footer-text); }

/* ============ REVEAL & EFFECTS ============ */
.reveal{ opacity:0; transform:translateY(28px); }
.js-ready .reveal{ transition:opacity .9s var(--ease), transform .9s var(--ease); }
.reveal.visible{ opacity:1; transform:translateY(0); }

#cursorGlow{
  position:fixed; top:0; left:0; width:520px; height:520px; border-radius:50%; pointer-events:none; z-index:5;
  background:radial-gradient(circle, rgba(var(--accent-rgb),0.12), transparent 65%);
  transform:translate(-50%,-50%); opacity:0; transition:opacity .5s ease; will-change:transform;
}
#cursorGlow.gold{ background:radial-gradient(circle, rgba(var(--accent-deep-rgb),0.12), transparent 65%); }

#particleCanvas{ position:absolute; inset:0; width:100%; height:100%; pointer-events:none; opacity:0.5; }
.magnetic{ position:relative; will-change:transform; }
.split-line{ overflow:hidden; display:inline-block; vertical-align:top; }
.split-line > span{ display:inline-block; transform:translateY(115%); will-change:transform; }

.glare{
  position:absolute; inset:0; pointer-events:none; opacity:0; z-index:3;
  background:linear-gradient(115deg, transparent 30%, rgba(255,255,255,0.7) 45%, transparent 60%);
  background-size:250% 250%; background-position:0% 0%;
  transition:opacity .4s ease; mix-blend-mode:overlay;
}
.company-card:hover .glare{ opacity:1; animation:glareSweep 1.4s ease forwards; }
@keyframes glareSweep{ from{ background-position:120% 0%; } to{ background-position:-20% 0%; } }

.tilt3d{ transform-style:preserve-3d; transition:transform .5s var(--ease); }
.industry-card:hover .tilt3d{ transform:rotateY(18deg) rotateX(-8deg) translateZ(10px); }
.why-icon-wrap{ transform-style:preserve-3d; transition:transform .6s var(--ease); }
.why-card:hover .why-icon-wrap{ transform:rotateY(180deg); }

/* ============ RESPONSIVE ============ */
@media (max-width:1200px){
  .company-grid{ grid-template-columns:repeat(3,1fr); gap:14px; }
}
@media (max-width:1080px){
  .company-grid{ grid-template-columns:repeat(2,1fr); }
  .industry-grid{ grid-template-columns:repeat(2,1fr); }
  .why-grid{ grid-template-columns:repeat(2,1fr); }
  .cert-grid{ grid-template-columns:repeat(2,1fr); }
  .news-grid{ grid-template-columns:repeat(2,1fr); }
  .globe-wrap{ grid-template-columns:1fr; }
  .about-grid{ grid-template-columns:1fr; }
  .product-stage{ grid-template-columns:1fr; }
  .contact-grid{ grid-template-columns:1fr; }
  .footer-grid{ grid-template-columns:1fr 1fr; }
}
@media (max-width:820px){
  .navlinks{ display:none; }
  .burger{ display:flex; }
  .hero-grid{ grid-template-columns:1fr; }
  .hero-visual{ height:340px; order:-1; }
  .hero-stats-mini{ gap:24px; flex-wrap:wrap; }
  .section-pad{ padding:80px 0; }
  .stat-grid{ grid-template-columns:1fr 1fr; }
  .form-row{ grid-template-columns:1fr; }
  #contact .bg-video{ object-position:center 22%; }
  .contact-form{ padding:26px 20px; }
  .nav-cta{ display:none; }
  .product-track-outer{ padding:16px 0 30px; margin-top:36px; }
  .product-track{ gap:14px; padding:0 12px; width:100%; flex-wrap:nowrap; overflow:visible; }
  .product-slide{ grid-template-columns:1fr; width:calc(50% - 8px); min-width:0; flex:0 0 calc(50% - 8px); padding:22px; }
  #cursorGlow{ display:none; }
}
@media (max-width:600px){
  .company-grid{ grid-template-columns:repeat(2,1fr); gap:12px; }
  .company-card{ padding:0; border-radius:16px; min-height:0; }
  .co-cover-wrap{ height:105px; }
  .co-full-cover-img{ padding:8px 12px; }
  .co-emblem-frame{ width:86%; height:62px; padding:6px 12px; border-radius:12px; }
  .co-mark-banner{ height:105px; }
  .co-mark-lg{ font-size:22px; }
  .co-partner-tag{ top:5px; right:5px; padding:2px 5px; font-size:7.5px; gap:3px; }
  [dir="rtl"] .co-partner-tag{ right:auto; left:5px; }
  .co-cover-badge{ bottom:5px; right:5px; left:5px; }
  .co-body{ padding:10px 8px 12px; }
  .co-header-row{ margin-bottom:4px; gap:4px; }
  .co-meta-pill{ font-size:9px; padding:2px 5px; }
  .co-trust-row{ margin-bottom:6px; gap:3px; }
  .co-cert-pill, .co-subspec-pill{ font-size:8px; padding:2px 4px; }
  .co-tag{ font-size:8.5px; padding:2px 6px; }
  .co-name{ font-size:13.5px; margin-bottom:0; font-weight:700; }
  .co-desc{ font-size:10.5px; line-height:1.35; margin-bottom:8px; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
  .co-more{ display:none; }
  .co-actions{ flex-direction:column; gap:4px; margin-top:auto; }
  .co-actions button, .co-actions span { width:100%; padding:6px 3px; font-size:9.5px; }

  /* Products Slider 2 in View on Mobile */
  .product-track-outer{ padding:16px 0 24px; margin-top:28px; }
  .product-track{ gap:10px; padding:0 10px; width:100%; flex-wrap:nowrap; overflow:visible; }
  .product-slide{
    width:calc(50% - 6px);
    min-width:0;
    flex:0 0 calc(50% - 6px);
    grid-template-columns:1fr;
    gap:8px;
    padding:12px 10px;
    border-radius:18px;
  }
  /* Solo slide on mobile */
  .product-track.track-solo .product-slide:not(.p-slide-hidden){
    width:90%; flex:0 0 90%; grid-template-columns:1fr;
  }
  .product-stage3d{ height:145px; }
  .p-real-card{ width:128px; height:128px; aspect-ratio:1/1; border-radius:14px; }
  .p-real-img{ padding:0; margin:0; }
  .p-showcase-halo{ width:130px; height:130px; }
  .p-shadow{ width:100px; height:16px; }
  .p-meta-bar{ gap:4px; margin-bottom:6px; }
  .p-company-badge{ font-size:9px; padding:2px 6px; letter-spacing:0; }
  .p-badge-tag{ font-size:9px; padding:2px 6px; }
  .p-slide-title{ font-size:13.5px; margin-bottom:4px; line-height:1.25; }
  .p-slide-desc{
    font-size:10.5px; line-height:1.4; margin-bottom:8px;
    display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
  }
  .p-slide-footer{ gap:4px; }
  .p-category-indicator{ font-size:9.5px; }
  .viewer-hint{ display:none !important; }

  /* Products Catalog Grid 2 in a row on Mobile */
  .product-catalog-grid{ grid-template-columns:repeat(2,1fr); gap:10px; }
  .catalog-card{ border-radius:18px; }
  .catalog-card-media{ aspect-ratio:1/1; height:auto; padding:0; margin:0; }
  .catalog-card-img{ width:100%; height:100%; object-fit:cover; display:block; }
  .catalog-card-body{ padding:12px 10px 14px; }
  .catalog-card-title{ font-size:13.5px; margin-bottom:4px; }
  .catalog-card-desc{
    font-size:10.5px; line-height:1.4; margin-bottom:8px;
    display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
  }
  .catalog-card-company-tag, .catalog-card-badge-tag{ font-size:9px; padding:2px 6px; }
  .catalog-card-action{ font-size:10.5px; }

  /* Industries / Sectors Grid 2 in a row on Mobile */
  .industry-grid{ grid-template-columns:repeat(2,1fr); gap:10px; }
  .industry-card{ padding:14px 12px; min-height:210px; border-radius:18px; }
  .ind-img-frame{ width:60px; height:60px; top:12px; right:12px; border-radius:14px; }
  html[dir="rtl"] .ind-img-frame{ right:auto; left:12px; }
  .industry-card .glyph{ width:38px; height:38px; top:12px; right:12px; }
  html[dir="rtl"] .industry-card .glyph{ right:auto; left:12px; }
  .industry-card h3{ font-size:14px; margin-bottom:5px; line-height:1.25; }
  .industry-card p{
    font-size:10.5px; line-height:1.4; margin-bottom:8px;
    display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
  }
  .ind-explore-btn{ font-size:10px; gap:4px; }
  .ind-explore-btn svg{ width:11px; height:11px; }

  /* News / Articles Grid 2 in a row on Mobile */
  .news-grid{ grid-template-columns:repeat(2,1fr); gap:10px; }
  .news-card{ border-radius:18px; }
  .news-media{ height:115px; }
  .news-body{ padding:12px 10px 14px; }
  .news-tag{ font-size:9px; margin-bottom:4px; padding:0; letter-spacing:0; }
  .news-card h3{
    font-size:13px; margin-bottom:4px; line-height:1.3;
    display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
  }
  .news-card p{
    font-size:10.5px; line-height:1.4; margin-bottom:8px;
    display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
  }
  .news-foot{ gap:4px; flex-direction:column; align-items:flex-start; }
  .news-date{ font-size:9.5px; }
  .news-more{ font-size:10.5px; gap:4px; }

  .why-grid{ grid-template-columns:1fr; }
  .cert-grid{ grid-template-columns:1fr 1fr; }
  .footer-grid{ grid-template-columns:1fr; gap:36px; }
}

/* mobile menu */
#mobile-menu{
  position:fixed; inset:0; background:var(--pearl); z-index:1200; display:flex; flex-direction:column;
  padding:26px clamp(20px,6vw,40px); transform:translateY(-100%); transition:transform .5s var(--ease); overflow-y:auto;
}
#mobile-menu.open{ transform:translateY(0); }
#mobile-menu .mm-top{ display:flex; justify-content:space-between; align-items:center; margin-bottom:50px; }
#mobile-menu a{ font-size:24px; font-weight:600; font-family:var(--font-display); padding:14px 0; border-bottom:1px solid var(--line); color:var(--ink);}
.mm-close span{ display:block; width:22px; height:2px; background:var(--ink); }
.mm-close span:first-child{ transform:rotate(45deg) translate(3px,3px); }
.mm-close span:last-child{ transform:rotate(-45deg) translate(3px,-3px); }

/* ============ IMMERSIVE 3D WARP TRANSITION OVERLAY ============ */
#sectionTransitionOverlay{
  position:fixed; inset:0; pointer-events:none; z-index:99999;
  visibility:hidden; overflow:hidden;
}
#sectionTransitionOverlay.active{
  visibility:visible; pointer-events:all;
}


/* Full-screen WebGL warp canvas */
#warpCanvas{
  position:absolute; inset:0; width:100%; height:100%;
  display:block;
}

/* Scanlines overlay */
.trans-scanlines{
  position:absolute; inset:0; pointer-events:none; z-index:2;
  background:repeating-linear-gradient(
    0deg,
    transparent,
    transparent 2px,
    rgba(var(--accent-rgb),0.03) 2px,
    rgba(var(--accent-rgb),0.03) 4px
  );
  animation:scanMove 8s linear infinite;
  opacity:0;
  transition:opacity 0.3s ease;
}
#sectionTransitionOverlay.active .trans-scanlines{ opacity:1; }
@keyframes scanMove{ 0%{ background-position:0 0; } 100%{ background-position:0 100vh; } }

/* Holographic UI overlay */
.trans-holo-ui{
  position:absolute; inset:0; z-index:3;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  opacity:0; transform:scale(1.08);
  transition:opacity 0.4s ease 0.2s, transform 0.5s cubic-bezier(0.34,1.56,0.64,1) 0.2s;
  pointer-events:none;
}
#sectionTransitionOverlay.active .trans-holo-ui{
  opacity:1; transform:scale(1);
}

/* Corner brackets */
.trans-holo-ui::before,
.trans-holo-ui::after{
  content:'';
  position:absolute;
  width:80px; height:80px;
  border:2px solid var(--cyan-bright);
  opacity:0.7;
  box-shadow:0 0 20px var(--cyan-bright), inset 0 0 20px rgba(var(--accent-rgb),0.1);
}
.trans-holo-ui::before{
  top:40px; left:40px;
  border-right:none; border-bottom:none;
  border-radius:8px 0 0 0;
}
.trans-holo-ui::after{
  bottom:40px; right:40px;
  border-left:none; border-top:none;
  border-radius:0 0 8px 0;
}

/* Central emblem ring */
.trans-center-emblem{
  position:relative;
  width:160px; height:160px;
  display:flex; align-items:center; justify-content:center;
  margin-bottom:28px;
}

/* Rotating outer ring */
.trans-center-emblem::before{
  content:'';
  position:absolute; inset:-16px;
  border-radius:50%;
  border:2px solid transparent;
  border-top-color:var(--cyan-bright);
  border-right-color:var(--cyan);
  box-shadow:0 0 30px var(--cyan-bright);
  animation:warpRingSpin 1.2s linear infinite;
}
.trans-center-emblem::after{
  content:'';
  position:absolute; inset:-32px;
  border-radius:50%;
  border:1.5px solid transparent;
  border-bottom-color:rgba(var(--accent-rgb),0.6);
  border-left-color:rgba(var(--accent-deep-rgb),0.4);
  animation:warpRingSpin 2s linear infinite reverse;
}
@keyframes warpRingSpin{ to{ transform:rotate(360deg); } }

/* Logo in emblem */
.trans-center-emblem img{
  position:relative; z-index:2;
  width:72px; height:72px; object-fit:contain; border-radius:18px;
  background:#FFFFFF; padding:6px;
  border:2px solid rgba(var(--accent-rgb),0.6);
  box-shadow:
    0 0 20px rgba(var(--accent-rgb),0.8),
    0 0 50px rgba(var(--accent-rgb),0.5),
    0 0 90px rgba(var(--accent-deep-rgb),0.3),
    inset 0 0 20px rgba(255,255,255,0.5);
  animation:holoLogoBreath 1.8s ease-in-out infinite alternate;
}
@keyframes holoLogoBreath{
  0%{ transform:scale(0.94) rotateY(0deg); filter:brightness(1) hue-rotate(0deg); }
  100%{ transform:scale(1.06) rotateY(5deg); filter:brightness(1.3) hue-rotate(15deg); }
}

/* Target section title with glitch */
.trans-target-title{
  font-family:var(--font-display);
  font-size:clamp(24px,4vw,42px);
  font-weight:900;
  color:#FFFFFF;
  letter-spacing:0.12em;
  text-transform:uppercase;
  text-align:center;
  position:relative;
  background:linear-gradient(90deg, #FFFFFF 0%, var(--cyan-bright) 40%, #FFFFFF 60%, var(--cyan-bright) 100%);
  background-size:300% auto;
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
  animation:holoShine 1.5s linear infinite;
  filter:drop-shadow(0 0 20px rgba(var(--accent-rgb),0.8));
}
.trans-target-title::before,
.trans-target-title::after{
  content:attr(data-text);
  position:absolute; top:0; left:0; width:100%;
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
  background:inherit;
}
.trans-target-title::before{
  animation:glitchShift 0.9s infinite;
  color:rgba(255,0,128,0.7); left:2px;
  clip-path:polygon(0 15%,100% 15%,100% 40%,0 40%);
}
.trans-target-title::after{
  animation:glitchShift 1.2s infinite reverse;
  color:rgba(0,255,255,0.7); left:-2px;
  clip-path:polygon(0 60%,100% 60%,100% 80%,0 80%);
}
@keyframes holoShine{
  to{ background-position:300% center; }
}
@keyframes glitchShift{
  0%,85%{ transform:translate(0); }
  86%{ transform:translate(-4px,1px); }
  87%{ transform:translate(3px,-1px); }
  88%{ transform:translate(-2px,2px); }
  89%{ transform:translate(0); }
}

/* Data line below title */
.trans-data-line{
  display:flex; align-items:center; gap:12px; margin-top:16px;
  font-family:monospace; font-size:13px; color:rgba(var(--accent-rgb),0.7);
  letter-spacing:0.08em;
  animation:dataFlicker 3s ease-in-out infinite;
}
.trans-data-line::before,
.trans-data-line::after{
  content:''; flex:1; height:1px;
  background:linear-gradient(90deg, transparent, rgba(var(--accent-rgb),0.6), transparent);
  box-shadow:0 0 8px rgba(var(--accent-rgb),0.4);
}
@keyframes dataFlicker{
  0%,95%,100%{ opacity:1; }
  96%{ opacity:0.3; }
  97%{ opacity:1; }
  98%{ opacity:0.5; }
}

/* Pulsing rings around emblem */
.trans-pulse-ring{
  position:absolute;
  width:100%; height:100%;
  border-radius:50%;
  border:2px solid var(--cyan-bright);
  animation:warpPulse 1.6s ease-out infinite;
  z-index:1;
}
.trans-pulse-ring:nth-child(2){
  animation-delay:0.5s;
  border-color:rgba(var(--accent-deep-rgb),0.6);
}
.trans-pulse-ring:nth-child(3){
  animation-delay:1s;
  border-color:rgba(var(--accent-deep-rgb),0.3);
}
@keyframes warpPulse{
  0%{ transform:scale(0.8); opacity:1; }
  100%{ transform:scale(2.8); opacity:0; }
}

/* Creative Section Reveal Entrance */
section.section-focus{
  animation:sectionCinematicGlow 1.1s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}
@keyframes sectionCinematicGlow{
  0%{ 
    transform:scale(0.97) translateY(20px); 
    filter:brightness(1.15) drop-shadow(0 0 40px rgba(var(--accent-rgb),0.4)); 
    opacity:0.7;
  }
  60%{
    transform:scale(1.005) translateY(-2px);
    filter:brightness(1.05) drop-shadow(0 0 15px rgba(var(--accent-rgb),0.2));
    opacity:1;
  }
  100%{ 
    transform:scale(1) translateY(0); 
    filter:none; 
    opacity:1;
  }
}

/* Warp flash vignette */
.trans-vignette{
  position:absolute; inset:0; z-index:4; pointer-events:none;
  background:radial-gradient(ellipse at center, transparent 30%, rgba(0,5,15,0.85) 100%);
  opacity:0;
  transition:opacity 0.3s ease;
}
#sectionTransitionOverlay.active .trans-vignette{ opacity:1; }

/* ======================================================
   PRODUCT DETAILS MODAL STYLES
====================================================== */
.product-modal{
  position:fixed; inset:0; z-index:100005;
  display:flex; align-items:center; justify-content:center;
  opacity:0; visibility:hidden; pointer-events:none;
  transition:opacity 0.35s var(--ease), visibility 0.35s var(--ease);
}
.product-modal.active{
  opacity:1; visibility:visible; pointer-events:auto;
}
.product-modal-backdrop{
  position:absolute; inset:0;
  background:rgba(4, 16, 28, 0.78);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
}
.product-modal-container{
  position:relative; z-index:2;
  width:100%; max-width:1000px;
  margin:auto; padding:20px;
  max-height:94vh; display:flex;
}
.product-modal-dialog{
  background:var(--card-bg);
  border:1px solid rgba(0, 205, 224, 0.3);
  border-radius:28px;
  box-shadow:0 35px 80px -15px rgba(0,0,0,0.5), 0 0 35px rgba(var(--accent-rgb),0.15);
  width:100%; max-height:90vh;
  overflow-y:auto; overflow-x:hidden;
  position:relative;
  transform:scale(0.93) translateY(24px);
  transition:transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}
[data-theme="deep"] .product-modal-dialog{
  background:linear-gradient(150deg, rgba(14, 38, 64, 0.95), rgba(7, 20, 36, 0.98));
  border-color:rgba(0, 229, 255, 0.35);
  box-shadow:0 40px 90px -15px rgba(0,0,0,0.7), 0 0 50px -10px rgba(var(--accent-rgb),0.22);
}
.product-modal.active .product-modal-dialog{
  transform:scale(1) translateY(0);
}
.pm-close-btn{
  position:absolute; top:20px; right:20px; z-index:10;
  width:42px; height:42px; border-radius:50%;
  background:rgba(0, 168, 190, 0.1); border:1px solid rgba(0, 168, 190, 0.25);
  color:var(--ink); cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  transition:all 0.3s ease;
}
html[dir="rtl"] .pm-close-btn{
  right:auto; left:20px;
}
.pm-close-btn:hover{
  background:rgba(0, 205, 224, 0.25); color:var(--cyan);
  transform:rotate(90deg) scale(1.08);
}
.pm-body{
  padding:36px 36px 40px;
}
.pm-grid{
  display:grid; grid-template-columns:340px 1fr; gap:36px; align-items:start;
}
.pm-visual-col{
  display:flex; flex-direction:column; gap:16px;
}
.pm-img-box{
  position:relative; width:100%; aspect-ratio:1/1; border-radius:24px; overflow:hidden;
  background:linear-gradient(145deg, rgba(255,255,255,0.95), rgba(240,248,252,0.85));
  border:1px solid rgba(0, 205, 224, 0.25);
  box-shadow:0 20px 45px -12px rgba(0,20,40,0.3);
}
[data-theme="deep"] .pm-img-box{
  background:linear-gradient(145deg, rgba(14,35,58,0.95), rgba(7,20,34,0.98));
  border-color:rgba(var(--accent-rgb),0.3);
  box-shadow:0 25px 50px -12px rgba(0,0,0,0.6), 0 0 35px -5px rgba(var(--accent-rgb),0.25);
}
.pm-img{
  width:100%; height:100%; object-fit:cover; display:block;
  transition:transform 0.6s var(--ease);
}
.pm-img-box:hover .pm-img{
  transform:scale(1.04);
}
.pm-standards-pills{
  display:flex; flex-wrap:wrap; gap:6px;
}
.pm-std-pill{
  font-size:11px; font-weight:700; padding:4px 10px; border-radius:999px;
  background:rgba(0, 168, 190, 0.1); color:var(--cyan-deep);
  border:1px solid rgba(0, 168, 190, 0.2);
}
[data-theme="deep"] .pm-std-pill{
  background:rgba(0, 229, 255, 0.12); color:var(--cyan-bright);
  border-color:rgba(0, 229, 255, 0.25);
}
.pm-info-col{
  display:flex; flex-direction:column; gap:18px;
}
.pm-header-tags{
  display:flex; align-items:center; gap:8px; flex-wrap:wrap;
}
.pm-company-tag{
  font-size:12px; font-weight:700; padding:4px 12px; border-radius:999px;
  background:rgba(0, 168, 190, 0.14); color:var(--cyan-deep);
  border:1px solid rgba(0, 168, 190, 0.25);
}
[data-theme="deep"] .pm-company-tag{
  background:rgba(0, 229, 255, 0.16); color:var(--cyan-bright);
}
.pm-cat-tag{
  font-size:11.5px; font-weight:600; padding:4px 12px; border-radius:999px;
  background:var(--silver-mist); color:var(--ink-soft);
}
[data-theme="deep"] .pm-cat-tag{
  background:rgba(255,255,255,0.08); color:var(--ink-soft);
}
.pm-badge-tag{
  font-size:11.5px; font-weight:700; padding:4px 12px; border-radius:999px;
  background:linear-gradient(90deg, var(--cyan-deep), var(--cyan-bright));
  color:#FFFFFF; box-shadow:0 0 10px rgba(var(--accent-rgb),0.4);
}
.pm-title{
  font-size:25px; font-weight:800; line-height:1.3; color:var(--ink);
  font-family:var(--font-display);
}
.pm-desc{
  font-size:14.5px; line-height:1.65; color:var(--ink-soft);
}
.pm-specs-grid{
  display:grid; grid-template-columns:1fr; gap:12px; margin-top:4px;
}
.pm-spec-card{
  background:rgba(0, 168, 190, 0.04); border:1px solid rgba(0, 168, 190, 0.16);
  border-radius:16px; padding:12px 18px;
  display:flex; flex-direction:column; gap:4px;
}
[data-theme="deep"] .pm-spec-card{
  background:rgba(255, 255, 255, 0.03); border-color:rgba(0, 229, 255, 0.18);
}
.pm-spec-label{
  font-size:11.5px; font-weight:700; text-transform:uppercase; letter-spacing:0.4px;
  color:var(--cyan-deep); display:flex; align-items:center; gap:6px;
}
[data-theme="deep"] .pm-spec-label{
  color:var(--cyan-bright);
}
.pm-spec-val{
  font-size:13.5px; font-weight:500; color:var(--ink); line-height:1.55;
}
.pm-actions-bar{
  display:flex; gap:12px; margin-top:8px; flex-wrap:wrap;
}
.pm-btn-inquire{
  flex:1; min-width:200px; padding:12px 24px; border-radius:var(--radius-pill);
  background:linear-gradient(135deg, var(--navy-mid), var(--cyan-deep));
  color:#FFFFFF; font-weight:700; font-size:14px; border:none; cursor:pointer;
  display:flex; align-items:center; justify-content:center; gap:8px;
  transition:all 0.3s ease; text-decoration:none;
}
.pm-btn-inquire:hover{
  transform:translateY(-2px); box-shadow:0 10px 24px -4px rgba(var(--accent-deep-rgb),0.5);
}
.pm-btn-close{
  padding:12px 24px; border-radius:var(--radius-pill);
  background:transparent; border:1.5px solid var(--line);
  color:var(--ink); font-weight:600; font-size:13.5px; cursor:pointer;
  transition:all 0.3s ease;
}
.pm-btn-close:hover{
  border-color:var(--cyan); color:var(--cyan);
}

/* Details button on slide */
.p-details-btn{
  background:linear-gradient(135deg, rgba(var(--accent-deep-rgb),0.12), rgba(var(--accent-rgb),0.18));
  border:1px solid rgba(var(--accent-deep-rgb),0.3); border-radius:999px;
  padding:6px 14px; font-size:12px; font-weight:700; color:var(--cyan-deep);
  cursor:pointer; display:inline-flex; align-items:center; gap:6px;
  transition:all 0.3s ease; font-family:inherit;
}
[data-theme="deep"] .p-details-btn{
  background:rgba(var(--accent-rgb),0.15); color:var(--cyan-bright); border-color:rgba(var(--accent-rgb),0.35);
}
.p-details-btn:hover{
  background:linear-gradient(135deg, var(--cyan-deep), var(--cyan-bright));
  color:#FFFFFF; transform:translateY(-1px); box-shadow:0 4px 14px rgba(var(--accent-rgb),0.35);
}

@media (max-width:820px){
  .pm-grid{ grid-template-columns:1fr; gap:24px; }
  .pm-body{ padding:26px 20px; }
  .pm-title{ font-size:20px; }
  .pm-visual-col{ max-width:280px; margin:0 auto; width:100%; }
  .pm-actions-bar{ flex-direction:column; }
  .pm-btn-inquire, .pm-btn-close{ width:100%; text-align:center; }
}

/* ========================================================
   ABOUT US: VISION, MISSION & CORE VALUES ENHANCED STYLES
   ======================================================== */
.about-vm-card {
  position: relative;
  border-radius: 24px;
  padding: 32px 28px;
  background: linear-gradient(145deg, rgba(255,255,255,0.04) 0%, rgba(255,255,255,0.015) 100%);
  border: 1px solid rgba(255,255,255,0.09);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  overflow: hidden;
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.4s ease, box-shadow 0.4s ease;
  box-shadow: 0 10px 30px -10px rgba(0,0,0,0.18);
  height: 100%;
  display: flex;
  flex-direction: column;
}

[data-theme="light"] .about-vm-card {
  background: linear-gradient(145deg, #FFFFFF 0%, #F8FAFC 100%);
  border-color: rgba(0, 155, 176, 0.18);
  box-shadow: 0 10px 30px -10px rgba(0, 155, 176, 0.08);
}

.about-vm-card:hover {
  transform: translateY(-6px);
  border-color: var(--cyan);
  box-shadow: 0 20px 40px -12px rgba(0, 199, 222, 0.22);
}

.about-vm-glow {
  position: absolute;
  top: -40px;
  inset-inline-end: -40px;
  width: 140px;
  height: 140px;
  border-radius: 50%;
  pointer-events: none;
  filter: blur(35px);
  opacity: 0.6;
  transition: opacity 0.4s ease;
}

.about-vm-card:hover .about-vm-glow {
  opacity: 1;
}

.about-vm-icon-box {
  width: 54px;
  height: 54px;
  border-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  margin-bottom: 20px;
  border: 1px solid rgba(255,255,255,0.12);
  box-shadow: 0 6px 16px rgba(0,0,0,0.12);
  flex-shrink: 0;
}

.about-vm-title {
  font-size: 1.25rem;
  font-weight: 800;
  margin-bottom: 12px;
  letter-spacing: -0.3px;
  display: flex;
  align-items: center;
  gap: 10px;
}

.about-vm-desc {
  font-size: 0.96rem;
  line-height: 1.8;
  color: var(--text-secondary, #94A3B8);
  margin: 0;
}

[data-theme="light"] .about-vm-desc {
  color: #475569;
}

/* Core Values Grid */
.core-val-card {
  position: relative;
  border-radius: 20px;
  padding: 24px 22px;
  background: rgba(255,255,255,0.025);
  border: 1px solid rgba(255,255,255,0.07);
  transition: transform 0.35s ease, border-color 0.35s ease, background-color 0.35s ease, box-shadow 0.35s ease;
  height: 100%;
  display: flex;
  flex-direction: column;
}

[data-theme="light"] .core-val-card {
  background: #FFFFFF;
  border-color: #E2E8F0;
  box-shadow: 0 4px 16px rgba(0,0,0,0.03);
}

.core-val-card:hover {
  transform: translateY(-4px);
  border-color: rgba(0, 199, 222, 0.45);
  background: rgba(255,255,255,0.045);
  box-shadow: 0 12px 28px -8px rgba(0, 199, 222, 0.16);
}

[data-theme="light"] .core-val-card:hover {
  background: #F8FAFC;
  box-shadow: 0 12px 28px -8px rgba(0, 155, 176, 0.12);
}

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

.core-val-icon-wrap {
  width: 42px;
  height: 42px;
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(0, 199, 222, 0.18), rgba(0, 91, 148, 0.12));
  border: 1px solid rgba(0, 199, 222, 0.3);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--cyan);
  font-size: 1.1rem;
  flex-shrink: 0;
  transition: transform 0.3s ease;
}

.core-val-card:hover .core-val-icon-wrap {
  transform: scale(1.1) rotate(5deg);
  background: linear-gradient(135deg, var(--cyan), var(--cyan-deep));
  color: #FFFFFF;
}

.core-val-title {
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--text, #F8FAFC);
  margin: 0;
}

[data-theme="light"] .core-val-title {
  color: #0F172A;
}

.core-val-desc {
  font-size: 0.91rem;
  line-height: 1.7;
  color: var(--text-secondary, #94A3B8);
  margin: 0;
}

[data-theme="light"] .core-val-desc {
  color: #64748B;
}

/* ========================================================
   FLAGSHIP LUXURY SHOWCASE: ABOUT, VISION, MISSION & VALUES
   ======================================================== */
.about-hero-badge {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: rgba(0, 199, 222, 0.08);
  border: 1px solid rgba(0, 199, 222, 0.28);
  padding: 6px 18px;
  border-radius: 999px;
  font-size: 0.88rem;
  font-weight: 700;
  color: var(--cyan);
  box-shadow: 0 4px 16px rgba(0, 199, 222, 0.12);
  letter-spacing: 0.5px;
}
.about-hero-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--cyan);
  box-shadow: 0 0 10px var(--cyan);
  animation: coPartnerPulse 2s infinite ease-in-out;
}
.about-hero-badge-tag {
  background: rgba(255, 255, 255, 0.1);
  padding: 2px 8px;
  border-radius: 6px;
  font-size: 0.76rem;
  letter-spacing: 0.5px;
  color: #FFFFFF;
}
[data-theme="light"] .about-hero-badge-tag {
  background: rgba(0, 155, 176, 0.15);
  color: #005B94;
}

.about-grand-title {
  font-size: clamp(2.2rem, 3.8vw, 3.2rem);
  font-weight: 900;
  letter-spacing: -0.5px;
  line-height: 1.2;
}

.about-lead-box {
  position: relative;
  max-width: 900px;
  margin: 0 auto;
  padding: 20px 48px;
}
.about-quote-mark {
  position: absolute;
  font-size: 5rem;
  line-height: 1;
  font-family: Georgia, serif;
  color: rgba(0, 199, 222, 0.18);
  user-select: none;
  pointer-events: none;
}
.about-quote-mark.start {
  top: -15px;
  inset-inline-start: 0;
}
.about-quote-mark.end {
  bottom: -35px;
  inset-inline-end: 0;
}
.about-lead-text {
  font-size: clamp(1.05rem, 1.25vw, 1.2rem);
  line-height: 2;
  color: #1E293B;
  font-weight: 500;
  text-align: center;
}
[data-theme="deep"] .about-lead-text {
  color: #CBD5E1;
}

/* Luxury Dual Cards (Vision & Mission) - Flagship Overhaul */
.luxury-vm-container {
  perspective: 1000px;
}
.luxury-vm-card {
  position: relative;
  border-radius: 30px;
  overflow: hidden;
  height: 100%;
  padding: 44px 38px 48px;
  transition: all 0.5s cubic-bezier(0.16, 1, 0.3, 1);
  display: flex;
  flex-direction: column;
}

/* Dark theme card */
[data-theme="deep"] .luxury-vm-card {
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.04) 0%, rgba(255, 255, 255, 0.01) 100%);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.25);
}

/* Light / Default theme card */
.luxury-vm-card,
[data-theme="light"] .luxury-vm-card {
  background: #FFFFFF;
  border: 1px solid #E2E8F0;
  box-shadow: 0 12px 36px rgba(10, 35, 60, 0.07);
}
.luxury-vm-card:hover,
[data-theme="light"] .luxury-vm-card:hover {
  box-shadow: 0 22px 50px rgba(10, 35, 60, 0.12);
}

.luxury-vm-ambient {
  position: absolute;
  top: -100px;
  right: -100px;
  width: 250px;
  height: 250px;
  border-radius: 50%;
  filter: blur(80px);
  pointer-events: none;
  opacity: 0.35;
  transition: opacity 0.5s ease, transform 0.5s ease;
}
.vision-ambient {
  background: radial-gradient(circle, var(--cyan) 0%, transparent 70%);
}
.mission-ambient {
  background: radial-gradient(circle, #3B82F6 0%, transparent 70%);
}

.luxury-vm-watermark {
  position: absolute;
  bottom: 15px;
  right: 25px;
  font-size: 5.5rem;
  font-weight: 900;
  line-height: 1;
  color: rgba(10, 35, 60, 0.04);
  user-select: none;
  pointer-events: none;
  font-family: var(--font-display, sans-serif);
  letter-spacing: -2px;
  transition: all 0.5s ease;
}
[data-theme="deep"] .luxury-vm-watermark {
  color: rgba(255, 255, 255, 0.03);
}
[dir="rtl"] .luxury-vm-watermark {
  right: auto;
  left: 25px;
}

.luxury-vm-content {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  height: 100%;
}
.luxury-vm-card:hover {
  transform: translateY(-8px) scale(1.01);
}
.luxury-vm-card:hover .luxury-vm-ambient {
  opacity: 0.6;
  transform: scale(1.2);
}
.luxury-vm-card:hover .luxury-vm-watermark {
  transform: translateY(-5px);
}

.vision-card {
  border-top: 3px solid var(--cyan) !important;
}
.vision-card:hover {
  border-color: var(--cyan);
  box-shadow: 0 25px 50px -12px rgba(0, 168, 190, 0.28);
}

.mission-card {
  border-top: 3px solid #2563EB !important;
}
.mission-card:hover {
  border-color: #2563EB;
  box-shadow: 0 25px 50px -12px rgba(37, 99, 235, 0.28);
}

.luxury-vm-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 24px;
}
.luxury-vm-icon {
  width: 60px;
  height: 60px;
  border-radius: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  transition: all 0.4s ease;
}
.vision-icon-wrap {
  background: linear-gradient(135deg, rgba(0, 168, 190, 0.12), rgba(0, 123, 142, 0.22));
  border: 1px solid rgba(0, 168, 190, 0.35);
  color: #007B8E;
  box-shadow: 0 8px 24px rgba(0, 168, 190, 0.2);
}
[data-theme="deep"] .vision-icon-wrap {
  background: linear-gradient(135deg, rgba(0, 199, 222, 0.2), rgba(0, 91, 148, 0.3));
  color: var(--cyan-bright);
}

.mission-icon-wrap {
  background: linear-gradient(135deg, rgba(37, 99, 235, 0.12), rgba(29, 78, 216, 0.22));
  border: 1px solid rgba(37, 99, 235, 0.35);
  color: #1D4ED8;
  box-shadow: 0 8px 24px rgba(37, 99, 235, 0.2);
}
[data-theme="deep"] .mission-icon-wrap {
  background: linear-gradient(135deg, rgba(59, 130, 246, 0.2), rgba(27, 58, 112, 0.3));
  color: #60A5FA;
}

.luxury-vm-card:hover .luxury-vm-icon {
  transform: rotate(8deg) scale(1.1);
}

.luxury-vm-pill {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 1.2px;
  padding: 6px 16px;
  border-radius: 30px;
}
.pill-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  display: inline-block;
}
.vision-pill {
  background: rgba(0, 168, 190, 0.1);
  color: #007B8E;
  border: 1px solid rgba(0, 168, 190, 0.3);
}
.vision-pill .pill-dot {
  background: #00A8BE;
  box-shadow: 0 0 8px #00A8BE;
}
[data-theme="deep"] .vision-pill {
  background: rgba(0, 199, 222, 0.12);
  color: var(--cyan);
}

.mission-pill {
  background: rgba(37, 99, 235, 0.1);
  color: #1D4ED8;
  border: 1px solid rgba(37, 99, 235, 0.3);
}
.mission-pill .pill-dot {
  background: #2563EB;
  box-shadow: 0 0 8px #2563EB;
}
[data-theme="deep"] .mission-pill {
  background: rgba(59, 130, 246, 0.12);
  color: #60A5FA;
}

/* Headings & Body Contrast in Light & Dark */
.luxury-vm-heading {
  font-size: 1.6rem;
  font-weight: 900;
  color: #0A233C;
  margin-bottom: 14px;
  letter-spacing: -0.3px;
}
[data-theme="deep"] .luxury-vm-heading {
  color: #FFFFFF;
}

.luxury-vm-body {
  font-size: 1.05rem;
  line-height: 1.95;
  color: #2D4A66;
  font-weight: 500;
  margin: 0;
  flex-grow: 1;
}
[data-theme="deep"] .luxury-vm-body {
  color: #CBD5E1;
}

.luxury-vm-accent-bar {
  height: 3px;
  width: 48px;
  border-radius: 3px;
  margin-top: 24px;
  transition: width 0.4s ease;
}
.vision-bar {
  background: linear-gradient(90deg, #00A8BE, transparent);
}
.mission-bar {
  background: linear-gradient(90deg, #2563EB, transparent);
}
.luxury-vm-card:hover .luxury-vm-accent-bar {
  width: 100px;
}

/* Values Header & Section Styling */
.values-head-block {
  position: relative;
}
.values-pill-tag {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 0.84rem;
  font-weight: 800;
  letter-spacing: 1.5px;
  color: #007B8E;
  background: rgba(0, 168, 190, 0.1);
  border: 1px solid rgba(0, 168, 190, 0.3);
  padding: 6px 18px;
  border-radius: 30px;
  margin-bottom: 14px;
}
[data-theme="deep"] .values-pill-tag {
  color: var(--cyan);
  background: rgba(0, 199, 222, 0.1);
  border-color: rgba(0, 199, 222, 0.35);
}

.values-main-title {
  font-size: 2.2rem;
  font-weight: 900;
  color: #0A233C;
  margin-bottom: 12px;
}
[data-theme="deep"] .values-main-title {
  background: linear-gradient(135deg, #FFFFFF 30%, #94A3B8 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  color: #FFFFFF;
}

.values-sub-desc {
  font-size: 1.02rem;
  color: #334E68;
  font-weight: 500;
  max-width: 680px;
  margin: 0 auto 16px;
  line-height: 1.85;
}
[data-theme="deep"] .values-sub-desc {
  color: #94A3B8;
}

.values-divider {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
}
.values-divider span {
  width: 44px;
  height: 1.5px;
  background: rgba(10, 35, 60, 0.15);
}
[data-theme="deep"] .values-divider span {
  background: rgba(255, 255, 255, 0.15);
}
.values-divider i {
  color: #00A8BE;
  font-size: 14px;
}
[data-theme="deep"] .values-divider i {
  color: var(--cyan);
}

/* ========================================================
   CONNECTED ENCLOSURE FRAME: ركائز التميز (Core Values Frame)
   ======================================================== */
.luxury-values-enclosure {
  position: relative;
  border-radius: 36px;
  padding: 48px 36px 42px;
  overflow: hidden;
  transition: all 0.4s ease;
}

/* Light & Default Frame */
.luxury-values-enclosure,
[data-theme="light"] .luxury-values-enclosure {
  background: linear-gradient(180deg, #F8FAFC 0%, #EDF4F9 100%);
  border: 1.5px solid #CBD5E1;
  box-shadow: 0 16px 45px rgba(10, 35, 60, 0.06), inset 0 1px 0 #FFFFFF;
}
.luxury-values-enclosure:hover,
[data-theme="light"] .luxury-values-enclosure:hover {
  border-color: #00A8BE;
  box-shadow: 0 24px 55px rgba(0, 168, 190, 0.14);
}

/* Deep Theme Frame */
[data-theme="deep"] .luxury-values-enclosure {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.025) 0%, rgba(10, 25, 47, 0.4) 100%);
  border: 1px solid rgba(0, 199, 222, 0.22);
  box-shadow: 0 20px 60px -15px rgba(0, 0, 0, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
}
[data-theme="deep"] .luxury-values-enclosure:hover {
  border-color: rgba(0, 199, 222, 0.4);
  box-shadow: 0 25px 70px -10px rgba(0, 199, 222, 0.15);
}

.values-enclosure-glow {
  position: absolute;
  top: -120px;
  left: 50%;
  transform: translateX(-50%);
  width: 500px;
  height: 250px;
  background: radial-gradient(ellipse, rgba(0, 168, 190, 0.18) 0%, transparent 70%);
  filter: blur(60px);
  pointer-events: none;
  z-index: 0;
}

/* Connected Grid Inside Frame */
.values-connected-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}
@media (max-width: 991px) {
  .values-connected-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 575px) {
  .values-connected-grid {
    grid-template-columns: 1fr;
  }
}

.luxury-val-card {
  position: relative;
  border-radius: 22px;
  padding: 30px 22px 28px;
  display: flex;
  flex-direction: column;
  transition: all 0.45s cubic-bezier(0.16, 1, 0.3, 1);
  overflow: hidden;
}

/* Light / Default Card */
.luxury-val-card,
[data-theme="light"] .luxury-val-card {
  background: #FFFFFF;
  border: 1px solid #E2E8F0;
  box-shadow: 0 4px 18px rgba(10, 35, 60, 0.04);
}
.luxury-val-card:hover,
[data-theme="light"] .luxury-val-card:hover {
  transform: translateY(-6px);
  background: #FFFFFF;
  border-color: #00A8BE;
  box-shadow: 0 18px 40px -8px rgba(0, 168, 190, 0.22);
}

/* Deep Theme Card */
[data-theme="deep"] .luxury-val-card {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.08);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow: none;
}
[data-theme="deep"] .luxury-val-card:hover {
  border-color: rgba(0, 199, 222, 0.5);
  background: rgba(0, 199, 222, 0.05);
  box-shadow: 0 16px 36px -8px rgba(0, 199, 222, 0.25);
}

.val-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 20px;
}

/* Number Badge */
.val-number-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: #EEF4F8;
  border: 1px solid #D1DFE8;
  padding: 4px 12px 4px 10px;
  border-radius: 20px;
  transition: all 0.35s ease;
}
[data-theme="deep"] .val-number-badge {
  background: rgba(255, 255, 255, 0.05);
  border-color: rgba(255, 255, 255, 0.1);
}

.val-num-icon {
  font-size: 0.85rem;
  color: #007B8E;
  transition: transform 0.35s ease, color 0.35s ease;
}
[data-theme="deep"] .val-num-icon {
  color: var(--cyan);
}

.val-number {
  font-family: var(--font-display, sans-serif);
  font-size: 1.15rem;
  font-weight: 900;
  color: #0A233C;
  letter-spacing: 0.5px;
  line-height: 1;
}
[data-theme="deep"] .val-number {
  color: #FFFFFF;
}

.luxury-val-card:hover .val-number-badge {
  background: rgba(0, 168, 190, 0.12);
  border-color: rgba(0, 168, 190, 0.4);
}
[data-theme="deep"] .luxury-val-card:hover .val-number-badge {
  background: rgba(0, 199, 222, 0.15);
  border-color: rgba(0, 199, 222, 0.4);
}

.luxury-val-card:hover .val-num-icon {
  transform: scale(1.2);
  color: #00A8BE;
}
[data-theme="deep"] .luxury-val-card:hover .val-num-icon {
  color: var(--cyan-bright);
}

/* Icon Box */
.val-icon-box {
  width: 48px;
  height: 48px;
  border-radius: 15px;
  background: linear-gradient(135deg, rgba(0, 168, 190, 0.14), rgba(0, 123, 142, 0.12));
  border: 1px solid rgba(0, 168, 190, 0.3);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #007B8E;
  font-size: 1.25rem;
  transition: all 0.4s ease;
}
[data-theme="deep"] .val-icon-box {
  background: linear-gradient(135deg, rgba(0, 199, 222, 0.18), rgba(0, 91, 148, 0.15));
  border-color: rgba(0, 199, 222, 0.35);
  color: var(--cyan);
}

.luxury-val-card:hover .val-icon-box {
  transform: scale(1.15) rotate(8deg);
  background: linear-gradient(135deg, #00A8BE, #007B8E);
  color: #FFFFFF;
  box-shadow: 0 8px 20px rgba(0, 168, 190, 0.4);
}
[data-theme="deep"] .luxury-val-card:hover .val-icon-box {
  background: linear-gradient(135deg, var(--cyan), var(--cyan-deep));
  color: #FFFFFF;
  box-shadow: 0 8px 20px rgba(0, 199, 222, 0.45);
}

/* Title & Description */
.val-title {
  font-size: 1.18rem;
  font-weight: 800;
  color: #0A233C;
  margin-bottom: 12px;
  letter-spacing: -0.2px;
}
[data-theme="deep"] .val-title {
  color: #FFFFFF;
}

.val-desc {
  font-size: 0.94rem;
  line-height: 1.85;
  color: #334E68;
  font-weight: 500;
  margin-bottom: 18px;
  flex-grow: 1;
}
[data-theme="deep"] .val-desc {
  color: #94A3B8;
}

.val-card-footer-line {
  height: 3px;
  width: 34px;
  background: rgba(0, 168, 190, 0.35);
  border-radius: 3px;
  transition: width 0.45s cubic-bezier(0.16, 1, 0.3, 1), background 0.4s ease;
}
.luxury-val-card:hover .val-card-footer-line {
  width: 100%;
  background: linear-gradient(90deg, #00A8BE, #2563EB);
}
[data-theme="deep"] .val-card-footer-line {
  background: rgba(0, 199, 222, 0.3);
}
[data-theme="deep"] .luxury-val-card:hover .val-card-footer-line {
  background: linear-gradient(90deg, var(--cyan), #3B82F6);
}

/* ========================================================
   FORCE 2 COMPANIES PER ROW ON MOBILE (<= 768px)
   ======================================================== */
@media (max-width: 768px) {
  #companies .company-grid,
  .company-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }
}