/* ── Pie SVG ─────────────────────────────────────────────────────── */

.pie-chart__viz {
    width: 100%;
    max-width: 400px;
}

.pie-chart__svg {
    width: 100%;
    height: auto;
    display: block;
    overflow: visible;
}

/* Slices: same fill as the section so only the outlines show; active = orange */
.pie-slice {
    fill: #F6F0ED;
    stroke: #212121;
    stroke-width: 6;
    vector-effect: non-scaling-stroke;
    stroke-linejoin: round;
    cursor: pointer;
    transition: fill 0.15s ease;
}

.pie-slice.is-active {
    fill: #FF9C20;
}

/* ── Parts ───────────────────────────────────────────────────────── */

.pie-chart__parts {
    position: relative;
}

.pie-part {
    display: none;
    flex-direction: column;
    gap: 12px;
}

.pie-part.is-active {
    display: flex;
}

.pie-part__title {
    font-family: 'Inter', sans-serif;
    font-weight: 600;
    font-size: 20px;
    line-height: 28px;
    color: #212121;
}

.pie-part__desc {
    font-family: 'Inter', sans-serif;
    font-weight: 400;
    font-size: 18px;
    line-height: 32px;
    color: #212121;
}