/* Global awards ticker (js/home-awards-ticker.js). Mirrors the slick.css rules the strip used to get. */
.award-section .home-awards {
    display: block;
    position: relative;
    -webkit-user-select: none;
    user-select: none;
    -webkit-touch-callout: none;
    touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;
}

.award-section .home-awards__list {
    position: relative;
    display: block;
    overflow: hidden;
    margin: 0;
    padding: 0;
    transform: translate3d(0, 0, 0);
}

.award-section .home-awards__track {
    position: relative;
    display: flex;
    align-items: flex-start;
    width: max-content;
    margin: 0;
    transform: translate3d(0, 0, 0);
}

.award-section .home-awards__chunk {
    display: flex;
    flex: none;
    align-items: flex-start;
}

/* Icon, then title over logo: the old card's nested flex rows as one grid. */
.award-section .home-awards .award-card {
    display: grid;
    grid-template-columns: auto max-content;
    column-gap: 16px;
    flex: none;
}

.award-section .home-awards .award-card > .icon {
    grid-row: 1 / span 2;
    align-self: center;
}

.award-section .home-awards .awards-card-title {
    grid-column: 2;
}

.award-section .home-awards .awards-card-image {
    grid-column: 2;
    display: block;
    justify-self: start;
}

/*
 * components/button/button-lean: button-base without its row/col/span wrappers. The icon keeps the
 * 24px slot of .button-image-container-right: 8px gap + 15px icon + 1px. In RTL the old 8px + 12px
 * margins made flexbox shrink the icon to its intrinsic 4px, which is reproduced here.
 */
.button-lean {
    display: inline-flex;
    justify-content: center;
    white-space: nowrap;
}

.button-lean > .button-lean__icon {
    flex: none;
    align-self: center;
    width: 15px;
    margin: 0 1px 0 8px;
}

[dir="rtl"] .button-lean > .button-lean__icon {
    width: 4px;
    margin: 0 12px 0 8px;
    transform: rotateY(180deg);
}
