.is-macgillis--hero-main {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    position: relative;
    background-size: cover;
    background-position: center bottom;
    padding-top: var(--spacing-xxl);
    padding-bottom: var(--spacing-xxxl);
    height: 80vh;
}

.is-macgillis--hero-main-overlay {
    position: absolute;
    inset: 0;
    z-index: 1;
}

.is-macgillis--hero-main--inner {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-m);
    align-items: flex-start;
    width: 920px;
    position: relative;
    z-index: 2;
}

.main-hero--eyebrow {
    font-size: var(--text-sm);
    font-weight: var(--medium);
    letter-spacing: 0.02em;
    text-transform: uppercase;
    color: var(--oxford-blue);
}

.main-hero--title {
    font-size: var(--h1);
    color: var(--calming-white);
}

.main-hero--text {
    font-size: var(--text-md);
    color: var(--calming-white);
}

/**********************************************/
/******************* Tablet *******************/
/**********************************************/
@media (max-width: 1024px) {
    /* Main Hero Block */
    .is-macgillis--hero-main {
        padding-top: var(--spacing-xl);
        padding-bottom: var(--spacing-xl);
        height: 45vh;
    }

    .is-macgillis--hero-main--inner {
        gap: var(--spacing-s);
        width: var(--full);
    }
}

/**********************************************/
/******************* Mobile *******************/
/**********************************************/
@media (max-width: 767px) {
    /* Main Hero Block */
    .is-macgillis--hero-main {
        padding-top: var(--spacing-s);
        padding-bottom: var(--spacing-l);
        justify-content: flex-end;
        height: 75vh;
    }
}