.c-aalberts-hero {
    position: relative;
    height: calc(var(--vh, 100vh) * 100);
    overflow: hidden;
    background: #fff
}

.c-aalberts-hero__image-wrap {
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    transform: translateY(-50%)
}

.c-aalberts-hero__image {
    width: 100%;
    height: calc(var(--vh, 100vh) * 130);
    object-fit: cover;
    object-position: bottom
}

.c-aalberts-hero__content {
    display: flex;
    position: relative;
    z-index: 2;
    flex-direction: column;
    align-items: start;
    justify-content: flex-end;
    height: 100%
}

.c-aalberts-hero__title {
    width: 15.625rem;
    margin: 7.5rem 1.5625rem;
    text-align: left
}

@media screen and (min-width: 48em) {
    .c-aalberts-hero__title {
        width:min(62.5rem,1000px);
        margin: 7.5rem 3.75rem 15.625rem
    }
}

.c-aalberts-hero__organic {
    position: absolute;
    bottom: -1px;
    left: 0;
    width: 100%;
    height: 8.875rem;
    fill: #fff
}

@media screen and (max-width: 47.99em) {
    .c-aalberts-hero__organic {
        transform:rotateY(180deg)
    }
}

@media screen and (min-width: 48em) {
    .c-aalberts-hero__organic {
        bottom:-6.25rem;
        height: 21.75rem
    }
}

.c-intro-aalberts {
    padding: 5rem var(--side-padding);
    text-align: center
}

@media screen and (min-width: 48em) {
    .c-intro-aalberts {
        padding:11.4375rem var(--side-padding)
    }
}

@media screen and (min-width: 48em) {
    .c-intro-aalberts__title {
        max-width:min(68.75rem,1100px);
        margin: auto
    }
}

.c-aalberts-banner {
    display: block;
    position: relative;
    z-index: 2;
    width: 100%;
    height: 100vh;
    overflow: hidden;
    border: 0;
    background: #fff;
    cursor: pointer
}

@media screen and (min-width: 48em) {
    .c-aalberts-banner {
        height:140vh
    }
}

@media (hover: hover) {
    .c-aalberts-banner:hover .c-aalberts-banner__image {
        transform:scale(1.1)
    }
}

.c-aalberts-banner__container {
    height: 100%
}

.c-aalberts-banner__image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    transition: transform .55s;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
    object-fit: cover
}

.c-aalberts-banner__content {
    display: flex;
    position: relative;
    z-index: 2;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    text-align: center
}

@media screen and (min-width: 48em) {
    .c-aalberts-banner__title {
        margin-bottom:3.125rem
    }
}

.c-aalberts-way {
    margin-bottom: 3.125rem;
    padding: 3.875rem var(--side-padding) 0
}

@media screen and (min-width: 48em) {
    .c-aalberts-way {
        position:relative;
        margin-bottom: min(6.25rem,100px);
        padding: min(2.5rem,40px) var(--side-padding) 0
    }

    .c-aalberts-way:after {
        content: "";
        position: absolute;
        z-index: 10;
        /* bottom: 100%; */
        left: 0;
        width: 100%;
        height: 6.25rem;
        transform: translateY(1px);
        border-top-left-radius: 20px;
        border-top-right-radius: 20px;
        background: #fff
    }
}

.c-aalberts-way__title {
    /* margin-bottom: 3.875rem; */
    text-align: center
}

@media screen and (min-width: 48em) {
    .c-aalberts-way__title {
        margin-bottom:min(7.625rem,122px)
    }
}

@media screen and (min-width: 48em) {
    .c-aalberts-way__grid {
        display:flex;
        flex-wrap: wrap;
        justify-content: center
    }
}

.c-aalberts-way__card {
    margin-bottom: 3.875rem;
}

@media screen and (min-width: 48em) {
    .c-aalberts-way__card {
        flex:0 1 50%;
        margin-bottom: min(1.625rem,122px);
    }
}

@media screen and (min-width: 48em) {
    .c-aalberts-way__card__wrap {
        /* max-width:min(28.125rem,450px); */

        margin: 20px;
    }
}

@media screen and (min-width: 90em) {
    .c-aalberts-way__card__wrap {
        /* max-width:min(40.625rem,362px) */
    }
}

.c-aalberts-way__card__title {
    margin-bottom: .9375rem;
    line-height: 1.2
}

@media screen and (min-width: 48em) {
    .c-aalberts-way__card__title {
        margin-bottom:min(.9375rem,15px)
    }
}

.c-aalberts-way__card__copy {
    color: #66676a
}

.c-aalberts-way__card__image {
    width: 100%;
    margin-bottom: 2.1875rem;
    overflow: hiden;
    border-radius: 20px
}

@media screen and (min-width: 48em) {
    .c-aalberts-way__card__image {
        margin-bottom:min(2.75rem,44px)
    }
}

.c-aalberts-way__bottom {
    display: grid;
    grid-template-areas: "title" "image" "copy";
    margin-top: min(6.25rem,100px)
}

@media screen and (min-width: 48em) {
    .c-aalberts-way__bottom {
        grid-gap:min(2.5rem,40px);
        grid-template-areas: "title image" "copy image";
        grid-template-columns: 1fr 1.2fr;
        grid-template-rows: auto 1fr;
        margin-top: min(6.25rem,100px)
    }
}

.c-aalberts-way__bottom__title {
    grid-area: title;
    margin-bottom: 2.5625rem
}

@media screen and (min-width: 48em) {
    .c-aalberts-way__bottom__title {
        max-width:min(31.25rem,500px);
        margin-bottom: 0
    }
}

.c-aalberts-way__bottom__copy {
    grid-area: copy;
    color: #66676a
}

@media screen and (min-width: 48em) {
    .c-aalberts-way__bottom__copy {
        padding-right:min(9.375rem,150px)
    }
}

.c-aalberts-way__bottom__image-wrap {
    grid-area: image
}

@media screen and (max-width: 47.99em) {
    .c-aalberts-way__bottom__image-wrap {
        margin-bottom:2.5625rem
    }
}

.c-aalberts-way__bottom__cta {
    margin-top: 3.5rem;
    text-align: center
}

@media screen and (min-width: 48em) {
    .c-aalberts-way__bottom__cta {
        margin-top:min(8.125rem,130px)
    }
}
