/* Wali Impex: off-canvas mobile menu (shared) */
.oc{--oc-bg:#1F3A93;--oc-fg:#fff;--oc-mute:rgba(255,255,255,.72);--oc-line:rgba(255,255,255,.16);--oc-btn-bg:#fff;--oc-btn-fg:#1F3A93;--oc-hover:rgba(255,255,255,.08);--oc-font:inherit;--oc-ease:cubic-bezier(.16,1,.3,1)}
.oc[data-theme=dark]{--oc-bg:#000;--oc-fg:#fff;--oc-mute:#A7AEBF;--oc-line:#23262e;--oc-btn-bg:#1F3A93;--oc-btn-fg:#fff;--oc-hover:#101318}
.oc[data-theme=light]{--oc-bg:#fff;--oc-fg:#000;--oc-mute:#4E5A75;--oc-line:#E2E7F2;--oc-btn-bg:#1F3A93;--oc-btn-fg:#fff;--oc-hover:#F1F4FB}

.oc{position:fixed;inset:0;z-index:1000;visibility:hidden;pointer-events:none}
.oc.is-open,.oc.is-closing{visibility:visible}
.oc.is-open{pointer-events:auto}

.oc-backdrop{position:absolute;inset:0;background:rgba(5,10,30,.5);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);opacity:0;transition:opacity .45s ease}
.oc.is-open .oc-backdrop{opacity:1}

.oc-panel{position:absolute;top:0;right:0;bottom:0;width:min(420px,92vw);background:var(--oc-bg);color:var(--oc-fg);
  display:flex;flex-direction:column;overflow:hidden;box-shadow:-30px 0 80px -20px rgba(0,0,0,.45);
  transform:translate3d(104%,0,0);transition:transform .6s var(--oc-ease);will-change:transform;touch-action:pan-y}
.oc.is-open .oc-panel{transform:none}
.oc.is-closing .oc-panel{transition-duration:.38s;transition-timing-function:cubic-bezier(.4,0,1,1)}
.oc.is-dragging .oc-panel{transition:none}

/* watermark: the logo's wave circle, cropped off the corner */
.oc-panel::after{content:"";position:absolute;right:-28%;bottom:-14%;width:78%;aspect-ratio:1;background:var(--oc-mark) center/contain no-repeat;opacity:.09;pointer-events:none}

.oc-head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 22px;border-bottom:1px solid var(--oc-line)}
.oc-brand{display:flex;align-items:center;gap:10px;text-decoration:none}
.oc-brand img.m{width:38px;height:auto}
.oc-brand img.w{height:13px;width:auto}
.oc-close{width:46px;height:46px;border-radius:50%;border:1px solid var(--oc-line);background:transparent;color:var(--oc-fg);display:grid;place-items:center;cursor:pointer;transition:background .25s,transform .5s var(--oc-ease)}
.oc-close:hover{background:var(--oc-hover);transform:rotate(90deg)}
.oc-close svg{width:18px;height:18px}

.oc-body{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:14px 22px 26px;display:flex;flex-direction:column;position:relative;z-index:1}
.oc-nav{list-style:none;margin:0;padding:0}
.oc-nav li{border-bottom:1px solid var(--oc-line)}
.oc-nav a{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px 4px;color:var(--oc-fg);text-decoration:none;
  font-family:var(--oc-font);font-weight:700;font-size:clamp(1.45rem,6vw,1.85rem);line-height:1.15;letter-spacing:-.01em;transition:padding .35s var(--oc-ease),color .2s}
.oc-nav a i{width:9px;height:9px;border-radius:50%;border:2px solid currentColor;opacity:0;transform:scale(.4);transition:opacity .25s,transform .35s var(--oc-ease)}
.oc-nav a:hover,.oc-nav a:focus-visible{padding-left:12px}
.oc-nav a:hover i,.oc-nav a:focus-visible i,.oc-nav a[aria-current=true] i{opacity:1;transform:none}
.oc-nav a[aria-current=true] i{background:currentColor}

.oc-cta{display:flex;align-items:center;justify-content:center;gap:10px;margin:24px 0 0;min-height:54px;border-radius:999px;background:var(--oc-btn-bg);color:var(--oc-btn-fg);font-weight:700;font-size:1rem;text-decoration:none;transition:transform .2s,filter .2s}
.oc-cta:active{transform:scale(.97)}
.oc-cta:hover{filter:brightness(1.06)}

.oc-contact{margin:26px 0 0;display:grid;gap:4px}
.oc-contact a,.oc-contact span{display:flex;align-items:center;gap:14px;min-height:48px;color:var(--oc-fg);text-decoration:none;font-size:.98rem}
.oc-contact a > span:last-child{display:block}
.oc-contact small{display:block;margin-bottom:2px;color:var(--oc-mute);font-size:.8rem;line-height:1.2}
.oc-contact .ic{width:40px;height:40px;flex:none;border-radius:12px;border:1px solid var(--oc-line);display:grid;place-items:center}
.oc-contact .ic svg{width:18px;height:18px}
.oc-social{display:flex;gap:10px;margin-top:auto;padding-top:26px}
.oc-social a{width:46px;height:46px;border-radius:50%;border:1px solid var(--oc-line);display:grid;place-items:center;color:var(--oc-fg)}
.oc-social a:hover{background:var(--oc-hover)}
.oc-social svg{width:18px;height:18px}

/* staggered entrance of the contents */
@media (prefers-reduced-motion:no-preference){
  .oc .oc-stag{opacity:0;transform:translate3d(28px,0,0)}
  .oc.is-open .oc-stag{opacity:1;transform:none;transition:opacity .5s ease calc(.12s + var(--k,0) * 45ms),transform .7s var(--oc-ease) calc(.12s + var(--k,0) * 45ms)}
}
@media (prefers-reduced-motion:reduce){
  .oc-panel,.oc.is-closing .oc-panel{transition:opacity .2s ease !important;transform:none !important;opacity:0}
  .oc.is-open .oc-panel{opacity:1}
  .oc-backdrop{transition-duration:.2s}
}

html.oc-lock,html.oc-lock body{overflow:hidden}