/* Page-level overrides for the Class Detail template only.
   Section styling itself lives in each section's own classes/[name]/[name].css. */

/* Taller hero on the class-detail pages — 500px instead of the shared 400px
   (desktop + laptop). Tablet/mobile keeps the shared 50vh: this file loads
   after page-hero.css, so the 50vh has to be restated or the rule above
   would win inside that breakpoint. */
.page-hero {
    max-height: 400px;
}

@media (max-width: 1024px) {
    .page-hero {
        min-height: 50vh;
    }
}

.class-intro {
    background: var(--color-greige-light);
}

.image-text {
    background: var(--color-greige-light);
}

.client-quote {
    padding-top: 0;
}