/* Services V1 — Featured Services with tabbed panel */

.prc.v1 {

    

    /* ── Tab bar ───────────────────────────────────────── */

    .prc-tabs {
        background: rgba(0, 0, 0, 0.3);
        backdrop-filter: blur(15px);
        -webkit-backdrop-filter: blur(15px);
        border-radius: 6.25rem;
        padding: 0.125rem;

        li {
            display: contents;
        }
    }

    .prc-tab {
        font-weight: 700;
        font-size: 1.125rem;
        color: white;
        background: transparent;
        border: 2px solid transparent;
        border-radius: 4.375rem;
        height: 3.4375rem;
        padding-inline: 1.875rem;
        cursor: pointer;
        white-space: nowrap;
        transition: background-color 0.2s ease, border-color 0.2s ease;

        &.active {
            background: var(--btn-hvr-pry);
            border-color: var(--accent);
            color: white;
        }

        @media (hover: hover) and (pointer: fine) {
            &:is(:hover, :focus-visible):not(.active) {
                background: var(--btn-hvr-pry);
                color: white;
            }
        }
    }

    .cnt-stl {
        ul.itm li {
            padding-left: 0;

            svg {
                font-size: 1.67rem;
            }
        }
        ul.itm li::before {
            display: none;
        }
    }


   


    /* ── Responsive ────────────────────────────────────── */

    @media screen and (max-width: 1279px) {
        .prc-tabs {
            border-radius: 1.5rem;
            padding: 0.25rem;
            flex-wrap: wrap;
            justify-content: center;
            gap: 0.25rem;
        }

        .prc-tab {
            border-radius: 4.375rem;
            height: auto;
            padding: 0.75rem 1.25rem;
        }

        .iso {
            max-width: 50%;
            margin-inline: auto;
        }
    }

    @media screen and (max-width: 699px) {
        .prc-tab {
            font-size: 1rem;
            padding: 0.625rem 1rem;
        }
    }
}