/* Explain: Layout utilities and section backgrounds for the coaching site */
.section-shell {
    width: min(1160px, 100%);
    margin-inline: auto;
}

.hero-radiance {
    background:
        linear-gradient(115deg, rgba(255, 248, 238, 0.95), rgba(255, 248, 238, 0.76)),
        radial-gradient(circle at 70% 22%, rgba(255, 107, 90, 0.34), transparent 18rem),
        radial-gradient(circle at 38% 80%, rgba(167, 139, 250, 0.24), transparent 22rem);
}

.method-flow {
    background:
        radial-gradient(circle at 85% 10%, rgba(246, 196, 83, 0.22), transparent 24rem),
        radial-gradient(circle at 10% 70%, rgba(167, 139, 250, 0.18), transparent 24rem),
        white;
}

.sticky-copy {
    top: 8rem;
}

.method-ladder {
    display: grid;
    gap: 1rem;
}

.growth-road {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
    position: relative;
}

.growth-road::before {
    position: absolute;
    left: 8%;
    right: 8%;
    top: 3.75rem;
    height: 4px;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--coral-color), var(--warm-yellow), var(--soft-purple), var(--deep-teal));
    content: "";
}

.story-band {
    background:
        radial-gradient(circle at 85% 20%, rgba(167, 139, 250, 0.3), transparent 22rem),
        radial-gradient(circle at 15% 75%, rgba(255, 107, 90, 0.26), transparent 24rem),
        linear-gradient(135deg, var(--deep-teal), #072B35 78%);
}

.testimonial-mosaic {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.testimonial-mosaic article:nth-child(2),
.testimonial-mosaic article:nth-child(4) {
    transform: translateY(2rem);
}

.contact-radiance {
    background:
        radial-gradient(circle at 85% 18%, rgba(246, 196, 83, 0.32), transparent 22rem),
        radial-gradient(circle at 10% 75%, rgba(255, 107, 90, 0.26), transparent 24rem),
        linear-gradient(140deg, var(--deep-teal), #093540 72%);
}

@media (min-width: 1024px) {
    .sticky-copy {
        position: sticky;
    }
}

@media (max-width: 900px) {
    .growth-road,
    .testimonial-mosaic {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .growth-road::before {
        display: none;
    }

    .testimonial-mosaic article:nth-child(2),
    .testimonial-mosaic article:nth-child(4) {
        transform: none;
    }
}

@media (max-width: 640px) {
    .growth-road,
    .testimonial-mosaic {
        grid-template-columns: 1fr;
    }
}