/* PESYJE_CATEGORIES_TIRANA_HERO_V2
   Dynamic image + real category pins. Loaded after V1 and intentionally overrides it. */

.pesyje-categories-v20 .pc-v20-hero-wrap {
    min-height: 540px;
    background: #fff !important;
    isolation: isolate;
}

/* Image is a real configurable background and only occupies the visual side. */
.pesyje-categories-v20 section.pc-v20-hero-wrap::before {
    content: "" !important;
    position: absolute !important;
    z-index: 0 !important;
    inset: 0 0 0 43% !important;
    width: auto !important;
    height: auto !important;
    border: 0 !important;
    border-radius: 0 !important;
    background-image: var(--pc-hero-image) !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;
    background-position: var(--pc-hero-pos-x, 50%) var(--pc-hero-pos-y, 50%) !important;
    pointer-events: none !important;
    filter: none !important;
}

/* Strong white bridge: no baked mockup text can bleed underneath the live HTML. */
.pesyje-categories-v20 section.pc-v20-hero-wrap::after {
    content: "" !important;
    position: absolute !important;
    z-index: 1 !important;
    inset: 0 !important;
    pointer-events: none !important;
    background: linear-gradient(
        90deg,
        #fff 0%,
        #fff 42%,
        rgba(255,255,255,.995) 46%,
        rgba(255,255,255,.94) 50%,
        rgba(255,255,255,.58) 54%,
        rgba(255,255,255,.16) 58%,
        rgba(255,255,255,0) 62%
    ) !important;
}

.pesyje-categories-v20 .pc-v20-hero-grid,
.pesyje-categories-v20 .pc-v20-copy,
.pesyje-categories-v20 .pc-v20-scene {
    position: relative;
    z-index: 3;
}

/* Old illustration is disabled; only the configurable photo + real pins are used. */
.pesyje-categories-v20 .pc-v20-city-exact,
.pesyje-categories-v20 .pc-v20-city-exact-logo,
.pesyje-categories-v20 .pc-v20-city-svg,
.pesyje-categories-v20 .pc-v20-star3d {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
}

.pesyje-categories-v20 .pc-v20-scene {
    min-height: 456px !important;
    pointer-events: auto !important;
}

.pesyje-categories-v20 .pc-v20-city {
    position: relative !important;
    width: 100% !important;
    height: 456px !important;
    min-height: 456px !important;
    margin: 0 !important;
    overflow: visible !important;
    background: transparent !important;
    transform: none !important;
}

.pesyje-categories-v20 .pc-v20-city::before {
    display: none !important;
}

/* Real category icons. Large opaque discs cover the old baked circles in the default photo. */
.pesyje-categories-v20 .pc-v20-pin {
    --pin-color: #0da39b;
    position: absolute !important;
    z-index: 20 !important;
    display: grid !important;
    place-items: center !important;
    width: 76px !important;
    height: 76px !important;
    padding: 10px !important;
    border: 5px solid rgba(255,255,255,.98) !important;
    border-radius: 50% !important;
    background: #fff !important;
    box-shadow: 0 12px 28px rgba(31,67,70,.20) !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    animation: pcV20Float 5.2s ease-in-out infinite !important;
    transition: transform .2s ease, box-shadow .2s ease !important;
}

.pesyje-categories-v20 .pc-v20-pin img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    border-radius: 12px !important;
}

.pesyje-categories-v20 .pc-v20-pin::before {
    content: "" !important;
    position: absolute !important;
    z-index: -1 !important;
    left: 50% !important;
    bottom: -27px !important;
    width: 5px !important;
    height: 31px !important;
    transform: translateX(-50%) !important;
    border-radius: 0 0 8px 8px !important;
    background: var(--pin-color) !important;
    box-shadow: 0 4px 7px rgba(34,75,70,.10) !important;
}

.pesyje-categories-v20 .pc-v20-pin::after {
    content: "" !important;
    position: absolute !important;
    z-index: -2 !important;
    left: 50% !important;
    bottom: -34px !important;
    width: 21px !important;
    height: 7px !important;
    transform: translateX(-50%) !important;
    border-radius: 50% !important;
    background: rgba(35,76,70,.14) !important;
    filter: blur(2px) !important;
}

.pesyje-categories-v20 .pc-v20-pin:hover {
    z-index: 30 !important;
    transform: translateY(-6px) scale(1.06) !important;
    box-shadow: 0 18px 34px rgba(31,67,70,.26) !important;
}

/* Positions match the six marker locations in the supplied Tirana default image. */
.pesyje-categories-v20 .pc-v20-pin.p1 { left: 12% !important; top: 82px !important; right: auto !important; bottom: auto !important; }
.pesyje-categories-v20 .pc-v20-pin.p2 { left: 45% !important; top: 24px !important; right: auto !important; bottom: auto !important; }
.pesyje-categories-v20 .pc-v20-pin.p3 { left: 77% !important; top: 45px !important; right: auto !important; bottom: auto !important; }
.pesyje-categories-v20 .pc-v20-pin.p4 { right: 0 !important; top: 186px !important; left: auto !important; bottom: auto !important; }
.pesyje-categories-v20 .pc-v20-pin.p5 { right: 2% !important; bottom: 71px !important; left: auto !important; top: auto !important; }
.pesyje-categories-v20 .pc-v20-pin.p6 { left: 10% !important; bottom: 77px !important; right: auto !important; top: auto !important; }
.pesyje-categories-v20 .pc-v20-pin.p7,
.pesyje-categories-v20 .pc-v20-pin.p8,
.pesyje-categories-v20 .pc-v20-pin.p9,
.pesyje-categories-v20 .pc-v20-pin.p10 { display: none !important; }

html[data-pesyje-theme="dark"] .pesyje-categories-v20 .pc-v20-hero-wrap {
    background: rgb(var(--background_color)) !important;
}

html[data-pesyje-theme="dark"] .pesyje-categories-v20 section.pc-v20-hero-wrap::before {
    filter: brightness(.68) saturate(.82) !important;
}

html[data-pesyje-theme="dark"] .pesyje-categories-v20 section.pc-v20-hero-wrap::after {
    background: linear-gradient(
        90deg,
        rgb(var(--background_color)) 0%,
        rgb(var(--background_color)) 42%,
        rgba(var(--background_color),.995) 46%,
        rgba(var(--background_color),.94) 50%,
        rgba(var(--background_color),.62) 54%,
        rgba(var(--background_color),.20) 58%,
        rgba(var(--background_color),0) 62%
    ) !important;
}

html[data-pesyje-theme="dark"] .pesyje-categories-v20 .pc-v20-pin {
    border-color: rgba(255,255,255,.16) !important;
    background: rgb(var(--elements_inner_background_color)) !important;
    box-shadow: 0 14px 30px rgba(0,0,0,.34) !important;
}

@media (max-width: 1199.98px) {
    .pesyje-categories-v20 .pc-v20-pin { width: 64px !important; height: 64px !important; padding: 8px !important; }
    .pesyje-categories-v20 .pc-v20-pin.p1 { left: 9% !important; }
    .pesyje-categories-v20 .pc-v20-pin.p3 { left: 74% !important; }
}

@media (max-width: 991.98px) {
    .pesyje-categories-v20 section.pc-v20-hero-wrap::before,
    .pesyje-categories-v20 section.pc-v20-hero-wrap::after {
        display: none !important;
    }

    .pesyje-categories-v20 .pc-v20-scene {
        display: block !important;
        min-height: 360px !important;
        margin-top: 4px !important;
        border: 1px solid var(--pc-soft-border) !important;
        border-radius: 24px !important;
        background-image: var(--pc-hero-image) !important;
        background-repeat: no-repeat !important;
        background-size: cover !important;
        background-position: var(--pc-hero-pos-x, 50%) var(--pc-hero-pos-y, 50%) !important;
        box-shadow: 0 15px 34px rgba(22,54,68,.08) !important;
        overflow: hidden !important;
    }

    .pesyje-categories-v20 .pc-v20-city {
        height: 360px !important;
        min-height: 360px !important;
    }

    .pesyje-categories-v20 .pc-v20-pin {
        width: 54px !important;
        height: 54px !important;
        padding: 6px !important;
        border-width: 4px !important;
    }
    .pesyje-categories-v20 .pc-v20-pin::before { height: 22px !important; bottom: -20px !important; width: 4px !important; }
    .pesyje-categories-v20 .pc-v20-pin.p1 { left: 12% !important; top: 56px !important; }
    .pesyje-categories-v20 .pc-v20-pin.p2 { left: 45% !important; top: 18px !important; }
    .pesyje-categories-v20 .pc-v20-pin.p3 { left: 76% !important; top: 38px !important; }
    .pesyje-categories-v20 .pc-v20-pin.p4 { right: 2% !important; top: 145px !important; }
    .pesyje-categories-v20 .pc-v20-pin.p5 { right: 4% !important; bottom: 55px !important; }
    .pesyje-categories-v20 .pc-v20-pin.p6 { left: 10% !important; bottom: 58px !important; }

    html[data-pesyje-theme="dark"] .pesyje-categories-v20 .pc-v20-scene {
        filter: brightness(.72) saturate(.84) !important;
        border-color: rgb(var(--border_color)) !important;
    }
}

@media (max-width: 767.98px) {
    .pesyje-categories-v20 .pc-v20-scene {
        min-height: 265px !important;
        border-radius: 18px !important;
    }
    .pesyje-categories-v20 .pc-v20-city {
        height: 265px !important;
        min-height: 265px !important;
    }
    .pesyje-categories-v20 .pc-v20-pin { width: 44px !important; height: 44px !important; padding: 5px !important; }
    .pesyje-categories-v20 .pc-v20-pin.p1 { left: 10% !important; top: 42px !important; }
    .pesyje-categories-v20 .pc-v20-pin.p2 { left: 43% !important; top: 10px !important; }
    .pesyje-categories-v20 .pc-v20-pin.p3 { left: 74% !important; top: 30px !important; }
    .pesyje-categories-v20 .pc-v20-pin.p4 { right: 1% !important; top: 105px !important; }
    .pesyje-categories-v20 .pc-v20-pin.p5 { right: 3% !important; bottom: 43px !important; }
    .pesyje-categories-v20 .pc-v20-pin.p6 { left: 8% !important; bottom: 47px !important; }
}

@media (prefers-reduced-motion: reduce) {
    .pesyje-categories-v20 .pc-v20-pin { animation: none !important; }
}