/* ================================================================
   GOOGAN REDESIGN — Navy + Gold Premium Design System (Phase 1)
   Scope: global shared components + homepage (.googan-home)
   ================================================================ */
:root{
  --g-navy:#0B1F33; --g-navy-2:#12304d; --g-navy-3:#081422;
  --g-gold:#C9A96A; --g-gold-2:#b8965a; --g-gold-soft:#e7d6ae;
  --g-white:#ffffff; --g-off:#f6f2ea; --g-warm:#faf8f3; --g-line:#e7e1d4;
  --g-ink:#15232f; --g-muted:#5d6b78;
  --g-radius:14px; --g-radius-sm:10px;
  --g-shadow:0 10px 30px rgba(11,31,51,.08); --g-shadow-lg:0 22px 55px rgba(11,31,51,.15);
  --g-container:1200px;
}
/* ---------- Base typography (global, Arabic-first) ---------- */
body{font-family:'Tajawal',Tahoma,Arial,sans-serif !important;color:var(--g-ink);}
h1,h2,h3,h4,h5,h6{font-family:'Tajawal',Tahoma,sans-serif !important;color:var(--g-navy);font-weight:800;letter-spacing:normal;}
p,li,span,a,div{font-family:'Tajawal',Tahoma,sans-serif;}
p{line-height:2;color:var(--g-muted);}
a{transition:color .25s,background .25s,border-color .25s,box-shadow .25s,transform .25s;}
img{max-width:100%;height:auto;}
.googan-home .container,.main-header .container,.main-footer .container{max-width:var(--g-container);}

/* ---------- Buttons (global system) ---------- */
.g-btn,a.btn-wa{display:inline-flex !important;align-items:center;gap:.55rem;justify-content:center;
  font-weight:700;font-size:16px;line-height:1;border-radius:60px;padding:15px 30px;border:2px solid transparent;
  text-decoration:none;cursor:pointer;transition:.25s;}
a.btn-wa{background:var(--g-gold) !important;color:var(--g-navy) !important;box-shadow:0 8px 22px rgba(201,169,106,.35);}
a.btn-wa:hover{background:var(--g-gold-2) !important;color:#fff !important;transform:translateY(-2px);box-shadow:0 12px 28px rgba(201,169,106,.45);}
.g-btn-outline{background:transparent;color:var(--g-navy);border-color:var(--g-navy);}
.g-btn-outline:hover{background:var(--g-navy);color:#fff;}
.g-btn-ghost{background:rgba(255,255,255,.08);color:#fff;border-color:rgba(255,255,255,.5);}
.g-btn-ghost:hover{background:#fff;color:var(--g-navy);border-color:#fff;}

/* ---------- HEADER (global) ---------- */
.main-header{position:relative;z-index:999;}
.main-header .sticky-header{background:var(--g-navy) !important;box-shadow:0 6px 24px rgba(8,20,34,.18);}
.main-header .sticky-header .container{display:flex;align-items:center;justify-content:space-between;min-height:78px;}
.main-header .sticky-header .logo-box{padding:8px 0;margin:0;}
.main-header .sticky-header .logo-box img,.main-header .outer-box .logo-box img{max-height:52px;width:auto;}
/* nav */
.main-menu .navigation{display:flex;align-items:center;gap:4px;margin:0;}
.main-menu .navigation>li{margin:0;padding:0;position:relative;}
.main-menu .navigation>li>a{color:#eaf0f6 !important;font-weight:600;font-size:15.5px;padding:12px 16px !important;border-radius:8px;background:transparent !important;position:relative;}
.main-menu .navigation>li>a:hover,.main-menu .navigation>li.current>a,.main-menu .navigation>li.current-menu-item>a{color:var(--g-gold) !important;}
.main-menu .navigation>li>a::after{content:"";position:absolute;left:16px;right:16px;bottom:6px;height:2px;background:var(--g-gold);transform:scaleX(0);transform-origin:center;transition:transform .25s;border-radius:2px;}
.main-menu .navigation>li:hover>a::after,.main-menu .navigation>li.current>a::after{transform:scaleX(1);}
/* header CTA (last nav item 'English' stays; add gold ring to contact) */
.main-header .header-cta{display:inline-flex;align-items:center;}
/* nav toggler / hamburger */
.main-header .nav-toggler,.main-header .mobile-nav-toggler,.nav-toggler .nav-btn{color:#fff;}
.main-header .outer-box{background:transparent !important;}
.main-header .outer-box .nav-toggler{background:var(--g-gold) !important;border-radius:10px;padding:12px 14px;}

/* ---------- Section headings (global) ---------- */
.sec-title{margin-bottom:34px;}
.sec-title h2,.sec-title h1,.sec-title .title{color:var(--g-navy) !important;font-weight:800;position:relative;display:inline-block;padding-bottom:16px;font-size:34px;}
.sec-title h2::after,.sec-title h1::after{content:"";position:absolute;bottom:0;right:0;width:64px;height:3px;background:var(--g-gold);border-radius:3px;}
.sec-title .text,.sec-title p{color:var(--g-muted);}

/* ---------- Section rhythm (homepage) ---------- */
.googan-home section{position:relative;}
.googan-home .about-section{background:linear-gradient(135deg,var(--g-navy) 0%,var(--g-navy-2) 60%,var(--g-navy-3) 100%) !important;padding:96px 0 88px !important;color:#eef3f8;}
.googan-home .service-section{background:var(--g-warm) !important;padding:88px 0 !important;}
.googan-home .work-section{background:var(--g-white) !important;padding:80px 0 !important;}
.googan-home .project-section{background:var(--g-off) !important;padding:80px 0 !important;}
.googan-home .testimonial-section{background:var(--g-white) !important;padding:70px 0 !important;}
.googan-home .fact-counter{background:var(--g-navy) !important;padding:60px 0 !important;}
.googan-home .clients-section{background:var(--g-warm) !important;padding:64px 0 !important;}
.googan-home .faq-section{background:var(--g-white) !important;padding:84px 0 !important;}
.googan-home .news-section{background:var(--g-off) !important;padding:84px 0 !important;}

/* ---------- HERO (about-section elevated on homepage) ---------- */
.googan-home .about-section h1{color:#fff !important;font-size:46px;line-height:1.4;font-weight:800;margin:0 0 18px;}
.googan-home .about-section h1 span{color:var(--g-gold) !important;}
.googan-home .about-section h2,.googan-home .about-section h3{color:#fff !important;}
.googan-home .about-section p{color:#cfdae6 !important;font-size:17px;line-height:2;}
.googan-home .about-section .sec-title h2::after{background:var(--g-gold);}
.googan-home .about-section a:not(.btn-wa){color:var(--g-gold-soft);}
.googan-home .about-section .btn-wa{margin-top:10px;}
/* hero trust strip */
.g-trust-strip{display:flex;flex-wrap:wrap;gap:14px 26px;margin-top:26px;padding-top:22px;border-top:1px solid rgba(201,169,106,.3);}
.g-trust-strip .g-trust{display:inline-flex;align-items:center;gap:9px;color:#e7eef5;font-weight:600;font-size:15px;}
.g-trust-strip .g-trust i,.g-trust-strip .g-trust svg{color:var(--g-gold);}
.g-trust-strip .g-trust b{color:var(--g-gold);font-weight:800;}

/* ---------- Service cards (global, premium) ---------- */
.service-block-one .inner-box,.service-section .service-block .inner-box{background:#fff !important;border:1px solid var(--g-line) !important;border-radius:var(--g-radius) !important;padding:34px 28px !important;box-shadow:var(--g-shadow);transition:.3s;height:100%;position:relative;overflow:hidden;}
.service-block-one .inner-box::before{content:"";position:absolute;top:0;right:0;width:100%;height:3px;background:var(--g-gold);transform:scaleX(0);transform-origin:right;transition:transform .3s;}
.service-block-one .inner-box:hover{box-shadow:var(--g-shadow-lg);transform:translateY(-6px);border-color:var(--g-gold-soft) !important;}
.service-block-one .inner-box:hover::before{transform:scaleX(1);}
.service-block-one h3,.service-block-one h4,.service-section .service-block h3{color:var(--g-navy) !important;font-weight:800;font-size:20px;}
.service-block-one h3 a{color:var(--g-navy) !important;}
.service-block-one h3 a:hover{color:var(--g-gold) !important;}
.service-block-one .icon-box,.service-block-one i{color:var(--g-gold) !important;font-size:42px;}

/* ---------- Clients (global) ---------- */
.clients-section .logo,.clients-section li,.clients-section .slide-item,.clients-section .image-box{background:#fff;border:1px solid var(--g-line);border-radius:12px;padding:16px;display:flex;align-items:center;justify-content:center;min-height:96px;transition:.3s;}
.clients-section img{max-height:60px;width:auto;object-fit:contain;filter:grayscale(100%);opacity:.72;transition:.3s;}
.clients-section .logo:hover img,.clients-section li:hover img{filter:grayscale(0);opacity:1;}

/* ---------- Fact counter (navy band) ---------- */
.googan-home .fact-counter h1,.googan-home .fact-counter h2,.googan-home .fact-counter h3,.googan-home .fact-counter .count-text,.googan-home .fact-counter .counter-title{color:#fff !important;}
.googan-home .fact-counter .count-outer,.googan-home .fact-counter .count-text{color:var(--g-gold) !important;font-weight:800;}

/* ---------- FOOTER (global) ---------- */
.main-footer{background:var(--g-navy) !important;color:#c6d2de;padding-top:66px;}
.main-footer .widget-section{padding-bottom:36px;}
.main-footer h2,.main-footer h3,.main-footer h4,.main-footer .widget-title{color:#fff !important;font-weight:800;font-size:19px;margin-bottom:20px;position:relative;padding-bottom:12px;}
.main-footer h3::after,.main-footer h4::after,.main-footer .widget-title::after{content:"";position:absolute;bottom:0;right:0;width:42px;height:2px;background:var(--g-gold);}
.main-footer a{color:#bfccd9;}
.main-footer a:hover{color:var(--g-gold);}
.main-footer ul li{margin-bottom:10px;line-height:1.9;}
.main-footer .footer-logo img,.main-footer img.footer-logo{max-height:56px;width:auto;margin-bottom:18px;}
.main-footer .footer-bottom{border-top:1px solid rgba(255,255,255,.1);padding:22px 0;margin-top:20px;}
.main-footer .footer-bottom,.main-footer .copyright{color:#9fb0bf;}
.main-footer .footer-bottom a{color:var(--g-gold);}

/* ---------- WhatsApp float polish ---------- */
#gb-widget,.gb-widget,[class*="get-button"]{z-index:9998;}

/* ================================================================
   RESPONSIVE
   ================================================================ */
@media (max-width:1199px){ .sec-title h2{font-size:30px;} .googan-home .about-section h1{font-size:40px;} }
@media (max-width:991px){
  .googan-home .about-section{padding:70px 0 60px !important;}
  .googan-home .about-section h1{font-size:34px;}
  .googan-home section{padding:56px 0 !important;}
  .main-header .sticky-header .container{min-height:66px;}
  .main-menu .navigation{flex-direction:column;align-items:stretch;gap:0;}
  .main-menu .navigation>li>a{padding:14px 18px !important;border-bottom:1px solid rgba(255,255,255,.08);}
  .main-menu .navigation>li>a::after{display:none;}
}
@media (max-width:767px){
  .sec-title h2{font-size:26px;}
  .googan-home .about-section h1{font-size:29px;line-height:1.5;}
  .googan-home .about-section p{font-size:15.5px;}
  .service-block-one .inner-box{padding:26px 22px !important;}
  a.btn-wa,.g-btn{width:100%;padding:14px 22px;font-size:15px;}
  .g-trust-strip{gap:10px 16px;}
  .g-trust-strip .g-trust{font-size:13.5px;}
  .main-header .outer-box .logo-box img{max-height:44px;}
}
@media (max-width:390px){
  .googan-home .about-section h1{font-size:26px;}
  .sec-title h2{font-size:23px;}
}
/* prevent horizontal overflow */
html,body{overflow-x:hidden;}



/* ---------- Off-canvas menu fix (global): remove 911px in-flow gap ---------- */
.hidden-bar{position:fixed !important;top:0 !important;height:100% !important;}
.hidden-bar.right-align{right:-350px;}

/* preloader safety (slider removed) */
#fv-loading-icon,.preloader{display:none !important;}


/* ============================================================
   PHASE 1 BUG-FIX PASS (2026-08-14) — scoped narrow selectors
   ============================================================ */
/* FIX 1: remove stray decorative line beside WhatsApp CTA (.btn-wa::before/::after) */
.googan-home a.btn-wa::before,.googan-home a.btn-wa::after{display:none !important;}

/* FIX 2: contrast — white trust cards (.box) in navy hero must have dark readable text */
.googan-home .about-section .box{color:#15232f !important;}
.googan-home .about-section .box p,.googan-home .about-section .box .text,.googan-home .about-section .box span,.googan-home .about-section .box li,.googan-home .about-section .box div{color:#46545f !important;}
.googan-home .about-section .box h1,.googan-home .about-section .box h2,.googan-home .about-section .box h3,.googan-home .about-section .box h4,.googan-home .about-section .box h5,.googan-home .about-section .box strong{color:#0B1F33 !important;}
.googan-home .about-section .box .top-title,.googan-home .about-section .box em{color:#9a7636 !important;}

/* FIX 3: navigation direction — lang-scoped (flex was computing direction:ltr on RTL) */
html[lang="ar"] .main-menu .navigation{direction:rtl !important;}
html[lang="en"] .main-menu .navigation{direction:ltr !important;}