/* --- HERO GRID LAYOUT --- */

main.home-layout .home-hero {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-areas:
        "company tagline"
        "image text";
    gap: 40px;
    padding: 60px 40px;
    max-width: 1200px;
    margin: 0 auto;
}

/* Grid areas */
main.home-layout .home-hero .left-column h1 {
    grid-area: company;
}

main.home-layout .home-hero .right-column h2 {
    grid-area: tagline;
}

main.home-layout .home-hero .left-column img {
    grid-area: image;
}

main.home-layout .home-hero .right-column p {
    grid-area: text;
}

/* Flatten PopularFX wrappers */
main.home-layout .home-hero .left-column,
main.home-layout .home-hero .right-column {
    display: contents;
}

/* --- MOBILE --- */
@media (max-width: 768px) {
    main.home-layout .home-hero {
        grid-template-columns: 1fr;
        grid-template-areas:
            "company"
            "tagline"
            "image"
            "text";
        text-align: center;
    }
}