.elementor-487 .elementor-element.elementor-element-44e6a8a{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}/* Start custom CSS for html, class: .elementor-element-ff783b6 *//* =========================================
   WYMUSZONE STYLE KROPEK Z ANIMACJĄ (!important)
========================================= */

/* 1. Kontener linku - ukrywamy jego tło i ramki, żeby nie było "podwójnej kropki" */
.wsg-estate-map__hotspot {
    position: absolute !important;
    transform: translate(-50%, -50%) !important;
    text-decoration: none !important;
    cursor: pointer !important;
    z-index: 4 !important;
    background: transparent !important; /* Wymusza brak podwójnego tła */
    border: none !important;            /* Wymusza brak podwójnej ramki */
    box-shadow: none !important;        /* Wymusza brak podwójnego cienia */
}

/* 2. Właściwa kropka graficzna (z animacją) */
.wsg-estate-map__dot {
    position: relative !important;
    width: 14px !important;
    height: 14px !important;
    border-radius: 50% !important;
    background: #d8b24c !important;
    border: 2px solid rgba(255,255,255,0.9) !important;
    /* Przypisanie animacji z !important */
    animation: wsgPulse 1.8s infinite !important; 
    transition: 0.25s ease !important;
    display: block !important;
}

/* 3. Poświata (jasny okrąg pod kropką) */
.wsg-estate-map__dot::after {
    content: "" !important;
    position: absolute !important;
    inset: -8px !important;
    border-radius: 50% !important;
    background: rgba(216,178,76,0.12) !important;
    z-index: -1 !important;
    display: block !important;
}

/* 4. Zatrzymanie animacji i powiększenie po najechaniu myszką */
.wsg-estate-map__hotspot:hover .wsg-estate-map__dot {
    transform: scale(1.35) !important;
    background: #fff !important;
    border-color: #d8b24c !important;
    animation: none !important; /* Wyłącza pulsowanie przy hoverze */
}

/* 5. Definicja samej animacji pulsowania (tu nie dajemy !important, bo to klatki kluczowe) */
@keyframes wsgPulse {
    0% { box-shadow: 0 0 0 0 rgba(216,178,76,0.65); }
    70% { box-shadow: 0 0 0 14px rgba(216,178,76,0); }
    100% { box-shadow: 0 0 0 0 rgba(216,178,76,0); }
}

/* 6. Etykieta (Lokal x/x) */
.wsg-estate-map__label {
    position: absolute !important;
    left: 50% !important;
    bottom: calc(100% + 14px) !important;
    transform: translateX(-50%) !important;
    padding: 8px 12px !important;
    white-space: nowrap !important;
    background: rgba(17,17,17,0.96) !important;
    border: 1px solid rgba(216,178,76,0.34) !important;
    border-radius: 999px !important;
    color: #fff !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    opacity: 0 !important;
    pointer-events: none !important;
    transition: 0.25s ease !important;
}

.wsg-estate-map__hotspot:hover .wsg-estate-map__label {
    opacity: 1 !important;
    transform: translateX(-50%) translateY(-4px) !important;
}

.wsg-estate-map__label span {
    color: #d8b24c !important;
}

/* 7. Wersja mobilna */
@media (max-width: 767px) {
    .wsg-estate-map__dot {
        width: 10px !important;
        height: 10px !important;
    }
    .wsg-estate-map__dot::after {
        inset: -6px !important;
    }
    .wsg-estate-map__label {
        display: none !important;
    }
}/* End custom CSS */