/* =========================================================
   Layered Cost Cards Block
   ========================================================= */

.layered-cost-cards {
    padding: 20px 0;
    background: #FFFFFF;
}

.layered-cost-cards__container {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

/* ── Title ────────────────────────────────────────────── */
.layered-cost-cards__title {
    margin: 0;
    max-width: 840px;
    color: #1C1C1C;
}

.layered-cost-cards__title span {
    color: #e02020;
}

/* ── Stack ────────────────────────────────────────────── */
.layered-cost-cards__stack {
    position: relative;
    display: flex;
    flex-direction: column;
}

/* ── Card ─────────────────────────────────────────────── */
.layered-cost-cards__card {
    position: relative;
    z-index: calc(var(--layered-cost-cards-index, 0) + 1);
    width: calc(100% - (2 - var(--layered-cost-cards-index, 0)) * 15%);
    padding: 20px;
    gap: 10px;
}

.layered-cost-cards__card--light {
    background: #F4F4F4;
    border-radius: 20px 20px 0 0;
    color: #000000;
}

.layered-cost-cards__card--grey {
    background: #E6E6E6;
    border-radius: 0 20px 0 0;
    color: #000000;
}

.layered-cost-cards__card--dark {
    background: #383838;
    border-radius: 0 20px 20px 20px;
    color: #FFFFFF;
}

/* ── Label ────────────────────────────────────────────── */
.layered-cost-cards__label {
    display: block;
    font-size: 12px;
    line-height: 18px;
    font-weight: 400;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: inherit;
}

/* ── Heading ──────────────────────────────────────────── */
.container-post h3.layered-cost-cards__heading {
    margin: 0;
    font-size: 24px;
    line-height: 44px;
    font-weight: 400;
    letter-spacing: -0.02em;
    color: inherit;
}

/* ── List ─────────────────────────────────────────────── */
.container-post ul.layered-cost-cards__list {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 7px;
    color: inherit;
}

.container-post ul li.layered-cost-cards__list-item {
    position: relative;
    padding-left: 22px;
    font-size: 14px;
    line-height: 20px;
    font-weight: 500;
    color: inherit;
}

.layered-cost-cards__list-item::before {
    content: "";
    position: absolute;
    left: 4px;
    top: 12px;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: currentColor;
}