/* =====================================================================
   BURAK CONTRACTING — Corporate Design System
   Premium · Saudi · Industrial · Water
   ===================================================================== */

/* ------------------------------------------------------------ tokens */
:root{
  --navy:#0B2A4A;
  --navy-800:#0A2340;
  --navy-900:#061626;
  --navy-700:#12406B;
  --navy-600:#1B5183;
  --cyan:#00A3D9;
  --cyan-600:#0089B8;
  --cyan-300:#5FC8EC;
  --cyan-100:#DCF2FB;
  --gold:#C8A54B;
  --gold-300:#E0C378;
  --ink:#16283A;
  --body:#41566B;
  --muted:#6E8296;
  --line:#E2EAF1;
  --line-soft:#EEF3F8;
  --bg:#FFFFFF;
  --bg-soft:#F4F8FB;
  --bg-deep:#EEF4F9;
  --success:#12A67A;
  --warn:#E1A32B;
  --danger:#D64550;

  --radius-xs:4px;
  --radius-sm:6px;
  --radius:10px;
  --radius-lg:16px;

  --shadow-xs:0 1px 2px rgba(11,42,74,.06);
  --shadow-sm:0 2px 10px rgba(11,42,74,.07);
  --shadow:0 10px 30px rgba(11,42,74,.10);
  --shadow-lg:0 24px 60px rgba(11,42,74,.16);
  --shadow-cyan:0 12px 30px rgba(0,163,217,.28);

  --ff:'Inter','Segoe UI',system-ui,-apple-system,sans-serif;
  --ff-alt:'Barlow Condensed','Inter',sans-serif;

  --header-h:78px;
  --topbar-h:40px;
  --ease:cubic-bezier(.22,.75,.3,1);
  --t-fast:.22s var(--ease);
  --t:.38s var(--ease);
  --t-slow:.7s var(--ease);
  --container:1240px;
}
html[dir="rtl"]{ --ff:'Cairo','Segoe UI',Tahoma,sans-serif; --ff-alt:'Cairo',sans-serif; }

/* ------------------------------------------------------------- base */
*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; scroll-padding-top:calc(var(--header-h) + 16px); -webkit-text-size-adjust:100%;
      overflow-x:hidden; overflow-x:clip; }
body{
  margin:0; font-family:var(--ff); font-size:16px; line-height:1.7;
  color:var(--body); background:var(--bg); overflow-x:hidden; overflow-x:clip;
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
}
img,svg,video{ max-width:100%; height:auto; display:block; }
a{ color:var(--cyan-600); text-decoration:none; transition:color var(--t-fast); }
a:hover{ color:var(--navy); }
h1,h2,h3,h4,h5,h6{ font-family:var(--ff); color:var(--ink); font-weight:800; line-height:1.2; letter-spacing:-.02em; margin:0 0 .6em; }
html[dir="rtl"] h1,html[dir="rtl"] h2,html[dir="rtl"] h3,html[dir="rtl"] h4{ letter-spacing:0; line-height:1.45; }
h1{ font-size:clamp(2rem,4.4vw,3.4rem); }
h2{ font-size:clamp(1.65rem,3.1vw,2.5rem); }
h3{ font-size:clamp(1.2rem,2vw,1.55rem); }
h4{ font-size:1.1rem; }
p{ margin:0 0 1.1rem; }
ul,ol{ margin:0 0 1.1rem; padding-inline-start:1.2rem; }
hr{ border:0; border-top:1px solid var(--line); margin:2rem 0; opacity:1; }
::selection{ background:var(--cyan); color:#fff; }

.container{ width:100%; max-width:var(--container); margin-inline:auto; padding-inline:20px; }
.container-wide{ max-width:1480px; }

/* accessibility */
.skip-link{
  position:absolute; inset-inline-start:-9999px; top:0; z-index:99999;
  background:var(--navy); color:#fff; padding:12px 20px; border-radius:0 0 8px 0; font-weight:600;
}
.skip-link:focus{ inset-inline-start:0; color:#fff; }
:focus-visible{ outline:3px solid var(--cyan); outline-offset:3px; border-radius:3px; }
.visually-hidden{
  position:absolute!important; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;
}

/* ------------------------------------------------------- typography */
.eyebrow{
  display:inline-flex; align-items:center; gap:.55rem;
  font-size:.72rem; font-weight:700; letter-spacing:.18em; text-transform:uppercase;
  color:var(--cyan-600); margin-bottom:.9rem;
}
html[dir="rtl"] .eyebrow{ letter-spacing:.02em; }
.eyebrow::before{ content:""; width:26px; height:2px; background:linear-gradient(90deg,var(--cyan),var(--gold)); border-radius:2px; }
.eyebrow--light{ color:var(--cyan-300); }
.eyebrow--center{ justify-content:center; }

.section-title{ margin-bottom:.85rem; }
.section-text{ color:var(--muted); font-size:1.02rem; max-width:62ch; }
.section-head{ margin-bottom:3rem; }
.section-head--center{ text-align:center; }
.section-head--center .section-text{ margin-inline:auto; }

.text-gradient{
  background:linear-gradient(100deg,var(--cyan) 0%,var(--cyan-300) 45%,var(--gold) 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.lead{ font-size:1.1rem; color:var(--body); }

/* --------------------------------------------------------- sections */
.section{ padding:clamp(64px,7vw,112px) 0; position:relative; }
.section--tight{ padding:clamp(48px,5vw,76px) 0; }
.section--soft{ background:var(--bg-soft); }
.section--deep{ background:var(--navy); color:#C4D6E5; }
.section--deep h2,.section--deep h3,.section--deep h4{ color:#fff; }
.section--deep .section-text{ color:#9FBAD0; }
.section--pattern{
  background:
    radial-gradient(900px 420px at 92% -8%,rgba(0,163,217,.10),transparent 62%),
    radial-gradient(700px 380px at 0% 105%,rgba(200,165,75,.09),transparent 60%),
    var(--bg-soft);
}
.section--deep.section--pattern{
  background:
    radial-gradient(900px 460px at 88% -10%,rgba(0,163,217,.22),transparent 62%),
    radial-gradient(760px 420px at 2% 108%,rgba(200,165,75,.14),transparent 60%),
    var(--navy);
}
.section--deep .eyebrow{ color:var(--cyan-300); }
.section-divider{
  height:1px; background:linear-gradient(90deg,transparent,var(--line) 18%,var(--line) 82%,transparent);
}

/* ---------------------------------------------------------- buttons */
.btn{
  --btn-bg:var(--cyan); --btn-fg:#fff; --btn-bd:transparent;
  position:relative; display:inline-flex; align-items:center; justify-content:center; gap:.6rem;
  padding:.92rem 1.7rem; border:1.5px solid var(--btn-bd); border-radius:var(--radius-sm);
  background:var(--btn-bg); color:var(--btn-fg);
  font-family:var(--ff); font-size:.94rem; font-weight:700; letter-spacing:.01em;
  cursor:pointer; overflow:hidden; isolation:isolate; white-space:nowrap;
  transition:transform var(--t-fast),box-shadow var(--t-fast),background var(--t-fast),color var(--t-fast),border-color var(--t-fast);
}
.btn::after{
  content:""; position:absolute; inset:0; z-index:-1; transform:translateY(101%);
  background:rgba(255,255,255,.16); transition:transform var(--t);
}
.btn:hover{ color:var(--btn-fg); transform:translateY(-2px); box-shadow:var(--shadow); }
.btn:hover::after{ transform:translateY(0); }
.btn:active{ transform:translateY(0); }
.btn i{ font-size:.95em; }

.btn-primary{ --btn-bg:var(--cyan); box-shadow:0 6px 18px rgba(0,163,217,.26); }
.btn-primary:hover{ box-shadow:var(--shadow-cyan); }
.btn-navy{ --btn-bg:var(--navy); }
.btn-gold{ --btn-bg:var(--gold); --btn-fg:#241C05; }
.btn-danger{ --btn-bg:var(--danger); }
.btn-success{ --btn-bg:var(--success); }
.btn-whatsapp{ --btn-bg:#25D366; --btn-fg:#04301A; }
.btn-outline{ --btn-bg:transparent; --btn-fg:var(--navy); --btn-bd:var(--line); }
.btn-outline:hover{ --btn-bg:var(--navy); --btn-fg:#fff; --btn-bd:var(--navy); }
.btn-ghost-light{ --btn-bg:rgba(255,255,255,.08); --btn-fg:#fff; --btn-bd:rgba(255,255,255,.34); backdrop-filter:blur(8px); }
.btn-ghost-light:hover{ --btn-bg:#fff; --btn-fg:var(--navy); --btn-bd:#fff; }
.btn-lg{ padding:1.08rem 2.1rem; font-size:1rem; }
.btn-sm{ padding:.6rem 1.1rem; font-size:.84rem; }
.btn-block{ width:100%; }
.btn-icon{ width:44px; height:44px; padding:0; border-radius:50%; }

.link-arrow{
  display:inline-flex; align-items:center; gap:.5rem;
  font-weight:700; font-size:.9rem; color:var(--navy); letter-spacing:.01em;
}
.link-arrow i{ transition:transform var(--t-fast); font-size:.8em; }
.link-arrow:hover{ color:var(--cyan-600); }
.link-arrow:hover i{ transform:translateX(4px); }
html[dir="rtl"] .link-arrow:hover i{ transform:translateX(-4px); }

/* -------------------------------------------------------- preloader */
#bc-preloader{
  position:fixed; inset:0; z-index:99999; display:grid; place-items:center;
  background:var(--navy-900); transition:opacity .55s ease,visibility .55s ease;
}
#bc-preloader.is-hidden{ opacity:0; visibility:hidden; }
.preloader-inner{ text-align:center; }
.preloader-drop{ position:relative; width:74px; height:74px; margin:0 auto 22px; }
.preloader-drop svg{ width:100%; height:100%; overflow:visible; }
.preloader-drop .drop-path{
  fill:none; stroke:var(--cyan); stroke-width:3; stroke-linecap:round;
  stroke-dasharray:190; stroke-dashoffset:190; animation:drop-draw 1.9s var(--ease) infinite;
}
.preloader-drop .drop-fill{ fill:rgba(0,163,217,.22); transform-origin:center bottom; animation:drop-fill 1.9s var(--ease) infinite; }
@keyframes drop-draw{ 0%{stroke-dashoffset:190}55%,100%{stroke-dashoffset:0} }
@keyframes drop-fill{ 0%,25%{transform:scaleY(0);opacity:0}70%{transform:scaleY(1);opacity:1}100%{transform:scaleY(1);opacity:.5} }
.preloader-name{ color:#fff; font-weight:800; letter-spacing:.22em; font-size:.82rem; text-transform:uppercase; }
.preloader-bar{ width:150px; height:2px; margin:16px auto 0; background:rgba(255,255,255,.14); overflow:hidden; border-radius:2px; }
.preloader-bar span{ display:block; height:100%; width:40%; background:linear-gradient(90deg,var(--cyan),var(--gold)); animation:pl-run 1.2s ease-in-out infinite; }
@keyframes pl-run{ 0%{transform:translateX(-120%)}100%{transform:translateX(320%)} }

/* ----------------------------------------------------------- topbar */
.topbar{
  background:var(--navy-900); color:#9FBAD0; font-size:.8rem; line-height:1;
  border-bottom:1px solid rgba(255,255,255,.07);
}
.topbar-inner{ display:flex; align-items:center; justify-content:space-between; gap:1rem; min-height:var(--topbar-h); flex-wrap:nowrap; }
.topbar-list{ display:flex; align-items:center; gap:1.4rem; list-style:none; margin:0; padding:0; flex-wrap:nowrap; overflow:hidden; }
.topbar-list li{ display:flex; align-items:center; gap:.45rem; white-space:nowrap; }
.topbar-list i{ color:var(--cyan); font-size:.85rem; }
.topbar a{ color:#C4D6E5; }
.topbar a:hover{ color:#fff; }
.topbar-right{ display:flex; align-items:center; gap:1rem; }
.lang-switch{
  display:inline-flex; align-items:center; gap:.45rem;
  border:1px solid rgba(255,255,255,.2); border-radius:100px;
  padding:.4rem .85rem; font-weight:700; font-size:.76rem; color:#fff;
  transition:all var(--t-fast);
}
.lang-switch:hover{ background:var(--cyan); border-color:var(--cyan); color:#fff; }
.topbar-social{ display:flex; gap:.3rem; }
.topbar-social a{
  width:26px; height:26px; display:grid; place-items:center; border-radius:50%;
  background:rgba(255,255,255,.07); font-size:.72rem; color:#C4D6E5;
}
.topbar-social a:hover{ background:var(--cyan); color:#fff; }

/* ----------------------------------------------------------- header */
.site-header{
  position:sticky; top:0; z-index:1000; background:#fff;
  border-bottom:1px solid var(--line);
  transition:box-shadow var(--t),background var(--t);
}
.site-header.is-stuck{ box-shadow:0 6px 26px rgba(11,42,74,.10); }
.header-inner{
  display:flex; align-items:center; justify-content:space-between; gap:1.2rem;
  height:var(--header-h); transition:height var(--t);
}
.site-header.is-compact .header-inner{ height:64px; }
.site-header.is-compact .brand-logo{ height:38px; }

.brand{ display:inline-flex; align-items:center; gap:.7rem; flex-shrink:0; }
.brand-logo{ height:48px; width:auto; transition:height var(--t); }
.brand-text{ display:flex; flex-direction:column; line-height:1.15; }
.brand-name{ font-weight:800; font-size:1.06rem; color:var(--navy); letter-spacing:-.01em; }
.brand-tag{ font-size:.66rem; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); font-weight:600; }
html[dir="rtl"] .brand-tag{ letter-spacing:.02em; }

.main-nav{ display:flex; align-items:center; gap:.15rem; margin-inline:auto; }
.main-nav a{
  position:relative; display:block; padding:.6rem .74rem; border-radius:var(--radius-xs);
  font-size:.88rem; font-weight:600; color:var(--ink); white-space:nowrap;
}
.main-nav a::after{
  content:""; position:absolute; left:.74rem; right:.74rem; bottom:.3rem; height:2px;
  background:linear-gradient(90deg,var(--cyan),var(--gold)); border-radius:2px;
  transform:scaleX(0); transform-origin:var(--nav-origin,left); transition:transform var(--t);
}
html[dir="rtl"] .main-nav a::after{ --nav-origin:right; }
.main-nav a:hover{ color:var(--cyan-600); }
.main-nav a:hover::after,.main-nav a.active::after{ transform:scaleX(1); }
.main-nav a.active{ color:var(--navy); }

/* desktop dropdown */
.nav-drop{ position:relative; }
.nav-caret{ font-size:.6rem; margin-inline-start:.2rem; opacity:.6; transition:transform var(--t-fast); }
.nav-drop:hover .nav-caret,.nav-drop:focus-within .nav-caret{ transform:rotate(180deg); }
.nav-drop-menu{
  position:absolute; inset-block-start:calc(100% + 10px); inset-inline-start:0; min-width:250px;
  background:#fff; border:1px solid var(--line); border-radius:var(--radius-sm);
  box-shadow:var(--shadow-lg); padding:.5rem; z-index:60;
  opacity:0; visibility:hidden; transform:translateY(10px);
  transition:opacity var(--t),transform var(--t),visibility var(--t);
}
.nav-drop-menu::before{
  content:""; position:absolute; inset-block-start:-9px; inset-inline:0; height:9px;
}
.nav-drop:hover .nav-drop-menu,.nav-drop:focus-within .nav-drop-menu{
  opacity:1; visibility:visible; transform:translateY(0);
}
.nav-drop-menu a{
  display:flex; align-items:center; gap:.7rem; padding:.62rem .8rem; border-radius:var(--radius-xs);
  font-size:.87rem; font-weight:600; color:var(--body);
}
.nav-drop-menu a::after{ display:none; }
.nav-drop-menu a i{ width:18px; text-align:center; font-size:.85rem; color:var(--cyan); }
.nav-drop-menu a:hover{ background:var(--bg-soft); color:var(--navy); }
.nav-drop-menu a.active{ background:var(--cyan-100); color:var(--cyan-600); }
html[dir="rtl"] .nav-drop-menu{ inset-inline-start:auto; inset-inline-end:0; }

/* drawer sub-items */
.drawer-nav a.is-child{ padding-inline-start:2rem; font-size:.88rem; font-weight:600; color:var(--muted); }
.drawer-nav a.is-child i:first-child{ color:var(--cyan); width:16px; }

.header-actions{ display:flex; align-items:center; gap:.55rem; flex-shrink:0; }
.header-search-btn,.header-account-btn{
  width:40px; height:40px; display:grid; place-items:center; border-radius:50%;
  border:1px solid var(--line); background:#fff; color:var(--navy); cursor:pointer;
  transition:all var(--t-fast);
}
.header-search-btn:hover,.header-account-btn:hover{ background:var(--navy); color:#fff; border-color:var(--navy); }
.header-account-btn{ text-decoration:none; }

.burger{
  display:none; width:46px; height:46px; border:1px solid var(--line); background:#fff;
  border-radius:var(--radius-sm); cursor:pointer; padding:0; place-items:center;
}
.burger span{ display:block; width:20px; height:2px; background:var(--navy); border-radius:2px; transition:all var(--t-fast); }
.burger span+span{ margin-top:4px; }
.burger[aria-expanded="true"] span:nth-child(1){ transform:translateY(6px) rotate(45deg); }
.burger[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.burger[aria-expanded="true"] span:nth-child(3){ transform:translateY(-6px) rotate(-45deg); }

/* mobile drawer */
.mobile-drawer{
  position:fixed; inset-block:0; inset-inline-end:0; width:min(360px,88vw); z-index:1100;
  background:#fff; box-shadow:-20px 0 60px rgba(11,42,74,.2);
  transform:translateX(105%); transition:transform var(--t); display:flex; flex-direction:column;
  overflow-y:auto; overscroll-behavior:contain;
}
html[dir="rtl"] .mobile-drawer{ transform:translateX(-105%); box-shadow:20px 0 60px rgba(11,42,74,.2); }
.mobile-drawer.is-open{ transform:translateX(0); }
.drawer-head{ display:flex; align-items:center; justify-content:space-between; padding:16px 20px; border-bottom:1px solid var(--line); }
.drawer-close{ width:40px;height:40px;border:1px solid var(--line);background:#fff;border-radius:50%;cursor:pointer;color:var(--navy); }
.drawer-nav{ list-style:none; margin:0; padding:8px 0; flex:1; }
.drawer-nav a{
  display:flex; align-items:center; justify-content:space-between;
  padding:.95rem 20px; font-weight:600; color:var(--ink); border-bottom:1px solid var(--line-soft);
}
.drawer-nav a.active{ color:var(--cyan-600); background:var(--cyan-100); }
.drawer-nav a i{ font-size:.75rem; color:var(--muted); }
.drawer-foot{ padding:18px 20px 28px; display:grid; gap:.6rem; background:var(--bg-soft); }
.drawer-contact{ font-size:.85rem; color:var(--muted); display:grid; gap:.4rem; margin-top:.6rem; }
.drawer-contact a{ color:var(--navy); font-weight:600; }
.backdrop{
  position:fixed; inset:0; background:rgba(6,22,38,.55); backdrop-filter:blur(3px);
  z-index:1050; opacity:0; visibility:hidden; transition:opacity var(--t),visibility var(--t);
}
.backdrop.is-open{ opacity:1; visibility:visible; }

/* search overlay */
.search-overlay{
  position:fixed; inset:0; z-index:1200; background:rgba(6,22,38,.96);
  display:grid; place-items:center; opacity:0; visibility:hidden; transition:opacity var(--t),visibility var(--t);
}
.search-overlay.is-open{ opacity:1; visibility:visible; }
.search-box{ width:min(760px,92vw); }
.search-box input{
  width:100%; padding:1.1rem 1.4rem; font-size:1.2rem; border-radius:var(--radius);
  border:1px solid rgba(255,255,255,.25); background:rgba(255,255,255,.07); color:#fff;
}
.search-box input::placeholder{ color:rgba(255,255,255,.5); }
.search-hint{ color:rgba(255,255,255,.5); font-size:.85rem; margin-top:.9rem; text-align:center; }
.search-close{ position:absolute; top:26px; inset-inline-end:26px; background:none; border:0; color:#fff; font-size:1.5rem; cursor:pointer; }

/* ------------------------------------------------------------- hero */
.hero{ position:relative; background:var(--navy-900); }
.hero-swiper{ height:clamp(560px,90vh,880px); }
.hero-slide{ position:relative; overflow:hidden; display:flex; align-items:center; }
.hero-bg{ position:absolute; inset:0; z-index:0; }
.hero-bg img{ width:100%; height:100%; object-fit:cover; transform:scale(1.06); }
.swiper-slide-active .hero-bg img{ animation:kenburns 9s ease-out forwards; }
.hero-slide.no-kb .hero-bg img{ animation:none!important; }
@keyframes kenburns{ from{ transform:scale(1.04) translate3d(0,0,0);} to{ transform:scale(1.16) translate3d(-1.5%,-1.5%,0);} }
.hero-overlay{
  position:absolute; inset:0; z-index:1;
  background:
    linear-gradient(100deg,rgba(6,22,38,var(--ov,.72)) 0%,rgba(6,22,38,calc(var(--ov,.72) * .78)) 42%,rgba(6,22,38,.22) 100%),
    linear-gradient(0deg,rgba(6,22,38,.55),transparent 45%);
}
@media (max-width:767.98px){
  /* small screens: the text sits over the whole frame, so darken evenly */
  .hero-overlay{
    background:
      linear-gradient(180deg,rgba(6,22,38,calc(var(--ov,.72) * .95)) 0%,rgba(6,22,38,calc(var(--ov,.72) * .8)) 45%,rgba(6,22,38,.9) 100%);
  }
}
html[dir="rtl"] .hero-overlay{
  background:
    linear-gradient(260deg,rgba(6,22,38,var(--ov,.72)) 0%,rgba(6,22,38,calc(var(--ov,.72) * .78)) 42%,rgba(6,22,38,.22) 100%),
    linear-gradient(0deg,rgba(6,22,38,.55),transparent 45%);
}
@media (max-width:767.98px){
  html[dir="rtl"] .hero-overlay{
    background:
      linear-gradient(180deg,rgba(6,22,38,calc(var(--ov,.72) * .95)) 0%,rgba(6,22,38,calc(var(--ov,.72) * .8)) 45%,rgba(6,22,38,.9) 100%);
  }
}
html[dir="rtl"] .hero-overlay{
  background:
    linear-gradient(260deg,rgba(6,22,38,var(--ov,.72)) 0%,rgba(6,22,38,calc(var(--ov,.72) * .78)) 42%,rgba(6,22,38,.22) 100%),
    linear-gradient(0deg,rgba(6,22,38,.55),transparent 45%);
}
.hero-grid-lines{
  position:absolute; inset:0; z-index:1; pointer-events:none; opacity:.28;
  background-image:linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px);
  background-size:80px 80px;
  mask-image:linear-gradient(180deg,transparent,#000 40%,#000 70%,transparent);
}
.hero-content{ position:relative; z-index:3; width:100%; padding-block:60px; }
.hero-inner{ max-width:720px; }
.hero-eyebrow{
  display:inline-flex; align-items:center; gap:.6rem; padding:.5rem 1rem;
  border:1px solid rgba(255,255,255,.24); border-radius:100px; backdrop-filter:blur(8px);
  background:rgba(255,255,255,.08); color:#fff;
  font-size:.72rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; margin-bottom:1.4rem;
}
html[dir="rtl"] .hero-eyebrow{ letter-spacing:.02em; }
.hero-eyebrow .dot{ width:7px; height:7px; border-radius:50%; background:var(--cyan); box-shadow:0 0 0 0 rgba(0,163,217,.7); animation:pulse-dot 2.2s infinite; }
@keyframes pulse-dot{ 70%{box-shadow:0 0 0 10px rgba(0,163,217,0)} 100%{box-shadow:0 0 0 0 rgba(0,163,217,0)} }
.hero-title{
  color:#fff; font-size:clamp(2.1rem,5.2vw,4.05rem); line-height:1.08; margin-bottom:1.1rem;
  text-shadow:0 6px 40px rgba(0,0,0,.35);
}
html[dir="rtl"] .hero-title{ line-height:1.35; }
.hero-sub{ color:#CFE0EE; font-size:clamp(1rem,1.5vw,1.18rem); max-width:57ch; margin-bottom:2rem; }
.hero-actions{ display:flex; flex-wrap:wrap; gap:.85rem; }

/* entrance animation */
.hero-anim{ opacity:0; transform:translateY(34px); }
.swiper-slide-active .hero-anim{ animation:heroIn .95s var(--ease) forwards; }
.swiper-slide-active .hero-anim:nth-child(1){ animation-delay:.15s; }
.swiper-slide-active .hero-anim:nth-child(2){ animation-delay:.3s; }
.swiper-slide-active .hero-anim:nth-child(3){ animation-delay:.45s; }
.swiper-slide-active .hero-anim:nth-child(4){ animation-delay:.6s; }
@keyframes heroIn{ to{ opacity:1; transform:translateY(0);} }

/* hero controls */
.hero-nav{
  position:absolute; z-index:5; bottom:38px; inset-inline-end:max(20px,calc((100vw - var(--container))/2 + 20px));
  display:flex; gap:.5rem;
}
.hero-nav button{
  width:52px; height:52px; border-radius:50%; border:1px solid rgba(255,255,255,.3);
  background:rgba(255,255,255,.08); backdrop-filter:blur(10px); color:#fff; cursor:pointer;
  display:grid; place-items:center; transition:all var(--t-fast);
}
.hero-nav button:hover{ background:var(--cyan); border-color:var(--cyan); transform:translateY(-2px); }
.hero-pagination{
  position:absolute!important; z-index:5; bottom:52px!important;
  inset-inline-start:max(20px,calc((100vw - var(--container))/2 + 20px))!important;
  width:auto!important; display:flex; gap:.7rem; align-items:center;
}
.hero-pagination .swiper-pagination-bullet{
  width:38px; height:3px; border-radius:2px; background:rgba(255,255,255,.35); opacity:1;
  margin:0!important; transition:all var(--t); position:relative; overflow:hidden;
}
.hero-pagination .swiper-pagination-bullet-active{ background:rgba(255,255,255,.3); width:70px; }
.hero-pagination .swiper-pagination-bullet-active::after{
  content:""; position:absolute; inset:0; background:linear-gradient(90deg,var(--cyan),var(--gold));
  transform-origin:left; animation:pgFill var(--slide-dur,6s) linear forwards;
}
html[dir="rtl"] .hero-pagination .swiper-pagination-bullet-active::after{ transform-origin:right; }
@keyframes pgFill{ from{ transform:scaleX(0);} to{ transform:scaleX(1);} }
.hero-scroll{
  position:absolute; z-index:5; bottom:34px; left:50%; transform:translateX(-50%);
  color:rgba(255,255,255,.6); font-size:.68rem; letter-spacing:.2em; text-transform:uppercase;
  display:flex; flex-direction:column; align-items:center; gap:.5rem;
}
.hero-scroll .bar{ width:1px; height:34px; background:linear-gradient(180deg,var(--cyan),transparent); animation:scrollBar 1.9s ease-in-out infinite; }
@keyframes scrollBar{ 0%,100%{ transform:scaleY(.4); opacity:.4 } 50%{ transform:scaleY(1); opacity:1 } }

/* ---------------------------------------------------------- marquee */
.marquee{
  background:linear-gradient(100deg,var(--navy) 0%,var(--navy-700) 55%,var(--navy) 100%);
  color:#fff; overflow:hidden; position:relative;
  border-block:1px solid rgba(255,255,255,.08);
}
.marquee::before,.marquee::after{
  content:""; position:absolute; top:0; bottom:0; width:90px; z-index:2; pointer-events:none;
}
.marquee::before{ inset-inline-start:0; background:linear-gradient(90deg,var(--navy),transparent); }
.marquee::after{ inset-inline-end:0; background:linear-gradient(270deg,var(--navy),transparent); }
html[dir="rtl"] .marquee::before{ background:linear-gradient(270deg,var(--navy),transparent); }
html[dir="rtl"] .marquee::after{ background:linear-gradient(90deg,var(--navy),transparent); }
.marquee-track{ display:flex; width:max-content; animation:marquee 42s linear infinite; }
.marquee:hover .marquee-track{ animation-play-state:paused; }
html[dir="rtl"] .marquee-track{ animation-name:marquee-rtl; }
@keyframes marquee{ from{ transform:translateX(0);} to{ transform:translateX(-50%);} }
@keyframes marquee-rtl{ from{ transform:translateX(0);} to{ transform:translateX(50%);} }
.marquee-item{
  display:inline-flex; align-items:center; gap:.7rem; padding:1rem 2.2rem;
  font-size:.87rem; font-weight:600; letter-spacing:.02em; white-space:nowrap;
}
.marquee-item i{ color:var(--gold-300); }
.marquee-item::after{ content:""; width:5px; height:5px; border-radius:50%; background:var(--cyan); margin-inline-start:2.2rem; }

/* --------------------------------------------------- quick actions */
.quick-actions{ position:relative; margin-top:-58px; z-index:20; }
.quick-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:0; border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-lg); }
.quick-card{
  position:relative; background:#fff; padding:2.1rem 1.6rem; display:block; overflow:hidden;
  border-inline-end:1px solid var(--line-soft); transition:color var(--t);
}
.quick-card:last-child{ border-inline-end:0; }
.quick-card::before{
  content:""; position:absolute; inset:0; z-index:0;
  background:linear-gradient(150deg,var(--navy),var(--navy-700));
  transform:translateY(100%); transition:transform var(--t);
}
.quick-card:hover::before{ transform:translateY(0); }
.quick-card.is-emergency{ background:linear-gradient(150deg,#7E1620,#B0202D); }
.quick-card.is-emergency .qa-title,.quick-card.is-emergency .qa-text,.quick-card.is-emergency .qa-more{ color:#fff; }
.quick-card.is-emergency .qa-text{ color:#F3C9CD; }
.quick-card.is-emergency::before{ background:linear-gradient(150deg,#B0202D,#7E1620); }
.qa-icon{
  position:relative; z-index:1; width:56px; height:56px; border-radius:14px; display:grid; place-items:center;
  background:var(--cyan-100); color:var(--cyan-600); font-size:1.35rem; margin-bottom:1.1rem;
  transition:all var(--t);
}
.quick-card.is-emergency .qa-icon{ background:rgba(255,255,255,.16); color:#fff; }
.quick-card:hover .qa-icon{ background:var(--cyan); color:#fff; transform:translateY(-3px) rotate(-4deg); }
.qa-title{ position:relative; z-index:1; font-size:1.08rem; font-weight:800; color:var(--ink); margin-bottom:.35rem; transition:color var(--t); }
.qa-text{ position:relative; z-index:1; font-size:.87rem; color:var(--muted); margin-bottom:1rem; transition:color var(--t); }
.qa-more{ position:relative; z-index:1; font-size:.78rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:var(--cyan-600); display:inline-flex; gap:.4rem; align-items:center; transition:color var(--t); }
.quick-card:hover .qa-title,.quick-card:hover .qa-more{ color:#fff; }
.quick-card:hover .qa-text{ color:#B7CCDD; }
.quick-card:hover .qa-more i{ transform:translateX(4px); }
html[dir="rtl"] .quick-card:hover .qa-more i{ transform:translateX(-4px); }
.qa-more i{ transition:transform var(--t-fast); }

/* ----------------------------------------------------------- cards */
.card-surface{
  background:#fff; border:1px solid var(--line); border-radius:var(--radius);
  box-shadow:var(--shadow-xs); transition:transform var(--t),box-shadow var(--t),border-color var(--t);
}
.card-surface:hover{ transform:translateY(-6px); box-shadow:var(--shadow); border-color:transparent; }

/* service card */
.service-card{
  position:relative; color:inherit; background:#fff; border:1px solid var(--line); border-radius:var(--radius);
  overflow:hidden; height:100%; display:flex; flex-direction:column;
  transition:transform var(--t),box-shadow var(--t),border-color var(--t);
}
.service-card:hover{ transform:translateY(-8px); box-shadow:var(--shadow-lg); border-color:transparent; }
.service-media{ position:relative; aspect-ratio:16/10; overflow:hidden; background:var(--bg-deep); }
.service-media img{ width:100%; height:100%; object-fit:cover; transition:transform 1.1s var(--ease); }
.service-card:hover .service-media img{ transform:scale(1.09); }
.service-media::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(0deg,rgba(6,22,38,.78) 0%,rgba(6,22,38,.12) 55%,transparent 100%);
}
.service-icon{
  position:absolute; z-index:2; inset-block-end:-24px; inset-inline-start:22px;
  width:56px; height:56px; border-radius:14px; display:grid; place-items:center;
  background:linear-gradient(140deg,var(--cyan),var(--cyan-600)); color:#fff; font-size:1.3rem;
  box-shadow:var(--shadow-cyan); transition:transform var(--t);
}
.service-card:hover .service-icon{ transform:translateY(-4px) rotate(-6deg); }
.service-body{ padding:2.4rem 1.6rem 1.6rem; display:flex; flex-direction:column; flex:1; }
.service-title{ font-size:1.13rem; margin-bottom:.5rem; }
.service-title a{ color:var(--ink); }
.service-card:hover .service-title a{ color:var(--cyan-600); }
.service-text{ font-size:.9rem; color:var(--muted); margin-bottom:1.2rem; flex:1; }
.service-foot{ display:flex; align-items:center; justify-content:space-between; padding-top:1rem; border-top:1px solid var(--line-soft); }
.service-index{ font-family:var(--ff-alt); font-size:1.6rem; font-weight:700; color:var(--line); line-height:1; }

/* stat / counter */
.stats-strip{ display:grid; grid-template-columns:repeat(var(--stat-cols,4),1fr); gap:1px; background:var(--line); border-radius:var(--radius); overflow:hidden; }
.stat-cell{ background:#fff; padding:2rem 1.2rem; text-align:center; position:relative; overflow:hidden; }
.stat-cell::after{
  content:""; position:absolute; inset-block-end:0; inset-inline-start:0; width:100%; height:3px;
  background:linear-gradient(90deg,var(--cyan),var(--gold)); transform:scaleX(0); transform-origin:left; transition:transform var(--t);
}
html[dir="rtl"] .stat-cell::after{ transform-origin:right; }
.stat-cell:hover::after{ transform:scaleX(1); }
.stat-icon{ color:var(--cyan); font-size:1.35rem; margin-bottom:.7rem; }
.stat-value{ font-family:var(--ff-alt); font-size:clamp(2rem,3.4vw,2.9rem); font-weight:700; color:var(--navy); line-height:1; letter-spacing:-.01em; }
html[dir="rtl"] .stat-value{ font-family:var(--ff); font-weight:800; }
.stat-label{ font-size:.82rem; color:var(--muted); margin-top:.5rem; font-weight:600; }
.section--deep .stats-strip{ background:rgba(255,255,255,.1); }
.section--deep .stat-cell{ background:rgba(255,255,255,.03); }
.section--deep .stat-value{ color:#fff; }
.section--deep .stat-label{ color:#9FBAD0; }

/* about visual */
.about-visual{ position:relative; }
.about-img-main{ border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-lg); aspect-ratio:4/5; }
.about-img-main img{ width:100%; height:100%; object-fit:cover; }
.about-img-sub{
  position:absolute; inset-block-end:-34px; inset-inline-end:-24px; width:56%;
  border-radius:var(--radius); overflow:hidden; border:6px solid #fff; box-shadow:var(--shadow-lg); aspect-ratio:4/3;
}
.about-img-sub img{ width:100%; height:100%; object-fit:cover; }
.about-badge{
  position:absolute; inset-block-start:24px; inset-inline-start:-24px;
  background:linear-gradient(140deg,var(--navy),var(--navy-700)); color:#fff;
  border-radius:var(--radius); padding:1.1rem 1.4rem; box-shadow:var(--shadow-lg); text-align:center;
}
.about-badge .num{ font-family:var(--ff-alt); font-size:2.2rem; font-weight:700; line-height:1; color:var(--gold-300); }
.about-badge .txt{ font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; color:#B7CCDD; margin-top:.3rem; }

.mv-card{
  display:flex; gap:1rem; padding:1.3rem; border-radius:var(--radius);
  background:var(--bg-soft); border:1px solid var(--line); transition:all var(--t);
}
.mv-card:hover{ background:#fff; box-shadow:var(--shadow); transform:translateY(-4px); }
.mv-icon{ width:46px; height:46px; flex-shrink:0; border-radius:12px; display:grid; place-items:center; background:var(--navy); color:var(--gold-300); font-size:1.05rem; }
.mv-card h4{ font-size:1rem; margin-bottom:.3rem; }
.mv-card p{ font-size:.88rem; color:var(--muted); margin:0; }

.value-chip{
  display:inline-flex; align-items:center; gap:.5rem; padding:.5rem .95rem;
  border:1px solid var(--line); border-radius:100px; background:#fff;
  font-size:.83rem; font-weight:600; color:var(--ink); transition:all var(--t-fast);
}
.value-chip i{ color:var(--cyan); font-size:.75rem; }
.value-chip:hover{ border-color:var(--cyan); box-shadow:var(--shadow-sm); transform:translateY(-2px); }

/* ------------------------------------------------------ CEO section */
.ceo-section{ position:relative; background:var(--navy); overflow:hidden; }
.ceo-section::before{
  content:""; position:absolute; inset-block:0; inset-inline-end:0; width:52%;
  background:radial-gradient(circle at 70% 40%,rgba(0,163,217,.22),transparent 62%);
}
.ceo-quote-mark{
  position:absolute; z-index:0; inset-block-start:6%; inset-inline-start:44%;
  font-size:18rem; line-height:1; color:rgba(255,255,255,.035); font-family:Georgia,serif;
}
.ceo-section h2,.ceo-section .section-title{ color:#fff; }
.ceo-photo-wrap{ position:relative; z-index:2; }
.ceo-photo{
  border-radius:var(--radius-lg); overflow:hidden; aspect-ratio:4/5;
  box-shadow:0 40px 80px rgba(0,0,0,.4); border:1px solid rgba(255,255,255,.1);
}
.ceo-photo img{ width:100%; height:100%; object-fit:cover; object-position:top center; }
.ceo-photo-frame{
  position:absolute; inset-block-start:-18px; inset-inline-start:-18px; width:100%; height:100%;
  border:2px solid rgba(0,163,217,.4); border-radius:var(--radius-lg); z-index:-1;
}
.ceo-tag{
  position:absolute; inset-block-end:-20px; inset-inline-end:-14px; z-index:3;
  background:linear-gradient(140deg,var(--gold),#A8862F); color:#241C05;
  padding:.85rem 1.3rem; border-radius:var(--radius); box-shadow:var(--shadow-lg);
  font-weight:800; font-size:.85rem;
}
.ceo-body{ position:relative; z-index:2; }
.ceo-message{
  color:#DCE9F3; font-size:clamp(1.02rem,1.5vw,1.22rem); line-height:1.9; font-weight:400;
  padding-inline-start:1.6rem; border-inline-start:3px solid var(--cyan); margin-bottom:2rem;
}
.ceo-name{ color:#fff; font-size:1.35rem; font-weight:800; margin-bottom:.15rem; }
.ceo-role{ color:var(--gold-300); font-size:.85rem; letter-spacing:.12em; text-transform:uppercase; font-weight:700; }
html[dir="rtl"] .ceo-role{ letter-spacing:.02em; }
.ceo-signature{ height:64px; margin-top:1.2rem; filter:brightness(0) invert(1); opacity:.85; }

/* -------------------------------------------------------- industry */
.industry-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(190px,1fr)); gap:14px; }
.industry-card{
  position:relative; padding:1.7rem 1.2rem; border-radius:var(--radius);
  background:#fff; border:1px solid var(--line); text-align:center; overflow:hidden;
  transition:all var(--t);
}
.industry-card::before{
  content:""; position:absolute; inset:0; background:linear-gradient(160deg,var(--navy),var(--navy-700));
  opacity:0; transition:opacity var(--t);
}
.industry-card:hover{ transform:translateY(-6px); box-shadow:var(--shadow-lg); border-color:transparent; }
.industry-card:hover::before{ opacity:1; }
.industry-card > *{ position:relative; z-index:1; }
.industry-icon{
  width:56px; height:56px; margin:0 auto .9rem; border-radius:16px; display:grid; place-items:center;
  background:var(--bg-soft); color:var(--navy); font-size:1.3rem; transition:all var(--t);
}
.industry-card:hover .industry-icon{ background:rgba(255,255,255,.12); color:var(--gold-300); transform:rotate(-6deg); }
.industry-title{ font-size:.95rem; font-weight:700; color:var(--ink); margin-bottom:.3rem; transition:color var(--t); }
.industry-text{ font-size:.8rem; color:var(--muted); margin:0; transition:color var(--t); }
.industry-card:hover .industry-title{ color:#fff; }
.industry-card:hover .industry-text{ color:#9FBAD0; }

/* ---------------------------------------------------------- fleet */
.fleet-card{
  background:#fff; border:1px solid var(--line); border-radius:var(--radius); overflow:hidden;
  height:100%; display:flex; flex-direction:column; transition:all var(--t);
}
.fleet-card:hover{ transform:translateY(-6px); box-shadow:var(--shadow-lg); border-color:transparent; }
.fleet-media{ position:relative; aspect-ratio:4/3; background:var(--bg-deep); overflow:hidden; }
.fleet-media img{ width:100%; height:100%; object-fit:cover; transition:transform 1s var(--ease); }
.fleet-card:hover .fleet-media img{ transform:scale(1.07); }
.fleet-cap{
  position:absolute; inset-block-start:14px; inset-inline-start:14px; z-index:2;
  background:rgba(6,22,38,.86); backdrop-filter:blur(6px); color:#fff;
  padding:.45rem .9rem; border-radius:100px; font-size:.78rem; font-weight:800;
  border:1px solid rgba(255,255,255,.14);
}
.fleet-cap i{ color:var(--cyan-300); margin-inline-end:.35rem; }
.fleet-body{ padding:1.4rem; flex:1; display:flex; flex-direction:column; }
.fleet-body h3{ font-size:1.05rem; margin-bottom:.3rem; }
.fleet-type{ font-size:.78rem; color:var(--cyan-600); font-weight:700; letter-spacing:.06em; text-transform:uppercase; margin-bottom:.7rem; }
.fleet-specs{ list-style:none; padding:0; margin:.6rem 0 0; font-size:.83rem; color:var(--muted); }
.fleet-specs li{ display:flex; gap:.5rem; padding:.28rem 0; border-bottom:1px dashed var(--line-soft); }
.fleet-specs li:last-child{ border-bottom:0; }
.fleet-specs i{ color:var(--cyan); font-size:.7rem; margin-top:.42rem; }

/* --------------------------------------------------------- projects */
.filter-bar{ display:flex; flex-wrap:wrap; gap:.5rem; justify-content:center; margin-bottom:2.4rem; }
.filter-btn{
  padding:.6rem 1.25rem; border-radius:100px; border:1px solid var(--line); background:#fff;
  font-size:.85rem; font-weight:700; color:var(--body); cursor:pointer; transition:all var(--t-fast);
}
.filter-btn:hover{ border-color:var(--cyan); color:var(--cyan-600); }
.filter-btn.active{ background:var(--navy); border-color:var(--navy); color:#fff; box-shadow:var(--shadow-sm); }

.project-card{
  position:relative; border-radius:var(--radius); overflow:hidden; display:block;
  aspect-ratio:4/3.1; background:var(--navy); box-shadow:var(--shadow-xs);
  transition:transform var(--t),box-shadow var(--t);
}
.project-card:hover{ transform:translateY(-7px); box-shadow:var(--shadow-lg); }
.project-card img{ width:100%; height:100%; object-fit:cover; transition:transform 1.2s var(--ease),filter var(--t); }
.project-card:hover img{ transform:scale(1.1); }
.project-veil{
  position:absolute; inset:0;
  background:linear-gradient(0deg,rgba(6,22,38,.94) 0%,rgba(6,22,38,.55) 38%,rgba(6,22,38,.06) 72%);
  transition:opacity var(--t);
}
.project-info{ position:absolute; inset-inline:0; inset-block-end:0; padding:1.6rem; z-index:2; }
.project-cat{
  display:inline-block; font-size:.68rem; letter-spacing:.14em; text-transform:uppercase; font-weight:800;
  color:var(--gold-300); margin-bottom:.5rem;
}
html[dir="rtl"] .project-cat{ letter-spacing:.02em; }
.project-name{ color:#fff; font-size:1.13rem; font-weight:800; margin-bottom:.4rem; line-height:1.35; }
.project-meta{ color:#9FBAD0; font-size:.82rem; display:flex; flex-wrap:wrap; gap:.9rem; }
.project-meta i{ color:var(--cyan-300); margin-inline-end:.3rem; }
.project-plus{
  position:absolute; inset-block-start:16px; inset-inline-end:16px; z-index:2;
  width:42px; height:42px; border-radius:50%; display:grid; place-items:center;
  background:rgba(255,255,255,.14); backdrop-filter:blur(8px); color:#fff;
  border:1px solid rgba(255,255,255,.24); opacity:0; transform:scale(.7); transition:all var(--t);
}
.project-card:hover .project-plus{ opacity:1; transform:scale(1); }
.project-status-tag{
  position:absolute; inset-block-start:16px; inset-inline-start:16px; z-index:2;
  padding:.35rem .8rem; border-radius:100px; font-size:.7rem; font-weight:800;
  background:rgba(255,255,255,.92); color:var(--navy);
}
.project-status-tag.ongoing{ background:var(--gold); color:#241C05; }

/* ------------------------------------------------------ why choose */
.why-card{
  display:flex; gap:1.1rem; padding:1.7rem; border-radius:var(--radius);
  background:#fff; border:1px solid var(--line); height:100%; position:relative; overflow:hidden;
  transition:all var(--t);
}
.why-card::after{
  content:""; position:absolute; inset-block-start:0; inset-inline-start:0; width:3px; height:100%;
  background:linear-gradient(180deg,var(--cyan),var(--gold)); transform:scaleY(0); transform-origin:top; transition:transform var(--t);
}
.why-card:hover{ transform:translateY(-5px); box-shadow:var(--shadow); border-color:transparent; }
.why-card:hover::after{ transform:scaleY(1); }
.why-icon{
  width:52px; height:52px; flex-shrink:0; border-radius:14px; display:grid; place-items:center;
  background:var(--cyan-100); color:var(--cyan-600); font-size:1.2rem; transition:all var(--t);
}
.why-card:hover .why-icon{ background:var(--navy); color:var(--gold-300); }
.why-card h4{ font-size:1.02rem; margin-bottom:.35rem; }
.why-card p{ font-size:.88rem; color:var(--muted); margin:0; }

/* ----------------------------------------------------- service map */
.ksa-map-wrap{ position:relative; }
.ksa-map{ width:100%; height:auto; }
.ksa-map .land{ fill:rgba(255,255,255,.05); stroke:rgba(0,163,217,.35); stroke-width:1.2; }
.map-pin{ cursor:pointer; }
.map-pin circle.dot{ fill:var(--cyan); transition:r .25s ease; }
.map-pin circle.halo{ fill:var(--cyan); opacity:.28; transform-origin:center; animation:pinPulse 2.6s ease-out infinite; }
.map-pin.hub circle.dot{ fill:var(--gold); }
.map-pin.hub circle.halo{ fill:var(--gold); }
.map-pin:hover circle.dot{ r:7; }
.map-pin text{ fill:#CFE0EE; font-size:11px; font-weight:600; }
@keyframes pinPulse{ 0%{ transform:scale(.6); opacity:.5 } 80%,100%{ transform:scale(2.6); opacity:0 } }

.area-list{ display:grid; gap:.5rem; max-height:430px; overflow-y:auto; padding-inline-end:.4rem; }
.area-item{
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
  padding:.85rem 1.1rem; border-radius:var(--radius-sm);
  background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.08);
  transition:all var(--t-fast); cursor:pointer;
}
.area-item:hover,.area-item.is-active{ background:rgba(0,163,217,.14); border-color:rgba(0,163,217,.4); transform:translateX(4px); }
html[dir="rtl"] .area-item:hover,html[dir="rtl"] .area-item.is-active{ transform:translateX(-4px); }
.area-name{ color:#fff; font-weight:700; font-size:.92rem; }
.area-region{ color:#7F9AB2; font-size:.76rem; }
.area-badge{ font-size:.68rem; font-weight:800; padding:.25rem .6rem; border-radius:100px; text-transform:uppercase; letter-spacing:.06em; }
.area-badge.available{ background:rgba(18,166,122,.18); color:#4FD8AC; }
.area-badge.limited{ background:rgba(225,163,43,.18); color:#F0C46A; }
.area-badge.on_request{ background:rgba(0,163,217,.16); color:var(--cyan-300); }
.area-badge.unavailable{ background:rgba(214,69,80,.16); color:#F09098; }

/* ----------------------------------------------------- testimonials */
.testimonial-card{
  background:#fff; border:1px solid var(--line); border-radius:var(--radius);
  padding:2rem 1.8rem; height:100%; display:flex; flex-direction:column; position:relative;
  transition:all var(--t);
}
.testimonial-card::before{
  content:"\201C"; position:absolute; inset-block-start:6px; inset-inline-end:20px;
  font-family:Georgia,serif; font-size:6rem; line-height:1; color:var(--cyan-100);
}
.testimonial-card:hover{ box-shadow:var(--shadow-lg); transform:translateY(-5px); border-color:transparent; }
.t-stars{ color:var(--gold); font-size:.85rem; margin-bottom:1rem; letter-spacing:.15em; }
.t-text{ font-size:.96rem; color:var(--body); line-height:1.85; flex:1; margin-bottom:1.5rem; position:relative; z-index:1; }
.t-person{ display:flex; align-items:center; gap:.9rem; padding-top:1.2rem; border-top:1px solid var(--line-soft); }
.t-avatar{
  width:50px; height:50px; border-radius:50%; object-fit:cover; flex-shrink:0;
  background:linear-gradient(140deg,var(--navy),var(--cyan)); color:#fff;
  display:grid; place-items:center; font-weight:800; font-size:1.05rem;
}
.t-name{ font-weight:800; color:var(--ink); font-size:.95rem; }
.t-role{ font-size:.8rem; color:var(--muted); }

/* ------------------------------------------------------------- FAQ */
.faq-item{
  background:#fff; border:1px solid var(--line); border-radius:var(--radius);
  margin-bottom:.75rem; overflow:hidden; transition:all var(--t);
}
.faq-item.is-open{ border-color:var(--cyan); box-shadow:var(--shadow); }
.faq-q{
  width:100%; display:flex; align-items:center; justify-content:space-between; gap:1rem;
  padding:1.15rem 1.4rem; background:none; border:0; cursor:pointer; text-align:start;
  font-size:1rem; font-weight:700; color:var(--ink); font-family:var(--ff);
}
.faq-q:hover{ color:var(--cyan-600); }
.faq-toggle{
  width:32px; height:32px; flex-shrink:0; border-radius:50%; display:grid; place-items:center;
  background:var(--bg-soft); color:var(--navy); font-size:.75rem; transition:all var(--t);
}
.faq-item.is-open .faq-toggle{ background:var(--cyan); color:#fff; transform:rotate(180deg); }
.faq-a{ max-height:0; overflow:hidden; transition:max-height .45s var(--ease); }
.faq-a-inner{ padding:0 1.4rem 1.3rem; color:var(--muted); font-size:.93rem; }
.faq-cat-tabs{ display:flex; flex-wrap:wrap; gap:.5rem; margin-bottom:1.8rem; }

/* ---------------------------------------------------------- CTA band */
.cta-band{
  position:relative; overflow:hidden; border-radius:var(--radius-lg);
  background:linear-gradient(115deg,var(--navy) 0%,var(--navy-700) 52%,var(--cyan-600) 140%);
  padding:clamp(2.4rem,4vw,3.6rem);
  box-shadow:var(--shadow-lg);
}
.cta-band::before{
  content:""; position:absolute; inset-block-start:-50%; inset-inline-end:-8%; width:520px; height:520px;
  background:radial-gradient(circle,rgba(0,163,217,.35),transparent 62%);
}
.cta-band::after{
  content:""; position:absolute; inset:0; opacity:.5;
  background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);
  background-size:52px 52px;
  mask-image:radial-gradient(circle at 80% 20%,#000,transparent 70%);
}
.cta-band > *{ position:relative; z-index:1; }
.cta-band h2{ color:#fff; margin-bottom:.6rem; }
.cta-band p{ color:#B7CCDD; margin-bottom:0; max-width:60ch; }

.cta-final{
  position:relative; overflow:hidden; background:var(--navy-900); color:#fff;
  padding:clamp(70px,8vw,120px) 0; text-align:center;
}
.cta-final::before{
  content:""; position:absolute; inset:0;
  background:radial-gradient(800px 400px at 50% 0%,rgba(0,163,217,.2),transparent 65%),
             radial-gradient(600px 340px at 15% 100%,rgba(200,165,75,.14),transparent 62%);
}
.cta-final > *{ position:relative; z-index:1; }
.cta-final h2{ color:#fff; font-size:clamp(1.9rem,4vw,3rem); }
.cta-final p{ color:#9FBAD0; max-width:60ch; margin-inline:auto; }
.cta-actions{ display:flex; flex-wrap:wrap; gap:.9rem; justify-content:center; margin-top:2rem; }

/* --------------------------------------------------------- contact */
.contact-card{
  display:flex; flex-direction:column; gap:.95rem; padding:1.6rem 1.5rem;
  border-radius:var(--radius); background:#fff; border:1px solid var(--line);
  border-block-start:3px solid transparent; transition:all var(--t); height:100%;
  text-align:start;
}
.contact-card:hover{
  box-shadow:var(--shadow); transform:translateY(-4px);
  border-color:transparent; border-block-start-color:var(--cyan);
}
.contact-ico{
  width:54px; height:54px; flex-shrink:0; border-radius:14px; display:grid; place-items:center;
  background:linear-gradient(140deg,var(--navy),var(--navy-700)); color:var(--cyan-300); font-size:1.2rem;
}
.contact-card h4{ font-size:.98rem; font-weight:800; margin:0 0 .35rem; color:var(--ink); }
.contact-text{ font-size:.88rem; color:var(--muted); line-height:1.65; word-break:break-word; }
.contact-card a{ color:var(--muted); }
.contact-card a:hover{ color:var(--cyan-600); }
.contact-card .link-arrow{ margin-top:auto; padding-top:.4rem; font-size:.85rem; font-weight:700; }
.map-frame{ border-radius:var(--radius); overflow:hidden; border:1px solid var(--line); box-shadow:var(--shadow-sm); min-height:340px; background:var(--bg-deep); }
.map-frame iframe{ width:100%; height:100%; min-height:340px; border:0; display:block; }

/* ----------------------------------------------------------- forms */
.form-panel{
  background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg);
  padding:clamp(1.5rem,3vw,2.6rem); box-shadow:var(--shadow-sm);
}
.form-section-title{
  display:flex; align-items:center; gap:.7rem; font-size:.78rem; font-weight:800;
  letter-spacing:.14em; text-transform:uppercase; color:var(--cyan-600);
  margin:2rem 0 1.2rem; padding-bottom:.7rem; border-bottom:1px solid var(--line);
}
html[dir="rtl"] .form-section-title{ letter-spacing:.02em; }
.form-section-title:first-child{ margin-top:0; }
.form-section-title .n{
  width:24px; height:24px; border-radius:50%; background:var(--navy); color:#fff;
  display:grid; place-items:center; font-size:.72rem;
}
.form-label{ display:block; font-size:.83rem; font-weight:700; color:var(--ink); margin-bottom:.4rem; }
.form-label .req{ color:var(--danger); margin-inline-start:.15rem; }
.form-label .opt{ color:var(--muted); font-weight:500; font-size:.76rem; }
.form-control,.form-select,textarea.form-control{
  width:100%; padding:.78rem 1rem; font-size:.94rem; font-family:var(--ff); color:var(--ink);
  background:#fff; border:1.5px solid var(--line); border-radius:var(--radius-sm);
  transition:border-color var(--t-fast),box-shadow var(--t-fast),background var(--t-fast);
}
.form-control:focus,.form-select:focus{
  outline:none; border-color:var(--cyan); box-shadow:0 0 0 4px rgba(0,163,217,.12); background:#fff;
}
.form-control::placeholder{ color:#9BADBD; }
.form-control.is-invalid,.form-select.is-invalid{ border-color:var(--danger); box-shadow:0 0 0 4px rgba(214,69,80,.1); }
textarea.form-control{ min-height:120px; resize:vertical; }
.form-hint{ font-size:.78rem; color:var(--muted); margin-top:.3rem; }
.form-error{ font-size:.79rem; color:var(--danger); margin-top:.3rem; font-weight:600; display:flex; gap:.35rem; align-items:center; }
.input-group-bc{ position:relative; }
.input-group-bc .ig-icon{
  position:absolute; inset-block-start:50%; inset-inline-start:14px; transform:translateY(-50%);
  color:var(--muted); font-size:.9rem; pointer-events:none;
}
.input-group-bc .form-control{ padding-inline-start:40px; }
.form-check-bc{ display:flex; gap:.65rem; align-items:flex-start; font-size:.88rem; }
.form-check-bc input{ margin-top:.32rem; width:17px; height:17px; accent-color:var(--cyan); flex-shrink:0; }

.file-drop{
  position:relative; border:2px dashed var(--line); border-radius:var(--radius);
  padding:1.5rem; text-align:center; background:var(--bg-soft); cursor:pointer; transition:all var(--t-fast);
}
.file-drop:hover,.file-drop.is-drag{ border-color:var(--cyan); background:var(--cyan-100); }
.file-drop input[type=file]{ position:absolute; inset:0; opacity:0; cursor:pointer; }
.file-drop i{ font-size:1.5rem; color:var(--cyan); margin-bottom:.5rem; }
.file-drop .fd-title{ font-weight:700; color:var(--ink); font-size:.9rem; }
.file-drop .fd-hint{ font-size:.78rem; color:var(--muted); }
.file-drop .fd-name{ font-size:.82rem; color:var(--cyan-600); font-weight:700; margin-top:.4rem; }

/* choice cards (order type) */
.choice-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:.7rem; }
.choice{ position:relative; }
.choice input{ position:absolute; opacity:0; }
.choice label{
  display:flex; flex-direction:column; gap:.35rem; align-items:center; text-align:center;
  padding:1.1rem .8rem; border:1.5px solid var(--line); border-radius:var(--radius);
  cursor:pointer; background:#fff; transition:all var(--t-fast); height:100%;
}
.choice label i{ font-size:1.2rem; color:var(--muted); transition:color var(--t-fast); }
.choice label .ct{ font-size:.85rem; font-weight:700; color:var(--ink); }
.choice input:checked + label{ border-color:var(--cyan); background:var(--cyan-100); box-shadow:0 0 0 3px rgba(0,163,217,.1); }
.choice input:checked + label i{ color:var(--cyan-600); }
.choice input:focus-visible + label{ outline:3px solid var(--cyan); outline-offset:2px; }
.choice.is-emergency input:checked + label{ border-color:var(--danger); background:#FDECEE; box-shadow:0 0 0 3px rgba(214,69,80,.1); }
.choice.is-emergency input:checked + label i{ color:var(--danger); }

/* ------------------------------------------------------- page hero */
.page-hero{
  position:relative; background:var(--navy-900); color:#fff; overflow:hidden;
  padding:clamp(60px,8vw,110px) 0 clamp(50px,6vw,80px);
}
.page-hero-bg{ position:absolute; inset:0; z-index:0; opacity:.34; }
.page-hero-bg img{ width:100%; height:100%; object-fit:cover; }
.page-hero::after{
  content:""; position:absolute; inset:0; z-index:1;
  background:linear-gradient(100deg,rgba(6,22,38,.94),rgba(6,22,38,.68) 60%,rgba(0,163,217,.22));
}
.page-hero .container{ position:relative; z-index:2; }
.page-hero h1{ color:#fff; margin-bottom:.6rem; }
.page-hero p{ color:#9FBAD0; max-width:62ch; margin:0; }
.breadcrumb-bc{ display:flex; flex-wrap:wrap; gap:.5rem; align-items:center; font-size:.82rem; color:#7F9AB2; margin-bottom:1rem; }
.breadcrumb-bc a{ color:#B7CCDD; }
.breadcrumb-bc a:hover{ color:var(--cyan-300); }
.breadcrumb-bc .sep{ opacity:.5; font-size:.7rem; }

/* -------------------------------------------------------- timeline */
.bc-timeline{ position:relative; padding-inline-start:34px; }
.bc-timeline::before{
  content:""; position:absolute; inset-block:6px 10px; inset-inline-start:11px; width:2px;
  background:linear-gradient(180deg,var(--cyan),var(--line));
}
.tl-item{ position:relative; padding-bottom:1.7rem; }
.tl-item:last-child{ padding-bottom:0; }
.tl-dot{
  position:absolute; inset-inline-start:-34px; inset-block-start:2px;
  width:24px; height:24px; border-radius:50%; display:grid; place-items:center;
  background:#fff; border:2px solid var(--line); color:var(--muted); font-size:.62rem; z-index:1;
}
.tl-item.done .tl-dot{ background:var(--success); border-color:var(--success); color:#fff; }
.tl-item.current .tl-dot{
  background:var(--cyan); border-color:var(--cyan); color:#fff;
  box-shadow:0 0 0 5px rgba(0,163,217,.18); animation:tlPulse 2s infinite;
}
@keyframes tlPulse{ 50%{ box-shadow:0 0 0 10px rgba(0,163,217,.06);} }
.tl-title{ font-weight:800; color:var(--ink); font-size:.97rem; margin-bottom:.15rem; }
.tl-item.pending .tl-title{ color:var(--muted); font-weight:600; }
.tl-meta{ font-size:.79rem; color:var(--muted); }
.tl-note{ font-size:.86rem; color:var(--body); margin-top:.3rem; }

/* status pill */
.pill{
  display:inline-flex; align-items:center; gap:.4rem; padding:.35rem .85rem; border-radius:100px;
  font-size:.76rem; font-weight:800; letter-spacing:.02em;
}
.pill::before{ content:""; width:6px; height:6px; border-radius:50%; background:currentColor; }
.pill-secondary{ background:#EEF2F6; color:#5B7186; }
.pill-primary{ background:rgba(0,163,217,.12); color:var(--cyan-600); }
.pill-info{ background:rgba(0,163,217,.1); color:#0C7CA0; }
.pill-success{ background:rgba(18,166,122,.12); color:#0E8862; }
.pill-warning{ background:rgba(225,163,43,.14); color:#A9761A; }
.pill-danger{ background:rgba(214,69,80,.12); color:#B3313C; }

/* reference display */
.ref-box{
  display:inline-flex; flex-direction:column; align-items:center; gap:.3rem;
  padding:1.4rem 2.4rem; border-radius:var(--radius); background:var(--navy);
  color:#fff; box-shadow:var(--shadow-lg); position:relative; overflow:hidden;
}
.ref-box::after{ content:""; position:absolute; inset-block-end:0; inset-inline:0; height:3px; background:linear-gradient(90deg,var(--cyan),var(--gold)); }
.ref-box .rl{ font-size:.72rem; letter-spacing:.16em; text-transform:uppercase; color:#9FBAD0; }
.ref-box .rv{ font-family:var(--ff-alt); font-size:1.9rem; font-weight:700; letter-spacing:.06em; color:#fff; }
html[dir="rtl"] .ref-box .rv{ font-family:'Inter',sans-serif; }

/* success screen */
.success-mark{
  width:96px; height:96px; margin:0 auto 1.6rem; border-radius:50%;
  display:grid; place-items:center; background:rgba(18,166,122,.12); color:var(--success); font-size:2.4rem;
  animation:popIn .55s var(--ease) both;
}
@keyframes popIn{ from{ transform:scale(.4); opacity:0 } to{ transform:scale(1); opacity:1 } }

/* ------------------------------------------------------- blog cards */
.blog-card{
  display:flex; flex-direction:column; height:100%; background:#fff;
  border:1px solid var(--line); border-radius:var(--radius); overflow:hidden;
  transition:transform var(--t),box-shadow var(--t),border-color var(--t);
}
.blog-card:hover{ transform:translateY(-6px); box-shadow:var(--shadow-lg); border-color:transparent; }
.blog-media{ aspect-ratio:16/10; overflow:hidden; background:var(--bg-soft); }
.blog-media img{ width:100%; height:100%; object-fit:cover; transition:transform 1.1s var(--ease); }
.blog-card:hover .blog-media img{ transform:scale(1.07); }
.blog-body{ padding:1.5rem; display:flex; flex-direction:column; flex:1; }
.blog-date{ font-size:.78rem; color:var(--muted); font-weight:600; margin-bottom:.6rem; }
.blog-date i{ color:var(--cyan); margin-inline-end:.35rem; }
.blog-body h3{ font-size:1.06rem; line-height:1.45; margin-bottom:.55rem; transition:color var(--t-fast); }
.blog-card:hover .blog-body h3{ color:var(--cyan-600); }
.blog-body p{ font-size:.89rem; color:var(--muted); flex:1; margin-bottom:1rem; }
.blog-tag{
  display:inline-block; font-size:.7rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase;
  color:var(--cyan-600); background:var(--cyan-100); padding:.28rem .7rem; border-radius:100px; margin-bottom:.7rem;
}

/* counter affixes */
.stat-affix{ font-size:.6em; color:var(--cyan); font-weight:700; }
.section--deep .stat-affix{ color:var(--cyan-300); }

/* --------------------------------------------------------- footer */
.site-footer{ background:var(--navy-900); color:#8FA9BF; position:relative; overflow:hidden; }
.site-footer::before{
  content:""; position:absolute; inset-block-start:0; inset-inline:0; height:3px;
  background:linear-gradient(90deg,var(--cyan) 0%,var(--cyan-600) 40%,var(--gold) 100%);
}
.site-footer::after{
  content:""; position:absolute; inset-block-start:-120px; inset-inline-end:-100px; width:520px; height:520px;
  background:radial-gradient(circle,rgba(0,163,217,.12),transparent 62%); pointer-events:none;
}
.footer-main{ padding:clamp(52px,6vw,84px) 0 2.6rem; position:relative; z-index:1; }
.footer-brand-logo{ height:52px; margin-bottom:1.2rem; }
.footer-about{ font-size:.9rem; line-height:1.85; margin-bottom:1.4rem; }
.footer-title{
  color:#fff; font-size:.94rem; font-weight:800; margin-bottom:1.3rem; padding-bottom:.7rem;
  position:relative; letter-spacing:.02em;
}
.footer-title::after{
  content:""; position:absolute; inset-block-end:0; inset-inline-start:0; width:34px; height:2px;
  background:linear-gradient(90deg,var(--cyan),var(--gold)); border-radius:2px;
}
.footer-links{ list-style:none; padding:0; margin:0; display:grid; gap:.65rem; }
.footer-links a{ color:#8FA9BF; font-size:.89rem; display:inline-flex; align-items:center; gap:.5rem; transition:all var(--t-fast); }
.footer-links a i{ font-size:.6rem; color:var(--cyan); transition:transform var(--t-fast); }
.footer-links a:hover{ color:#fff; }
.footer-links a:hover i{ transform:translateX(3px); }
html[dir="rtl"] .footer-links a:hover i{ transform:translateX(-3px); }
.footer-contact{ list-style:none; padding:0; margin:0; display:grid; gap:1rem; }
.footer-contact li{ display:flex; gap:.8rem; font-size:.88rem; }
.footer-contact i{ color:var(--cyan); margin-top:.3rem; flex-shrink:0; }
.footer-contact a{ color:#8FA9BF; }
.footer-contact a:hover{ color:#fff; }
.footer-social{ display:flex; gap:.5rem; margin-top:1.4rem; }
.footer-social a{
  width:38px; height:38px; border-radius:10px; display:grid; place-items:center;
  background:rgba(255,255,255,.06); color:#B7CCDD; font-size:.9rem;
  border:1px solid rgba(255,255,255,.08); transition:all var(--t-fast);
}
.footer-social a:hover{ background:var(--cyan); border-color:var(--cyan); color:#fff; transform:translateY(-3px); }
.footer-badges{ display:flex; flex-wrap:wrap; gap:.6rem; margin-top:1.2rem; }
.footer-badge{
  font-size:.72rem; padding:.35rem .8rem; border-radius:6px;
  background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.09); color:#B7CCDD;
}
.footer-bottom{
  border-top:1px solid rgba(255,255,255,.08); padding:1.4rem 0; position:relative; z-index:1;
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1rem;
  font-size:.83rem;
}
.footer-legal{ display:flex; flex-wrap:wrap; gap:1.2rem; list-style:none; margin:0; padding:0; }
.footer-legal a{ color:#8FA9BF; }
.footer-legal a:hover{ color:#fff; }

/* ------------------------------------------------- floating things */
.wa-float{
  position:fixed; z-index:900; inset-block-end:26px; inset-inline-end:22px;
  width:58px; height:58px; border-radius:50%; display:grid; place-items:center;
  background:#25D366; color:#fff; font-size:1.6rem; box-shadow:0 10px 30px rgba(37,211,102,.42);
  transition:transform var(--t-fast);
}
.wa-float::before{
  content:""; position:absolute; inset:0; border-radius:50%; background:#25D366;
  animation:waPulse 2.4s ease-out infinite; z-index:-1;
}
@keyframes waPulse{ 0%{ transform:scale(1); opacity:.6 } 100%{ transform:scale(1.7); opacity:0 } }
.wa-float:hover{ transform:scale(1.08); color:#fff; }
.wa-tip{
  position:absolute; inset-inline-end:70px; white-space:nowrap; background:#fff; color:var(--ink);
  padding:.5rem .9rem; border-radius:8px; font-size:.82rem; font-weight:700; box-shadow:var(--shadow);
  opacity:0; visibility:hidden; transform:translateX(8px); transition:all var(--t-fast);
}
html[dir="rtl"] .wa-tip{ transform:translateX(-8px); }
.wa-float:hover .wa-tip{ opacity:1; visibility:visible; transform:translateX(0); }

.back-top{
  position:fixed; z-index:890; inset-block-end:26px; inset-inline-start:22px;
  width:46px; height:46px; border-radius:50%; border:1px solid var(--line);
  background:#fff; color:var(--navy); cursor:pointer; display:grid; place-items:center;
  box-shadow:var(--shadow); opacity:0; visibility:hidden; transform:translateY(12px);
  transition:all var(--t);
}
.back-top.is-visible{ opacity:1; visibility:visible; transform:translateY(0); }
.back-top:hover{ background:var(--navy); color:#fff; }

/* mobile bottom bar */
.mobile-bar{
  position:fixed; z-index:920; inset-inline:0; inset-block-end:0; display:none;
  background:#fff; border-top:1px solid var(--line); box-shadow:0 -6px 24px rgba(11,42,74,.1);
  padding-bottom:env(safe-area-inset-bottom);
}
.mobile-bar-inner{ display:grid; grid-template-columns:repeat(4,1fr); }
.mobile-bar a{
  display:flex; flex-direction:column; align-items:center; gap:.22rem; padding:.65rem .3rem;
  font-size:.68rem; font-weight:700; color:var(--muted); border-inline-end:1px solid var(--line-soft);
}
.mobile-bar a:last-child{ border-inline-end:0; }
.mobile-bar a i{ font-size:1.05rem; color:var(--navy); }
.mobile-bar a.accent i{ color:var(--cyan); }
.mobile-bar a.wa i{ color:#25D366; }
.mobile-bar a:active{ background:var(--bg-soft); }

/* cookie notice */
.cookie-bar{
  position:fixed; z-index:950; inset-block-end:16px; inset-inline:16px;
  max-width:520px; margin-inline:auto; background:#fff; border:1px solid var(--line);
  border-radius:var(--radius); box-shadow:var(--shadow-lg); padding:1.2rem 1.4rem;
  transform:translateY(140%); transition:transform .55s var(--ease);
}
.cookie-bar.is-visible{ transform:translateY(0); }
.cookie-bar p{ font-size:.85rem; color:var(--muted); margin-bottom:.9rem; }
.cookie-actions{ display:flex; gap:.5rem; }

/* alerts */
.bc-alert{
  display:flex; gap:.8rem; align-items:flex-start; padding:1rem 1.2rem; border-radius:var(--radius-sm);
  font-size:.9rem; margin-bottom:1rem; border:1px solid transparent;
  animation:alertIn .4s var(--ease) both;
}
@keyframes alertIn{ from{ opacity:0; transform:translateY(-8px) } to{ opacity:1; transform:none } }
.bc-alert i{ margin-top:.15rem; }
.bc-alert-success{ background:rgba(18,166,122,.09); border-color:rgba(18,166,122,.28); color:#0E8862; }
.bc-alert-danger{ background:rgba(214,69,80,.08); border-color:rgba(214,69,80,.26); color:#B3313C; }
.bc-alert-warning{ background:rgba(225,163,43,.1); border-color:rgba(225,163,43,.3); color:#A9761A; }
.bc-alert-info{ background:rgba(0,163,217,.08); border-color:rgba(0,163,217,.26); color:#0C7CA0; }

/* toast */
#bc-toasts{ position:fixed; z-index:2000; inset-block-start:20px; inset-inline-end:20px; display:grid; gap:.6rem; max-width:360px; }
.bc-toast{
  display:flex; gap:.7rem; align-items:flex-start; padding:.9rem 1.1rem; border-radius:var(--radius-sm);
  background:#fff; box-shadow:var(--shadow-lg); border-inline-start:4px solid var(--cyan);
  font-size:.88rem; animation:toastIn .4s var(--ease) both;
}
@keyframes toastIn{ from{ opacity:0; transform:translateX(30px) } to{ opacity:1; transform:none } }
html[dir="rtl"] @keyframes toastIn{ from{ opacity:0; transform:translateX(-30px) } to{ opacity:1; transform:none } }
.bc-toast.success{ border-color:var(--success); }
.bc-toast.danger{ border-color:var(--danger); }
.bc-toast.warning{ border-color:var(--warn); }

/* ------------------------------------------------------ scroll anim */
[data-reveal]{ opacity:0; transform:translateY(28px); transition:opacity .8s var(--ease),transform .8s var(--ease); will-change:opacity,transform; }
[data-reveal="left"]{ transform:translateX(-32px); }
[data-reveal="right"]{ transform:translateX(32px); }
[data-reveal="scale"]{ transform:scale(.94); }
[data-reveal="fade"]{ transform:none; }
[data-reveal].is-visible{ opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{ animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; scroll-behavior:auto!important; }
  [data-reveal]{ opacity:1!important; transform:none!important; }
}

/* -------------------------------------------------------- utilities */
.bg-soft{ background:var(--bg-soft); }
.text-muted-bc{ color:var(--muted)!important; }
.text-navy{ color:var(--navy)!important; }
.text-cyan{ color:var(--cyan-600)!important; }
.text-gold{ color:var(--gold)!important; }
.fw-800{ font-weight:800; }
.rounded-bc{ border-radius:var(--radius); }
.shadow-bc{ box-shadow:var(--shadow); }
.divider-y{ height:1px; background:var(--line); }
.list-check{ list-style:none; padding:0; margin:0; display:grid; gap:.6rem; }
.list-check li{ display:flex; gap:.65rem; font-size:.92rem; }
.list-check i{ color:var(--success); margin-top:.35rem; font-size:.8rem; flex-shrink:0; }
.ratio-box{ position:relative; overflow:hidden; border-radius:var(--radius); }
.ratio-box img{ width:100%; height:100%; object-fit:cover; }

.prose{ color:var(--body); font-size:1rem; line-height:1.85; }
.prose h2{ font-size:1.6rem; margin-top:2rem; }
.prose h3{ font-size:1.25rem; margin-top:1.8rem; color:var(--navy); }
.prose ul,.prose ol{ padding-inline-start:1.3rem; }
.prose li{ margin-bottom:.5rem; }
.prose a{ text-decoration:underline; }
.prose img{ border-radius:var(--radius); margin:1.4rem 0; }
.prose blockquote{
  margin:1.6rem 0; padding:1rem 1.4rem; border-inline-start:3px solid var(--cyan);
  background:var(--bg-soft); border-radius:0 var(--radius-sm) var(--radius-sm) 0; color:var(--ink); font-style:italic;
}

/* swiper tweaks */
.swiper-button-next,.swiper-button-prev{ display:none; }
.bc-swiper-nav{ display:flex; gap:.5rem; }
.bc-swiper-nav button{
  width:44px; height:44px; border-radius:50%; border:1px solid var(--line); background:#fff;
  color:var(--navy); cursor:pointer; display:grid; place-items:center; transition:all var(--t-fast);
}
.bc-swiper-nav button:hover{ background:var(--navy); color:#fff; border-color:var(--navy); }
.swiper-pagination-bullet-active{ background:var(--cyan); }
.swiper{ padding-bottom:6px; }

/* ------------------------------------------------------- responsive */
@media (max-width:1199.98px){
  .main-nav a{ padding:.55rem .55rem; font-size:.83rem; }
  .quick-grid{ grid-template-columns:repeat(2,1fr); }
  .quick-card{ border-bottom:1px solid var(--line-soft); }
  .stats-strip{ grid-template-columns:repeat(3,1fr); }
}
@media (max-width:991.98px){
  :root{ --header-h:70px; }
  .main-nav,.header-actions .btn{ display:none; }
  .burger{ display:grid; }
  .hero-swiper{ height:clamp(520px,80vh,700px); }
  .hero-nav{ display:none; }
  .about-img-sub{ position:static; width:100%; margin-top:14px; border-width:0; box-shadow:none; }
  .about-badge{ inset-inline-start:14px; inset-block-start:14px; }
  .ceo-quote-mark{ display:none; }
  .topbar-list li.hide-md{ display:none; }
}
@media (max-width:767.98px){
  body{ font-size:15.5px; padding-bottom:62px; }
  .header-actions{ gap:.42rem; }
  .brand-logo{ height:42px; max-width:44vw; object-fit:contain; }
  .header-search-btn,.header-account-btn{ width:38px; height:38px; }
  .burger{ width:42px; height:42px; }
  .mobile-bar{ display:block; }
  .wa-float{ inset-block-end:78px; width:52px; height:52px; font-size:1.4rem; }
  .back-top{ inset-block-end:78px; }
  .cookie-bar{ inset-block-end:74px; }
  .quick-actions{ margin-top:-32px; }
  .quick-grid{ grid-template-columns:1fr; }
  .stats-strip{ grid-template-columns:repeat(2,1fr); }
  .hero-swiper{ height:auto; min-height:560px; }
  .hero-content{ padding-block:80px 110px; }
  .hero-pagination{ inset-inline-start:20px!important; bottom:34px!important; }
  .hero-scroll{ display:none; }
  .section{ padding:56px 0; }
  .industry-grid{ grid-template-columns:repeat(2,1fr); }
  .topbar-inner{ justify-content:center; }
  .topbar-list li.hide-sm{ display:none; }
  .ref-box{ padding:1.2rem 1.5rem; width:100%; }
  .ref-box .rv{ font-size:1.4rem; }
  .footer-bottom{ flex-direction:column; text-align:center; }
  .cta-band{ text-align:center; }
  .cta-band .btn{ width:100%; }
}
@media (max-width:575.98px){
  .stats-strip{ grid-template-columns:1fr 1fr; }
  .industry-grid{ grid-template-columns:1fr; }
  .filter-bar{ overflow-x:auto; flex-wrap:nowrap; justify-content:flex-start; padding-bottom:.5rem; }
  .filter-btn{ flex-shrink:0; }
  .btn{ padding:.85rem 1.3rem; font-size:.9rem; }
  .hero-actions .btn{ width:100%; }
}

/* ----------------------------------------------------------- print */
@media print{
  .topbar,.site-header,.site-footer,.wa-float,.back-top,.mobile-bar,.cookie-bar,.hero-nav,.no-print{ display:none!important; }
  body{ background:#fff; color:#000; padding:0; }
  .section{ padding:12px 0; }
  a{ color:#000; text-decoration:none; }
}

/* ═══════════════════════════════════════════════════════════════════
   Customer account area
   ═══════════════════════════════════════════════════════════════════ */
.account-wrap{ background:var(--bg-soft); }
.acc-side{
  background:#fff; border:1px solid var(--line); border-radius:14px;
  overflow:hidden; position:sticky; top:96px;
}
.acc-user{ display:flex; align-items:center; gap:12px; padding:18px; background:var(--navy); color:#fff; }
.acc-ava{
  width:44px; height:44px; flex:0 0 44px; border-radius:12px; background:var(--cyan);
  display:flex; align-items:center; justify-content:center; font-weight:700; font-size:1.05rem;
}
.acc-user b{ display:block; font-size:.95rem; line-height:1.3; }
.acc-user span{ font-size:.74rem; color:rgba(255,255,255,.7); letter-spacing:.04em; }
.acc-nav{ display:flex; flex-direction:column; padding:8px 0; }
.acc-nav a{
  display:flex; align-items:center; gap:11px; padding:11px 18px; font-size:.9rem;
  color:var(--ink); text-decoration:none; transition:background .16s ease, color .16s ease;
}
.acc-nav a i{ width:18px; text-align:center; color:var(--muted); transition:color .16s ease; }
.acc-nav a:hover{ background:var(--bg-soft); color:var(--navy); }
.acc-nav a:hover i{ color:var(--cyan); }
.acc-nav a.on{ background:rgba(0,163,217,.08); color:var(--navy); font-weight:600; box-shadow:inset 3px 0 0 var(--cyan); }
body.is-rtl .acc-nav a.on{ box-shadow:inset -3px 0 0 var(--cyan); }
.acc-nav a.on i{ color:var(--cyan); }
.acc-nav a em{
  margin-inline-start:auto; font-style:normal; font-size:.7rem; font-weight:700; color:#fff;
  background:var(--cyan); border-radius:20px; padding:1px 7px;
}
.acc-nav a.out{ border-top:1px solid var(--line); margin-top:6px; padding-top:14px; color:#B3313C; }
.acc-nav a.out i{ color:#B3313C; }
.acc-cta{ padding:14px 16px 18px; border-top:1px solid var(--line); }
.acc-head{ display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:16px; flex-wrap:wrap; }
.acc-head h2{ font-size:1.25rem; margin:0; }
.acc-card{ background:#fff; border:1px solid var(--line); border-radius:14px; margin-bottom:18px; }
.acc-card > h3{
  font-size:.95rem; margin:0; padding:15px 18px; border-bottom:1px solid var(--line);
  display:flex; align-items:center; gap:9px;
}
.acc-card > h3 i{ color:var(--cyan); }
.acc-card-b{ padding:18px; }
.acc-card-b.tight{ padding:0; }
.acc-stat{
  background:#fff; border:1px solid var(--line); border-radius:14px; padding:18px;
  display:flex; align-items:center; gap:14px; height:100%;
}
.acc-stat i{
  width:44px; height:44px; flex:0 0 44px; border-radius:12px; background:rgba(0,163,217,.1);
  color:var(--cyan-600); display:flex; align-items:center; justify-content:center; font-size:1.05rem;
}
.acc-stat b{ display:block; font-family:var(--font-num,inherit); font-size:1.5rem; line-height:1.1; color:var(--navy); }
.acc-stat span{ font-size:.76rem; color:var(--muted); text-transform:uppercase; letter-spacing:.06em; }
.acc-table{ width:100%; border-collapse:collapse; font-size:.88rem; }
.acc-table th{
  text-align:start; font-size:.7rem; letter-spacing:.07em; text-transform:uppercase; color:var(--muted);
  font-weight:600; padding:11px 16px; border-bottom:1px solid var(--line); background:var(--bg-soft);
}
.acc-table td{ padding:13px 16px; border-bottom:1px solid var(--line); vertical-align:middle; }
.acc-table tr:last-child td{ border-bottom:0; }
.acc-table a{ font-weight:600; }
.acc-empty{ text-align:center; padding:40px 20px; color:var(--muted); }
.acc-empty i{ font-size:2rem; color:var(--line-strong,#CBD8E3); display:block; margin-bottom:10px; }
.acc-empty b{ display:block; color:var(--navy); margin-bottom:4px; }
.auth-card{ background:#fff; border:1px solid var(--line); border-radius:16px; padding:30px 28px; box-shadow:var(--shadow-sm,0 10px 30px rgba(11,42,74,.06)); }
.auth-card h2{ font-size:1.2rem; margin-bottom:6px; }
.auth-card .muted{ font-size:.86rem; color:var(--muted); margin-bottom:20px; }
.auth-alt{ text-align:center; margin-top:18px; font-size:.86rem; color:var(--muted); }
@media (max-width:991.98px){ .acc-side{ position:static; } }
.kv-list{ margin:0; }
.kv-list dt{ font-size:.74rem; text-transform:uppercase; letter-spacing:.06em; color:var(--muted); font-weight:600; margin-top:.7rem; }
.kv-list dt:first-child{ margin-top:0; }
.kv-list dd{ margin:.15rem 0 0; font-size:.92rem; color:var(--ink); }

/* ================================================================= */
/*  LIVE CHAT WIDGET                                                 */
/* ================================================================= */
.chat-float{
  position:fixed; z-index:960; inset-block-end:26px; inset-inline-start:22px;
  width:58px; height:58px; border-radius:50%; display:grid; place-items:center;
  background:linear-gradient(140deg,var(--navy),var(--navy-700)); color:var(--cyan-300);
  font-size:1.35rem; border:0; cursor:pointer; padding:0;
  box-shadow:0 12px 32px rgba(11,42,74,.38); transition:transform var(--t-fast), box-shadow var(--t-fast);
}
.chat-float:hover{ transform:scale(1.07); color:#fff; }
.chat-unread{
  position:absolute; inset-block-start:-5px; inset-inline-end:-5px; min-width:21px; height:21px;
  padding:0 6px; border-radius:11px; background:#D64545; color:#fff; font-size:.68rem; font-weight:800;
  display:grid; place-items:center; border:2px solid #fff; box-sizing:content-box;
}
.chat-panel{
  position:fixed; z-index:955; inset-block-end:100px; inset-inline-start:22px;
  width:min(372px,calc(100vw - 32px)); height:min(560px,calc(100dvh - 135px)); min-height:380px;
  display:flex; flex-direction:column; background:#fff; border-radius:18px; overflow:hidden;
  box-shadow:0 28px 70px rgba(6,22,38,.3); border:1px solid var(--line);
  opacity:0; visibility:hidden; transform:translateY(18px) scale(.97); pointer-events:none;
  transition:opacity var(--t), transform var(--t), visibility var(--t);
}
.chat-panel.open{ opacity:1; visibility:visible; transform:none; pointer-events:auto; }
.chat-head{
  display:flex; align-items:center; gap:12px; padding:14px 16px; color:#fff;
  background:linear-gradient(140deg,var(--navy),var(--navy-700));
}
.chat-head-ava{
  width:42px; height:42px; border-radius:12px; flex:0 0 42px; display:grid; place-items:center;
  background:rgba(255,255,255,.12); color:var(--cyan-300); font-size:1.1rem;
}
.chat-head-txt{ flex:1; min-width:0; }
.chat-head-txt b{ display:block; font-size:.95rem; line-height:1.25; }
.chat-head-txt span{ display:flex; align-items:center; gap:6px; font-size:.74rem; color:rgba(255,255,255,.78); }
.chat-dot{ width:8px; height:8px; border-radius:50%; background:#6E7F92; flex-shrink:0; }
.chat-online .chat-dot{ background:#41D38A; box-shadow:0 0 0 3px rgba(65,211,138,.2); }
.chat-head-close{
  width:34px; height:34px; border-radius:9px; border:0; background:rgba(255,255,255,.1);
  color:#fff; cursor:pointer; display:grid; place-items:center; transition:background var(--t-fast);
}
.chat-head-close:hover{ background:rgba(255,255,255,.22); }
.chat-body{ flex:1; overflow-y:auto; padding:14px; background:#F4F8FB; display:flex; flex-direction:column; }
.chat-welcome{
  background:#fff; border:1px solid var(--line); border-radius:12px; padding:12px 14px;
  font-size:.85rem; color:var(--ink); line-height:1.65; margin-bottom:12px;
}
.chat-intro{ background:#fff; border:1px solid var(--line); border-radius:12px; padding:12px 14px; margin-bottom:12px; }
.chat-intro label{ display:block; font-size:.76rem; font-weight:700; color:var(--navy); margin-bottom:8px; }
.chat-intro-grid{ display:grid; gap:7px; }
.chat-intro-grid input{
  border:1px solid var(--line); border-radius:8px; padding:8px 10px; font-size:.84rem; outline:none;
}
.chat-intro-grid input:focus{ border-color:var(--cyan); }
.chat-msgs{ display:flex; flex-direction:column; gap:10px; margin-top:auto; }
.chat-row{ display:flex; flex-direction:column; max-width:84%; }
.chat-row.out{ align-self:flex-end; align-items:flex-end; }
.chat-row.in{ align-self:flex-start; align-items:flex-start; }
.chat-bubble{
  padding:9px 13px; border-radius:15px; font-size:.875rem; line-height:1.55; word-break:break-word;
  white-space:pre-wrap; max-width:100%;
}
.chat-row.out .chat-bubble{ background:var(--navy); color:#fff; border-end-end-radius:5px; }
.chat-row.in .chat-bubble{ background:#fff; border:1px solid var(--line); color:var(--ink); border-end-start-radius:5px; }
.chat-meta{ display:flex; align-items:center; gap:6px; font-size:.68rem; color:#8296A8; margin-top:4px; }
.chat-meta .chat-ticks{ color:#A9B9C7; letter-spacing:-2px; font-size:.8rem; }
.chat-meta .chat-ticks.seen{ color:#2F9BD1; }
.chat-meta b{ font-weight:700; color:#5F7385; }
.chat-typing{ display:flex; margin-top:10px; }
.chat-typing .chat-bubble{ padding:11px 14px; }
.chat-typing span{
  width:6px; height:6px; border-radius:50%; background:#9DB2C4; display:inline-block; margin:0 2px;
  animation:chatDot 1.15s ease-in-out infinite;
}
.chat-typing span:nth-child(2){ animation-delay:.18s; }
.chat-typing span:nth-child(3){ animation-delay:.36s; }
@keyframes chatDot{ 0%,60%,100%{ transform:translateY(0); opacity:.55 } 30%{ transform:translateY(-4px); opacity:1 } }
.chat-foot{ display:flex; gap:8px; padding:10px 12px; border-top:1px solid var(--line); background:#fff; }
.chat-input{
  flex:1; border:1px solid var(--line); border-radius:11px; padding:10px 13px; font-size:.88rem;
  outline:none; transition:border-color var(--t-fast);
}
.chat-input:focus{ border-color:var(--cyan); }
.chat-input:disabled{ background:var(--bg-soft); color:var(--muted); }
.chat-send{
  width:44px; height:44px; flex:0 0 44px; border-radius:11px; border:0; cursor:pointer;
  background:var(--navy); color:var(--cyan-300); font-size:1rem; transition:background var(--t-fast);
}
.chat-send:hover{ background:var(--navy-700); }
.chat-send:disabled{ background:#C6D2DD; color:#8CA0B2; cursor:not-allowed; }
@media (max-width:575.98px){
  .header-inner{ gap:.55rem; }
  .brand-logo{ height:38px; max-width:44vw; object-fit:contain; }
  .header-search-btn,.header-account-btn{ width:36px; height:36px; font-size:.92rem; }
  .burger{ width:40px; height:40px; }
  .header-actions{ gap:.38rem; }
  .chat-panel{ inset-block-end:84px; inset-inline-start:12px; height:min(520px,calc(100dvh - 105px)); }
  .chat-float{ inset-block-end:84px; inset-inline-start:16px; width:52px; height:52px; font-size:1.2rem; }
  .back-top{ inset-block-end:150px; }
}
@media (min-width:576px){ .chat-panel{ inset-block-end:100px; } .back-top{ inset-block-end:100px; } }

.btn-xs{ padding:.35rem .75rem; font-size:.78rem; }
.input-hint{ font-size:.74rem; color:var(--muted); margin-top:.35rem; }
.acc-ava img{ width:100%; height:100%; object-fit:cover; border-radius:12px; }

/* ============================================================ location
   Free map-based location picker (OpenStreetMap tiles, no API key). */
.loc-picker{ position:relative; }
.loc-map{
  position:relative; width:100%; height:320px; overflow:hidden;
  background:#dbe7ef; border:1px solid var(--line); border-radius:10px; cursor:crosshair;
}
.loc-tile{ position:absolute; width:256px; height:256px; background-repeat:no-repeat; background-size:256px 256px; pointer-events:none; }
.loc-pin{
  position:absolute; width:24px; height:32px; pointer-events:none; z-index:5;
  background:#0B2A4A; clip-path:polygon(50% 0,100% 100%,50% 78%,0 100%);
  box-shadow:0 2px 6px rgba(0,0,0,.35);
}
.loc-pin::after{
  content:""; position:absolute; left:50%; top:11px; width:8px; height:8px;
  margin-left:-4px; background:#fff; border-radius:50%;
}
.loc-loading{
  position:absolute; inset:0; display:grid; place-items:center;
  color:var(--muted); font-size:.85rem; background:#dbe7ef;
}
.loc-controls{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:12px; flex-wrap:wrap; }
.loc-status{ font-size:.8rem; color:var(--muted); }