/* Site additions loaded on every page from inc/partials/footer.php (kept separate from site.css so updates are 2 small files) */
/* floating WhatsApp chat — bottom-right; back-to-top sits above it */
.wa-float{position:fixed;right:24px;bottom:calc(24px + env(safe-area-inset-bottom,0px));z-index:95;width:60px;height:60px;border-radius:50%;background:#25d366;color:#fff;display:flex;align-items:center;justify-content:center;font-size:34px;box-shadow:0 10px 28px -6px rgba(37,211,102,.6),0 4px 12px rgba(0,0,0,.18);transition:transform .2s ease,box-shadow .2s ease}
.wa-float:hover{transform:scale(1.08);box-shadow:0 14px 34px -6px rgba(37,211,102,.7),0 6px 16px rgba(0,0,0,.2)}
.wa-float::after{content:'';position:absolute;inset:0;border-radius:50%;border:2px solid #25d366;animation:waPulse 2.6s ease-out infinite;pointer-events:none}
@keyframes waPulse{0%{transform:scale(1);opacity:.7}80%,100%{transform:scale(1.55);opacity:0}}
.wa-tip{position:absolute;right:72px;top:50%;transform:translateY(-50%) translateX(6px);background:#0f1b2d;color:#fff;font:600 .85rem var(--font-body);padding:8px 13px;border-radius:9px;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s}
.wa-tip::after{content:'';position:absolute;right:-5px;top:50%;margin-top:-5px;border:5px solid transparent;border-right:0;border-left-color:#0f1b2d}
.wa-float:hover .wa-tip,.wa-float:focus-visible .wa-tip{opacity:1;transform:translateY(-50%)}
.wa-float:focus-visible{outline:3px solid #0f1b2d;outline-offset:3px}
#go-top{bottom:calc(98px + env(safe-area-inset-bottom,0px))!important}
@media(max-width:600px){.wa-float{right:16px;bottom:calc(16px + env(safe-area-inset-bottom,0px));width:56px;height:56px;font-size:31px}.wa-tip{display:none}#go-top{right:21px!important;bottom:calc(84px + env(safe-area-inset-bottom,0px))!important}}
@media(prefers-reduced-motion:reduce){.wa-float::after{animation:none}}

/* phones: no sideways scrolling */
@media(max-width:900px){
  /* slide-in-from-the-side animations start off-screen and widened the page → slide up instead */
  .reveal-left,.reveal-right{transform:translateY(28px)}
  .reveal-left.visible,.reveal-right.visible{transform:none}
  /* safety net: clip any leftover overflow (clip, unlike hidden, keeps sticky headers working) */
  html,body{overflow-x:clip}
}
@media(max-width:420px){
  /* top bar promo fits 360px phones */
  .topbar-inner,.topbar a,.topbar-scan{white-space:normal}
  .topbar-scan{font-size:.72rem;text-align:center;justify-content:center;flex-wrap:wrap;row-gap:2px}
  .topbar-scan .fa-arrow-right{display:none}
  /* full logo name on phones: "MEGASOFT / INTELLECTUAL SOLUTIONS" */
  .nav-logo-text span{display:block;font-size:.52rem;letter-spacing:.08em;margin-top:2px}
}

/* ── mobile menu: service cards + company list + contact buttons ── */
.mobile-menu{display:none;position:fixed;left:0;right:0;bottom:0;top:66px;z-index:99;background:linear-gradient(180deg,#f7f9ff 0%,#fff 55%);border-top:1px solid var(--line);overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:0}
.mobile-menu.open{display:block;animation:mmIn .28s cubic-bezier(.2,.8,.2,1)}
@keyframes mmIn{from{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:none}}
.mm{max-width:560px;margin:0 auto;padding:20px 18px calc(28px + env(safe-area-inset-bottom,0px))}
.mm-label{font-family:var(--font-head);font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#64748b;margin:6px 4px 10px}
.mm-label:not(:first-child){margin-top:22px}
.mm-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.mobile-menu a.mm-card{position:relative;display:flex;flex-direction:column;gap:4px;padding:16px 14px 15px;border-radius:18px;background:#fff;border:1px solid #e3e9f4;box-shadow:0 8px 22px -14px rgba(15,27,45,.35);font-family:var(--font-body);font-size:inherit;color:var(--ink);transition:transform .15s,box-shadow .15s}
.mobile-menu a.mm-card:active{transform:scale(.97)}
.mm-ic{width:44px;height:44px;border-radius:13px;background:var(--bg);color:var(--c);display:flex;align-items:center;justify-content:center;font-size:1.15rem;margin-bottom:8px}
.mm-card b{font-family:var(--font-head);font-size:.98rem;font-weight:700;line-height:1.2;color:var(--ink)}
.mm-card small{font-size:.76rem;color:#64748b;font-weight:600;line-height:1.35}
.mm-badge{position:absolute;top:12px;right:12px;font-style:normal;font-family:var(--font-head);font-size:.6rem;font-weight:800;letter-spacing:.06em;color:#fff;padding:3px 8px;border-radius:20px}
.mm-list{background:#fff;border:1px solid #e3e9f4;border-radius:18px;overflow:hidden}
.mobile-menu .mm-list a{display:flex;align-items:center;gap:14px;padding:15px 16px;font-family:var(--font-head);font-size:1rem;font-weight:600;color:var(--ink)}
.mobile-menu .mm-list a+a{border-top:1px solid #eef2f7}
.mm-list a>i:first-child{width:36px;height:36px;border-radius:11px;background:#eef3fd;color:var(--brand);display:flex;align-items:center;justify-content:center;font-size:.95rem}
.mm-list a span{flex:1}
.mm-go{color:#94a3b8;font-size:.8rem}
.mm-cta{display:grid;grid-template-columns:1.6fr 1fr;gap:10px;margin-top:22px}
.mobile-menu .mm-cta a{display:flex;align-items:center;justify-content:center;gap:9px;padding:15px 12px;border-radius:16px;font-family:var(--font-head);font-size:1rem;font-weight:700}
.mobile-menu .mm-wa{background:#25d366;color:#fff;box-shadow:0 12px 24px -12px rgba(37,211,102,.8)}
.mobile-menu .mm-wa i{font-size:1.35rem}
.mobile-menu .mm-call{background:#fff;color:var(--ink);border:1px solid #d8e0ee}
.mobile-menu .mm-call i{color:var(--brand)}
.mm-foot{text-align:center;font-size:.8rem;color:#64748b;margin-top:16px;word-break:break-all}
.mm-foot i{color:var(--brand);margin-right:5px}
@media(max-width:360px){.mm-card b{font-size:.9rem}.mm-card small{font-size:.72rem}}
@media(prefers-reduced-motion:reduce){.mobile-menu.open{animation:none}}
/* the floating WhatsApp button would sit on top of the open menu → hide it while the menu is open */
body:has(.mobile-menu.open) .wa-float,body:has(.mobile-menu.open) #go-top{display:none}