/* home-awards.css v1.4 */

/* =========================================================
   HOME PAGE AWARDS
   Compact three-award layout
   ========================================================= */

.home_awards {
    padding: 26px 30px 32px;
    background: var(--zoom-white);
}


/* =========================================================
   SECTION HEADING
   ========================================================= */

.home_awards .section_kicker_rule {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 16px;

    width: 100%;
    max-width: 440px;

    margin: 0 auto 22px;
}

.home_awards .section_kicker_rule > span {
    display: block;
    height: 1px;
    background: var(--zoom-line);
}

.home_awards .section_kicker_rule p {
    margin: 0;

    color: var(--zoom-charcoal);

    font-size: 0.6875rem;
    font-weight: 700;
    line-height: 1.2;

    letter-spacing: 0.16em;
    text-transform: uppercase;
    white-space: nowrap;
}


/* =========================================================
   AWARD GRID
   ========================================================= */

.home_awards_grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: center;

    gap: 24px;

    width: 100%;
    max-width: 680px;

    margin: 0 auto;
}


/* =========================================================
   INDIVIDUAL AWARD
   ========================================================= */

.award_item {
    position: relative;

    display: grid;
    place-items: center;

    min-height: 120px;

    text-align: center;
}


/* Laurel graphic */

.award_laurel {
    position: absolute;

    top: 50%;
    left: 50%;

    width: 150px;
    height: auto;

    transform: translate(-50%, -50%);

    pointer-events: none;
}


/* Text inside laurel */

.award_content {
    position: relative;
    z-index: 1;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    width: 82px;

    padding: 4px 0;
}

.award_item strong {
    display: block;

    margin: 0;

    color: var(--zoom-charcoal);

    font-size: 0.5rem;
    font-weight: 700;
    line-height: 1.3;

    letter-spacing: 0.01em;
    text-transform: uppercase;
}

.award_item small {
    display: block;

    margin-top: 2px;

    color: var(--zoom-charcoal);

    font-size: 0.6875rem;
    font-weight: 600;
    line-height: 1.2;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 900px) {

    .home_awards {
        padding: 24px 24px 30px;
    }

    .home_awards_grid {
        gap: 18px;
        max-width: 600px;
    }

    .award_item {
        min-height: 115px;
    }

    .award_laurel {
        width: 140px;
    }

    .award_content {
        width: 78px;
    }

    .award_item strong,
    .award_item small {
        font-size: 0.625rem;
    }

}


/* =========================================================
   MOBILE
   Keep all three awards side-by-side
   ========================================================= */

@media (max-width: 600px) {

    .home_awards {
        padding: 22px 12px 26px;
    }

    .home_awards .section_kicker_rule {
        max-width: calc(100% - 30px);
        gap: 10px;

        margin-bottom: 18px;
    }

    .home_awards .section_kicker_rule p {
        font-size: 0.625rem;
        letter-spacing: 0.13em;
    }

    .home_awards_grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));

        gap: 4px;

        max-width: 430px;
    }

    .award_item {
        min-height: 105px;
    }

    .award_laurel {
        width: 125px;
        max-width: 100%;
    }

    .award_content {
        width: 68px;
        padding: 3px 0;
    }

    .award_item strong,
    .award_item small {
        font-size: 0.5625rem;
    }

}


/* =========================================================
   SMALL MOBILE
   ========================================================= */

@media (max-width: 390px) {

    .home_awards {
        padding-left: 8px;
        padding-right: 8px;
    }

    .home_awards .section_kicker_rule {
        max-width: calc(100% - 20px);
    }

    .home_awards_grid {
        gap: 2px;
    }

    .award_item {
        min-height: 95px;
    }

    .award_laurel {
        width: 112px;
    }

    .award_content {
        width: 61px;
    }

    .award_item strong,
    .award_item small {
        font-size: 0.5rem;
    }

}