/* Homepage hero only; the page background and navigation retain their styles. */
.home-hero {
    --hero-scroll-width: 72px;
    background: url('../Images/Images_WebSite/main.jpg?quality=80&format=webp') center center / cover no-repeat;
    padding: 32px 10% 24px;
    font-family: 'Montserrat', sans-serif;
}

.home-hero__layout {
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr) 110px;
    gap: clamp(32px, 4vw, 64px);
    align-items: center;
    margin: 0 auto;
}

.home-hero__award {
    min-width: 0;
    padding: clamp(20px, 2vw, 32px);
    background: url('../Images/Images_WebSite/IEEEbanner.png?quality=80&format=webp') center / cover no-repeat;
    box-sizing: border-box;
}

.home-hero__award-content {
    display: flex;
    align-items: center;
    gap: 20px;
    /* Enlarge the contents without changing the banner's layout dimensions. */
    transform: scale(1.05);
}

.home-hero__award-logo { display: block; width: 40%; height: auto; }
.home-hero__award-copy { min-width: 0; }
.home-hero__award-copy p {
    margin: 0 0 16px;
    color: #f5f5f5;
    font-family: inherit;
    font-size: clamp(16px, 1.25vw, 20px);
    font-weight: 700;
    line-height: 1.4;
}
.home-hero__award-copy .home-hero__award-highlight { color: rgb(232, 154, 39); }
.home-hero__award-link {
    display: block;
    margin-top: 24px;
    color: #00b9c9;
    font-size: 15px;
    font-style: italic;
    line-height: 1.6;
    transform: scale(1.03);
}
.home-hero__award-link:hover { color: #f5f5f5; }
.home-hero__award-link:focus-visible { outline: 2px solid #ff7800; outline-offset: 6px; }

.home-hero__copy {
    min-width: 0;
    /* Clear the right half of the centered Scroll Down indicator. */
    padding-left: calc(var(--hero-scroll-width) / 2);
}

.home-hero__copy h1 {
    margin: 0;
    font-family: inherit;
    font-size: clamp(30px, 2.8vw, 46px);
    font-weight: 500;
    line-height: 1.35;
    color: rgb(232, 154, 39);
}

.home-hero__copy p {
    margin: 28px 0 0;
    font-family: inherit;
    font-size: 15px;
    line-height: 1.85;
    color: #f5f5f5;
}

.home-hero__actions {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.home-hero__action {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    color: #f5f5f5;
    font-size: 12px;
    line-height: 1.5;
    text-align: center;
    text-decoration: none;
}

.home-hero__action img {
    display: block;
    width: 64px;
    height: 64px;
    transition: transform .2s ease;
}


.home-hero__action:hover { color: #ff7800; text-decoration: none; }
.home-hero__action:hover img { transform: translateY(-3px); }
.home-hero__action:focus-visible,
.home-hero__scroll:focus-visible { outline: 2px solid #ff7800; outline-offset: 6px; }

.home-hero__scroll {
    display: block;
    width: var(--hero-scroll-width);
    margin: 32px auto 0;
}

.home-hero__scroll img {
    display: block;
    width: var(--hero-scroll-width);
    height: 48px;
    transition: transform .2s ease;
}
.home-hero__scroll:hover img { transform: translateY(-3px); }
#home-overview { scroll-margin-top: 120px; }

@media (max-width: 1100px) {
    .home-hero__layout { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); }
    .home-hero__actions {
        grid-column: 1 / -1;
        flex-direction: row;
        justify-content: space-evenly;
    }
    .home-hero__action { flex: 1; max-width: 180px; }
}

@media (max-width: 640px) {
    .home-hero { padding: 0 0 24px; }
    .home-hero__layout { grid-template-columns: minmax(0, 1fr); gap: 32px; }
    .home-hero__award {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr);
        gap: 12px 16px;
        width: 100%;
        padding: 12px 20px 24px;
        align-items: start;
    }
    .home-hero__award-content { display: contents; transform: none; }
    .home-hero__award-logo {
        grid-column: 1;
        grid-row: 1 / 3;
        width: 100%;
        max-width: 180px;
        margin: 0 auto;
        transform: scale(1.05);
    }
    .home-hero__award-copy { grid-column: 2; width: 100%; text-align: left; transform: scale(1.05); }
    .home-hero__award-copy p { font-size: 17px; }
    .home-hero__award-copy p:last-child { margin-bottom: 0; }
    .home-hero__award-link { grid-column: 2; margin-top: 0; font-size: 12px; line-height: 1.3; }
    .home-hero__copy,
    .home-hero__actions { margin-inline: 10%; }
    .home-hero__copy { padding-left: 0; }
    .home-hero__copy h1 { font-size: clamp(30px, 7vw, 40px); }
    .home-hero__copy p { margin-top: 24px; }
    .home-hero__actions { gap: 12px; }
    .home-hero__action { font-size: 11px; }
    .home-hero__action img { width: 64px; height: 64px; }
    .home-hero__scroll { margin-top: 32px; }
}

@media (prefers-reduced-motion: reduce) {
    .home-hero__action img,
    .home-hero__scroll img { transition: none; }
}