/* Site-wide header menu + footer (all pages).
   Loaded after styles.css / dark-mode.css. The header keeps its fixed LTR
   arrangement (logo left, buttons right) like the rest of the site; the
   menu panel and footer content follow the page language. */

/* ---------- menu button (matches .theme-toggle sizing) ---------- */
.site-menu-btn{
    height:45px;min-width:45px;padding:0 16px;border:none;border-radius:12px;
    background:linear-gradient(135deg,#ff00aa,#913791);color:#fff;
    font-family:inherit;font-weight:700;font-size:14px;line-height:1;cursor:pointer;
    display:flex;align-items:center;justify-content:center;gap:8px;flex-shrink:0;
    transition:0.3s cubic-bezier(0.175,0.885,0.32,1.275);
}
.site-menu-btn:hover{transform:translate(var(--mx,0px),var(--my,0px)) scale(1.06)}
.site-menu-btn:focus-visible{outline:3px solid #ffad27;outline-offset:2px}
.site-menu-btn .smb-bars{position:relative;width:18px;height:12px;display:inline-block}
.site-menu-btn .smb-bars i{position:absolute;left:0;right:0;height:2px;border-radius:2px;background:currentColor;transition:transform .3s,opacity .2s,top .3s}
.site-menu-btn .smb-bars i:nth-child(1){top:0}
.site-menu-btn .smb-bars i:nth-child(2){top:5px}
.site-menu-btn .smb-bars i:nth-child(3){top:10px}
.site-menu-btn[aria-expanded="true"] .smb-bars i:nth-child(1){top:5px;transform:rotate(45deg)}
.site-menu-btn[aria-expanded="true"] .smb-bars i:nth-child(2){opacity:0}
.site-menu-btn[aria-expanded="true"] .smb-bars i:nth-child(3){top:5px;transform:rotate(-45deg)}
@media(max-width:768px){.site-menu-btn{height:38px;min-width:38px;padding:0;width:38px}.site-menu-btn .smb-label{display:none}}
@media(max-width:480px){.site-menu-btn{height:32px;min-width:32px;width:32px;border-radius:9px}.site-menu-btn .smb-bars{width:15px;height:10px}.site-menu-btn .smb-bars i:nth-child(2){top:4px}.site-menu-btn .smb-bars i:nth-child(3){top:8px}.site-menu-btn[aria-expanded="true"] .smb-bars i:nth-child(1),.site-menu-btn[aria-expanded="true"] .smb-bars i:nth-child(3){top:4px}}
@media(max-width:360px){.site-menu-btn{height:28px;min-width:28px;width:28px}}

@media(max-width:400px){nav .nav-icon.email,nav .nav-icon.linkedin{display:none}}

/* ---------- menu panel ---------- */
.site-menu{
    position:absolute;top:100%;right:max(12px,calc((100% - 1200px) / 2));
    width:min(400px,calc(100vw - 24px));max-height:calc(100vh - 110px);overflow:auto;
    margin-top:8px;background:#fff;color:#1f2550;border-radius:18px;
    box-shadow:0 24px 60px -20px rgba(15,19,48,.45);border:1px solid rgba(31,37,80,.08);
    padding:10px;opacity:0;visibility:hidden;transform:translateY(-8px);
    transition:opacity .22s ease,transform .22s ease,visibility 0s linear .22s;z-index:1001;text-align:start
}
.site-menu.open{opacity:1;visibility:visible;transform:none;transition:opacity .22s ease,transform .22s ease}
.site-menu::before{content:"";display:block;height:4px;border-radius:4px;margin:2px 6px 8px;background:linear-gradient(90deg,#85BB33 0 20%,#913791 20% 40%,#E33069 40% 60%,#4FB9C2 60% 80%,#FFAD27 80%)}
.site-menu ul{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.site-menu a{display:flex;align-items:center;gap:14px;padding:11px 12px;border-radius:12px;text-decoration:none;color:inherit;font-weight:600;font-size:15px;transition:background .2s}
.site-menu a:hover,.site-menu a:focus-visible{background:#f2f4fa;outline:none}
.site-menu a[aria-current="page"]{background:#eef6ff;color:#1565c0}
.site-menu a i{flex:0 0 36px;height:36px;border-radius:10px;display:grid;place-items:center;font-size:15px;color:#fff;background:var(--c,#1f2550)}
.site-menu .sm-badge{margin-inline-start:auto;font-size:11px;font-weight:700;padding:3px 8px;border-radius:999px;background:#ff00aa;color:#fff}
.site-menu .sm-sep{height:1px;background:rgba(31,37,80,.08);margin:6px 8px}
html[data-theme="dark"] .site-menu{background:#1e2440;color:#eef0fa;border-color:rgba(255,255,255,.08)}
html[data-theme="dark"] .site-menu a:hover,html[data-theme="dark"] .site-menu a:focus-visible{background:#232a4a}
html[data-theme="dark"] .site-menu a[aria-current="page"]{background:#232a4a;color:#7cc4ff}
html[data-theme="dark"] .site-menu .sm-sep{background:rgba(255,255,255,.08)}
@media (prefers-reduced-motion:reduce){.site-menu,.site-menu-btn,.site-menu-btn .smb-bars i{transition:none}}

/* ---------- footer ---------- */
#site-footer.site-footer{
    position:relative;margin:0;padding:0;text-align:start;
    background:linear-gradient(170deg,#1f2550 0%,#141938 100%);color:rgba(255,255,255,.78);
    font-size:15px;line-height:1.7
}
#site-footer .sf-stripes{height:5px;background:linear-gradient(90deg,#85BB33 0 20%,#913791 20% 40%,#E33069 40% 60%,#4FB9C2 60% 80%,#FFAD27 80%)}
#site-footer .sf-in{max-width:1200px;margin:0 auto;padding:56px 24px 36px;display:grid;grid-template-columns:1.4fr 1fr 1.3fr;gap:48px}
#site-footer h2{position:static;display:block;margin:0 0 16px;font-size:16px;font-weight:700;color:#fff;letter-spacing:.02em}
#site-footer h2::after{content:none}
#site-footer a{color:inherit;text-decoration:none;transition:color .2s}
#site-footer a:hover{color:#fff}
#site-footer a:focus-visible{outline:2px solid #ffad27;outline-offset:3px;border-radius:4px}
#site-footer .sf-logo img{height:52px;width:auto;margin-bottom:14px}
#site-footer .sf-tag{color:#fff;font-weight:600;margin:0 0 8px}
#site-footer .sf-about{margin:0 0 18px;font-size:14px}
#site-footer .sf-social{display:flex;gap:10px}
#site-footer .sf-social a{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:rgba(255,255,255,.08);color:#fff;font-size:17px}
#site-footer .sf-social a:hover{background:#ff00aa}
#site-footer ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
#site-footer .sf-links a{display:inline-flex;align-items:center;gap:10px}
#site-footer .sf-links i{width:16px;text-align:center;color:#4fb9c2;font-size:13px}
#site-footer .sf-contact li{display:flex;gap:12px;align-items:flex-start}
#site-footer .sf-contact i{flex:0 0 34px;height:34px;border-radius:10px;display:grid;place-items:center;background:rgba(255,255,255,.08);color:#ffad27;font-size:14px;margin-top:2px}
#site-footer .sf-contact small{display:block;font-size:12px;color:rgba(255,255,255,.55);line-height:1.3}
#site-footer .sf-contact span[dir="ltr"]{unicode-bidi:isolate}
#site-footer .sf-profile p{margin:0 0 16px;font-size:14px}
#site-footer .sf-btn{display:inline-flex;align-items:center;gap:10px;padding:12px 20px;border-radius:999px;background:linear-gradient(90deg,#ff00aa,#913791);color:#fff;font-weight:700;font-size:14px;margin:0 0 10px;box-shadow:0 12px 26px -12px rgba(255,0,170,.7)}
#site-footer .sf-btn:hover{color:#fff;filter:brightness(1.1)}
#site-footer .sf-btn--ghost{background:transparent;border:1.5px solid rgba(255,255,255,.35);box-shadow:none}
#site-footer .sf-bottom{border-top:1px solid rgba(255,255,255,.08)}
#site-footer .sf-bottom div{max-width:1200px;margin:0 auto;padding:18px 24px;display:flex;flex-wrap:wrap;gap:8px 20px;justify-content:space-between;font-size:13px;color:rgba(255,255,255,.6)}
#site-footer .sf-bottom p{margin:0}
#site-footer .sf-legal a{display:inline-flex;align-items:center;gap:8px;color:rgba(255,255,255,.85);font-weight:600}
#site-footer .sf-legal a:hover{color:#fff;text-decoration:underline;text-underline-offset:4px}
#site-footer .sf-legal i{color:#4fb9c2}
@media(max-width:1000px){#site-footer .sf-in{grid-template-columns:1fr 1fr}#site-footer .sf-brand{grid-column:1/-1}}
@media(max-width:560px){#site-footer .sf-in{grid-template-columns:1fr;gap:30px;padding:44px 20px 28px}}
/* WhatsApp float sits above the footer content on small screens */
@media(max-width:560px){#site-footer .sf-bottom div{padding-bottom:84px}}