/* ══════════════════════════════════════════════════════════════
   PRICING — glass tier slabs (see /assets/podium.js)
   JS writes --x --y (percent), --k, --rx --ry (deg), --lit (0..1)
   on .pd-stage, and --rise on each .pd-slab.
   Every slab stands on the floor (y = 0) and grows upward.
   ══════════════════════════════════════════════════════════════ */

.pd-stage {
    --u: min(8.5vw, 16vh);
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    overflow: hidden;
    background:
        radial-gradient(ellipse 45% 40% at calc(var(--x, 50) * 1%) calc(var(--y, 62) * 1% - 8%), rgba(16, 201, 138, calc(0.06 + var(--lit, 1) * 0.12)), rgba(16, 201, 138, 0) 70%),
        linear-gradient(180deg, #0d110f 0%, #0d110f calc(var(--y, 62) * 1%), #0a0f0c 100%);
    perspective: 1500px;
    perspective-origin: 50% 35%;
}

.pd-rig {
    position: absolute;
    left: calc(var(--x, 50) * 1%);
    top: calc(var(--y, 62) * 1%);
    width: 0;
    height: 0;
    transform-style: preserve-3d;
    transform:
        scale3d(var(--k, 1), var(--k, 1), var(--k, 1))
        rotateX(calc(var(--rx, 12) * -1deg))
        rotateY(calc(var(--ry, 0) * 1deg));
}

.pd-slab {
    --W: calc(var(--u) * 1);
    --D: calc(var(--u) * 1);
    --H: calc(var(--u) * var(--h) * var(--rise, 1));
    position: absolute;
    left: 0;
    top: 0;
    transform-style: preserve-3d;
    transform: translate3d(calc(var(--u) * var(--px)), 0, 0);
}
.pd-s0 { --px: -1.4; --h: 1.1; }
.pd-s1 { --px: 0;    --h: 1.8; }
.pd-s2 { --px: 1.4;  --h: 2.6; }

.pd-box { position: absolute; transform-style: preserve-3d; }
.pd-f {
    position: absolute;
    box-sizing: border-box;
    border: 1px solid rgba(62, 224, 168, calc(0.25 + var(--lit, 1) * 0.45));
    background: linear-gradient(180deg, rgba(16, 201, 138, calc(0.08 + var(--lit, 1) * 0.14)), rgba(16, 201, 138, 0.03));
    box-shadow: inset 0 0 calc(var(--u) * 0.3) rgba(16, 201, 138, calc(var(--lit, 1) * 0.22));
}
.pd-front, .pd-back {
    width: var(--W);
    height: var(--H);
    left: calc(var(--W) / -2);
    top: calc(var(--H) * -1);
}
.pd-front { transform: translateZ(calc(var(--D) / 2)); }
.pd-back  { transform: rotateY(180deg) translateZ(calc(var(--D) / 2)); }
.pd-left, .pd-right {
    width: var(--D);
    height: var(--H);
    left: calc(var(--D) / -2);
    top: calc(var(--H) * -1);
}
.pd-left  { transform: rotateY(-90deg) translateZ(calc(var(--W) / 2)); }
.pd-right { transform: rotateY(90deg) translateZ(calc(var(--W) / 2)); }
.pd-top {
    width: var(--W);
    height: var(--D);
    left: calc(var(--W) / -2);
    top: calc(var(--D) / -2);
    transform: translateY(calc(var(--H) * -1)) rotateX(90deg);
    background: rgba(62, 224, 168, calc(0.12 + var(--lit, 1) * 0.22));
    box-shadow: 0 0 calc(var(--u) * 0.5) rgba(16, 201, 138, calc(var(--lit, 1) * 0.5));
}

/* tier label, low on the front face */
.pd-front {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: center;
    padding-bottom: calc(var(--u) * 0.12);
    overflow: hidden;
}
.pd-num, .pd-name {
    font-family: 'Space Mono', monospace;
    font-weight: 700;
    text-transform: uppercase;
    white-space: nowrap;
    color: rgba(233, 255, 246, calc(0.4 + var(--lit, 1) * 0.6));
}
.pd-num  { font-size: calc(var(--u) * 0.2); line-height: 1; color: #3ee0a8; }
.pd-name { font-size: calc(var(--u) * 0.1); letter-spacing: 0.12em; margin-top: calc(var(--u) * 0.05); }

/* floor glow under each slab */
.pd-glow {
    position: absolute;
    width: calc(var(--u) * 2.2);
    height: calc(var(--u) * 2.2);
    left: calc(var(--u) * -1.1);
    top: calc(var(--u) * -1.1);
    transform: rotateX(90deg);
    background: radial-gradient(closest-side, rgba(16, 201, 138, calc(var(--lit, 1) * 0.45)), rgba(16, 201, 138, 0));
}

.pd-scrim {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(90deg, rgba(8, 11, 9, 0.7) 0%, rgba(8, 11, 9, 0.2) 45%, rgba(8, 11, 9, 0) 62%),
        radial-gradient(ellipse 85% 80% at 55% 50%, rgba(8, 11, 9, 0), rgba(8, 11, 9, 0.5) 100%);
}

/* ── PAGE CONTENT ON TOP ── */
body.podium .page-hero { background: transparent; }
body.podium main > section:not(.cta-band) { background: transparent; border-top: 0; }
body.podium .care-card {
    background: var(--glass-strong);
}
body.podium .care-header,
body.podium .prose.pd-note,
body.podium .faq-list {
    background: var(--glass-strong);
    border: 1px solid var(--border);
    padding: 28px 32px;
}
body.podium .prose.pd-note { padding: 40px 40px 36px; }
body.podium .faq-list { padding: 8px 32px; }
body.podium table.cmp { background: rgba(11, 15, 13, 0.9); }

@media (max-width: 999px), (max-aspect-ratio: 13/10) {
    .pd-stage { --u: min(15vw, 11vh); }
}
@media (max-width: 700px) {
    body.podium .care-header,
    body.podium .prose.pd-note { padding: 24px 20px; }
    body.podium .faq-list { padding: 4px 20px; }
}