/* CRANIMAX-roter pulsierender Punkt auf der Karte */

.cranimax-pin {
    width: 14px;
    height: 14px;
    background: transparent;
    border: none;
    position: relative;
}

.cranimax-pin__dot {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 12px;
    height: 12px;
    margin-left: -6px;
    margin-top: -6px;
    border-radius: 50%;
    background-color: #eb3e4a;
    box-shadow: 0 0 0 2px #ffffff, 0 2px 5px rgba(0, 0, 0, 0.45);
    z-index: 3;
}

.cranimax-pin__pulse,
.cranimax-pin__pulse::before,
.cranimax-pin__pulse::after {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 12px;
    height: 12px;
    margin-left: -6px;
    margin-top: -6px;
    border-radius: 50%;
    background-color: #eb3e4a;
    pointer-events: none;
}

.cranimax-pin__pulse {
    opacity: 0.85;
    animation: cranimax-pin-pulse 1.6s ease-out infinite;
    z-index: 1;
}

.cranimax-pin__pulse::before {
    content: '';
    opacity: 0.7;
    animation: cranimax-pin-pulse 1.6s ease-out infinite;
    animation-delay: 0.55s;
    z-index: 1;
}

.cranimax-pin__pulse::after {
    content: '';
    opacity: 0.55;
    animation: cranimax-pin-pulse 1.6s ease-out infinite;
    animation-delay: 1.1s;
    z-index: 1;
}

@keyframes cranimax-pin-pulse {
    0%   { transform: scale(1); opacity: 0.85; }
    70%  { transform: scale(8); opacity: 0;    }
    100% { transform: scale(8); opacity: 0;    }
}

@media (prefers-reduced-motion: reduce) {
    .cranimax-pin__pulse,
    .cranimax-pin__pulse::before,
    .cranimax-pin__pulse::after {
        animation: none;
        opacity: 0;
    }
}