/* ==========================================================================
   طيف التطور — الهيكل: الشريط العلوي، الهيدر، الفوتر، الأزرار العائمة
   ========================================================================== */

/* ------------------------------------------------------------------ شريط الإعلان */
.topbar{background:var(--tb,var(--gold-d));color:#fff;text-align:center;font:600 14.5px/1.5 var(--f-head);padding:9px 16px;position:relative;z-index:60}
.topbar a{display:inline-flex;gap:8px;align-items:center}
.topbar a:hover{text-decoration:underline}

/* ------------------------------------------------------------------ الهيدر */
.site-header{position:sticky;top:0;z-index:70;background:rgba(251,247,240,.93);-webkit-backdrop-filter:saturate(1.5) blur(14px);backdrop-filter:saturate(1.5) blur(14px);
  border-bottom:1px solid rgba(184,145,91,.2);transition:box-shadow .3s,background .3s;--hu:min(var(--u),1.08px)}
.site-header.static{position:relative}
.site-header.scrolled{box-shadow:0 10px 30px -18px rgba(60,40,10,.4);background:rgba(251,247,240,.97)}
.hd-in{display:flex;align-items:center;gap:calc(18*var(--hu));min-height:var(--hd-h)}
.brand{display:flex;align-items:center;gap:13px;flex:none;color:var(--ink)}
.brand img{height:var(--logo-h);width:auto;max-width:200px;object-fit:contain}
.brand-t{display:block;line-height:1.15}
.brand-t b{display:block;font:800 calc(24*var(--hu))/1.15 var(--f-head);letter-spacing:-.2px}
.brand-t small{display:block;font:500 calc(11.5*var(--hu))/1.4 var(--f-body);color:var(--muted);margin-top:3px;white-space:nowrap}
.nav{flex:1;display:flex;justify-content:center;min-width:0}
.nav ul{display:flex;gap:4px;list-style:none;margin:0;padding:0}
.nav a{position:relative;display:block;padding:10px calc(11*var(--hu));font:700 calc(14*var(--hu))/1.4 var(--f-head);color:var(--ink);transition:color .2s;white-space:nowrap}
.nav a::after{content:"";position:absolute;inset-inline:calc(11*var(--hu));bottom:2px;height:2px;border-radius:2px;background:var(--gold);transform:scaleX(0);transform-origin:center;transition:transform .28s}
.nav a:hover{color:var(--gold-d)}
.nav a:hover::after,.nav a.on::after{transform:scaleX(1)}
.nav a.on{color:var(--gold-d)}
.nav .nav-cta{display:none}
.hd-act{display:flex;align-items:center;gap:8px;flex:none}
.ic-btn{width:42px;height:42px;display:grid;place-items:center;border:0;background:transparent;color:var(--gold-d);border-radius:50%;transition:background .2s,color .2s;position:relative}
.ic-btn:hover{background:rgba(184,145,91,.14);color:var(--ink)}
.ic-btn .ic{width:22px;height:22px}
.ic-btn .dot{position:absolute;top:6px;inset-inline-end:6px;min-width:17px;height:17px;padding:0 4px;border-radius:9px;background:#C0392B;color:#fff;font:700 10.5px/17px var(--f-head);text-align:center}
.hd-cta{margin-inline-start:8px;padding:calc(10*var(--hu)) calc(22*var(--hu));font-size:calc(14*var(--hu))}
.burger{display:none;width:44px;height:44px;border:0;background:transparent;position:relative;border-radius:12px}
.burger span,.burger::before,.burger::after{content:"";position:absolute;inset-inline:11px;height:2px;background:var(--ink);border-radius:2px;transition:.3s}
.burger::before{top:15px}.burger span{top:21px}.burger::after{top:27px}
.burger[aria-expanded=true]::before{top:21px;transform:rotate(45deg)}
.burger[aria-expanded=true] span{opacity:0}
.burger[aria-expanded=true]::after{top:21px;transform:rotate(-45deg)}

.hd-search{position:absolute;inset-inline:0;top:100%;background:#fff;border-bottom:1px solid var(--line);box-shadow:0 20px 40px -20px rgba(60,40,10,.35);
  padding:18px 0;transform:translateY(-8px);opacity:0;visibility:hidden;transition:.25s}
.hd-search.open{transform:none;opacity:1;visibility:visible}
.hd-search form{display:flex;gap:12px;width:min(760px,calc(100% - 40px));margin-inline:auto}
.hd-search input{flex:1;min-width:0;padding:14px 20px;border:1.5px solid var(--line);border-radius:999px;font-size:17px;background:var(--ivory)}
.hd-search input:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 4px rgba(184,145,91,.15)}

@media (max-width:1240px){.brand-t small{display:none}}
@media (max-width:1100px){
  .hd-in{gap:10px}
  .nav a{padding:10px calc(8*var(--hu));font-size:calc(13.5*var(--hu))}
  .nav a::after{inset-inline:calc(8*var(--hu))}
  .hd-cta{padding-inline:calc(16*var(--hu));margin-inline-start:2px}
  .hd-act{gap:4px}
}
@media (max-width:1060px){
  .nav a{padding:10px calc(6*var(--hu));font-size:calc(13*var(--hu))}
  .nav a::after{inset-inline:calc(6*var(--hu))}
  .brand-t b{font-size:calc(22*var(--hu))}
}
@media (max-width:990px){
  :root{--hd-h:72px}
  /* backdrop-filter على الهيدر يجعله «حاوية» للعناصر ذات position:fixed فتنحصر القائمة الجانبية داخل ارتفاع الهيدر — نلغيه على الجوال */
  .site-header{-webkit-backdrop-filter:none;backdrop-filter:none;background:var(--ivory)}
  body.nav-open .fab{opacity:0;visibility:hidden;pointer-events:none}
  .burger{display:block}
  .hd-cta{display:none}
  .nav{position:fixed;top:0;bottom:0;height:100vh;height:100dvh;inset-inline-start:0;width:min(86vw,360px);background:var(--ivory);z-index:90;flex-direction:column;justify-content:flex-start;
    padding:92px 22px 28px;transform:translateX(calc(100% * var(--ds)));transition:transform .38s cubic-bezier(.2,.7,.2,1);box-shadow:-30px 0 60px -30px rgba(0,0,0,.5);overflow:auto}
  .nav.open{transform:none}
  .nav ul{flex-direction:column;gap:2px}
  .nav a{padding:15px 12px;font-size:18px;border-bottom:1px solid var(--line)}
  .nav a::after{display:none}
  .nav a.on{background:rgba(184,145,91,.1);border-radius:12px;border-bottom-color:transparent}
  .nav .nav-cta{display:block;margin-top:22px}
  .nav .nav-cta .btn{width:100%}
  .nav-scrim{position:fixed;inset:0;background:rgba(10,8,5,.55);z-index:80;opacity:0;visibility:hidden;transition:.3s}
  .nav-scrim.open{opacity:1;visibility:visible}
  .burger{z-index:100;position:relative}
  body.nav-open{overflow:hidden}
  .brand{margin-inline-end:auto}
  .hd-in{justify-content:space-between}
}
@media (min-width:991px){.nav-scrim{display:none}}

/* ------------------------------------------------------------------ الفوتر */
.site-footer{background:var(--dark2);color:rgba(255,255,255,.82);position:relative;margin-top:0;overflow:hidden}
.site-footer::before{content:"";position:absolute;inset-inline:0;top:0;height:1px;background:linear-gradient(90deg,transparent,rgba(214,185,126,.55),transparent)}
.ft-top{padding:calc(22*var(--u)) 0 calc(10*var(--u))}
.ft-grid{display:grid;grid-template-columns:1.3fr 1.15fr .8fr .75fr 1fr;gap:0}
.ft-col{padding:2px calc(18*var(--u));border-inline-start:1px solid rgba(255,255,255,.08)}
.ft-col:first-child{padding-inline-start:0;border-inline-start:0}
.ft-col:last-child{padding-inline-end:0}
.ft-col h4{font:800 calc(14.5*var(--u))/1.4 var(--f-head);color:#fff;margin:0 0 calc(10*var(--u));position:relative;padding-bottom:calc(7*var(--u))}
.ft-col h4::after{content:"";position:absolute;inset-inline-start:0;bottom:0;width:calc(30*var(--u));height:2px;background:var(--gold);border-radius:2px}
.ft-col ul{list-style:none;margin:0;padding:0}
.ft-col li{margin-bottom:calc(3*var(--u));font-size:calc(12.5*var(--u));line-height:1.75}
.ft-col a{transition:color .2s}
.ft-col a:hover{color:var(--gold-l)}
.ft-lines li{display:flex;gap:10px;align-items:flex-start;line-height:1.7}
.ft-lines .ic{color:var(--gold-l);margin-top:calc(4*var(--u));width:calc(14*var(--u));height:calc(14*var(--u))}
.ft-col .btn{margin-top:calc(8*var(--u));padding:calc(9*var(--u)) calc(22*var(--u));font-size:calc(13.5*var(--u))}
.ft-contact li{display:flex;align-items:center;gap:calc(10*var(--u))}
.ft-contact .ico{width:calc(24*var(--u));height:calc(24*var(--u));border-radius:calc(8*var(--u));background:rgba(214,185,126,.14);color:var(--gold-l);display:grid;place-items:center;flex:none}
.ft-contact .ico .ic{width:calc(14*var(--u));height:calc(14*var(--u))}
.ft-contact a{direction:ltr;unicode-bidi:embed;font-size:calc(12.5*var(--u));word-break:break-all}
.ft-social{display:flex;flex-wrap:wrap;gap:calc(7*var(--u));margin-bottom:calc(12*var(--u))}
.ft-social a,.soc a{width:calc(28*var(--u));height:calc(28*var(--u));border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.08);color:#fff;transition:.25s}
.ft-social a:hover{background:var(--gold);transform:translateY(-3px);color:#fff}
.ft-social .ic{width:calc(13*var(--u));height:calc(13*var(--u))}
.ft-brand{display:flex;align-items:center;gap:10px;color:#fff}
.ft-brand img{height:calc(38*var(--u));width:auto}
.ft-brand b{display:block;font:800 calc(19*var(--u))/1.1 var(--f-head)}
.ft-brand small{display:block;font-size:calc(10.5*var(--u));color:rgba(255,255,255,.6);margin-top:3px}
.ft-about{font-size:calc(13*var(--u));color:rgba(255,255,255,.65);margin:calc(12*var(--u)) 0 0;line-height:1.8}
.ft-news{display:flex;gap:8px;margin-top:18px}
.ft-news input{flex:1;min-width:0;padding:11px 14px;border-radius:12px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.07);color:#fff}
.ft-news input::placeholder{color:rgba(255,255,255,.5)}
.ft-bottom{border-top:1px solid rgba(255,255,255,.09);padding:calc(12*var(--u)) 0 calc(14*var(--u));font-size:calc(12.5*var(--u));color:rgba(255,255,255,.66)}
.ft-bottom .container{display:flex;justify-content:space-between;align-items:center;gap:14px 30px;flex-wrap:wrap}
.ft-legal{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.ft-legal a{padding:0 4px}
.ft-legal a:hover{color:var(--gold-l)}
.ft-legal span{opacity:.4}
@media (max-width:900px){
  .ft-grid{grid-template-columns:1fr 1fr 1fr;row-gap:36px}
  .ft-top{padding:46px 0 24px}
  .ft-col{border-inline-start:0;padding:0 12px}
  .ft-col:first-child{padding-inline-start:12px}
  .ft-col h4{font-size:17px}
  .ft-col li,.ft-contact a{font-size:15px}
  .ft-bottom{font-size:14px}
}
@media (max-width:700px){
  .ft-grid{grid-template-columns:1fr 1fr;gap:34px 18px}
  .ft-top{padding:46px 0 24px}
  .ft-col:first-child,.ft-col:last-child{grid-column:1/-1}
  .ft-col{padding:0}
  .ft-bottom .container{justify-content:center;text-align:center}
  .ft-contact a{word-break:normal;overflow-wrap:anywhere}
}
@media (max-width:520px){
  .ft-grid{grid-template-columns:1fr}
  .ft-col:nth-child(2){grid-column:1/-1}
}

/* ------------------------------------------------------------------ الأزرار العائمة */
.fab{position:fixed;z-index:75;bottom:calc(22px + env(safe-area-inset-bottom))}
.fab-wa{left:22px;display:flex;align-items:center;gap:12px;direction:ltr}
.fab-wa.right{left:auto;right:22px;flex-direction:row-reverse}
.fab-wa .wa-btn{width:var(--wa-size);height:var(--wa-size);border-radius:50%;background:var(--wa);color:#fff;display:grid;place-items:center;
  box-shadow:0 12px 28px -6px rgba(37,211,102,.65),0 4px 10px rgba(0,0,0,.18);position:relative;transition:transform .25s;flex:none}
.fab-wa .wa-btn:hover{transform:scale(1.08)}
.fab-wa .wa-btn .ic{width:54%;height:54%}
.fab-wa.pulse .wa-btn::before,.fab-wa.pulse .wa-btn::after{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid var(--wa);animation:wapulse 2.4s infinite;opacity:0}
.fab-wa.pulse .wa-btn::after{animation-delay:1.2s}
@keyframes wapulse{0%{transform:scale(1);opacity:.7}100%{transform:scale(1.75);opacity:0}}
.fab-bubble{background:#fff;color:var(--ink);padding:9px 16px;border-radius:14px;font:700 14px/1.4 var(--f-head);box-shadow:var(--shadow);white-space:nowrap;position:relative;animation:bubbleIn .5s .8s both;direction:rtl}
[dir=ltr] .fab-bubble{direction:ltr}
.fab-bubble::after{content:"";position:absolute;top:50%;width:10px;height:10px;background:#fff;transform:translateY(-50%) rotate(45deg);left:-4px}
.fab-wa.right .fab-bubble::after{left:auto;right:-4px}
@keyframes bubbleIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.fab-call{right:22px;bottom:calc(92px + env(safe-area-inset-bottom));width:52px;height:52px;border-radius:50%;background:var(--grad-gold);color:#fff;display:none;place-items:center;box-shadow:0 12px 24px -8px rgba(148,112,63,.8)}
.fab-call .ic{width:24px;height:24px}
.fab-top{right:22px;width:46px;height:46px;border-radius:50%;border:1px solid rgba(184,145,91,.45);background:rgba(255,255,255,.96);color:var(--gold-d);display:grid;place-items:center;box-shadow:var(--shadow-sm);
  opacity:0;visibility:hidden;transform:translateY(10px);transition:.3s}
.fab-top.show{opacity:1;visibility:visible;transform:none}
.fab-top:hover{background:var(--gold);color:#fff}
.fab-top .ic{width:20px;height:20px}
body.wa-right .fab-call,body.wa-right .fab-top{right:auto;left:22px}
@media (max-width:820px){
  .fab-call{display:grid}
  .has-callfab .fab-top{bottom:calc(156px + env(safe-area-inset-bottom))}
  .fab-bubble{display:none}
  .fab-wa{bottom:calc(18px + env(safe-area-inset-bottom))}
}

/* ------------------------------------------------------------------ إشعار الكوكيز */
.cookie{position:fixed;inset-inline:18px;bottom:18px;z-index:90;max-width:640px;margin-inline:auto;background:var(--dark);color:#fff;border-radius:18px;padding:16px 20px;display:flex;gap:18px;align-items:center;box-shadow:var(--shadow-lg);transform:translateY(150%);transition:transform .5s}
.cookie.show{transform:none}
.cookie p{margin:0;font-size:14.5px;flex:1;line-height:1.7}

/* ------------------------------------------------------------------ شريط المدير */
.adminbar{position:fixed;z-index:99;bottom:22px;left:50%;transform:translateX(-50%);display:flex;gap:2px;background:rgba(20,25,28,.95);color:#fff;border-radius:999px;padding:5px;box-shadow:var(--shadow-lg);font:600 13px var(--f-head);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);direction:rtl}
.adminbar a,.adminbar button{display:flex;align-items:center;gap:7px;padding:9px 15px;border-radius:999px;border:0;background:transparent;color:#fff;font:inherit;white-space:nowrap;cursor:pointer}
.adminbar a:hover,.adminbar button:hover{background:rgba(255,255,255,.14)}
.adminbar .on{background:var(--grad-gold)}
.adminbar .ic{width:17px;height:17px}
@media (max-width:820px){.adminbar{bottom:calc(88px + env(safe-area-inset-bottom));left:auto;right:12px;transform:none;flex-direction:column;border-radius:20px}.adminbar a span,.adminbar button span{display:none}.adminbar a,.adminbar button{padding:11px}}

/* ------------------------------------------------------------------ بنر الصفحات الداخلية */
.pg-banner{--bn-ar:3.1;position:relative;margin:calc(14*var(--u)) auto 0;width:min(var(--container),calc(100% - var(--gut)));aspect-ratio:var(--bn-ar);border-radius:calc(14*var(--u));overflow:hidden;display:flex;align-items:center;color:#fff;isolation:isolate;box-shadow:var(--shadow)}
.pg-banner>img,.pg-banner>.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.pg-banner::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(270deg,rgba(20,14,8,.58) 0%,rgba(20,14,8,.34) 52%,rgba(20,14,8,.1) 100%)}
[dir=ltr] .pg-banner::before{background:linear-gradient(90deg,rgba(20,14,8,.58) 0%,rgba(20,14,8,.34) 52%,rgba(20,14,8,.1) 100%)}
.pg-banner.center{justify-content:center;text-align:center}
.pg-banner.center::before{background:radial-gradient(ellipse at center,rgba(20,14,8,.4),rgba(20,14,8,.2) 70%,rgba(20,14,8,.32))}
.pg-banner .in{padding:calc(30*var(--u)) calc(50*var(--u));width:100%;max-width:calc(760*var(--u))}
.pg-banner.center .in{max-width:calc(700*var(--u))}
.pg-banner h1{color:#fff;font-size:calc(46*var(--u));line-height:1.3;margin:0 0 calc(10*var(--u));font-weight:800;text-shadow:0 2px 18px rgba(0,0,0,.4)}
.pg-banner p{margin:0;font:600 calc(23*var(--u))/1.6 var(--f-head);color:rgba(255,255,255,.95);text-shadow:0 1px 10px rgba(0,0,0,.45)}
.pg-banner .crumbs{color:rgba(255,255,255,.82);margin-bottom:calc(10*var(--u));font-size:calc(14*var(--u))}
.pg-banner .crumbs a:hover{color:var(--gold-l)}
/* مقاسات البنرات كما في التصميم */
.pg-banner.bn-about{--bn-ar:2.37}
.pg-banner.bn-about h1{font-size:calc(54*var(--u))}
.pg-banner.bn-services{--bn-ar:3.77}
.pg-banner.bn-services h1{font-size:calc(48*var(--u))}
.pg-banner.bn-lounge{--bn-ar:1.56;align-items:flex-start}
.pg-banner.bn-lounge .in{padding-top:calc(40*var(--u))}
.pg-banner.bn-lounge h1{font-size:calc(46*var(--u))}
@media (max-width:900px){
  .pg-banner,.pg-banner.bn-about,.pg-banner.bn-services,.pg-banner.bn-lounge{aspect-ratio:auto;min-height:calc(190*var(--u))}
  .pg-banner.bn-lounge{min-height:calc(300*var(--u))}
  .pg-banner .in{padding:calc(28*var(--u)) calc(26*var(--u))}
  .pg-banner h1,.pg-banner.bn-about h1,.pg-banner.bn-services h1,.pg-banner.bn-lounge h1{font-size:calc(30*var(--u))}
  .pg-banner p{font-size:calc(16*var(--u))}
}
@media (max-width:640px){.pg-banner{margin-top:12px;border-radius:calc(14*var(--u))}}