/* ==========================================================
   CITYGO NEARBY
========================================================== */

.cg-nearby-section{
    padding:72px 0;
    background:var(--cg-page);
}

.cg-nearby-section .cg-container{
    width:min(1480px,calc(100% - 56px));
    margin-inline:auto;
}

.cg-nearby-layout{
    display:grid;
    grid-template-columns:1.2fr .8fr;
    gap:28px;
    align-items:start;
}

.cg-map-preview{
    position:relative;
    overflow:hidden;

    height:560px;

    border-radius:34px;
    background:#eef6f8;
    box-shadow:0 22px 60px rgba(18,34,58,.08);
}

.cg-map-preview__bg{
    position:absolute;
    inset:0;

    background:
        linear-gradient(rgba(255,255,255,.2),rgba(255,255,255,.2)),
        url("https://citygo.ee/wp-content/uploads/2026/07/map-placeholder.webp");

    background-size:cover;
    background-position:center;
}

.cg-map-pin{
    position:absolute;
    z-index:2;

    width:52px;
    height:52px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:50%;
    background:#fff;

    font-size:22px;

    box-shadow:0 12px 30px rgba(0,0,0,.16);
}

.cg-map-pin--food{top:120px;left:90px;}
.cg-map-pin--rent{top:250px;left:260px;}
.cg-map-pin--spa{top:160px;right:170px;}
.cg-map-pin--shop{bottom:120px;left:160px;}
.cg-map-pin--hotel{bottom:180px;right:140px;}

.cg-map-location{
    position:absolute;
    left:26px;
    bottom:26px;

    height:48px;
    padding:0 22px;

    border:0;
    border-radius:999px;

    background:var(--cg-primary);
    color:#fff;

    font-size:15px;
    font-weight:800;

    cursor:pointer;
}

.cg-nearby-list{
    display:flex;
    flex-direction:column;
    gap:18px;
}

.cg-nearby-item{
    display:grid;
    grid-template-columns:92px 1fr auto;
    gap:18px;
    align-items:center;

    padding:18px;

    border-radius:24px;
    background:#fff;

    box-shadow:0 18px 50px rgba(18,34,58,.08);
}

.cg-nearby-item__image{
    width:92px;
    height:92px;

    border-radius:18px;

    background:
        linear-gradient(135deg,#18b8ca,#0798a9);
}

.cg-nearby-item h3{
    margin:0 0 6px;
    font-size:22px;
    font-weight:850;
}

.cg-nearby-item p{
    margin:0 0 8px;
    color:#64748b;
    font-weight:700;
}

.cg-nearby-item span{
    font-weight:800;
}

.cg-nearby-item strong{
    color:#10b981;
    font-size:15px;
    font-weight:850;
}

@media(max-width:1100px){

    .cg-nearby-layout{
        grid-template-columns:1fr;
    }

}
#cg-nearby-map {
    position: absolute;
    inset: 0;
    z-index: 1;
}

.cg-map-location {
    z-index: 5;
}

.cg-map-marker {
    width: 48px;
    height: 48px;
}

.cg-map-marker span {
    width: 48px;
    height: 48px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;
    background: var(--cg-primary);
    color: #fff;

    font-size: 22px;

    box-shadow: 0 14px 34px rgba(0,0,0,.22);
}
#cg-nearby-map {
    width: 100%;
    height: 100%;
}