.floating-contact { position: fixed; z-index: 1035; bottom: max(22px, env(safe-area-inset-bottom)); left: max(20px, env(safe-area-inset-left)); display: flex; flex-direction: column; gap: 10px; }
.floating-contact-button { position: relative; width: 46px; height: 46px; display: grid; place-items: center; border: 1px solid #ffffff66; border-radius: 50%; color: #fff; box-shadow: 0 5px 16px #142c4233; transition: transform .2s, box-shadow .2s; }
.floating-call { background: #244c6d; }
.floating-call svg { transform-origin: 50% 50%; }
@media (prefers-reduced-motion: no-preference) {
  .floating-call svg { animation: phoneRing 3.5s ease-in-out infinite; }
  .floating-call::before,
  .floating-call::after {
    content: '';
    position: absolute;
    inset: -2px;
    border: 1px solid #244c6d80;
    border-radius: 50%;
    pointer-events: none;
    opacity: 0;
    animation: phoneRingWave 3.5s ease-out infinite;
  }
  .floating-call::after { animation-delay: .35s; }
}
@keyframes phoneRing {
  0%, 30%, 100% { transform: rotate(0); }
  4%, 12%, 20% { transform: rotate(-16deg); }
  8%, 16%, 24% { transform: rotate(16deg); }
  28% { transform: rotate(-6deg); }
}
@keyframes phoneRingWave {
  0% { opacity: .65; transform: scale(1); }
  40%, 100% { opacity: 0; transform: scale(1.65); }
}
.floating-whatsapp { background: #168746; }
.floating-enquiry { background: var(--red); }
.floating-contact-button svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.floating-contact-label { position: absolute; left: calc(100% + 10px); top: 50%; transform: translate(5px, -50%); padding: 7px 11px; border-radius: 5px; background: #142c42; color: #fff; font: 600 10px var(--brand-font); white-space: nowrap; opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .2s, transform .2s; }
.floating-contact-button:hover,.floating-contact-button:focus-visible { transform: translateY(-2px); box-shadow: 0 8px 20px #142c4244; }
.floating-contact-button:hover .floating-contact-label,.floating-contact-button:focus-visible .floating-contact-label { opacity: 1; visibility: visible; transform: translate(0, -50%); }
@media (prefers-reduced-motion: no-preference) { .floating-contact { animation: contactEntrance .6s ease-out both; } .floating-enquiry::after { content: ''; position: absolute; inset: -1px; border: 1px solid #d8243666; border-radius: 50%; animation: contactPulse 3.5s ease-out infinite; pointer-events: none; } }
@keyframes contactEntrance { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: translateY(0); } }
@keyframes contactPulse { 0%, 55% { opacity: 0; transform: scale(1); } 60% { opacity: .7; transform: scale(1); } 100% { opacity: 0; transform: scale(1.5); } }
@media (max-width: 767px) { .floating-contact { left: max(12px, env(safe-area-inset-left)); bottom: max(14px, env(safe-area-inset-bottom)); gap: 8px; } .floating-contact-button { width: 42px; height: 42px; } .floating-contact-button svg { width: 20px; height: 20px; } }