:root{ --navy:#0F2A4A; --gold:#B78846; }
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{ animation-duration:.001ms!important; animation-iteration-count:1!important; transition-duration:.001ms!important; scroll-behavior:auto!important; }
}
html{ scroll-behavior:smooth; }
body{ font-family:'Open Sans',sans-serif; color:#1C2530; background:#FFFFFF; cursor:default; }
h1,h2,h3,h4,.font-display{ font-family:'Poppins',sans-serif; }

/* Loader */
#loader{ position:fixed; inset:0; background:#FFFFFF; z-index:9999; display:flex; align-items:center; justify-content:center; transition:opacity .5s ease, visibility .5s ease; }
#loader.hidden{ opacity:0; visibility:hidden; pointer-events:none; }
.loader-mark{ width:56px; height:56px; border-radius:12px; background:var(--navy); display:flex; align-items:center; justify-content:center; animation:loaderPulse 1.4s ease-in-out infinite; }
@keyframes loaderPulse{ 0%,100%{ transform:scale(1); } 50%{ transform:scale(1.06); } }

/* Nav */
#site-nav{ transition:box-shadow .3s ease, padding .3s ease; }
#site-nav.scrolled{ box-shadow:0 1px 0 rgba(15,42,74,0.08); }
.nav-link{ position:relative; color:#1C2530; }
.nav-link::after{ content:''; position:absolute; left:0; bottom:-4px; width:0%; height:2px; background:var(--gold); transition:width .25s ease; }
.nav-link:hover::after{ width:100%; }
.nav-link.active::after{ width:100%; }
.nav-link.active{ color:var(--navy); font-weight:700; }

/* Buttons */
.btn-gold{ background:var(--gold); color:#FFFFFF; font-weight:600; transition:background .25s ease, transform .2s ease; }
.btn-gold:hover{ background:#A47638; transform:translateY(-1px); }
.btn-navy{ background:var(--navy); color:#FFFFFF; font-weight:600; transition:background .25s ease, transform .2s ease; }
.btn-navy:hover{ background:#0A1E38; transform:translateY(-1px); }
.btn-outline{ border:1.5px solid var(--navy); color:var(--navy); font-weight:600; transition:background .25s ease, color .25s ease, transform .2s ease; }
.btn-outline:hover{ background:var(--navy); color:#FFFFFF; transform:translateY(-1px); }

/* Reveal */
.reveal{ opacity:0; transform:translateY(28px); }
.reveal-fade{ opacity:0; }

/* Cards */
.service-card{ border:1px solid #E7E9EC; background:#FFFFFF; transition:border-color .25s ease, transform .25s ease, box-shadow .25s ease; }
.service-card:hover{ border-color:var(--gold); transform:translateY(-4px); box-shadow:0 12px 32px rgba(15,42,74,0.08); }
.icon-badge{ width:56px; height:56px; border-radius:14px; background:#F1F5F9; display:flex; align-items:center; justify-content:center; color:var(--navy); flex-shrink:0; }

/* Pills */
.pill{ border:1.5px solid #DDE2E8; color:#1C2530; background:#FFFFFF; transition:border-color .2s ease, background .2s ease; }
.pill:hover{ border-color:var(--gold); background:#FBF7F1; }

/* Step numbers */
.step-num{ width:44px; height:44px; border-radius:50%; background:var(--navy); color:#FFFFFF; font-family:'Poppins',sans-serif; font-weight:700; display:flex; align-items:center; justify-content:center; flex-shrink:0; }

/* Stat */
.stat-num{ font-family:'Poppins',sans-serif; font-weight:800; }

/* Check list */
.check-item{ display:flex; align-items:flex-start; gap:12px; }
.check-mark{ width:22px; height:22px; border-radius:50%; background:#F1F5F9; color:var(--navy); display:flex; align-items:center; justify-content:center; flex-shrink:0; margin-top:2px; }

/* Value cards (About page) */
.value-card{ border-left:3px solid var(--gold); background:#FAFAF9; }

/* Page hero (interior pages) */
.page-hero{ background:var(--navy); }

/* Mobile menu */
#mobile-menu{ transform:translateY(-12px); opacity:0; pointer-events:none; transition:transform .25s ease, opacity .25s ease; }
#mobile-menu.open{ transform:translateY(0); opacity:1; pointer-events:auto; }

::selection{ background:var(--gold); color:#fff; }

/* Services nav dropdown */
.dropdown-panel{ background:#FFFFFF; border:1px solid #E7E9EC; box-shadow:0 16px 40px rgba(15,42,74,0.12); }
.dropdown-link{ display:block; padding:9px 14px; border-radius:8px; font-size:14px; color:#1C2530; transition:background .2s ease, color .2s ease; }
.dropdown-link:hover{ background:#F1F5F9; color:var(--navy); }
.dropdown-link-sub{ padding-left:26px; color:#5B6472; font-size:13px; }

/* Form fields */
.label{ display:block; font-size:13px; font-weight:600; color:#1C2530; margin-bottom:6px; }
.input{ width:100%; border:1.5px solid #DDE2E8; border-radius:10px; padding:11px 14px; font-family:'Open Sans',sans-serif; font-size:15px; color:#1C2530; background:#FFFFFF; transition:border-color .2s ease, box-shadow .2s ease; }
.input:focus{ outline:none; border-color:var(--gold); box-shadow:0 0 0 3px rgba(183,136,70,0.15); }
.card-form{ border:1px solid #E7E9EC; background:#FFFFFF; box-shadow:0 12px 32px rgba(15,42,74,0.06); }

/* FAQ */
.faq-item{ border:1px solid #E7E9EC; background:#FAFAF9; }
.faq-item summary{ cursor:pointer; color:var(--navy); font-weight:600; font-size:14px; list-style:none; display:inline-flex; align-items:center; gap:6px; }
.faq-item summary::-webkit-details-marker{ display:none; }
.faq-item summary::after{ content:'+'; font-size:16px; line-height:1; transition:transform .2s ease; }
.faq-item details[open] summary::after{ content:'\2212'; }
.faq-item details p{ padding-top:2px; }

/* Subtle warm-tint card for sections that should stand out slightly (scope
   options, proof) without a heavy redesign — light shading, not a new color. */
.card-highlight{ background:#FBF7EE; border:1.5px solid #E8D9B4; }

/* Process timeline */
.process-num{ width:48px; height:48px; border-radius:50%; background:var(--navy); color:#FFFFFF; font-family:'Poppins',sans-serif; font-weight:700; display:flex; align-items:center; justify-content:center; flex-shrink:0; font-size:15px; }

/* RTL adjustments (Arabic pages set dir="rtl" on <html>) */
[dir="rtl"] body{ font-family:'Open Sans',sans-serif; }
[dir="rtl"] .value-card{ border-left:none; border-right:3px solid var(--gold); }
[dir="rtl"] .faq-item summary::after{ transform:scaleX(-1); }
[dir="rtl"] .dropdown-link-sub{ padding-left:14px; padding-right:26px; }
