/* ============================================================
   RQ LAW - SIMPLE BOOTSTRAP-LIKE HEADER + MOBILE COLLAPSE MENU
   Final clean override. This file must be loaded LAST.
   ============================================================ */
:root{
  --rq-teal:#0f5c5c;
  --rq-ink:#132b2b;
  --rq-muted:#536767;
  --rq-gold:#c9a84c;
  --rq-gold-dark:#9e7520;
  --rq-line:rgba(19,43,43,.12);
}

html,body{overflow-x:hidden!important;}
body{padding-top:76px!important;}
.topbar{display:none!important;}

/* kill old overlay/blur systems */
body.menu-open::before,
body.menu-open::after{display:none!important;content:none!important;}
body.menu-open{overflow:hidden!important;}

#site-header{position:relative!important;z-index:99999!important;}
.rq-header{
  position:fixed!important;
  top:0!important;left:0!important;right:0!important;
  width:100%!important;height:76px!important;
  z-index:99999!important;
  background:rgba(255,255,255,.97)!important;
  border-bottom:1px solid var(--rq-line)!important;
  box-shadow:none!important;
  backdrop-filter:blur(14px)!important;
  -webkit-backdrop-filter:blur(14px)!important;
}
.rq-header-inner{
  height:76px!important;
  max-width:1440px!important;
  margin:0 auto!important;
  padding:0 clamp(24px,4vw,72px)!important;
  display:flex!important;
  align-items:center!important;
  gap:30px!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
.rq-logo{
  display:flex!important;align-items:center!important;gap:12px!important;
  text-decoration:none!important;min-width:300px!important;flex-shrink:0!important;
}
.rq-logo-frame{
  width:44px!important;height:44px!important;flex:0 0 44px!important;
  display:flex!important;align-items:center!important;justify-content:center!important;
  padding:4px!important;border:1px solid rgba(184,146,62,.35)!important;background:transparent!important;
}
.rq-logo-img{height:34px!important;width:auto!important;display:block!important;filter:none!important;}
.rq-logo-text{display:flex!important;flex-direction:column!important;line-height:1.25!important;}
.rq-logo-text strong{color:var(--rq-teal)!important;font-size:.82rem!important;font-weight:900!important;white-space:nowrap!important;}
.rq-logo-text small{color:rgba(19,43,43,.45)!important;font-size:.54rem!important;font-weight:700!important;white-space:nowrap!important;}

.rq-desktop-nav{margin-inline-start:auto!important;display:flex!important;align-items:center!important;gap:28px!important;}
.rq-nav-link{
  position:relative!important;height:76px!important;display:inline-flex!important;align-items:center!important;
  color:var(--rq-muted)!important;text-decoration:none!important;font-size:.86rem!important;font-weight:800!important;
  white-space:nowrap!important;background:transparent!important;border:0!important;box-shadow:none!important;transform:none!important;padding:0!important;
}
.rq-nav-link::after{
  content:''!important;position:absolute!important;left:0!important;right:0!important;bottom:0!important;
  height:2px!important;background:var(--rq-gold)!important;opacity:0!important;transform:scaleX(0)!important;
  transform-origin:center!important;transition:opacity .18s ease,transform .18s ease!important;
}
.rq-nav-link:hover,.rq-nav-link.active{color:var(--rq-teal)!important;background:transparent!important;box-shadow:none!important;transform:none!important;}
.rq-nav-link:hover::after,.rq-nav-link.active::after{opacity:1!important;transform:scaleX(1)!important;}
.rq-nav-cta{
  min-height:42px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;
  padding:0 20px!important;border-radius:8px!important;text-decoration:none!important;
  background:linear-gradient(135deg,var(--rq-gold),var(--rq-gold-dark))!important;color:#132b2b!important;
  font-size:.84rem!important;font-weight:900!important;white-space:nowrap!important;border:0!important;box-shadow:none!important;
}
.rq-nav-cta:hover{background:#132b2b!important;color:#fff!important;}

.rq-lang{display:flex!important;align-items:center!important;gap:5px!important;background:#fff!important;border:1px solid rgba(15,92,92,.10)!important;border-radius:999px!important;padding:4px!important;}
.rq-lang .lang-btn,.rq-mobile-lang .lang-btn{border:0!important;border-radius:999px!important;background:transparent!important;color:rgba(19,43,43,.62)!important;font-family:inherit!important;font-size:.72rem!important;font-weight:900!important;cursor:pointer!important;padding:7px 10px!important;}
.rq-lang .lang-btn.active,.rq-mobile-lang .lang-btn.active{background:var(--rq-ink)!important;color:#fff!important;}
.rq-menu-toggle{display:none!important;}
.rq-mobile-menu{display:none!important;}

@media(max-width:1180px) and (min-width:881px){
  .rq-header-inner{gap:18px!important;padding:0 24px!important;}
  .rq-logo{min-width:auto!important;}
  .rq-logo-text{display:none!important;}
  .rq-desktop-nav{gap:18px!important;}
  .rq-nav-link{font-size:.80rem!important;}
  .rq-nav-cta{padding:0 14px!important;}
}

/* MOBILE: normal Bootstrap-like collapse panel */
@media(max-width:880px){
  body{padding-top:64px!important;}
  .rq-header{height:64px!important;background:#fff!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;}
  .rq-header-inner{height:64px!important;padding:0 16px!important;gap:0!important;justify-content:space-between!important;}
  .rq-logo{min-width:0!important;gap:0!important;}
  .rq-logo-text{display:none!important;}
  .rq-logo-frame{width:42px!important;height:42px!important;flex-basis:42px!important;border-radius:8px!important;}
  .rq-logo-img{height:32px!important;}
  .rq-desktop-nav,.rq-lang{display:none!important;}

  .rq-menu-toggle{
    display:flex!important;align-items:center!important;justify-content:center!important;flex-direction:column!important;gap:5px!important;
    width:42px!important;height:42px!important;background:#fff!important;border:1px solid rgba(19,43,43,.18)!important;border-radius:8px!important;
    cursor:pointer!important;padding:0!important;margin:0!important;position:relative!important;z-index:100001!important;
  }
  .rq-menu-toggle span{display:block!important;width:20px!important;height:2px!important;background:var(--rq-ink)!important;border-radius:999px!important;transition:transform .2s ease,opacity .16s ease!important;}
  .rq-menu-toggle.active span:nth-child(1){transform:translateY(7px) rotate(45deg)!important;}
  .rq-menu-toggle.active span:nth-child(2){opacity:0!important;}
  .rq-menu-toggle.active span:nth-child(3){transform:translateY(-7px) rotate(-45deg)!important;}

  .rq-mobile-menu{
    display:none!important;
    position:fixed!important;top:64px!important;left:0!important;right:0!important;bottom:auto!important;
    width:100%!important;max-height:calc(100vh - 64px)!important;overflow-y:auto!important;
    z-index:100000!important;background:#fff!important;border-top:1px solid rgba(19,43,43,.08)!important;border-bottom:1px solid rgba(19,43,43,.10)!important;
    box-shadow:0 18px 40px rgba(0,0,0,.14)!important;border-radius:0!important;opacity:1!important;visibility:visible!important;pointer-events:auto!important;transform:none!important;
  }
  .rq-mobile-menu.open{display:block!important;}

  .rq-mobile-menu-head{display:none!important;}
  .rq-menu-close{display:none!important;}

  .rq-mobile-lang{
    display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;
    padding:12px 18px!important;border-bottom:1px solid rgba(19,43,43,.08)!important;color:var(--rq-muted)!important;font-weight:800!important;font-size:.82rem!important;
  }
  .rq-mobile-lang>div{display:flex!important;gap:4px!important;background:#f5f7f7!important;border:1px solid rgba(19,43,43,.10)!important;border-radius:999px!important;padding:4px!important;direction:ltr!important;}

  .rq-mobile-nav{display:flex!important;flex-direction:column!important;padding:6px 0!important;gap:0!important;}
  .rq-mobile-link,.rq-mobile-cta{
    display:flex!important;align-items:center!important;gap:12px!important;min-height:52px!important;width:100%!important;
    padding:0 20px!important;text-decoration:none!important;color:var(--rq-ink)!important;background:#fff!important;border:0!important;border-bottom:1px solid rgba(19,43,43,.075)!important;
    border-radius:0!important;box-shadow:none!important;font-size:.96rem!important;font-weight:800!important;
  }
  html[dir="rtl"] .rq-mobile-link,html[dir="rtl"] .rq-mobile-cta{flex-direction:row-reverse!important;text-align:right!important;}
  html[dir="ltr"] .rq-mobile-link,html[dir="ltr"] .rq-mobile-cta{flex-direction:row!important;text-align:left!important;}
  .rq-mobile-link i,.rq-mobile-cta i{width:28px!important;height:28px!important;display:flex!important;align-items:center!important;justify-content:center!important;color:var(--rq-gold-dark)!important;background:rgba(201,168,76,.12)!important;border-radius:8px!important;flex-shrink:0!important;}
  .rq-mobile-link:hover,.rq-mobile-link.active{background:#f8f4e8!important;color:var(--rq-teal)!important;}
  .rq-mobile-cta{justify-content:center!important;background:linear-gradient(135deg,var(--rq-gold),var(--rq-gold-dark))!important;color:#132b2b!important;margin:12px 18px!important;width:calc(100% - 36px)!important;border-radius:8px!important;border-bottom:0!important;}
  .rq-mobile-cta i{background:rgba(255,255,255,.20)!important;color:#132b2b!important;}

  .rq-mobile-contact{display:flex!important;gap:10px!important;padding:12px 18px 16px!important;background:#f7f9f9!important;}
  .rq-mobile-contact a{flex:1!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:8px!important;min-height:42px!important;text-decoration:none!important;color:var(--rq-ink)!important;background:#fff!important;border:1px solid rgba(19,43,43,.10)!important;border-radius:8px!important;font-size:.78rem!important;font-weight:800!important;direction:ltr!important;}
  .rq-mobile-contact i{color:var(--rq-gold-dark)!important;}
}

/* ============================================================
   RQ LAW v61 — DESKTOP UNDERLINE POSITION FIX
   Keep menu underline directly under the text, not at header bottom.
   ============================================================ */
@media (min-width:881px){
  .rq-desktop-nav .rq-nav-link{
    height:42px!important;
    min-height:42px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    padding:0 0 8px 0!important;
    line-height:1!important;
  }
  .rq-desktop-nav .rq-nav-link::after{
    bottom:0!important;
    height:2px!important;
  }
  .rq-desktop-nav .rq-nav-link:hover::after,
  .rq-desktop-nav .rq-nav-link.active::after{
    opacity:1!important;
    transform:scaleX(1)!important;
  }
}

/* ==========================================================
   RQ LAW v66 — Custom Splash / Preloader
   Different from old WHB plain teal loader
   ========================================================== */
.preloader{
  position:fixed!important;
  inset:0!important;
  z-index:999999!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  overflow:hidden!important;
  background:
    radial-gradient(circle at 50% 42%, rgba(201,168,76,.18) 0 0, transparent 34%),
    radial-gradient(circle at 18% 18%, rgba(255,255,255,.18), transparent 28%),
    linear-gradient(135deg,#061f1f 0%,#0b3f3f 44%,#f7f3e8 44.2%,#fbfaf6 100%)!important;
  transition:opacity .45s ease, visibility .45s ease!important;
}
.preloader::before{
  content:''!important;
  position:absolute!important;
  inset:22px!important;
  border:1px solid rgba(201,168,76,.22)!important;
  border-radius:28px!important;
  pointer-events:none!important;
}
.preloader::after{
  content:'ركائز القسط للمحاماة والاستشارات القانونية'!important;
  position:absolute!important;
  bottom:clamp(34px,6vh,70px)!important;
  left:50%!important;
  transform:translateX(-50%)!important;
  width:min(86vw,560px)!important;
  text-align:center!important;
  color:#123f3f!important;
  font-family:'Cairo',sans-serif!important;
  font-weight:900!important;
  font-size:clamp(1rem,2.4vw,1.45rem)!important;
  letter-spacing:-.3px!important;
}
.preloader.fade-out{
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
}
.preloader-spinner{
  width:148px!important;
  height:148px!important;
  position:relative!important;
  border-radius:34px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  background:rgba(255,255,255,.88)!important;
  border:1px solid rgba(201,168,76,.35)!important;
  box-shadow:0 28px 80px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.9)!important;
  backdrop-filter:blur(16px)!important;
  -webkit-backdrop-filter:blur(16px)!important;
}
.spinner-inner{
  width:112px!important;
  height:112px!important;
  border:0!important;
  border-radius:28px!important;
  background:url('../img/rq-logo.webp') center/76px auto no-repeat!important;
  animation:rqSplashFloat 1.65s ease-in-out infinite!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  position:relative!important;
}
.spinner-inner::after{
  content:''!important;
  position:absolute!important;
  inset:-14px!important;
  border-radius:36px!important;
  border:3px solid rgba(201,168,76,.20)!important;
  border-top-color:#c9a84c!important;
  border-right-color:#0f5c5c!important;
  animation:rqSplashSpin 1.15s linear infinite!important;
}
.spinner-inner i{display:none!important;}
@keyframes rqSplashSpin{to{transform:rotate(360deg)}}
@keyframes rqSplashFloat{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-5px) scale(1.025)}}
@media(max-width:600px){
  .preloader{background:linear-gradient(160deg,#062323 0%,#0f5c5c 58%,#f7f3e8 58.3%,#fff 100%)!important;}
  .preloader::before{inset:12px!important;border-radius:22px!important;}
  .preloader-spinner{width:122px!important;height:122px!important;border-radius:28px!important;}
  .spinner-inner{width:92px!important;height:92px!important;background-size:64px auto!important;border-radius:24px!important;}
  .preloader::after{bottom:34px!important;font-size:.95rem!important;line-height:1.8!important;}
}
