/* ==========================================================
   Wiirank Interactive Map — Frontend
   ========================================================== */

.wiirank-frontend-map{
    --wiirank-primary:#8B1E2D;
    --wiirank-hover:#A52839;
    position:relative;
    width:100%;
    max-width:900px;
    margin:0 auto;
}

.wiirank-frontend-inner{
    position:relative;
    width:100%;
}

.wiirank-frontend-map.is-responsive .wiirank-frontend-inner{
    padding-top:var(--wiirank-ratio, 66%);
    height:0;
}

.wiirank-frontend-map.is-responsive .wiirank-frontend-svg{
    position:absolute;
    inset:0;
}

.wiirank-frontend-svg{
    width:100%;
    height:100%;
}

.wiirank-frontend-svg svg.wiirank-map-svg{
    display:block;
    width:100%;
    height:auto;
}

.wiirank-frontend-svg svg.wiirank-map-svg path,
.wiirank-frontend-svg svg.wiirank-map-svg polygon{
    fill:#e6e4ee;
    stroke:#ffffff;
    stroke-width:1;
    transition:fill .15s ease;
}

.wiirank-frontend-svg svg.wiirank-map-svg path:hover,
.wiirank-frontend-svg svg.wiirank-map-svg polygon:hover{
    fill:var(--wiirank-hover);
}

.wiirank-frontend-map.has-zoom .wiirank-frontend-svg{
    cursor:zoom-in;
}

/* ---------- Markers ---------- */

.wiirank-markers{
    position:absolute;
    inset:0;
    pointer-events:none;
}

.wiirank-marker{
    position:absolute;
    transform:translate(-50%,-50%);
    width:18px;
    height:18px;
    padding:0;
    border:none;
    background:transparent;
    cursor:pointer;
    pointer-events:auto;
}

.wiirank-marker-dot{
    display:block;
    width:14px;
    height:14px;
    margin:2px;
    border-radius:50%;
    background:var(--wiirank-primary);
    border:2px solid #fff;
    box-shadow:0 1px 4px rgba(0,0,0,.35);
}

.wiirank-marker::before{
    content:"";
    position:absolute;
    inset:-6px;
    border-radius:50%;
    background:var(--wiirank-primary);
    opacity:.35;
    animation:wiirank-pulse 2.2s ease-out infinite;
}

.wiirank-marker.is-active .wiirank-marker-dot{
    background:var(--wiirank-hover);
}

@keyframes wiirank-pulse{
    0%{ transform:scale(.6); opacity:.45; }
    100%{ transform:scale(1.9); opacity:0; }
}

/* ---------- Popup card ---------- */

.wiirank-popup{
    position:absolute;
    z-index:20;
    width:280px;
    max-width:80vw;
    padding:20px 22px;
    background:#fff;
    border-radius:10px;
    box-shadow:0 10px 30px rgba(20,20,30,.18);
    opacity:0;
    transform:translateY(6px);
    pointer-events:none;
    transition:opacity .15s ease, transform .15s ease;
}

.wiirank-popup.is-open{
    opacity:1;
    transform:translateY(0);
    pointer-events:auto;
}

.wiirank-popup-category{
    display:block;
    margin-bottom:8px;
    font-size:11px;
    font-weight:700;
    letter-spacing:.06em;
    text-transform:uppercase;
    color:var(--wiirank-primary);
}

.wiirank-popup-title{
    margin:0 0 12px;
    font-family:Georgia, 'Times New Roman', serif;
    font-size:17px;
    line-height:1.35;
    color:#1a1a1a;
}

.wiirank-popup-divider{
    margin:0 0 12px;
    border:none;
    border-top:1px solid #ececec;
}

.wiirank-popup-list{
    list-style:none;
    margin:0 0 14px;
    padding:0;
}

.wiirank-popup-list li{
    position:relative;
    margin-bottom:8px;
    padding-left:16px;
    font-size:13px;
    line-height:1.5;
    color:#333;
}

.wiirank-popup-list li::before{
    content:"";
    position:absolute;
    left:0;
    top:6px;
    width:6px;
    height:6px;
    border-radius:50%;
    background:var(--wiirank-primary);
}

.wiirank-popup-link{
    display:inline-flex;
    align-items:center;
    gap:6px;
    font-size:12px;
    font-weight:700;
    letter-spacing:.04em;
    text-transform:uppercase;
    color:var(--wiirank-primary);
    text-decoration:none;
}

.wiirank-popup-link:hover{
    color:var(--wiirank-hover);
}

.wiirank-popup-close{
    position:absolute;
    top:10px;
    right:10px;
    width:22px;
    height:22px;
    border:none;
    background:transparent;
    color:#999;
    cursor:pointer;
    font-size:16px;
    line-height:1;
}

.wiirank-popup-close:hover{
    color:#333;
}

@media (max-width:600px){

    .wiirank-popup{
        width:240px;
        padding:16px 18px;
    }

}