:root,
*::before,
*::after {
    --color-equestra: #CC9933;
}

.line-height-1 {
    line-height: 1;
}

.color-equestra {
    color: var(--color-equestra);
}

.cta--hero {
    position: absolute;
    left: 50%;
    bottom: 2rem;
    transform: translateX(-50%);
    background: var(--color-equestra)
}

.hero-section .hero-section__background {
    z-index: -1;
}

.section--via-equestra .equestra-detail svg {
    height: 2.5rem;
    width: 2.5rem;
}

.logo-vt-equestra {
    max-width: 230px;
}

.hero__gradient {
    position: relative;

    height: 82px;
    width: 100%;
}

.hero__gradient::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    background: #CC9933;
    background: linear-gradient(90deg, rgba(204, 153, 51, 1) 0%, rgba(204, 153, 51, 1) 50%, rgba(204, 153, 51, 0) 100%);
    z-index: -1;
}

.hero__gradient img {
    max-height: 50px;
}

.hero__gradient .cell:last-child img {
    max-height: 60px;
}

@media(max-width: 1023.99px) {
    .cta--hero {
        position: initial;
        transform: translateX(50%);
        margin-top: 2rem;
    }

    .hero__gradient::before {
        left: -5vw;
    }

    .hero-section--equestra {
        height: auto !important;
        min-height: calc(100vh - var(--top-bar-height, var(--top-bar-fallback)));
        padding-top: 2rem;
    }

    .small-color-equestra {
        color: var(--color-equestra);
    }

    body.page-secondary .hero-section {
        height: calc(85vh - var(--top-bar-height, var(--top-bar-fallback)));
    }

    .hero-section {
        padding-bottom: 0;
    }

    .hero__gradient {
        height: auto;
        padding: 1rem 0;
    }

}

@media all and (min-width: 1024px) {
    .hero__gradient::before {
        left: -15vw;
    }
}

@media(max-height: 700px) {
    .hero-section--equestra {
        min-height: calc(110vh - var(--top-bar-height, var(--top-bar-fallback)));
    }
}