/* The home page's phone top bar on every other page of almithaq.co (her ask 25 Oct 2026). Loaded with
   media="screen and (max-width:700px)", so computers never use it. Markup: lib/phonebar.js; behaviour: /js/mq-phonebar.js.
   Same look as home.css v115 "1 Hairline": gold roof + wordmark, language word, two-line menu, one fine gold line;
   the full-screen menu holds the section links, call and WhatsApp (gold-bordered buttons), Talk to us and the language.
   Every page has its own styles for a, button, header, nav, span..., so the kit first resets its own elements. */
#mqpb,#mqpbm{display:none}
@media (max-width:700px){
:root{--mqpb-h:calc(64px + env(safe-area-inset-top,0px));--mqpb-gold:#C9A24B;--mqpb-gold2:#E3C97C;--mqpb-ink:#F3EFE6;--mqpb-mute:#A49F95;
  --mqpb-page:#0B0B0D;--mqpb-solid:rgba(11,11,13,.86);--mqpb-line:rgba(227,201,124,.42);--mqpb-row:rgba(201,162,75,.06);--mqpb-ease:cubic-bezier(.16,1,.3,1);
  --mqpb-sans:'Jost',Inter,system-ui,-apple-system,'Segoe UI',sans-serif;--mqpb-display:'Marcellus','Cormorant Garamond',Georgia,serif;
  --mqpb-ar:'Readex Pro','Tajawal','Segoe UI',sans-serif}
/* a light page (cream background): the solid bar and the menu take the page's own colour, the words go dark */
html[data-mqpb-tone=light]{--mqpb-menu-ink:#1C1915;--mqpb-menu-mute:#6F675B;--mqpb-row:rgba(201,162,75,.08)}
html[data-mqpb]{scroll-padding-top:calc(var(--mqpb-h) + 8px)}

/* ---- reset: nothing from the page's own css reaches the kit (pictures keep their own drawing) ---- */
#mqpb,#mqpbm,#mqpb :not(svg):not(svg *),#mqpbm :not(svg):not(svg *){all:unset;box-sizing:border-box}
#mqpb svg,#mqpbm svg{display:block;flex:none;overflow:visible}
#mqpb *::before,#mqpb *::after,#mqpbm *::before,#mqpbm *::after,#mqpbm::before,#mqpbm::after,#mqpb::before{content:none!important;display:none!important}

/* ---- the bar ---- */
#mqpb{display:flex;align-items:center;gap:20px;position:fixed;top:0;left:0;right:0;z-index:47;height:var(--mqpb-h);
  padding:env(safe-area-inset-top,0px) 22px 0;background:transparent;color:var(--mqpb-ink);
  font:500 16px/1 var(--mqpb-sans);-webkit-text-size-adjust:100%;text-size-adjust:100%;
  transition:background .35s ease,-webkit-backdrop-filter .35s ease,backdrop-filter .35s ease}
#mqpb::after{content:"";position:absolute;left:22px;right:22px;bottom:0;height:1px;background:var(--mqpb-line);transform:scaleY(.6);transform-origin:bottom;pointer-events:none}
#mqpb.is-solid,html[data-mqpb-solid] #mqpb{background:var(--mqpb-solid);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
html[data-mqpb-tone=light] #mqpb.is-solid,html[data-mqpb-tone=light][data-mqpb-solid] #mqpb{--mqpb-ink:var(--mqpb-menu-ink);--mqpb-line:rgba(176,138,58,.55);background:var(--mqpb-solid-light,rgba(246,241,231,.9))}
#mqpb .mqpb__brand{display:flex;align-items:center;gap:11px;margin-inline-end:auto;cursor:pointer;color:var(--mqpb-ink);-webkit-tap-highlight-color:transparent;min-height:44px}
#mqpb .mqpb__logo{height:15px;width:auto;color:var(--mqpb-gold)}
#mqpb .mqpb__word{font:500 .7rem/1 var(--mqpb-sans);letter-spacing:.38em;color:var(--mqpb-ink);white-space:nowrap}
#mqpb[lang=ar] .mqpb__word{font:700 1.08rem/1 var(--mqpb-ar);letter-spacing:0}
#mqpb[lang=ru] .mqpb__word{letter-spacing:.24em}
#mqpb .mqpb__end{display:flex;align-items:center;gap:22px}
#mqpb .mqpb__langs{display:flex;flex-direction:column;align-items:flex-end;gap:5px;line-height:1}
#mqpb[dir=rtl] .mqpb__langs{align-items:flex-start}
#mqpb .mqpb__lang{display:block;cursor:pointer;padding:6px 0;color:var(--mqpb-ink);font:500 .66rem/1 var(--mqpb-sans);letter-spacing:.24em;text-transform:uppercase;white-space:nowrap;-webkit-tap-highlight-color:transparent}
#mqpb .mqpb__lang[lang=ar]{font:500 .92rem/1 var(--mqpb-ar);letter-spacing:0}
#mqpb .mqpb__lang + .mqpb__lang{padding-top:0}
#mqpb .mqpb__langs:has(.mqpb__lang + .mqpb__lang) .mqpb__lang{font-size:.6rem;letter-spacing:.2em;padding:2px 0}
#mqpb .mqpb__langs:has(.mqpb__lang + .mqpb__lang) .mqpb__lang[lang=ar]{font-size:.82rem;letter-spacing:0}
#mqpb .mqpb__menu{display:grid;justify-items:end;align-content:center;gap:6px;width:34px;height:40px;margin-inline-end:-6px;padding:0 6px;cursor:pointer;-webkit-tap-highlight-color:transparent}
#mqpb[dir=rtl] .mqpb__menu{justify-items:start}
#mqpb .mqpb__menu span{display:block;height:1px;background:var(--mqpb-ink);transition:transform .45s var(--mqpb-ease),width .45s var(--mqpb-ease)}
#mqpb .mqpb__menu span:first-child{width:22px}
#mqpb .mqpb__menu span:last-child{width:14px}
#mqpb :focus-visible{outline:1px solid var(--mqpb-gold);outline-offset:4px}

/* ---- the full-screen menu ---- */
#mqpbm{display:flex;flex-direction:column;justify-content:space-between;position:fixed;top:0;left:0;right:0;bottom:0;z-index:2147483000;
  background:var(--mqpb-page);color:var(--mqpb-ink);overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;
  padding:calc(104px + env(safe-area-inset-top,0px)) 28px calc(36px + env(safe-area-inset-bottom,0px));
  font:400 16px/1.2 var(--mqpb-sans);opacity:0;visibility:hidden;transition:opacity .45s var(--mqpb-ease),visibility 0s linear .45s}
html[data-mqpb-tone=light] #mqpbm{--mqpb-ink:var(--mqpb-menu-ink);--mqpb-mute:var(--mqpb-menu-mute)}
html.mqpb-open #mqpbm{opacity:1;visibility:visible;transition:opacity .45s var(--mqpb-ease)}
html.mqpb-open #mqpb{z-index:2147483001;background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none}
html.mqpb-open[data-mqpb-tone=light] #mqpb{--mqpb-ink:var(--mqpb-menu-ink);--mqpb-line:rgba(176,138,58,.55)}
html.mqpb-open #mqpb .mqpb__langs{visibility:hidden}
html.mqpb-open #mqpb .mqpb__menu span:first-child{width:20px;transform:translateY(3.5px) rotate(45deg)}
html.mqpb-open #mqpb .mqpb__menu span:last-child{width:20px;transform:translateY(-3.5px) rotate(-45deg)}
html.mqpb-open,html.mqpb-open body{overflow:hidden!important}
#mqpbm .mqpbm__links{display:grid}
#mqpbm .mqpbm__link{display:block;cursor:pointer;font:400 1.9rem/1.1 var(--mqpb-display);color:var(--mqpb-ink);padding:15px 0;border-bottom:1px solid rgba(227,201,124,.16);-webkit-tap-highlight-color:transparent}
html[data-mqpb-tone=light] #mqpbm .mqpbm__link{border-bottom-color:rgba(176,138,58,.28)}
#mqpbm[lang=ar] .mqpbm__link{font:700 1.6rem/1.35 var(--mqpb-ar)}
#mqpbm[lang=ru] .mqpbm__link{font:400 1.6rem/1.2 var(--mqpb-sans)}
#mqpbm .mqpbm__contact{display:grid;gap:12px;margin-top:40px}
#mqpbm .mqpbm__row{display:flex;align-items:center;gap:14px;min-height:64px;padding:0 18px 0 12px;border:1px solid rgba(227,201,124,.55);border-radius:16px;color:var(--mqpb-ink);background:var(--mqpb-row);cursor:pointer;-webkit-tap-highlight-color:transparent;transition:background .3s,border-color .3s}
#mqpbm[dir=rtl] .mqpbm__row{padding:0 12px 0 18px}
html[data-mqpb-tone=light] #mqpbm .mqpbm__row{border-color:rgba(176,138,58,.6)}
#mqpbm .mqpbm__row:active{background:rgba(201,162,75,.18);border-color:var(--mqpb-gold2)}
#mqpbm .mqpbm__ic{display:grid;place-items:center;width:40px;height:40px;flex:0 0 40px;border-radius:50%;background:var(--mqpb-gold);color:#141008}
#mqpbm .mqpb__ico{width:19px;height:19px}
#mqpbm .mqpbm__tx{display:grid;gap:6px;flex:1;min-width:0}
#mqpbm .mqpbm__tx small{display:block;font:500 .6rem/1 var(--mqpb-sans);letter-spacing:.24em;text-transform:uppercase;color:var(--mqpb-gold2)}
html[data-mqpb-tone=light] #mqpbm .mqpbm__tx small{color:#9A7630}
#mqpbm[lang=ar] .mqpbm__tx small{font:500 .9rem/1.2 var(--mqpb-ar);letter-spacing:0}
#mqpbm .mqpbm__tx bdi{display:block;font:400 1.02rem/1 var(--mqpb-sans);letter-spacing:.05em;text-align:start;direction:ltr;unicode-bidi:isolate}
#mqpbm[dir=rtl] .mqpbm__tx bdi{text-align:right}
#mqpbm .mqpb__arr{width:18px;height:18px;color:var(--mqpb-gold2)}
html[data-mqpb-tone=light] #mqpbm .mqpb__arr{color:#9A7630}
#mqpbm[dir=rtl] .mqpb__arr{transform:scaleX(-1)}
#mqpbm .mqpbm__cta{display:flex;align-items:center;justify-content:center;width:100%;min-height:54px;margin-top:10px;border-radius:999px;cursor:pointer;
  background:var(--mqpb-gold);color:#141008;font:500 .78rem/1 var(--mqpb-sans);letter-spacing:.2em;text-transform:uppercase;-webkit-tap-highlight-color:transparent}
#mqpbm .mqpbm__cta:active{background:var(--mqpb-gold2)}
#mqpbm[lang=ar] .mqpbm__cta{font:700 1.02rem/1 var(--mqpb-ar);letter-spacing:0}
#mqpbm .mqpbm__lang{display:block;justify-self:center;cursor:pointer;margin-top:6px;padding:6px 10px;font:500 .7rem/1 var(--mqpb-sans);letter-spacing:.24em;text-transform:uppercase;color:var(--mqpb-mute)}
#mqpbm .mqpbm__lang[lang=ar]{font:500 1rem/1 var(--mqpb-ar);letter-spacing:0}
#mqpbm .mqpbm__lang + .mqpbm__lang{margin-top:0}
#mqpbm :focus-visible{outline:1px solid var(--mqpb-gold);outline-offset:4px}

/* ---- the page's own old top bar goes away on phones (each kind of page has its own) ---- */
html[data-mqpb=tpl] #nav.nav,html[data-mqpb=tpl] #menu.menu{display:none!important}
html[data-mqpb=news] body > .bar{display:none!important}
html[data-mqpb=travel] body > header.tb{display:none!important}
html[data-mqpb=yh] body > header.top{display:none!important}
html[data-mqpb=guide] body > header{display:none!important}
html[data-mqpb=privacy] body > .wrap > .top:first-child{display:none!important}
html[data-mqpb=sp] body > .homebtn,html[data-mqpb=sp] body > .brand,html[data-mqpb=sp] body > .nav,html[data-mqpb=sp] body > .back,
html[data-mqpb=sp] body > header.top,html[data-mqpb=sp] body > .bar,html[data-mqpb=sp] body > .langbtn{display:none!important}
/* pages that open with words (no big picture): they start below the bar */
html[data-mqpb-solid] body{padding-top:var(--mqpb-h)!important}
}
@media (max-width:360px){
  #mqpb{padding-left:16px;padding-right:16px;gap:14px}
  #mqpb::after{left:16px;right:16px}
  #mqpb .mqpb__word{letter-spacing:.28em}
  #mqpb .mqpb__end{gap:16px}
}
