/* Floating contact buttons and the screenshot lightbox. */
.fab-stack { position: fixed; inset-block-end: 18px; inset-inline-end: 18px; z-index: 55; display: grid; gap: 10px; }
.fab {
    display: grid; place-items: center; width: 52px; height: 52px; color: #fff; border-radius: 50%;
    box-shadow: 0 10px 24px -8px rgba(11, 18, 48, .55);
    transition: transform .18s var(--ease), box-shadow .18s var(--ease);
}
.fab:hover { transform: translateY(-2px) scale(1.04); }
.fab svg { width: 24px; height: 24px; }
.fab--call { background: var(--primary); color: var(--on-primary); }
.fab--whatsapp { background: #1fa855; }
@media (max-width: 640px) { .fab { width: 48px; height: 48px; } .fab-stack { inset-block-end: 14px; inset-inline-end: 14px; } }

.lightbox {
    position: fixed; inset: 0; z-index: 120; display: grid; place-items: center; padding: 20px;
    background: rgba(5, 9, 24, .9); cursor: zoom-out; animation: lightbox-in .18s ease-out;
}
.lightbox img { max-width: 100%; max-height: 100%; width: auto; height: auto; border-radius: 10px; box-shadow: 0 30px 80px rgba(0, 0, 0, .6); background: #fff; }
.lightbox-close {
    position: absolute; top: 14px; inset-inline-end: 16px; width: 44px; height: 44px;
    color: #fff; font-size: 24px; line-height: 1; background: rgba(255, 255, 255, .16);
    border: 0; border-radius: 50%; cursor: pointer;
}
.lightbox-close:hover { background: rgba(255, 255, 255, .28); }
@keyframes lightbox-in { from { opacity: 0; } to { opacity: 1; } }
