/* Mobile navigation: a complete, quiet canvas with staggered typography. */
@media (max-width:700px){
 body.menu-overlay-ready header,body.menu-overlay-ready header.scrolled{z-index:80;isolation:isolate;overflow:visible}
 body.menu-overlay-ready header>.brand,body.menu-overlay-ready header>.menu-button,body.menu-overlay-ready header>.language-picker{position:relative;z-index:3}
 body.menu-overlay-ready header>.menu-button{width:44px;height:48px;background:transparent;border:0;border-radius:2px}
 .menu-glyph{position:relative;display:block;width:27px;height:24px;flex:none}
 .menu-glyph i{position:absolute;left:0;top:11px;display:block;width:27px;height:1.6px;background:currentColor;transform-origin:center;transition:transform .5s cubic-bezier(.22,1,.36,1),opacity .2s}
 .menu-glyph i:first-child{transform:translateY(-7px)}
 .menu-glyph i:last-child{transform:translateY(7px)}
 .menu-button[aria-expanded=true] .menu-glyph i:first-child{transform:rotate(45deg)}
 .menu-button[aria-expanded=true] .menu-glyph i:nth-child(2){opacity:0;transform:scaleX(.3)}
 .menu-button[aria-expanded=true] .menu-glyph i:last-child{transform:rotate(-45deg)}
 body.menu-overlay-ready header #nav{display:flex;position:fixed;inset:0;top:0;width:100%;height:100vh;height:100dvh;z-index:1;flex-direction:column;align-items:stretch;justify-content:center;gap:0;padding:112px 7vw max(80px,env(safe-area-inset-bottom));border:0;box-shadow:none;background:#0f1b2e;overflow-y:auto;overscroll-behavior:contain;visibility:hidden;pointer-events:none;clip-path:inset(0 0 100% 0);transition:clip-path .65s cubic-bezier(.76,0,.24,1),visibility 0s .65s;isolation:isolate}
 body.menu-overlay-ready header #nav:before{content:'';position:absolute;inset:76px 0 0;z-index:-1;background:radial-gradient(ellipse at 100% 20%,#c2a36b13,transparent 60%);border-top:1px solid #c2a36b30;pointer-events:none}
 body.menu-overlay-ready header #nav:after{content:'CABINET BOUABBANE';position:absolute;inset-inline-start:7vw;bottom:max(30px,env(safe-area-inset-bottom));font-size:10px;letter-spacing:.18em;color:#c2a36b;opacity:.7;pointer-events:none}
 body.menu-overlay-ready header #nav.open{visibility:visible;pointer-events:auto;clip-path:inset(0);transition:clip-path .7s cubic-bezier(.76,0,.24,1),visibility 0s}
 body.menu-overlay-ready header #nav>a{display:flex;align-items:center;justify-content:space-between;border:0;border-bottom:1px solid #c2a36b35;border-radius:0;background:transparent;color:#f7f5ef;font-size:clamp(28px,8vw,42px);font-weight:400;line-height:1.25;letter-spacing:-.035em;padding:21px 0;min-height:76px;margin:0;opacity:0;transform:translateY(28px);transition:opacity .25s,transform .35s cubic-bezier(.22,1,.36,1),color .25s}
 body.menu-overlay-ready header #nav.open>a{opacity:1;transform:translateY(0);transition:opacity .6s calc(.19s + var(--menu-order,0)*.075s),transform .75s cubic-bezier(.22,1,.36,1) calc(.19s + var(--menu-order,0)*.075s),color .25s}
 body.menu-overlay-ready header #nav>a:hover,body.menu-overlay-ready header #nav>a.active{color:#dfc596}
 body.menu-overlay-ready header #nav>.nav-contact{color:#dfc596}
 body.menu-overlay-ready header #nav .action-icon{height:28px;width:28px;color:#c2a36b}
 body.menu-overlay-ready header #nav .action-icon svg{height:23px;width:23px}
 html.menu-overlay-lock,html.menu-overlay-lock body{overflow:hidden!important;overscroll-behavior:none}
 body.menu-overlay-open .mobile-contact{opacity:0;pointer-events:none}
 html[dir=rtl] body.menu-overlay-ready header #nav>a{font-size:clamp(26px,7vw,36px);letter-spacing:0;line-height:1.5}
}
@media(max-width:700px) and (max-height:560px){body.menu-overlay-ready header #nav{padding-top:86px;padding-bottom:55px}body.menu-overlay-ready header #nav>a{padding:11px 0;min-height:52px;font-size:25px}body.menu-overlay-ready header #nav:after{bottom:18px}}
@media(prefers-reduced-motion:reduce){body.menu-overlay-ready header #nav,body.menu-overlay-ready header #nav>a,.menu-glyph i{transition-duration:.01ms!important;transition-delay:0s!important}}
@media(max-width:700px){html[lang=ar] body.menu-overlay-ready header #nav:after{content:'مكتب بوعبان';letter-spacing:0;font-family:'Noto Sans Arabic',sans-serif}}
@media(max-width:700px){body.menu-overlay-open{padding-top:76px}body.menu-overlay-ready.menu-overlay-open header,body.menu-overlay-ready.menu-overlay-open header.scrolled{position:fixed;inset:0 0 auto;width:100%;height:76px}}
