/* ── Sticky Social Menu ── */
:root {
--clr-primary: #0081c3;
--clr-primary-dark: #006aa0;
}
.sticky-social {
position: fixed;
right: 0;
top: 50%;
transform: translateY(-50%);
z-index: 900;
display: none;
flex-direction: column;
gap: 4px;
@media (min-width: 768px) {
display: flex;
}
}
.ssi-link {
display: flex;
align-items: center;
justify-content: center;
width: 44px;
height: 44px;
background: var(--clr-primary);
border-radius: 8px 0 0 8px;
text-decoration: none;
transition: background 0.2s ease, transform 0.2s ease;
&:hover {
background: var(--clr-primary-dark);
transform: translateX(-4px);
}
}
.ssi-icon {
display: block;
width: 22px;
height: 22px;
background-color: #fff;
mask-repeat: no-repeat;
mask-position: center;
mask-size: contain;
flex-shrink: 0;
}
/* WhatsApp */
.ssi-link[data-icon="whatsapp"] .ssi-icon {
mask-image: url("data:image/svg+xml,");
}
/* Instagram */
.ssi-link[data-icon="instagram"] .ssi-icon {
mask-image: url("data:image/svg+xml,");
}
/* Contact */
.ssi-link[data-icon="contact"] .ssi-icon {
mask-image: url("data:image/svg+xml,");
}