#app .info-grid {
    display: grid;
    grid-template: 1fr 1fr 1fr 1fr /
                    1fr 1fr 1fr 1fr;
    gap: 1.25rem;
    padding: 0 .5rem .5rem .5rem;
    height: 17rem;
}

#app .discount-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 1.25rem;
    padding: 0 .5rem .5rem .5rem;
}

#app .discount-grid > div {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

#app .info-grid > div,
#app .discount-grid > div > div:not(.two-cols),
#app .discount-grid > div > .two-cols > div {
    --_color: var(--color, --Orange);
    --_strip-color: var(--strip-color, --Orange);
    background-color: var(--_color);
    height: 7.5625rem;
    border-radius: .1875rem;
    position: relative;
    padding: 1.25rem;
}

#app .info-grid > div .info-card-title,
#app .discount-grid > div > div:not(.two-cols) .info-card-title,
#app .discount-grid > div > .two-cols > div .info-card-title {
    --_title-color: #fff;
    color: var(--title-color, --_title-color);
    font-size: 1.625rem;
    font-weight: 800;
    letter-spacing: 0.0325rem;
}

#app .info-grid > div .info-card-desc,
#app .discount-grid > div > div:not(.two-cols) .info-card-desc,
#app .discount-grid > div > .two-cols > div .info-card-desc {
    --_desc-color: #fff;
    color: var(--desc-color, --_desc-color);
    font-size: 0.875rem;
    font-weight: 500;
    letter-spacing: 0.0175rem;
    text-transform: uppercase;
}

#app .info-grid > div::after,
#app .discount-grid > div > div:not(.two-cols)::after,
#app .discount-grid > div > .two-cols > div::after {
    content: '';
    bottom: 0;
    left: 0;
    position: absolute;
    height: 1.4375rem;
    width: 100%;
    border-radius: 0 0 0.1875rem 0.1875rem;
    background-color: var(--strip-color);
}

#app .info-grid > div:nth-child(1),
#app .info-grid > div:nth-child(7) {
    --color: #17A2B7;
    --strip-color: #1491A5;
}

#app .info-grid > div:nth-child(2),
#app .info-grid > div:nth-child(8) {
    --color: #2AC9E1;
    --strip-color: #1DB5CC;
}

#app .info-grid > div:nth-child(3),
#app .info-grid > div:nth-child(6) {
    --color: #2889E3;
    --strip-color: #1F79CC;
}

#app .info-grid > div:nth-child(4),
#app .info-grid > div:nth-child(5) {
    --color: #764DEB;
    --strip-color: #653CD8;
}

#app .discount-grid .managers > div,
#app .discount-grid .directions > div {
    --color: #fff;
    --strip-color: #e7e7e7;
    --title-color: var(--Orange);
    --desc-color: #000;
}

#app .discount-grid .departments > div {
    --color: #292929;
    --strip-color: #444;
    --title-color: var(--Orange);
    --desc-color: #fff;
}