/* Arab Connect Tours — reference luxury header */
:root{--ref-gold:#c89418;--ref-gold-dark:#946b12;--ref-gold-light:#f5d76b}
.trust{height:30px;display:flex;align-items:center;background:linear-gradient(90deg,#a86d13 0%,#d59a24 15%,#fff1a0 30%,#dba62b 48%,#fff08c 65%,#c78918 84%,#9d6510 100%);border:0;border-top:1px solid rgba(255,255,255,.55);border-bottom:1px solid rgba(120,75,8,.45);box-shadow:inset 0 1px 0 rgba(255,255,255,.65),inset 0 -1px 0 rgba(70,45,0,.2);font-size:12px;line-height:1}
.trust::after{opacity:.28;animation:trustShine 10s ease-in-out infinite}
.trust .container{height:100%;padding:0;gap:28px;justify-content:center;flex-wrap:nowrap}
.trust span{font-weight:500;color:#16120a;white-space:nowrap;text-shadow:none}
header.nav{position:relative;top:auto;z-index:1000;height:94px;background:#fff;border:0;box-shadow:0 1px 5px rgba(0,0,0,.08);backdrop-filter:none}
header.nav .nav-inner{height:94px;min-height:94px;width:min(1120px,92%);display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:20px;position:relative}
header.nav .nav-inner>a[aria-label="Arab Connect Tours"]{grid-column:2;grid-row:1;justify-self:center;align-self:center;position:relative;width:86px;height:86px;display:flex;align-items:center;justify-content:center;z-index:20;border-radius:50%;background:#fff;padding:3px;box-shadow:0 1px 7px rgba(70,45,0,.16);line-height:0}
header.nav .nav-inner .logo{width:100%;height:100%;object-fit:contain;border-radius:50%;margin:0}
header.nav .nav-inner>.nav-links{grid-column:1;grid-row:1;display:flex;justify-content:flex-start;align-items:center;gap:22px;min-width:0}
header.nav .nav-inner>.nav-links a{font-size:13px;font-weight:500;color:#171717;padding:0;border:0;white-space:nowrap}
header.nav .nav-inner>.nav-links a:hover,header.nav .nav-inner>.nav-links a.active{color:var(--ref-gold-dark);border:0}
header.nav .nav-inner>.nav-right-group{grid-column:3;grid-row:1;display:flex;justify-content:flex-end;align-items:center;gap:20px;min-width:0}
header.nav .nav-inner>.nav-right-group .nav-links{display:flex;flex:0 0 auto;gap:22px;align-items:center}
header.nav .nav-inner>.nav-right-group .nav-links a{font-size:13px;font-weight:500;color:#171717;padding:0;border:0;white-space:nowrap}
header.nav .nav-inner>.nav-right-group .nav-links a:hover,header.nav .nav-inner>.nav-right-group .nav-links a.active{color:var(--ref-gold-dark);border:0}
header.nav .nav-inner>.nav-right-group .nav-links a.active{position:relative}
header.nav .nav-inner>.nav-right-group .nav-links a.active::after{content:"";position:absolute;left:0;right:0;bottom:-13px;height:2px;background:var(--ref-gold)}
.nav-actions{gap:15px}
.nav-actions .btn-gold-outline{width:36px;height:32px;padding:0;border:1px solid var(--ref-gold);border-radius:5px;background:#fff;color:var(--ref-gold-dark);font-size:17px}
.nav-actions .lang{font-size:13px;color:var(--ref-gold-dark);font-weight:600}
.menu-btn{display:none}
.hero{margin-top:0;min-height:590px}
.slides{height:590px}
.slide-content{padding-top:25px}
.slider-ui{bottom:22px;width:min(1120px,92%)}
.slider-ui>div:first-child{display:flex;align-items:center;gap:16px}
.slider-ui strong{display:none}
.dot{width:9px;height:9px}
.slider-arrows button{width:44px;height:44px;background:rgba(92,62,9,.24);border-color:rgba(255,225,128,.9);font-size:25px}
@media (max-width:1150px){
 header.nav .nav-inner>.nav-links{gap:15px}
 header.nav .nav-inner>.nav-right-group{gap:12px}
 header.nav .nav-inner>.nav-right-group .nav-links{gap:14px}
}
@media (max-width:900px){
 header.nav{height:78px}
 header.nav .nav-inner{height:78px;min-height:78px;gap:0}
 header.nav .nav-inner>.nav-links,header.nav .nav-inner>.nav-right-group .nav-links{display:none}
 header.nav .nav-inner>.nav-right-group{grid-column:3}
 header.nav .nav-inner>.nav-right-group .nav-actions{display:flex}
 header.nav .nav-inner>a[aria-label="Arab Connect Tours"]{width:66px;height:66px}
 .menu-btn{display:inline-flex!important}
}
@media (max-width:640px){
 .trust{height:auto;min-height:28px}
 .trust .container{gap:8px 14px;padding:6px 8px;justify-content:center;flex-wrap:wrap}
 .trust span{font-size:10px}
 .trust span:nth-child(n+3){display:none}
 header.nav .nav-inner{width:94%}
 .hero,.slides{height:560px;min-height:560px}
}

/* Final runtime fix: keep the hero slides positioned inside the slider frame. */
.hero{position:relative;overflow:hidden;background:#111}
.slides{position:relative;width:100%;height:100%;overflow:hidden}
.slide{inset:0;width:100%;height:100%;background-repeat:no-repeat;background-size:cover;background-position:center center}

/* FINAL FIX — stable centered logo + six-slide hero (header sizing at end of file) */
.hero,.slides{position:relative!important;overflow:hidden!important}
.hero .slide{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;display:flex!important;opacity:0!important;visibility:hidden!important;pointer-events:none!important;z-index:0!important;background-repeat:no-repeat!important;background-size:cover!important;background-position:center center!important;transition:opacity .6s ease,visibility 0s linear .6s!important}
.hero .slide.active{opacity:1!important;visibility:visible!important;pointer-events:auto!important;z-index:2!important;transition:opacity .6s ease,visibility 0s linear 0s!important}
.hero .slide-content{width:100%!important}
/* Logo centred inside the navigation bar — single source of truth for header sizing */
header.nav{height:94px!important}
header.nav .nav-inner{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto minmax(0,1fr)!important;
  align-items:center!important;
  height:94px!important;
  min-height:94px!important;
  gap:14px!important;
  position:relative!important;
}
header.nav .nav-inner>a[aria-label="Arab Connect Tours"]{
  position:relative!important;
  grid-column:2!important;
  grid-row:1!important;
  justify-self:center!important;
  align-self:center!important;
  width:86px!important;
  height:86px!important;
  margin:0!important;
  padding:3px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  border-radius:50%!important;
  background:#fff!important;
  box-shadow:0 1px 7px rgba(70,45,0,.16)!important;
  line-height:0!important;
  z-index:60!important;
}
header.nav .nav-inner .logo{
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  border-radius:50%!important;
  margin:0!important;
}
header.nav .nav-left{grid-column:1!important;grid-row:1!important;justify-content:flex-start!important}
header.nav .nav-right-group{grid-column:3!important;grid-row:1!important;justify-content:flex-end!important}
header.nav .nav-right{padding:0!important}
header.nav .nav-links a{font-size:13px!important;padding:6px 0!important}
header.nav .nav-actions{gap:9px!important}
header.nav .nav-actions .desktop-cta{padding:13px 14px!important;font-size:.82rem!important}
@media(max-width:1240px) and (min-width:992px){
  header.nav .nav-inner{gap:14px!important}
  header.nav .nav-inner>a[aria-label="Arab Connect Tours"]{width:78px!important;height:78px!important}
  header.nav .nav-left,header.nav .nav-right-group{gap:12px!important}
  header.nav .nav-right{gap:14px!important}
  header.nav .nav-links a{font-size:.72rem!important}
}
@media(max-width:991px){
  header.nav{height:78px!important}
  header.nav .nav-inner{height:78px!important;min-height:78px!important;gap:0!important}
  header.nav .nav-inner>a[aria-label="Arab Connect Tours"]{width:66px!important;height:66px!important}
  header.nav .nav-right-group{gap:10px!important}
}
@media(max-width:600px){
  header.nav{height:70px!important}
  header.nav .nav-inner{height:70px!important;min-height:70px!important}
  header.nav .nav-inner>a[aria-label="Arab Connect Tours"]{width:58px!important;height:58px!important}
}

/* MOBILE WEB VIEW — preserve the desktop/reference header + homepage hero composition */
@media (max-width:600px){
  /* Keep the gold trust strip in the same single-line web composition. */
  .trust{
    width:138.8889%;
    margin-left:0;
    zoom:.72;
    height:30px!important;
    min-height:30px!important;
  }
  .trust .container{
    width:min(1120px,92%);
    padding:0!important;
    gap:28px!important;
    flex-wrap:nowrap!important;
    justify-content:center!important;
  }
  .trust span{font-size:12px!important;display:inline!important}

  /* Preserve the desktop header: centered logo, left/right navigation and search/language. */
  header.nav{
    width:138.8889%;
    margin-left:0;
    zoom:.72;
    height:94px!important;
  }
  header.nav .nav-inner{
    width:min(1120px,92%)!important;
    height:94px!important;
    min-height:94px!important;
    grid-template-columns:minmax(0,1fr) auto minmax(0,1fr)!important;
    gap:14px!important;
  }
  header.nav .nav-inner>a[aria-label="Arab Connect Tours"]{
    width:86px!important;
    height:86px!important;
  }
  header.nav .nav-inner>.nav-links,
  header.nav .nav-inner>.nav-right-group .nav-links{
    display:flex!important;
  }
  header.nav .nav-inner>.nav-links{gap:22px!important}
  header.nav .nav-inner>.nav-right-group{gap:20px!important}
  header.nav .nav-inner>.nav-right-group .nav-links{gap:22px!important}
  header.nav .nav-links a,
  header.nav .nav-right-group .nav-links a{font-size:13px!important;white-space:nowrap!important}
  header.nav .nav-actions{display:flex!important;gap:15px!important}
  header.nav .menu-btn{display:none!important}

  /* Keep the homepage hero in the same web/desktop composition rather than
     switching to the compact mobile hero layout. */
  .hero{
    width:138.8889%;
    margin-left:0;
    zoom:.72;
    min-height:590px!important;
    height:590px!important;
  }
  .hero .slides{height:590px!important}
  .hero .slide{background-image:var(--hero-bg-mobile)!important;background-size:cover!important;background-position:center center!important}
  .hero .slide-content{padding-top:25px!important}
  .slider-ui{width:min(1120px,92%)!important;bottom:22px!important}
  .slider-arrows button{width:44px!important;height:44px!important}
}
