/* credit hero v1 — split layout with rounded image frame */
.credit-hero__blob {
    pointer-events: none;
    top: -2.5rem;
    right: -2.5rem;
    width: 16rem;
    height: 16rem;
    transform: translate(0, 0);
}

.credit-hero__frame {
    aspect-ratio: 4 / 3;
}

.credit-hero__img.credit-hero__img {
    object-fit: cover;
}

@media (max-width: 1023px) {
    .credit-hero__frame {
        aspect-ratio: 16 / 9;
    }
}

/* credit split — two detail items with alternating image sides (no colors) */
.credit-split__blob.credit-split__blob {
    width: 10rem;
    height: 10rem;
    transform: translate(2.5rem, -2.5rem);
}

.credit-split__media {
    aspect-ratio: 16 / 10;
}

.credit-split__img.credit-split__img {
    object-fit: cover;
    max-height: 480px;
}

.credit-split__note {
    letter-spacing: 0.01em;
}

.credit-split__item--reverse {
    flex-direction: column;
}

/* !important: md:flex-row (Tailwind) and flex-md-row (Bootstrap, itself !important) would win */
@media (min-width: 768px) {
    .credit-split__item--reverse {
        flex-direction: row-reverse !important;
    }
}

@media (max-width: 767px) {
    .credit-split__item {
        text-align: left;
    }
}

/* steps-cards — numbered badge step cards, matches p3-b4 composition */
.steps-cards__title {
    max-width: 48rem;
}

.steps-cards__subtitle {
    max-width: 42rem;
}

.steps-cards__badge.steps-cards__badge {
    width: 2.75rem;
    height: 2.75rem;
    flex: none;
}

.steps-cards__card {
    transition: transform 200ms ease, box-shadow 200ms ease;
}

.steps-cards__card:hover {
    transform: translateY(-0.25rem);
}

/* plan spotlight — stacked single-plan highlight with accent blob (no colors) */
.plan-spotlight__blob.plan-spotlight__blob {
    width: 10rem;
    height: 10rem;
    transform: translate(2.5rem, -2.5rem);
}

.plan-spotlight__btn {
    min-width: 12rem;
}

/* stats proof — a single figure card (no colors) */

/* accredit-pair — two rows of photo and text, alternating sides (no colors) */
/* !important: md:flex-row (Tailwind) and flex-md-row (Bootstrap, itself !important) would win */
@media (min-width: 768px) {
    .accredit-pair__item--reverse {
        flex-direction: row-reverse !important;
    }
}

.accredit-pair__img {
    aspect-ratio: 16 / 10;
    object-fit: cover;
}

.faq-minimal__blob {
    pointer-events: none;
    top: -2.5rem;
    right: -2.5rem;
    width: 10rem;
    height: 10rem;
    transform: translate(2.5rem, -2.5rem);
}

.faq-minimal__list > .faq-minimal__item:first-child {
    border-top: 0;
    padding-top: 0;
}

/* cta final band — centered dark banner with soft blob accents (no colors) */
.cta-finalband__blob {
    pointer-events: none;
}

.cta-finalband__blob--a {
    top: -2.5rem;
    right: -2.5rem;
    width: 16rem;
    height: 16rem;
}

.cta-finalband__blob--b {
    bottom: -4rem;
    left: -4rem;
    width: 18rem;
    height: 18rem;
}

.cta-finalband__title {
    max-width: 40rem;
}

.cta-finalband__btn {
    min-width: 12rem;
}

@media (max-width: 767px) {
    .cta-finalband__title {
        max-width: 100%;
    }
}

