@keyframes pp-shimmer {
    100% { transform: translateX(100%); }
}

section.listing.property-primary {
    margin-top: 2vh;
    h2 {
        font-weight: 500;
        font-size: 2rem;
        line-height: 44px;
        color: #0B0E21;
    }
    p {
        font-weight: 500;
        font-size: 20px;
        line-height: 26px;
        color: #9EA3AE;
    }
    .property-section-tab {
        padding-bottom: 0;
        margin-bottom: 3vh;
        flex-direction: row;
        justify-content: space-evenly;
        align-items: center;
        display: flex;
        -webkit-tap-highlight-color: transparent;
    }
    .property-section-tab .col {
        display: flex;
        justify-content: flex-start;
        width: 100%;
        gap: 1rem;
        white-space: nowrap;
    }
    .property-section-tab .tab-header {
        position: relative;
        text-align: center;
        height: 40px;
        padding-right: 1rem;
        padding-bottom: 1vh;
        padding-left: 0;
        margin-bottom: 0;
        width: auto;
        display: flex;
        justify-content: center;
        font-weight: 600;
        font-size: 14px;
        line-height: 21px;
        color: #989BB3;
        letter-spacing: 0.25px;
        cursor: pointer;
        background: none;
        border: none;
        font-family: inherit;
        flex-shrink: 0;
    }
    .property-section-tab .tab-header:focus-visible {
        outline: 2px solid var(--primary-bg);
        outline-offset: 2px;
        border-radius: 2px;
    }
    .property-section-tab .active {
        color: #3C4268;
    }
    .property-section-tab .active::after {
        content: "";
        position: absolute;
        bottom: -2px;
        width: 110%;
        height: 4px;
        display: flex;
        justify-content: center;
        align-items: center;
        z-index: 10;
        background: var(--primary-bg);
    }
    .property-section-tab::after {
        content: '';
        display: inline-block;
        background: #E7E8EC;
        bottom: 2px !important;
        height: 4px;
        opacity: 1;
        border: unset;
        position: relative;
        width: 100%;
    }
    .property-section-tab-result button {
        padding: 8px 24px;
        gap: 8px;
        width: 140px;
        height: 48px;
        border: 1px solid var(--primary-bg);
        background: none;
        color: var(--primary-bg);
        border-radius: var(--Button-Border-Radius, 100px);
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: 16px;
        font-weight: 500;
        line-height: 32px;
    }
    .pp-primary-tab-cards .card-project-container.skeleton {
        position: relative;
        overflow: hidden;
    }
    .pp-primary-tab-cards .card-project-container.skeleton .shimmer {
        position: absolute;
        inset: 0;
        overflow: hidden;
    }
    .pp-primary-tab-cards .card-project-container.skeleton .shimmer::after {
        content: "";
        position: absolute;
        inset: 0;
        transform: translateX(-100%);
        background-image: linear-gradient(90deg, rgba(255,255,255,0) 0, rgba(255,255,255,0.2) 20%, rgba(255,255,255,0.5) 60%, rgba(255,255,255,0));
        animation: pp-shimmer 2s infinite;
    }
    @media screen and (max-width: 890px) {
        h2 {
            font-size: 24px;
            font-weight: 600;
            line-height: 32px;
        }
        p {
            font-size: 16px;
            line-height: 26px;
        }
        .property-section-tab {
            margin-bottom: 1vh;
        }
        .property-section-tab .col {
            overflow-y: hidden;
            overflow-x: scroll;
            height: 49px;
        }
        .property-section-tab::after {
            bottom: 11px !important;
        }
    }
}