.hero-primary {
    position: relative;
    min-height: 100svh;
    overflow: hidden;
    display: flex;
    align-items: flex-end;
    color: white;
    isolation: isolate;
    padding: 96px 16px 110px;
    background: var(--framb);
    --hero-overlay-opacity: 1;
    --hero-pattern-opacity: 1;
}

.hero-primary::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    opacity: var(--hero-overlay-opacity);
    background: linear-gradient(180deg, rgba(53, 37, 25, 0.22) 0%, rgba(53, 37, 25, 0.12) 38%, rgba(53, 37, 25, 0.7) 100%), linear-gradient(90deg, rgba(53, 37, 25, 0.66) 0%, rgba(53, 37, 25, 0.2) 45%, rgba(53, 37, 25, 0.16) 100%);
    pointer-events: none;
}

.hero-primary::after {
    content: "";
    position: absolute;
    bottom: -157px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 2;
    width: 176px;
    height: 279px;
    opacity: var(--hero-pattern-opacity);
    background: rgba(245, 240, 236, 0.4);
    -webkit-mask: url("../images/illus-synora.png") no-repeat center;
    mask: url("../images/illus-synora.png") no-repeat center;
    -webkit-mask-size: cover;
    mask-size: cover;
    pointer-events: none;
}

.hero-primary--media {
    position: absolute;
    inset: 0;
    z-index: 0;
    will-change: clip-path, opacity;
}

.hero-primary--media img {
    display: block;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: 58% center;
    object-position: 58% center;
}

.hero-primary--container {
    position: relative;
    z-index: 3;
    width: 100%;
    max-width: 1280px;
    margin-inline: auto;
}

.hero-primary--content {
    max-width: 470px;
}

.hero-primary--content h1 {
    color: white;
    max-width: 420px;
    margin: 0;
    font-size: 36px;
    font-style: normal;
    font-weight: 800;
    line-height: 110%;
    text-transform: uppercase;
    white-space: normal;
    overflow-wrap: anywhere;
    margin-bottom: 24px;
}

.hero-primary--body {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.hero-primary--body p {
    max-width: 430px;
    margin: 0;
    color: white;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 140%;
    letter-spacing: 0.14px;
}

.hero-primary--body .btn {
    margin-top: 24px;
}

.hero-primary .btn:focus-visible {
    outline: 3px solid var(--beige);
    outline-offset: 4px;
}

.hero-primary--intro {
    position: absolute;
    inset: 0;
    z-index: 6;
    pointer-events: none;
    overflow: hidden;
}

.hero-primary--intro-panel {
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: 1;
    width: 50%;
    background: var(--framb);
    will-change: transform;
}

.hero-primary--intro-panel-left {
    left: 0;
}

.hero-primary--intro-panel-right {
    right: 0;
}

.hero-primary--intro-logo-white,
.hero-primary--intro-logo-image {
    position: absolute;
    inset: 0;
    z-index: 2;
    -webkit-mask: url("../images/logo-white.svg") no-repeat center;
    mask: url("../images/logo-white.svg") no-repeat center;
    -webkit-mask-size: clamp(230px, 34vw, 380px) auto;
    mask-size: clamp(230px, 34vw, 609px) auto;
}

.hero-primary--intro-logo-white {
    background: white;
}

.hero-primary--intro-logo-image {
    opacity: 0;
    background-image: var(--hero-image-url);
    background-position: 58% center;
    background-size: cover;
}

@media screen and (min-width: 992px) {
    .hero-primary {
        padding: 144px 40px 64px;
    }

    .hero-primary::after {
        width: 345px;
        height: 559px;
        bottom: 0;
        right: 0;
        left: unset;
        transform: translateX(50%);
    }

    .hero-primary--media img {
        -o-object-position: center;
        object-position: center;
    }

    .hero-primary--intro-logo-image {
        background-position: center;
    }

    .hero-primary--content {
        max-width: 911px;
    }

    .hero-primary--content h1 {
        max-width: 911px;
        font-size: 64px;
    }

    .hero-primary--body {
        flex-direction: row;
        flex-wrap: wrap;
        align-items: flex-end;
        gap: 32px;
        margin-top: 24px;
    }

    .hero-primary--body p {
        max-width: 456px;
        font-size: 16px;
    }
}

@media screen and (min-width: 1200px) {
    .hero-primary {
        padding-inline: 80px;
        padding-bottom: 80px;
    }
}

.home.hero-primary-intro-running {
    overflow: hidden;
}

.home.hero-primary-intro-running:not(.hero-primary-ready) .hero-primary {
    --hero-overlay-opacity: 0;
    --hero-pattern-opacity: 0;
}

.home.hero-primary-intro-running:not(.hero-primary-ready) .hero-primary--media {
    opacity: 0;
    clip-path: inset(0 50% 0 50%);
}

.home.hero-primary-intro-running:not(.hero-primary-ready) .hero-primary--content {
    opacity: 0;
    visibility: hidden;
}

@media (prefers-reduced-motion: reduce) {
    .hero-primary--media,
    .hero-primary--intro-panel,
    .hero-primary--intro-logo-white,
    .hero-primary--intro-logo-image,
    .hero-primary .btn,
    .hero-primary .btn span,
    .hero-primary .btn span::before {
        transition: none;
        will-change: auto;
    }
}

/*# sourceMappingURL=style.css.map */


.acf-block-preview .hero-primary {
    position: relative;
    min-height: 50svh;
    overflow: hidden;
    display: flex;
    align-items: flex-end;
    color: white;
    isolation: isolate;
    padding: 96px 16px 110px;
    background: var(--framb);
    --hero-overlay-opacity: 1;
    --hero-pattern-opacity: 1;
}

.acf-block-preview .hero-primary::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    opacity: var(--hero-overlay-opacity);
    background: linear-gradient(180deg, rgba(53, 37, 25, 0.22) 0%, rgba(53, 37, 25, 0.12) 38%, rgba(53, 37, 25, 0.7) 100%), linear-gradient(90deg, rgba(53, 37, 25, 0.66) 0%, rgba(53, 37, 25, 0.2) 45%, rgba(53, 37, 25, 0.16) 100%);
    pointer-events: none;
}

.acf-block-preview .hero-primary::after {
    content: "";
    position: absolute;
    bottom: -157px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 2;
    width: 176px;
    height: 279px;
    opacity: var(--hero-pattern-opacity);
    background: rgba(245, 240, 236, 0.4);
    -webkit-mask: url("../images/illus-synora.png") no-repeat center;
    mask: url("../images/illus-synora.png") no-repeat center;
    -webkit-mask-size: cover;
    mask-size: cover;
    pointer-events: none;
}

.acf-block-preview .hero-primary--media {
    position: absolute;
    inset: 0;
    z-index: 0;
    will-change: clip-path, opacity;
}

.acf-block-preview .hero-primary--media img {
    display: block;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: 58% center;
    object-position: 58% center;
}

.acf-block-preview .hero-primary--container {
    position: relative;
    z-index: 3;
    width: 100%;
    max-width: 1280px;
    margin-inline: auto;
}

.acf-block-preview .hero-primary--content {
    max-width: 470px;
}

.acf-block-preview .hero-primary--content h1 {
    color: white;
    max-width: 420px;
    margin: 0;
    font-size: 36px;
    font-style: normal;
    font-weight: 800;
    line-height: 110%;
    text-transform: uppercase;
    white-space: normal;
    overflow-wrap: anywhere;
    margin-bottom: 24px;
}

.acf-block-preview .hero-primary--body {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.acf-block-preview .hero-primary--body p {
    max-width: 430px;
    margin: 0;
    color: white;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 140%;
    letter-spacing: 0.14px;
}

.acf-block-preview .hero-primary--body .btn {
    margin-top: 24px;
}

.acf-block-preview .hero-primary--intro {
    position: absolute;
    inset: 0;
    z-index: 6;
    pointer-events: none;
    overflow: hidden;
}

.acf-block-preview .hero-primary--intro-panel {
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: 1;
    width: 50%;
    background: var(--framb);
    will-change: transform;
}

.acf-block-preview .hero-primary--intro-panel-left {
    left: 0;
}

.acf-block-preview .hero-primary--intro-panel-right {
    right: 0;
}

.acf-block-preview .hero-primary--intro-logo-white,
.acf-block-preview .hero-primary--intro-logo-image {
    position: absolute;
    inset: 0;
    z-index: 2;
    -webkit-mask: url("../images/logo-white.svg") no-repeat center;
    mask: url("../images/logo-white.svg") no-repeat center;
    -webkit-mask-size: clamp(230px, 34vw, 380px) auto;
    mask-size: clamp(230px, 34vw, 609px) auto;
}

.acf-block-preview .hero-primary--intro-logo-white {
    background: white;
}

.acf-block-preview .hero-primary--intro-logo-image {
    opacity: 0;
    background-image: var(--hero-image-url);
    background-position: 58% center;
    background-size: cover;
}

@media screen and (min-width: 992px) {
    .acf-block-preview .hero-primary {
        padding: 144px 40px 64px;
    }

    .acf-block-preview .hero-primary::after {
        width: 345px;
        height: 559px;
        bottom: 0;
        right: 0;
        left: unset;
        transform: translateX(50%);
    }

    .acf-block-preview .hero-primary--media img {
        -o-object-position: center;
        object-position: center;
    }

    .acf-block-preview .hero-primary--intro-logo-image {
        background-position: center;
    }

    .acf-block-preview .hero-primary--content {
        max-width: 911px;
    }

    .acf-block-preview .hero-primary--content h1 {
        max-width: 911px;
        font-size: 64px;
    }

    .acf-block-preview .hero-primary--body {
        flex-direction: row;
        flex-wrap: wrap;
        align-items: flex-end;
        gap: 32px;
        margin-top: 24px;
    }

    .acf-block-preview .hero-primary--body p {
        max-width: 456px;
        font-size: 16px;
    }
}

@media screen and (min-width: 1200px) {
    .acf-block-preview .hero-primary {
        padding-inline: 80px;
        padding-bottom: 80px;
    }
}

.home.acf-block-preview .hero-primary-intro-running {
    overflow: hidden;
}

.home:not(.acf-block-preview .hero-primary-ready) .acf-block-preview .hero-primary {
    --hero-overlay-opacity: 0;
    --hero-pattern-opacity: 0;
}

.home:not(.acf-block-preview .hero-primary-ready) .acf-block-preview .hero-primary--media {
    opacity: 0;
    clip-path: inset(0 50% 0 50%);
}

.home:not(.acf-block-preview .hero-primary-ready) .acf-block-preview .hero-primary--content {
    opacity: 0;
    visibility: hidden;
}

/*# sourceMappingURL=style.css.map */
