@charset "UTF-8";
.flickity-enabled {
position: relative;
}
.flickity-enabled:focus { outline: none; }
.flickity-viewport {
overflow: hidden;
position: relative;
height: 100%;
}
.flickity-slider {
position: absolute;
width: 100%;
height: 100%;
} .flickity-enabled.is-draggable {
-webkit-tap-highlight-color: transparent;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.flickity-enabled.is-draggable .flickity-viewport {
cursor: move;
cursor: -webkit-grab;
cursor: grab;
}
.flickity-enabled.is-draggable .flickity-viewport.is-pointer-down {
cursor: -webkit-grabbing;
cursor: grabbing;
} .flickity-button {
position: absolute;
background: hsla(0, 0%, 100%, 0.75);
border: none;
color: #333;
}
.flickity-button:hover {
background: white;
cursor: pointer;
}
.flickity-button:focus {
outline: none;
box-shadow: 0 0 0 5px #19F;
}
.flickity-button:active {
opacity: 0.6;
}
.flickity-button:disabled {
opacity: 0.3;
cursor: auto; pointer-events: none;
}
.flickity-button-icon {
fill: currentColor;
} .flickity-prev-next-button {
top: 50%;
width: 44px;
height: 44px;
border-radius: 50%; transform: translateY(-50%);
}
.flickity-prev-next-button.previous { left: 10px; }
.flickity-prev-next-button.next { right: 10px; } .flickity-rtl .flickity-prev-next-button.previous {
left: auto;
right: 10px;
}
.flickity-rtl .flickity-prev-next-button.next {
right: auto;
left: 10px;
}
.flickity-prev-next-button .flickity-button-icon {
position: absolute;
left: 20%;
top: 20%;
width: 60%;
height: 60%;
} .flickity-page-dots {
position: absolute;
width: 100%;
bottom: -25px;
padding: 0;
margin: 0;
list-style: none;
text-align: center;
line-height: 1;
}
.flickity-rtl .flickity-page-dots { direction: rtl; }
.flickity-page-dots .dot {
display: inline-block;
width: 10px;
height: 10px;
margin: 0 8px;
background: #333;
border-radius: 50%;
opacity: 0.25;
cursor: pointer;
}
.flickity-page-dots .dot.is-selected {
opacity: 1;
}.splitting .word,
.splitting .char {
display: inline-block;
} .splitting .char {
position: relative;
} .splitting .char::before,
.splitting .char::after {
content: attr(data-char);
position: absolute;
top: 0;
left: 0;
visibility: hidden;
transition: inherit;
user-select: none;
} .splitting { --word-center: calc((var(--word-total) - 1) / 2); --char-center: calc((var(--char-total) - 1) / 2); --line-center: calc((var(--line-total) - 1) / 2);
}
.splitting .word { --word-percent: calc(var(--word-index) / var(--word-total)); --line-percent: calc(var(--line-index) / var(--line-total));
}
.splitting .char { --char-percent: calc(var(--char-index) / var(--char-total)); --char-offset: calc(var(--char-index) - var(--char-center)); --distance: calc(
(var(--char-offset) * var(--char-offset)) / var(--char-center)
); --distance-sine: calc(var(--char-offset) / var(--char-center)); --distance-percent: calc((var(--distance) / var(--char-center)));
}
 @font-face {
font-family: "Founders Grotesk";
font-style: normal;
font-weight: 300;
src: url(//alberts.nz/wp-content/themes/alberts-1/assets/fonts/FoundersGrotesk-Light.woff2) format("woff2"), url(//alberts.nz/wp-content/themes/alberts-1/assets/fonts/FoundersGrotesk-Light.woff) format("woff");
font-display: swap;
}
@font-face {
font-family: Rondal;
font-style: normal;
font-weight: 700;
src: url(//alberts.nz/wp-content/themes/alberts-1/assets/fonts/Rondal-Bold.woff2) format("woff2"), url(//alberts.nz/wp-content/themes/alberts-1/assets/fonts/Rondal-Bold.woff) format("woff");
font-display: swap;
}
@font-face {
font-family: "Founders Grotesk";
font-style: normal;
font-weight: 500;
src: url(//alberts.nz/wp-content/themes/alberts-1/assets/fonts/FoundersGrotesk-Medium.woff2) format("woff2"), url(//alberts.nz/wp-content/themes/alberts-1/assets/fonts/FoundersGrotesk-Medium.woff) format("woff");
font-display: swap;
}
@font-face {
font-family: Rondal;
font-style: normal;
font-weight: 600;
src: url(//alberts.nz/wp-content/themes/alberts-1/assets/fonts/Rondal-Semibold.woff2) format("woff2"), url(//alberts.nz/wp-content/themes/alberts-1/assets/fonts/Rondal-Semibold.woff) format("woff");
font-display: swap;
}   *,
::before,
::after {
box-sizing: border-box;
}
html { font-family: system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
line-height: 1.15; -webkit-text-size-adjust: 100%; tab-size: 4; } body {
margin: 0; }  b,
strong {
font-weight: bolder;
} code,
kbd,
samp,
pre {
font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", Menlo, monospace; font-size: 1em; } small {
font-size: 80%;
} sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sub {
bottom: -0.25em;
}
sup {
top: -0.5em;
}  table {
border-color: currentcolor;
}  button,
input,
optgroup,
select,
textarea {
font-family: inherit; font-size: 100%; line-height: 1.15; margin: 0; } button,
[type=button],
[type=reset],
[type=submit] {
-webkit-appearance: button;
} legend {
padding: 0;
} progress {
vertical-align: baseline;
} ::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
height: auto;
} [type=search] {
-webkit-appearance: textfield; outline-offset: -2px; } ::-webkit-search-decoration {
-webkit-appearance: none;
} ::-webkit-file-upload-button {
-webkit-appearance: button; font: inherit; }  summary {
display: list-item;
}
html {
font-size: 16px;
}
@media only screen and (min-width: 1536px) {
html {
font-size: 16px;
}
}
@media only screen and (max-width: 1535px) {
html {
font-size: 14px;
}
}
@media only screen and (max-width: 1279px) {
html {
font-size: 14px;
}
}
@media only screen and (max-width: 1023px) {
html {
font-size: 16px;
}
}
@media only screen and (max-width: 767px) {
html {
font-size: 14px;
}
}
@media only screen and (max-width: 639px) {
html {
font-size: 13px;
}
}
@media only screen and (max-width: 399px) {
html {
font-size: 12px;
}
}
:root {
--font-family-base: "Founders Grotesk", sans-serif;
--font-family-secondary: "Rondal", serif;
--screen-full: 100%;
--screen-xs: 400px;
--screen-sm: 640px;
--screen-md: 768px;
--screen-lg: 1024px;
--screen-xl: 1280px;
--screen-xxl: 1536px;
--color-dark-green: #2F5A47;
--color-white: #FFF;
--color-black: #000;
--color-primary: #C7B584;
--color-primary-lighter: #DCD0B3;
--color-light: #E8E1D3;
--color-light-white: #E8E1D1;
--font-size-base: 1rem;
--font-size-md: 1.125rem;
--font-size-lg: 1.25rem;
--font-size-xl: 1.5rem;
--font-size-xxl: 2rem;
--font-size-huge: 8rem;
}
body {
font-family: var(--font-family-base);
font-size: 1rem;
font-weight: 300;
line-height: 1.4;
}
body.admin-bar .header-site {
margin-top: 32px;
}
@media only screen and (max-width: 781px) {
body.admin-bar .header-site {
margin-top: 46px;
}
}
h1, h2, h3, h4, h5, h6 {
line-height: 1 !important;
}
:root {
--container: 1536px;
--container-space: calc( calc((100% - var(--container))) / 2 + 2rem);
}
@media only screen and (max-width: 1535px) {
:root {
--container: 1280px;
}
}
@media only screen and (max-width: 1279px) {
:root {
--container: 1024px;
}
}
@media only screen and (max-width: 1023px) {
:root {
--container: 768px;
}
}
@media only screen and (max-width: 767px) {
:root {
--container: 100%;
}
}
@media only screen and (max-width: 399px) {
:root {
--container-space: calc( calc((100% - var(--container))) / 2 + 1.5rem);
}
}
.container {
width: 100%;
max-width: var(--container);
margin-right: auto;
margin-left: auto;
padding-right: 2rem;
padding-left: 2rem;
}
@media only screen and (max-width: 399px) {
.container {
padding-right: 1.5rem;
padding-left: 1.5rem;
}
}
.header-site {
position: absolute;
z-index: 50;
z-index: 2;
top: 0;
right: 0;
left: 0;
width: 100%;
padding-top: 3rem;
padding-bottom: 3rem;
background: linear-gradient(to bottom, rgba(0, 0, 0, 0.2) 0%, transparent);
}
.header-site.headroom--pinned:not(.headroom--top) {
position: fixed;
top: 0;
right: 0;
left: 0;
width: 100%;
padding-top: 1rem;
padding-bottom: 1rem;
transition: all 0.3s ease-in-out;
background: linear-gradient(to bottom, rgba(255, 255, 255, 0.9) 0%, transparent);
-webkit-backdrop-filter: blur(2px);
backdrop-filter: blur(2px);
}
.header-site.headroom--pinned:not(.headroom--top) .header-buttons button,
.header-site.headroom--pinned:not(.headroom--top) .header-buttons a {
color: var(--color-black);
}
.header-site.headroom--pinned:not(.headroom--top) .header-logo path {
fill: var(--color-black);
}
.header-inner {
display: flex;
align-items: center;
justify-content: space-between;
padding-right: var(--container-space);
padding-left: calc(var(--container-space) - 6.75rem);
gap: 0.5rem;
}
.header-toggle {
width: 100%;
max-width: 6.25rem;
border: none;
background: none;
cursor: pointer;
}
.header-toggle svg {
width: 100%;
height: auto;
}
.header-logo {
display: flex;
align-items: center;
max-width: 48rem;
margin: 0;
margin-right: auto;
}
@media only screen and (max-width: 1023px) {
.header-logo {
max-width: 10rem;
}
}
.header-logo path {
fill: var(--color-white);
}
.error404 .header-logo path {
fill: var(--color-black);
}
.header-buttons {
display: flex;
align-items: center;
gap: 4rem;
}
@media only screen and (max-width: 1279px) {
.header-buttons {
gap: 2rem;
}
}
@media only screen and (max-width: 1023px) {
.header-buttons {
gap: 1rem;
}
}
@media only screen and (max-width: 799px) {
.header-buttons {
gap: 0.5rem;
}
}
@media only screen and (max-width: 639px) {
.header-buttons {
display: none;
}
}
.header-buttons button,
.header-buttons a {
padding: 0.5rem;
border: none;
background: transparent;
color: var(--color-white);
font-size: 0.9rem;
font-weight: 400;
letter-spacing: 0.25ch;
line-height: 1;
text-decoration: none;
text-transform: uppercase;
cursor: pointer;
}
@media only screen and (max-width: 1023px) {
.header-buttons button,
.header-buttons a {
font-size: 0.8rem;
}
}
@media only screen and (max-width: 799px) {
.header-buttons button,
.header-buttons a {
font-size: 0.7rem;
}
}
.error404 .header-buttons button,
.error404 .header-buttons a {
color: var(--color-black);
}
.header-buttons-mobile {
display: none;
flex-direction: column;
gap: 0.5rem;
}
@media only screen and (max-width: 639px) {
.header-buttons-mobile {
display: flex;
}
}
.header-buttons-mobile button,
.header-buttons-mobile a {
padding: 0.5rem;
border: none;
background: transparent;
color: var(--color-black);
font-size: 0.9rem;
font-weight: 400;
letter-spacing: 0.25ch;
line-height: 1;
text-align: left;
text-decoration: none;
text-transform: uppercase;
cursor: pointer;
pointer-events: auto;
}
@media only screen and (max-width: 1023px) {
.header-buttons-mobile button,
.header-buttons-mobile a {
font-size: 0.8rem;
}
}
@media only screen and (max-width: 799px) {
.header-buttons-mobile button,
.header-buttons-mobile a {
font-size: 0.7rem;
}
}
.error404 .header-buttons-mobile button,
.error404 .header-buttons-mobile a {
color: var(--color-black);
}
.header-seo {
display: none;
}
.form-hubspot {
display: flex;
visibility: hidden;
position: fixed;
z-index: -1;
flex-direction: column;
align-items: center;
justify-content: center;
width: 100%;
height: 100%;
padding: 2rem;
transition: opacity 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
opacity: 0;
background-color: rgba(232, 225, 209, 0.95);
inset: 0;
}
body.hubspot-open .form-hubspot {
visibility: visible;
z-index: 1000;
opacity: 1;
}
.form-hubspot-header {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
width: 100%;
text-align: center;
}
.form-hubspot-header h2 {
margin: 0;
font-family: var(--font-family-secondary);
font-size: 3rem;
font-weight: 400;
}
.form-hubspot-header p {
font-size: var(--font-size-xl);
}
.form-hubspot-header p a {
color: var(--color-primary);
text-decoration: underline;
}
.form-hubspot-modal {
position: relative;
}
.form-hubspot-close {
display: flex;
position: absolute;
z-index: 2;
top: -1.5rem;
right: -1.5rem;
align-items: center;
justify-content: center;
width: 3.5rem;
height: 3.5rem;
transform: rotate(0deg);
transition: transform 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
border: 1px solid var(--color-primary);
border-radius: 50%;
background: none;
background-color: var(--color-white);
cursor: pointer;
will-change: transform;
}
.form-hubspot-close:hover {
transform: rotate(720deg);
}
.form-hubspot-close svg {
width: 1.5rem;
height: 1.5rem;
fill: var(--color-primary);
}
.form-hubspot-inner {
display: flex;
position: relative;
flex-direction: column;
width: 100%;
max-width: 700px;
max-height: calc(100dvh - 4rem);
padding: 4rem;
overflow: auto;
border: 1px solid var(--color-primary);
background-color: #FFF;
gap: 2rem;
}
body.hubspot-download .form-hubspot-inner {
padding: 0;
}
@media only screen and (max-width: 639px) {
.form-hubspot-inner {
width: 100%;
max-width: 100%;
padding: 3rem 2rem;
}
}
.form-hubspot-inner iframe {
position: relative;
width: 100%;
height: 100%;
border: none;
}
.form-hubspot-booking {
display: none;
flex-direction: column;
gap: 2rem;
}
body.hubspot-booking .form-hubspot-booking {
display: flex;
}
.form-hubspot-download {
display: none;
flex-direction: column;
gap: 2rem;
}
body.hubspot-download .form-hubspot-download {
display: flex;
}
.form-hubspot-download iframe {
width: 600px !important;
max-width: 100% !important;
}
.main-site {
background-color: #FFF;
}
.site-main {
position: relative;
z-index: 1;
}
.site-main h1, .site-main h2, .site-main h3, .site-main h4, .site-main h5, .site-main h6,
.site-main p, .site-main ul, .site-main span, .site-main blockquote, .site-main ol, .site-main a, .site-main img, .site-main table, .site-main tr, .site-main th, .site-main td, .site-main li, .site-main dl, .site-main dt, .site-main dd, .site-main pre, .site-main code, .site-main form, .site-main input, .site-main textarea, .site-main button, .site-main select, .site-main label, .site-main nav, .site-main article, .site-main aside, .site-main figure, .site-main figcaption {
visibility: hidden;
}
.fonts-loaded .site-main h1, .fonts-loaded .site-main h2, .fonts-loaded .site-main h3, .fonts-loaded .site-main h4, .fonts-loaded .site-main h5, .fonts-loaded .site-main h6,
.fonts-loaded .site-main p, .fonts-loaded .site-main ul, .fonts-loaded .site-main span, .fonts-loaded .site-main blockquote, .fonts-loaded .site-main ol, .fonts-loaded .site-main a, .fonts-loaded .site-main img, .fonts-loaded .site-main table, .fonts-loaded .site-main tr, .fonts-loaded .site-main th, .fonts-loaded .site-main td, .fonts-loaded .site-main li, .fonts-loaded .site-main dl, .fonts-loaded .site-main dt, .fonts-loaded .site-main dd, .fonts-loaded .site-main pre, .fonts-loaded .site-main code, .fonts-loaded .site-main form, .fonts-loaded .site-main input, .fonts-loaded .site-main textarea, .fonts-loaded .site-main button, .fonts-loaded .site-main select, .fonts-loaded .site-main label, .fonts-loaded .site-main nav, .fonts-loaded .site-main article, .fonts-loaded .site-main aside, .fonts-loaded .site-main figure, .fonts-loaded .site-main figcaption {
visibility: visible;
}
.site {
overflow: hidden;
}
.footer-site {
padding-top: 6rem;
padding-bottom: 3rem;
background-color: var(--color-primary);
}
.footer-inner {
display: flex;
flex-direction: column;
gap: 3rem;
}
.footer-top {
display: flex;
align-items: center;
--spacing: 2.65rem;
gap: 0;
}
@media only screen and (max-width: 1279px) {
.footer-top {
--spacing: 2rem;
}
}
@media only screen and (max-width: 1023px) {
.footer-top {
flex-direction: column;
gap: var(--spacing);
}
}
@media only screen and (max-width: 399px) {
.footer-top {
align-items: flex-start;
}
}
.footer-logo {
display: block;
width: 100%;
margin: 0;
margin-right: auto;
}
@media only screen and (max-width: 1023px) {
.footer-logo {
max-width: 20rem;
margin-left: auto;
}
}
@media only screen and (max-width: 399px) {
.footer-logo {
max-width: 14rem;
margin-left: 0;
}
}
.footer-logo svg {
width: 100%;
height: auto;
}
.footer-contact {
display: flex;
margin-left: var(--spacing);
padding-left: var(--spacing);
border-left: 1px solid rgba(255, 255, 255, 0.5);
}
@media only screen and (max-width: 639px) {
.footer-contact {
flex-wrap: wrap;
justify-content: center;
margin-left: 0;
padding-left: 0;
border-left: none;
}
}
@media only screen and (max-width: 399px) {
.footer-contact {
flex-direction: column;
gap: 1rem;
}
}
.footer-contact a {
display: flex;
align-items: center;
margin-right: var(--spacing);
padding-right: var(--spacing);
border-right: 1px solid rgba(255, 255, 255, 0.5);
color: var(--color-black);
text-decoration: none;
gap: 0.5rem;
}
.footer-contact a:hover {
color: var(--color-dark-green);
}
@media only screen and (max-width: 639px) {
.footer-contact a:last-child {
margin-right: 0;
padding-right: 0;
border-right: none;
}
}
@media only screen and (max-width: 399px) {
.footer-contact a {
border-right: 0;
}
}
.footer-contact span {
transition: color 0.3s cubic-bezier(0.075, 0.82, 0.165, 1);
font-size: var(--font-size-xl);
white-space: nowrap;
will-change: color;
}
.footer-contact svg {
width: calc(var(--spacing) * 1.1);
height: calc(var(--spacing) * 1.1);
}
.footer-social {
display: flex;
align-items: center;
gap: 1rem;
}
.footer-social ul {
display: flex;
margin: 0;
padding: 0;
list-style: none;
gap: 0.5rem;
}
.footer-social a {
display: block;
width: var(--spacing);
height: var(--spacing);
}
.footer-social svg {
width: 100%;
height: auto;
}
.footer-social span {
font-size: var(--font-size-xl);
}
.footer-bottom {
display: flex;
flex-wrap: wrap;
align-items: flex-end;
justify-content: space-between;
font-size: 1.15em;
gap: 2rem;
}
@media only screen and (max-width: 1023px) {
.footer-bottom {
flex-direction: column;
align-items: center;
justify-content: unset;
gap: 0.5rem;
}
}
@media only screen and (max-width: 399px) {
.footer-bottom {
align-items: flex-start;
}
}
@media only screen and (max-width: 1023px) {
.footer-bottom-copyrights {
order: 3;
}
}
.footer-bottom-links {
display: flex;
flex-wrap: wrap;
gap: 1.5rem;
}
.footer-bottom-are {
flex: 1;
width: 100%;
max-width: 3rem;
}
@media only screen and (max-width: 1023px) {
.footer-bottom-are {
order: 4;
margin-top: 1rem;
}
}
@media only screen and (max-width: 399px) {
.footer-bottom-are {
max-width: 12rem;
}
}
.footer-bottom-are img {
width: 100%;
height: auto;
}
.footer-bottom p {
margin: 0;
padding-bottom: 0.5rem;
}
@media only screen and (max-width: 1023px) {
.footer-bottom p {
padding-bottom: 0;
}
}
.footer-bottom p a {
transition: border-color 0.3s cubic-bezier(0.075, 0.82, 0.165, 1);
border-bottom: 1px solid transparent;
color: var(--color-black);
text-decoration: none;
will-change: border-color;
}
.footer-bottom p a:hover {
border-color: var(--color-black);
}
.site-menu-open {
overflow: hidden;
}
.menu-site {
display: flex;
position: fixed;
z-index: 999;
top: 0;
bottom: 0;
left: 0;
flex-direction: column;
width: 100%;
overflow: auto;
transform: translateX(-100%);
transition: transform, opacity;
transition-duration: 0.3s;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
opacity: 0;
will-change: transform, opacity;
}
.site-menu-open .menu-site {
transform: translateX(0);
transition-duration: 0.5s;
opacity: 1;
}
.menu-site-container {
flex-grow: 1;
padding: 1rem 0;
}
.menu-site-header {
display: flex;
align-items: center;
justify-content: space-between;
}
.menu-site-logo {
display: flex;
}
.menu-site-logo img,
.menu-site-logo svg {
width: 100%;
max-width: 12rem;
height: auto;
}
.menu-site-close {
display: flex;
position: relative;
align-items: center;
justify-content: center;
width: 4rem;
height: 4rem;
transform: rotate(0deg);
transition: transform 3s cubic-bezier(0.075, 0.82, 0.165, 1);
border: none;
outline: none;
background: transparent;
cursor: pointer;
}
.menu-site-close:hover {
transform: rotate(360deg);
}
.menu-site-close span {
position: absolute;
top: 50%;
left: 50%;
width: 3rem;
height: 3px;
transform: translate(-50%, -50%) rotate(45deg);
background-color: var(--color-primary);
}
.menu-site-close span:last-child {
transform: translate(-50%, -50%) rotate(-45deg);
}
.menu-site-level-1 {
display: flex;
position: absolute;
z-index: 2;
flex-direction: column;
width: 100%;
max-width: 600px;
height: 100%;
padding: 3rem;
overflow: auto;
background-color: #E8E1D3;
box-shadow: 0 0 2rem rgba(0, 0, 0, 0.2);
inset: 0;
}
@media only screen and (max-width: 1199px) {
.menu-site-level-1 {
max-width: 400px;
padding: 2rem;
}
}
@media only screen and (max-width: 799px) {
.menu-site-level-1 {
max-width: 600px;
}
}
.menu-site-level-2 {
position: absolute;
z-index: 1;
width: 100%;
max-width: 600px;
height: 100%;
overflow: auto;
transform: translateX(-10%);
transition: transform, opacity;
transition-duration: 0.25s;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
opacity: 0;
background-color: #E8E1D3;
box-shadow: 0 0 2rem rgba(0, 0, 0, 0.2);
will-change: transform, opacity;
}
@media only screen and (max-width: 1199px) {
.menu-site-level-2 {
max-width: 400px;
}
}
@media only screen and (max-width: 799px) {
.menu-site-level-2 {
z-index: 3;
max-width: 600px;
transform: translateX(-110%);
}
}
.is-sub-open .menu-site-level-2 {
transform: translateX(100%);
transition: transform, opacity;
transition-duration: 0.25s;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
opacity: 1;
will-change: transform, opacity;
}
@media only screen and (max-width: 799px) {
.is-sub-open .menu-site-level-2 {
transform: translateX(0%);
}
}
.menu-site-submenu {
visibility: hidden;
position: absolute;
width: 100%;
height: 100%;
padding: 3rem;
opacity: 0;
inset: 0;
}
.menu-site-submenu.is-active {
visibility: visible;
opacity: 1;
}
.menu-site-submenu.is-active .menu-site-submenu-header > * {
transform: translateY(0);
transition-duration: 1s;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: calc(0.1s * var(--item-index) + 0.35s);
opacity: 1;
}
.menu-site-submenu.is-active ul li {
transform: translateY(0);
transition-duration: 1s;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: calc(0.1s * var(--item-index) + 0.4s);
opacity: 1;
}
.menu-site-submenu-header {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 2rem;
padding-bottom: 2rem;
border-bottom: var(--color-primary) 1px solid;
}
.menu-site-submenu-header > * {
transform: translateY(1rem);
transition: opacity, transform;
transition-duration: 0s;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: opacity, transform;
}
.menu-site-submenu-back {
border: none;
background: transparent;
cursor: pointer;
}
.menu-site-submenu-back svg {
width: 4rem;
height: 4rem;
transform: rotate(180deg);
transition: transform 3s cubic-bezier(0.075, 0.82, 0.165, 1);
will-change: transform;
}
.menu-site-submenu ul {
display: flex;
flex-direction: column;
margin: 0;
padding: 0;
list-style: none;
gap: 0.5rem;
}
.menu-site-submenu ul li {
position: relative;
margin: 0;
padding: 0;
transform: translateY(1rem);
transition: opacity, transform;
transition-duration: 0s;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
list-style: none;
will-change: opacity, transform;
}
.menu-site-submenu a {
display: block;
padding: 0.5rem 0;
transition: opacity 0.75s cubic-bezier(0.075, 0.82, 0.165, 1) calc(0.1s * var(--item-index) + 0.25s), transform 0.75s cubic-bezier(0.075, 0.82, 0.165, 1) calc(0.1s * var(--item-index) + 0.25s), color 0.2s cubic-bezier(0.075, 0.82, 0.165, 1) 0s;
color: var(--color-black);
font-family: var(--font-family-secondary);
font-size: 2rem;
text-decoration: none;
will-change: opacity, transform;
}
@media only screen and (max-width: 639px) {
.menu-site-submenu a {
font-size: 1.5rem;
}
}
@media only screen and (max-width: 399px) {
.menu-site-submenu a {
font-size: 7.5vw;
}
}
.menu-site-submenu a:hover {
color: var(--color-white);
}
.menu-site-submenu a.menu-site-submenu-title {
font-size: 3rem;
}
@media only screen and (max-width: 639px) {
.menu-site-submenu a.menu-site-submenu-title {
font-size: 2.5rem;
}
}
@media only screen and (max-width: 399px) {
.menu-site-submenu a.menu-site-submenu-title {
font-size: 10vw;
}
}
.menu-site-submenu a span {
padding-left: 2rem;
font-size: 1rem;
}
.menu-site-items {
margin: 0;
padding: 0;
list-style: none;
}
.menu-site-items li {
display: block;
position: relative;
margin: 0;
padding: 0;
overflow: hidden;
transition: border-color;
transition-duration: 3s;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: calc(0.1s * var(--item-index) + 0.25s);
list-style: none;
will-change: border-color;
}
.site-menu-open .menu-site-items li {
transition-duration: 0;
transition-delay: 0;
border-bottom-color: var(--color-primary);
}
.menu-site-items li:last-child {
border-bottom: none;
}
.menu-site-items a {
display: block;
padding: 1rem 0;
transform: translateY(300%);
transition: opacity 0.75s cubic-bezier(0.075, 0.82, 0.165, 1) calc(0.1s * var(--item-index) + 0.25s), transform 0.75s cubic-bezier(0.075, 0.82, 0.165, 1) calc(0.1s * var(--item-index) + 0.25s), color 0.2s cubic-bezier(0.075, 0.82, 0.165, 1) 0s;
opacity: 0;
color: var(--color-black);
font-family: var(--font-family-secondary);
font-size: 2rem;
text-decoration: none;
will-change: opacity, transform;
}
@media only screen and (max-width: 639px) {
.menu-site-items a {
font-size: 1.5rem;
}
}
@media only screen and (max-width: 399px) {
.menu-site-items a {
font-size: 7.5vw;
}
}
.menu-site-items a:hover {
color: var(--color-white);
}
.site-menu-open .menu-site-items a {
transform: translateY(0);
transition-duration: 0;
transition-delay: 0;
opacity: 1;
}
.menu-site-items a.has-children {
position: relative;
}
.menu-site-items a.has-children:hover svg {
margin-left: 0;
}
.menu-site-items a.has-children span {
position: relative;
z-index: 1;
}
.menu-site-items a.has-children svg {
z-index: 0;
width: 3rem;
height: 3rem;
margin-bottom: -1.5rem;
margin-left: 1rem;
transition: margin-left 1s cubic-bezier(0.075, 0.82, 0.165, 1);
}
.menu-site-bottom {
display: flex;
align-items: center;
justify-content: space-between;
margin-top: auto;
margin-bottom: 0;
padding-top: 2rem;
}
@media only screen and (max-width: 299px) {
.menu-site-bottom {
flex-direction: column;
gap: 1rem;
align-items: flex-start;
}
}
.menu-site-member-login {
display: flex;
display: block;
visibility: hidden;
align-items: center;
padding: 1rem 2rem;
transition: all 0.3s cubic-bezier(0.075, 0.82, 0.165, 1), opacity 1.5s cubic-bezier(0.075, 0.82, 0.165, 1) 1.5s;
opacity: 0;
background-color: var(--color-black);
color: var(--color-primary-lighter);
letter-spacing: 1px;
line-height: 1;
text-decoration: none;
text-transform: uppercase;
}
@media only screen and (max-width: 1023px) {
.menu-site-member-login {
font-size: 90%;
}
}
.menu-site-member-login:hover {
background-color: var(--color-primary);
color: var(--color-white);
}
.site-menu-open .menu-site-member-login {
visibility: visible;
opacity: 1;
}
.menu-site-member-login span {
position: relative;
z-index: 1;
font-size: var(--font-size-xl);
line-height: 1;
}
.menu-site-social {
transition: opacity 3s cubic-bezier(0.075, 0.82, 0.165, 1) 1.25s;
opacity: 0;
will-change: opacity;
}
.site-menu-open .menu-site-social {
opacity: 1;
}
.menu-site-social ul {
display: flex;
margin: 0;
padding: 0;
list-style: none;
gap: 0.5rem;
}
.menu-site-social ul li {
list-style: none;
}
.menu-site-social a {
display: block;
}
.menu-site-social svg {
width: 2.5rem;
height: 2.5rem;
}
.menu-site-social svg path {
fill: var(--color-black);
}
.screen-reader-text {
display: none;
}
.screens {
display: none;
position: fixed;
z-index: 9999;
bottom: 24px;
left: 16px;
}
body.logged-in .screens {
display: block;
}
.screens .xxl {
display: none;
}
@media only screen and (min-width: 1536px) {
.screens .xxl {
display: block;
}
}
.screens .xl {
display: none;
}
@media only screen and (min-width: 1280px) and (max-width: 1535px) {
.screens .xl {
display: block;
}
}
.screens .lg {
display: none;
}
@media only screen and (min-width: 1024px) and (max-width: 1279px) {
.screens .lg {
display: block;
}
}
.screens .md {
display: none;
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
.screens .md {
display: block;
}
}
.screens .sm {
display: none;
}
@media only screen and (min-width: 640px) and (max-width: 767px) {
.screens .sm {
display: block;
}
}
.screens .xs {
display: none;
}
@media only screen and (min-width: 400px) and (max-width: 639px) {
.screens .xs {
display: block;
}
}
.screens .xxs {
display: none;
}
@media only screen and (max-width: 399px) {
.screens .xxs {
display: block;
}
}
.screen {
margin-right: 2px;
margin-left: 2px;
padding: 10px;
border-radius: 4px;
font-size: 10px;
font-weight: 700;
line-height: 1;
text-transform: uppercase;
}
.screen.is-base {
background-color: #000;
color: #FFF;
}
.screen.is-down, .screen.is-up {
background-color: rgba(0, 0, 0, 0.1);
color: #000;
}
section[class^=b-] {
visibility: hidden;
}
.fonts-loaded section[class^=b-] {
visibility: visible;
}
[data-aos] {
visibility: hidden;
}
[data-aos].aos-init {
visibility: visible;
}
.s-post-header {
position: relative;
z-index: 1;
width: 100%;
overflow: hidden;
background-color: var(--color-dark-green);
}
.s-post-header.no-title {
display: none;
}
.s-post-header.is-404 {
display: flex;
align-items: center;
min-height: 80vh;
background-color: var(--color-light);
}
.s-post-header.is-404 h1 {
color: var(--color-black);
}
.s-post-header.is-404 p {
max-width: 500px;
margin-top: 2rem;
margin-right: auto;
margin-left: auto;
color: var(--color-black);
font-size: 1.25rem;
text-align: center;
}
.s-post-header-image {
position: absolute;
width: 100%;
height: 100%;
inset: 0;
overflow: hidden;
}
.s-post-header-image img {
position: absolute;
width: 100%;
height: 100%;
transform: scale(1.2);
transition: transform 5s cubic-bezier(0.075, 0.82, 0.165, 1);
will-change: transform;
object-fit: cover;
inset: 0;
}
.s-post-header-image.is-selected img {
transform: scale(1);
}
@media (prefers-reduced-motion: no-preference) {
.s-post-header-image.aos-init img {
transform: scale(1.2);
transition: transform;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
}
.s-post-header-image.aos-animate img {
transform: scale(1);
transition-duration: 6s;
}
}
.s-post-header-overlay {
position: absolute;
z-index: 1;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.2);
pointer-events: none;
user-select: none;
inset: 0;
}
.s-post-header-wrapper {
position: relative;
z-index: 2;
padding-top: 40ch;
padding-bottom: 40ch;
pointer-events: none;
}
.s-post-header-content {
width: 100%;
max-width: 968px;
margin-right: auto;
margin-left: auto;
}
.s-post-header-content h1 {
margin: 0;
padding-top: 1ch;
padding-bottom: 1ch;
color: var(--color-white);
font-family: var(--font-family-secondary);
font-size: 6rem;
font-weight: 400;
letter-spacing: -1px;
line-height: 1.2;
text-align: center;
user-select: none;
}
@media only screen and (max-width: 399px) {
.s-post-header-content h1 {
font-size: 4rem;
}
}
@media (prefers-reduced-motion: no-preference) {
.s-post-header-content.aos-init .word {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.s-post-header-content.aos-init .c-line-top {
right: unset;
left: 0;
width: 0;
transition: width 5s cubic-bezier(0.075, 0.82, 0.165, 1);
will-change: width;
}
.s-post-header-content.aos-init .c-line-bottom {
right: 0;
left: unset;
width: 0;
transition: width 5s cubic-bezier(0.075, 0.82, 0.165, 1) 0.75s;
will-change: width;
}
.s-post-header-content.aos-animate .c-line-top,
.s-post-header-content.aos-animate .c-line-bottom {
width: 100%;
transition-duration: 0;
transition-delay: 0;
}
.s-post-header-content.aos-animate .word {
transform: translateY(0);
transition-duration: 2s;
transition-delay: calc(var(--word-index) * 0.2s + 0.1s);
opacity: 1;
}
}
.s-post-content {
--content-width: 900px;
--spacing: 8rem;
padding-top: var(--spacing);
padding-bottom: var(--spacing);
background-color: var(--color-light);
word-wrap: break-word;
}
.s-post-content.no-title {
padding-top: 0;
padding-bottom: 0;
}
.s-post-content:not(.no-title) > [class^=b-]:first-child {
margin-top: calc(var(--spacing) * -1);
}
.s-post-content:not(.no-title) > [class^=b-]:last-child {
margin-bottom: calc(var(--spacing) * -1);
}
@media only screen and (max-width: 1279px) {
.s-post-content {
--spacing: 6rem;
}
}
@media only screen and (max-width: 1023px) {
.s-post-content {
--spacing: 5rem;
}
}
@media (prefers-reduced-motion: no-preference) {
.s-post-content.aos-init {
transition: opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: opacity;
}
.s-post-content.aos-animate {
transition-duration: 6s;
opacity: 1;
}
}
.s-post-content > :not([class^=b-]) {
max-width: var(--content-width);
margin-right: auto;
margin-left: auto;
padding-right: 2rem;
padding-left: 2rem;
}
.s-post-content > :not([class^=b-]).alignfull {
width: 100%;
max-width: 100%;
margin-right: 0;
margin-left: 0;
}
.s-post-content > :not([class^=b-]).alignwide {
width: 100%;
max-width: 100%;
max-width: var(--container);
margin-right: auto;
margin-left: auto;
padding-right: 2rem;
padding-left: 2rem;
}
.s-post-content h1, .s-post-content h2, .s-post-content h3, .s-post-content h4, .s-post-content h5, .s-post-content h6 {
font-family: var(--font-family-secondary);
}
.s-post-content h1 {
font-size: calc(var(--font-size-xxl) * 1.5);
}
.s-post-content h2 {
font-size: calc(var(--font-size-xl) * 1.5);
}
.s-post-content h3 {
font-size: calc(var(--font-size-lg) * 1.5);
}
.s-post-content h4 {
font-size: calc(var(--font-size-lg) * 1.5);
}
.s-post-content h5 {
font-size: calc(var(--font-size-lg) * 1.25);
}
.s-post-content h6 {
font-size: calc(var(--font-size-lg) * 1);
}
.s-post-content img {
max-width: 100%;
}
.s-post-content p a {
color: var(--color-dark-green);
font-weight: 500;
text-decoration: none;
}
.s-post-content p a:hover {
color: var(--color-primary);
text-decoration: underline;
}
.s-post-content ul {
margin: 0;
list-style: none;
}
.s-post-content ul li {
position: relative;
margin-left: 2rem;
padding-left: 1rem; list-style-type: none;
}
.s-post-content ul li::marker {
content: "•";
color: var(--color-dark-green);
font-size: 1.2em;
}
.s-post-content > p, .s-post-content > .wp-block-list {
font-size: var(--font-size-xl);
}
.site-main .s-post > .no-title {
--content-width: 900px;
--spacing: 8rem;
}
.site-main .s-post > .no-title > :not([class^=b-]) {
max-width: var(--content-width);
margin-right: auto;
margin-left: auto;
padding-right: 2rem;
padding-left: 2rem;
font-size: var(--font-size-lg);
}
@media only screen and (max-width: 1023px) {
.site-main .s-post > .no-title > :not([class^=b-]) {
font-size: var(--font-size-md);
}
}
.site-main .s-post > .no-title > :not([class^=b-]).alignfull {
width: 100%;
max-width: 100%;
margin-right: 0;
margin-left: 0;
}
.site-main .s-post > .no-title > :not([class^=b-]).alignwide {
width: 100%;
max-width: 100%;
max-width: var(--container);
margin-right: auto;
margin-left: auto;
padding-right: 2rem;
padding-left: 2rem;
}
.site-main .s-post > .no-title > h1, .site-main .s-post > .no-title > h2, .site-main .s-post > .no-title > h3, .site-main .s-post > .no-title > h4, .site-main .s-post > .no-title > h5, .site-main .s-post > .no-title > h6 {
font-family: var(--font-family-secondary);
}
.site-main .s-post > .no-title > h1 {
font-size: var(--font-size-xxl);
}
.site-main .s-post > .no-title > h2 {
font-size: var(--font-size-xl);
}
.site-main .s-post > .no-title > h3 {
font-size: var(--font-size-lg);
}
.site-main .s-post > .no-title > h4 {
font-size: var(--font-size-md);
}
.site-main .s-post > .no-title > h5 {
font-size: var(--font-size-sm);
}
.site-main .s-post > .no-title > h6 {
font-size: var(--font-size-xs);
}
.site-main .s-post > .no-title > .wp-block-image img {
max-width: 100%;
}
.c-archive {
--spacing: 8rem;
position: relative;
width: 100%;
padding-top: calc(var(--spacing) * 1.5);
padding-bottom: var(--spacing);
background-color: var(--color-primary-lighter);
}
@media only screen and (max-width: 1279px) {
.c-archive {
--spacing: 6rem;
}
}
@media only screen and (max-width: 1023px) {
.c-archive {
--spacing: 5rem;
}
}
.c-archive-list {
display: flex;
flex-wrap: wrap;
gap: 2rem;
align-items: stretch;
}
.c-archive-list .b-blog-item {
flex-direction: column-reverse;
justify-content: flex-end;
width: calc(50% - 1rem);
height: auto;
margin: 0;
}
@media only screen and (max-width: 639px) {
.c-archive-list .b-blog-item {
width: 100%;
}
}
.c-archive-list .b-blog-content {
width: 100%;
padding-top: 5rem;
padding-bottom: 6rem;
}
.c-archive-list .b-blog-image {
display: block;
width: 100%;
}
.c-archive-list .b-blog-image::after {
padding-top: 50%;
}
.c-archive-navigation {
display: flex;
justify-content: center;
margin-top: var(--spacing);
gap: calc(var(--spacing) / 2);
}
.c-archive-navigation-next a, .c-archive-navigation-prev a {
display: flex;
align-items: center;
color: var(--color-black);
text-decoration: none;
}
.c-archive-navigation-next a:hover svg, .c-archive-navigation-prev a:hover svg {
margin-left: 1rem;
}
.c-archive-navigation-next a span, .c-archive-navigation-prev a span {
position: relative;
z-index: 1;
font-family: var(--font-family-secondary);
font-size: var(--font-size-xl);
line-height: 1;
}
.c-archive-navigation-next a svg, .c-archive-navigation-prev a svg {
z-index: 0;
width: 6rem;
height: 6rem;
margin-bottom: -3rem;
margin-left: -1.5rem;
transition: margin-left 1s cubic-bezier(0.075, 0.82, 0.165, 1), margin-right 1s cubic-bezier(0.075, 0.82, 0.165, 1);
}
.c-archive-navigation-prev a {
flex-direction: row-reverse;
}
.c-archive-navigation-prev a:hover svg {
margin-right: 1rem;
margin-left: unset;
}
.c-archive-navigation-prev a svg {
margin-right: -1.5rem;
margin-left: unset;
transform: rotate(180deg);
}
.c-archive-navigation .nav-links {
display: flex;
gap: 1rem;
}
.c-archive-navigation .nav-links a, .c-archive-navigation .nav-links span {
color: var(--color-black);
font-family: var(--font-family-secondary);
font-size: var(--font-size-xl);
line-height: 1;
text-decoration: none;
}
.c-line {
position: relative;
}
.c-line-top {
display: block;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 3px;
background-color: var(--color-primary-lighter);
}
.c-line-bottom {
display: block;
position: absolute;
right: 0;
bottom: 0;
width: 100%;
height: 3px;
background-color: var(--color-primary-lighter);
}
.c-shape {
position: absolute;
z-index: 1;
width: 100%;
height: 100%;
inset: 0;
--spacing: 2rem;
--width: 2.5rem;
}
.c-shape-top {
position: absolute;
top: var(--spacing);
left: var(--spacing);
width: var(--width);
height: auto;
}
.c-shape-bottom {
position: absolute;
right: var(--spacing);
bottom: var(--spacing);
width: var(--width);
height: auto;
}
.rte a {
border-bottom: 1px solid transparent;
color: var(--color-dark-green);
text-decoration: none;
}
.aos-animate .rte a {
transition: border-bottom-color 0.3s ease-in-out;
transition-delay: 2s;
border-bottom: 1px solid var(--color-dark-green);
}
.rte a:hover {
text-decoration: none;
}
.rte ul li {
padding-left: 0.5rem;
}
.rte ul li::marker {
content: "●";
color: transparent;
}
.aos-animate .rte ul li::marker {
transition: color 0.3s cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 2s;
color: inherit;
}
.rte.aos-animate ul li::marker {
transition: color 0.3s cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: calc(var(--line-total) * 0.5s);
color: inherit;
}
.rte strong {
font-weight: 700;
}
.b-hero {
display: flex;
position: relative;
z-index: 1;
align-items: center;
width: 100%;
height: 100vh;
overflow: hidden;
}
.b-hero-slider {
display: flex;
position: absolute;
z-index: 0;
width: 100%;
height: 100%;
inset: 0;
}
.acf-block-component .b-hero-slider {
display: flex;
overflow-x: auto;
}
.b-hero-slider .flickity-viewport,
.b-hero-slider .flickity-slider {
position: absolute;
width: 100% !important;
height: 100% !important;
inset: 0 !important;
}
.b-hero-slider-dots {
display: flex;
position: absolute;
z-index: 3;
right: 0;
bottom: 2rem;
left: 0;
align-items: center;
justify-content: center;
gap: 0.5rem;
}
.b-hero-slider-dot {
width: 0.75rem;
height: 0.75rem;
border-radius: 100%;
background-color: var(--color-white);
cursor: pointer;
}
.b-hero-slider-dot.is-selected {
background-color: var(--color-primary);
}
.b-hero-slide {
position: relative;
flex: 0 0 100%;
width: 100%;
height: 100%;
overflow: hidden;
inset: 0;
}
.acf-block-component .b-hero-slide {
flex: 0 0 100%;
}
.b-hero-slide img {
position: absolute;
width: 100%;
height: 100%;
transform: scale(1.2);
transition: transform 5s cubic-bezier(0.075, 0.82, 0.165, 1);
will-change: transform;
object-fit: cover;
inset: 0;
}
.b-hero-slide.is-selected img {
transform: scale(1);
}
.b-hero-overlay {
position: absolute;
z-index: 1;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.2);
pointer-events: none;
user-select: none;
inset: 0;
}
.b-hero-content {
visibility: hidden;
width: 100%;
max-width: var(--content-width);
opacity: 0;
}
.site-loaded .b-hero-content {
visibility: visible;
opacity: 1;
}
.b-hero-content-wrapper {
position: relative;
z-index: 2;
padding-top: 40ch;
padding-bottom: 40ch;
pointer-events: none;
}
.b-hero-content-wrapper.is-right {
display: flex;
justify-content: flex-end;
padding-top: 60ch;
padding-bottom: 20ch;
}
.b-hero-content h2 {
visibility: hidden;
margin: 0;
padding-top: 0.5ch;
padding-bottom: 0.5ch;
opacity: 0;
color: var(--color-white);
font-family: var(--font-family-secondary);
font-size: 8rem;
font-weight: 400;
letter-spacing: -1px;
line-height: 1.2;
user-select: none;
}
.site-loaded .b-hero-content h2 {
visibility: visible;
opacity: 1;
}
@media only screen and (max-width: 1023px) {
.b-hero-content h2 {
font-size: 7rem;
}
}
@media only screen and (max-width: 767px) {
.b-hero-content h2 {
font-size: 6rem;
}
}
@media only screen and (max-width: 639px) {
.b-hero-content h2 {
font-size: 5rem;
}
}
@media only screen and (max-width: 399px) {
.b-hero-content h2 {
font-size: 4rem;
}
}
@media (prefers-reduced-motion: no-preference) {
.b-hero-content.aos-init .word {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-hero-content.aos-init .c-line-top {
right: unset;
left: 0;
width: 0;
transition: width 5s cubic-bezier(0.075, 0.82, 0.165, 1);
will-change: width;
}
.b-hero-content.aos-init .c-line-bottom {
right: 0;
left: unset;
width: 0;
transition: width 5s cubic-bezier(0.075, 0.82, 0.165, 1) 0.75s;
will-change: width;
}
.b-hero-content.aos-animate .c-line-top,
.b-hero-content.aos-animate .c-line-bottom {
width: 100%;
transition-duration: 0;
transition-delay: 0;
}
.b-hero-content.aos-animate .word {
transform: translateY(0);
transition-duration: 2s;
transition-delay: calc(var(--word-index) * 0.2s + 0.1s);
opacity: 1;
}
}
.b-book {
position: relative;
z-index: 10;
width: 100%;
margin-top: -6rem;
padding-top: 6rem;
overflow: hidden;
}
@media only screen and (max-width: 767px) {
.b-book {
margin-top: 0;
padding-top: 0;
}
}
.b-book-background {
background-color: var(--color-light);
}
.b-book-inner {
display: flex;
}
.has-bottom-space .b-book-inner {
padding-bottom: 4rem;
}
.b-book-inner.is-right {
flex-direction: row-reverse;
}
@media only screen and (max-width: 767px) {
.b-book-inner {
flex-direction: column-reverse;
}
.b-book-inner.is-right {
flex-direction: column-reverse;
}
}
.b-book-image {
position: relative;
left: -15%;
width: 55%;
margin-top: -6rem;
}
.is-parallax .b-book-image {
margin-top: unset;
margin-bottom: -6rem;
}
.is-image-margin .b-book-image {
margin-top: 0;
}
.is-right .b-book-image {
right: -15%;
left: unset;
}
@media only screen and (max-width: 1023px) {
.b-book-image {
width: 100%;
margin-left: calc(-2rem + (50vw - var(--container)) / 2);
}
.is-right .b-book-image {
margin-right: calc(-2rem + (50vw - var(--container)) / 2);
margin-left: unset;
}
}
@media only screen and (max-width: 767px) {
.b-book-image {
left: 0;
margin-top: 0;
margin-left: 0;
}
.is-right .b-book-image {
right: 0;
margin-right: 0;
}
.b-book-image::after {
content: "";
display: block;
width: 100%;
height: 0;
padding-top: 125%;
}
}
.b-book-image img {
position: absolute;
z-index: 0;
width: 100%;
height: 100%;
object-fit: cover;
inset: 0;
}
.b-book-image.aos-init img {
transform: scale(0);
transition: transform 0s cubic-bezier(0.075, 0.82, 0.165, 1) 0s;
will-change: transform;
}
@media only screen and (max-width: 767px) {
.b-book-image.aos-init img {
transform: scale(1) translateY(6rem);
opacity: 0;
}
}
.b-book-image.aos-init .c-shape {
transform: scale(0);
transition: transform;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
will-change: transform;
}
.b-book-image.aos-animate img {
transform: scale(1);
transition: transform 2s cubic-bezier(0.075, 0.82, 0.165, 1) 0.5s;
}
@media only screen and (max-width: 767px) {
.b-book-image.aos-animate img {
transform: scale(1) translateY(0);
transition: transform 2s, opacity 2s;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0.5s;
opacity: 1;
}
}
.b-book-image.aos-animate .c-shape {
transform: scale(1);
transition: transform;
transition-duration: 1.5s;
transition-delay: 1s;
}
.b-book-content {
display: flex;
position: relative;
left: -5%;
flex-direction: column;
width: 45%;
margin-top: 16rem;
margin-bottom: 16rem;
gap: 2rem;
}
.is-right .b-book-content {
right: -5%;
left: unset;
}
@media only screen and (max-width: 1023px) {
.b-book-content {
left: 0;
width: 100%;
margin-top: 10rem;
margin-bottom: 10rem;
}
}
@media only screen and (max-width: 767px) {
.b-book-content {
width: 100%;
margin-bottom: 5rem;
}
}
@media only screen and (max-width: 639px) {
.b-book-content {
margin-top: 6rem;
margin-bottom: 4rem;
}
}
.b-book-content p {
margin: 0;
font-size: var(--font-size-lg);
}
.b-book-content a {
display: flex;
align-items: center;
color: var(--color-black);
text-decoration: none;
}
.b-book-content a:hover svg {
margin-left: 0;
}
.b-book-content a span {
position: relative;
z-index: 1;
font-family: var(--font-family-secondary);
font-size: var(--font-size-xl);
line-height: 1;
}
.b-book-content a svg {
z-index: 0;
width: 6rem;
height: 6rem;
margin-bottom: -3rem;
margin-left: 1rem;
transition: margin-left 1s cubic-bezier(0.075, 0.82, 0.165, 1);
}
@media (prefers-reduced-motion: no-preference) {
.b-book-content.aos-init p .word {
visibility: hidden;
transform: translateY(2rem);
transition-duration: 0;
transition-delay: 0;
opacity: 0;
}
.b-book-content.aos-init a .char {
visibility: hidden;
transform: translateY(2rem);
transition-duration: 0;
transition-delay: 0;
opacity: 0;
will-change: opacity, transform, visibility;
}
.b-book-content.aos-init svg {
visibility: hidden;
position: relative;
transform: translate(0, 1rem);
transition-duration: 0;
transition-delay: 0;
opacity: 0;
will-change: opacity, transform, margin-left, visibility;
}
.b-book-content.aos-animate p .word {
visibility: visible;
transform: translateY(0);
will-change: opacity, transform, visibility;
transition: opacity 2s cubic-bezier(0.075, 0.82, 0.165, 1) calc(0.1s * var(--line-index) + 0.75s), transform 2s cubic-bezier(0.075, 0.82, 0.165, 1) calc(0.1s * var(--line-index) + 0.75s);
opacity: 1;
}
}
@media only screen and (prefers-reduced-motion: no-preference) and (max-width: 767px) {
.b-book-content.aos-animate p .word {
transition: opacity 4s cubic-bezier(0.075, 0.82, 0.165, 1) calc(0.1s * var(--line-index) + 1.25s), transform 4s cubic-bezier(0.075, 0.82, 0.165, 1) calc(0.1s * var(--line-index) + 1.25s);
}
}
@media (prefers-reduced-motion: no-preference) {
.b-book-content.aos-animate a .char {
visibility: visible;
transform: translateY(0);
transition: opacity 2s, transform 2s;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: calc(0.025s * var(--char-index) + 1.25s);
opacity: 1;
}
.b-book-content.aos-animate svg {
visibility: visible;
transform: translateY(0);
transition: opacity 2s 2s, transform 2s 2s, margin-left 1s;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
opacity: 1;
}
}
.b-links {
display: flex;
position: relative;
flex-direction: column;
width: 100%;
margin: 0;
overflow: hidden;
border-top: 0.25rem solid;
border-bottom: 0.25rem solid;
border-color: var(--color-primary);
background-color: var(--color-primary);
gap: 0.25rem;
user-select: none;
}
.b-link {
position: relative;
overflow: hidden;
background-color: var(--color-light-white);
}
.b-link::after {
content: "";
display: block;
visibility: hidden;
position: absolute;
z-index: 1;
inset: 0;
width: 100%;
height: 100%;
transition: opacity 0.5s;
opacity: 0;
background-color: var(--color-black);
will-change: opacity;
}
.b-link:hover img {
transform: scale(1);
opacity: 1;
}
.b-link:hover a {
color: var(--color-white);
}
.b-link:hover::after {
visibility: visible;
opacity: 0.3;
}
.b-link .container {
position: relative;
z-index: 2;
}
.b-link img {
position: absolute;
z-index: 0;
width: 100%;
height: 100%;
transform: scale(1.2);
transition: transform 1s, opacity 0.5s;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
opacity: 0;
inset: 0;
object-fit: cover;
will-change: transform, opacity;
}
.b-link a {
display: flex;
align-items: center;
padding-top: calc(1.75ch * var(--padding-percentage));
padding-bottom: calc(1.75ch * var(--padding-percentage));
transition: color 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
color: var(--color-black);
font-family: var(--font-family-secondary);
font-size: 8rem;
font-weight: 400;
letter-spacing: -0.16rem;
line-height: 1;
text-decoration: none;
user-select: none;
}
@media only screen and (max-width: 1023px) {
.b-link a {
font-size: 6rem;
}
}
@media only screen and (max-width: 767px) {
.b-link a {
justify-content: space-between;
font-size: 5rem;
}
}
@media only screen and (max-width: 639px) {
.b-link a {
font-size: 4rem;
}
}
@media only screen and (max-width: 399px) {
.b-link a {
font-size: 3rem;
}
}
.b-link a span {
position: relative;
z-index: 1;
}
.b-link a svg {
z-index: 0;
width: 2ch;
height: 2ch;
margin-bottom: -2ch;
margin-left: 1rem;
transform: translateY(20%);
transition: margin-left 0.5s, transform 0, opacity 0s;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: opacity, transform, margin-left;
}
@media only screen and (max-width: 767px) {
.b-link a svg {
width: 3ch;
height: 3ch;
margin-left: 0;
}
}
@media only screen and (max-width: 639px) {
.b-link a svg {
position: absolute;
top: 50%;
right: 2rem;
margin-top: -1.5ch;
transform: scale(0.9);
}
}
.b-link a:hover svg {
margin-left: 0;
}
.b-link a:hover svg path {
stroke: var(--color-light-white);
}
@media only screen and (max-width: 639px) {
.b-link a:hover svg {
transform: scale(1);
}
}
@media (prefers-reduced-motion: no-preference) {
.b-link.aos-init .char {
visibility: hidden;
transform: translateY(20%);
transition: opacity, transform;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: opacity, transform, visibility;
}
.b-link.aos-init svg {
visibility: hidden;
transform: translateY(40%);
transition: margin-left, transform, opacity;
transition-duration: 0;
transition-delay: 0;
opacity: 0;
}
.b-link.aos-animate .char {
visibility: visible;
transform: translateY(0);
transition-duration: 2s;
transition-delay: calc(0.05s * var(--char-index) + 0.5s);
opacity: 1;
}
.b-link.aos-animate svg {
visibility: visible;
transform: translateY(0);
transition: margin-left 0.5s, transform 1s 1s, opacity 1s 1s;
opacity: 1;
}
}
.b-slider {
position: relative;
width: 100%;
margin: 0;
overflow: hidden;
background-color: var(--color-primary);
}
.b-links + .b-slider .b-slider-element {
padding-top: 0;
}
.b-slider-element {
visibility: hidden;
position: relative;
z-index: 0;
width: 100%;
padding-top: 0.25rem;
padding-bottom: 0.25rem;
cursor: pointer;
}
.acf-block-component .b-slider-element {
display: flex;
overflow-x: auto;
}
.b-slider-element:not(.flickity-enabled) {
display: flex;
}
.b-slider-element.flickity-enabled {
visibility: visible;
}
.b-slider-next {
position: absolute;
z-index: 1;
top: 50%;
right: var(--container-space);
transform: translateY(-50%) scale(1);
transition: transform 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
cursor: pointer;
}
.b-slider-next:hover {
transform: translateY(-50%) scale(1.1);
}
.b-slider-prev {
position: absolute;
z-index: 1;
top: 50%;
left: var(--container-space);
transform: translateY(-50%) scale(1);
transition: transform 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
cursor: pointer;
}
.b-slider-prev:hover {
transform: translateY(-50%) scale(1.1);
}
.b-slider-item {
position: relative;
width: 45%;
margin-right: 0.25rem;
overflow: hidden;
}
.b-slider-element:not(.flickity-enabled) .b-slider-item {
flex: 0 0 45%;
}
.acf-block-component .b-slider-item {
flex: 0 0 45%;
}
.b-slider-item.is-selected img {
transform: scale(1);
}
.b-slider-item.is-selected + .b-slider-item img {
transform: scale(1.1);
transition-delay: 0.01s;
}
.b-slider-item::after {
content: "";
display: block;
position: relative;
width: 100%;
height: 0;
padding-top: 120%;
}
@media only screen and (max-width: 767px) {
.b-slider-item::after {
padding-top: 130%;
}
}
.b-slider-item img {
position: absolute;
width: 100%;
height: 100%;
inset: 0;
object-fit: cover;
transform: scale(1.2);
transition: transform 3s cubic-bezier(0.075, 0.82, 0.165, 1);
}
.b-slider svg {
width: 7rem;
height: 7rem;
color: var(--color-white);
}
@media only screen and (max-width: 1023px) {
.b-slider svg {
width: 6rem;
height: 6rem;
}
}
.b-special {
position: relative;
width: 100%;
overflow: hidden;
--spacing: 6rem;
}
@media only screen and (max-width: 1023px) {
.b-special {
--spacing: 5rem;
}
}
.b-special-image {
position: relative;
z-index: 1;
width: 100%;
}
.b-special-image::after {
content: "";
display: block;
width: 100%;
height: 0;
padding-top: 50%;
}
.b-special-image img {
position: absolute;
z-index: 0;
width: 100%;
height: 100%;
object-fit: cover;
inset: 0;
}
@media (prefers-reduced-motion: no-preference) {
.b-special-image.aos-init .c-shape {
transform: scale(0);
transition: transform;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
will-change: transform;
}
.b-special-image.aos-init img {
transform: scale(1.2);
transition: transform;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
}
.b-special-image.aos-animate .c-shape {
transform: scale(1);
transition: transform;
transition-duration: 1.5s;
transition-delay: 1s;
}
.b-special-image.aos-animate img {
transform: scale(1);
transition-duration: 3s;
}
}
.b-special-content {
display: flex;
position: relative;
z-index: 2;
background-color: var(--color-light-white);
}
@media only screen and (max-width: 1023px) {
.b-special-content {
flex-direction: column;
}
}
.has-spacing-bottom .b-special-content {
padding-bottom: var(--spacing);
}
.b-special-heading {
display: flex;
position: relative;
flex-direction: column;
justify-content: flex-start;
width: 57%;
margin-top: calc(var(--spacing) * -2.5);
padding-top: calc(var(--spacing) + 3rem);
padding-right: calc(var(--spacing) + 1.5rem);
padding-bottom: calc(var(--spacing) + 3rem);
padding-left: var(--container-space);
}
@media only screen and (max-width: 1023px) {
.b-special-heading {
width: 100%;
margin-top: 0;
padding-right: var(--container-space);
}
}
.b-special-heading::after {
content: "";
display: block;
position: absolute;
z-index: 1;
width: 100%;
height: 100%;
opacity: 0.9;
background-color: var(--color-white);
inset: 0;
}
.b-special-heading .c-line {
z-index: 2;
}
.b-special-heading h2 {
z-index: 3;
margin: 0;
padding-top: 0.5ch;
padding-bottom: 0.5ch;
color: var(--color-black);
font-family: var(--font-family-secondary);
font-size: 7.25rem;
font-weight: 400;
letter-spacing: -1px;
line-height: 1.2;
user-select: none;
}
@media only screen and (max-width: 1023px) {
.b-special-heading h2 {
font-size: 5rem;
}
}
@media only screen and (max-width: 767px) {
.b-special-heading h2 {
font-size: 4rem;
}
}
@media only screen and (max-width: 639px) {
.b-special-heading h2 {
font-size: 3rem;
}
}
@media only screen and (max-width: 399px) {
.b-special-heading h2 {
font-size: 3rem;
}
}
@media (prefers-reduced-motion: no-preference) {
.b-special-heading.aos-init .word {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-special-heading.aos-init .c-line-top {
right: unset;
left: 0;
width: 0;
transition: width;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
will-change: width;
}
.b-special-heading.aos-init .c-line-bottom {
right: 0;
left: unset;
width: 0;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
will-change: width;
}
.b-special-heading.aos-animate .c-line-top,
.b-special-heading.aos-animate .c-line-bottom {
width: 100%;
transition-duration: 5s;
transition-delay: 0;
}
.b-special-heading.aos-animate .c-line-bottom {
transition-duration: 5s;
transition-delay: 0.75s;
}
.b-special-heading.aos-animate .word {
transform: translateY(0);
transition-duration: 2s;
transition-delay: calc(var(--word-index) * 0.2s + 0.1s);
opacity: 1;
}
}
.b-special-text {
display: flex;
flex-direction: column;
justify-content: center;
width: 43%;
padding: calc(var(--spacing) * 1.5);
padding-right: var(--container-space);
padding-left: 4rem;
}
@media only screen and (max-width: 1023px) {
.b-special-text {
width: 100%;
padding-left: var(--container-space);
}
}
.b-special-text p, .b-special-text ul, .b-special-text ol {
margin: 0;
margin-top: 0.5rem;
margin-bottom: 0.5rem;
font-size: calc(var(--font-size-xl) * 0.98);
}
@media (prefers-reduced-motion: no-preference) {
.b-special-text.aos-init .word {
visibility: hidden;
transform: translateY(2rem);
transition-duration: 0;
transition-delay: 0;
opacity: 0;
}
.b-special-text.aos-animate .word {
visibility: visible;
transform: translateY(0);
will-change: opacity, transform, visibility;
transition: opacity 2s cubic-bezier(0.075, 0.82, 0.165, 1) calc(0.1s * var(--line-index) + 0.75s), transform 2s cubic-bezier(0.075, 0.82, 0.165, 1) calc(0.1s * var(--line-index) + 0.75s);
opacity: 1;
}
}
@media only screen and (prefers-reduced-motion: no-preference) and (max-width: 767px) {
.b-special-text.aos-animate .word {
transition: opacity 4s cubic-bezier(0.075, 0.82, 0.165, 1) calc(0.1s * var(--line-index) + 1.25s), transform 4s cubic-bezier(0.075, 0.82, 0.165, 1) calc(0.1s * var(--line-index) + 1.25s);
}
}
.b-cta {
--spacing: 6.3rem;
width: 100%;
margin: 0;
padding-top: var(--spacing);
padding-bottom: var(--spacing);
background-color: #2F5A47 !important;
}
@media only screen and (max-width: 1023px) {
.b-cta {
--spacing: 6rem;
}
}
@media only screen and (max-width: 767px) {
.b-cta {
--spacing: 4rem;
}
}
.b-cta-buttons {
display: flex;
gap: 3rem;
}
@media only screen and (max-width: 639px) {
.b-cta-buttons {
flex-direction: column;
gap: 2rem;
}
}
.is-no-text .b-cta-buttons {
margin-left: auto;
}
@media only screen and (max-width: 639px) {
.is-no-text .b-cta-buttons {
flex-direction: row;
flex-wrap: wrap;
margin-left: 0;
}
}
.b-cta-content {
display: flex;
align-items: center;
justify-content: space-between;
gap: var(--spacing);
}
@media only screen and (max-width: 1279px) {
.has-more-button .b-cta-content {
flex-direction: column;
align-items: start;
gap: 2rem;
}
}
@media only screen and (max-width: 639px) {
.b-cta-content {
flex-direction: column;
align-items: flex-start;
gap: 2rem;
}
}
.b-cta-content p {
flex-grow: 1;
color: var(--color-white);
font-size: var(--font-size-xl);
}
.b-cta-content a {
display: flex;
align-items: center;
justify-content: start;
color: var(--color-white);
text-decoration: none;
}
.b-cta-content a:hover svg {
left: 0.5rem;
}
.b-cta-content a span {
font-family: var(--font-family-secondary);
font-size: calc(var(--font-size-xxl) * 1.5);
line-height: 1;
white-space: nowrap;
}
@media only screen and (max-width: 1529px) {
.b-cta-content a span {
font-size: calc(var(--font-size-xl) * 1.5);
}
}
@media only screen and (max-width: 1023px) {
.b-cta-content a span {
font-size: calc(var(--font-size-xl) * 1.25);
}
}
.b-cta-content a > span {
position: relative;
z-index: 1;
}
.b-cta-content a svg {
position: relative;
z-index: 0;
left: 1.5rem;
width: calc(var(--spacing) * 1.5);
height: calc(var(--spacing) * 1.5);
}
@media only screen and (max-width: 1529px) {
.b-cta-content a svg {
width: calc(var(--spacing) * 1.25);
height: calc(var(--spacing) * 1.25);
}
}
@media only screen and (max-width: 1023px) {
.b-cta-content a svg {
width: var(--spacing);
height: var(--spacing);
}
}
@media (prefers-reduced-motion: no-preference) {
.b-cta-content.aos-init .word {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-cta-content.aos-init a span {
visibility: hidden;
transform: translateY(2rem);
transition-duration: 0;
transition-delay: 0;
opacity: 0;
will-change: opacity, transform, visibility;
}
.b-cta-content.aos-init a svg {
visibility: hidden;
position: relative;
transform: translateY(30%);
transition-duration: 0;
transition-delay: 0;
opacity: 0;
will-change: opacity, transform, left, visibility;
}
.b-cta-content.aos-animate .word {
transform: translateY(0);
transition-duration: 2s;
transition-delay: calc(var(--line-index) * 0.2s + 0.1s);
opacity: 1;
}
.b-cta-content.aos-animate a span {
visibility: visible;
transform: translateY(0);
transition-duration: 2s;
transition-delay: calc(var(--line-index) * 0.2s + 0.1s);
opacity: 1;
}
.b-cta-content.aos-animate a svg {
visibility: visible;
transform: translateY(0);
transition: left 1s cubic-bezier(0.075, 0.82, 0.165, 1), transform 2s cubic-bezier(0.075, 0.82, 0.165, 1) 1s, opacity 2s cubic-bezier(0.075, 0.82, 0.165, 1) 1s;
opacity: 1;
}
}
.b-benefit {
--spacing: 8rem;
padding-top: var(--spacing);
padding-bottom: var(--spacing);
background-color: #DCD0B3;
}
@media only screen and (max-width: 1279px) {
.b-benefit {
--spacing: 6rem;
}
}
@media only screen and (max-width: 1023px) {
.b-benefit {
--spacing: 5rem;
}
}
.b-benefit-top {
display: flex;
gap: var(--spacing);
align-items: flex-end;
}
@media only screen and (max-width: 1529px) {
.b-benefit-top {
gap: calc(var(--spacing) * 0.5);
}
}
@media only screen and (max-width: 1023px) {
.b-benefit-top {
flex-direction: column;
align-items: start;
gap: 0;
}
}
@media (prefers-reduced-motion: no-preference) {
.b-benefit-top.aos-init .char {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-benefit-top.aos-init .word {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-benefit-top.aos-init .c-line-top {
right: unset;
left: 0;
width: 0;
transition: width;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
will-change: width;
}
.b-benefit-top.aos-init .c-line-bottom {
right: 0;
left: unset;
width: 0;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
will-change: width;
}
.b-benefit-top.aos-animate .c-line-top,
.b-benefit-top.aos-animate .c-line-bottom {
width: 100%;
transition-duration: 5s;
transition-delay: 0;
}
.b-benefit-top.aos-animate .c-line-bottom {
transition-duration: 5s;
transition-delay: 0.75s;
}
.b-benefit-top.aos-animate .char {
transform: translateY(0);
transition-duration: 2s;
transition-delay: calc(var(--char-index) * 0.1s + 0.1s);
opacity: 1;
}
.b-benefit-top.aos-animate .word {
transform: translateY(0);
transition-duration: 2s;
transition-delay: calc(var(--line-index) * 0.2s + 0.5s);
opacity: 1;
}
}
.b-benefit-heading {
display: inline-block;
flex-shrink: 0;
width: auto;
max-width: var(--max-width);
}
@media only screen and (max-width: 1023px) {
.b-benefit-heading {
max-width: 100%;
}
}
.b-benefit-heading .c-line {
z-index: 2;
}
.b-benefit-heading .c-line-top, .b-benefit-heading .c-line-bottom {
background-color: var(--color-primary);
}
.b-benefit-heading h2,
.b-benefit-heading h1 {
z-index: 3;
margin: 0;
padding-top: 0.5ch;
padding-bottom: 0.5ch;
color: var(--color-black);
font-family: var(--font-family-secondary);
font-size: 8rem;
font-weight: 400;
letter-spacing: -1px;
line-height: 1.2;
}
@media only screen and (max-width: 1529px) {
.b-benefit-heading h2,
.b-benefit-heading h1 {
font-size: 6.5rem;
}
}
@media only screen and (max-width: 1023px) {
.b-benefit-heading h2,
.b-benefit-heading h1 {
font-size: 5rem;
}
}
@media only screen and (max-width: 767px) {
.b-benefit-heading h2,
.b-benefit-heading h1 {
font-size: 4rem;
}
}
@media only screen and (max-width: 639px) {
.b-benefit-heading h2,
.b-benefit-heading h1 {
font-size: 3rem;
}
}
@media only screen and (max-width: 399px) {
.b-benefit-heading h2,
.b-benefit-heading h1 {
font-size: 3rem;
}
}
.b-benefit-text {
flex-grow: 1;
padding-top: calc(var(--spacing) / 1.15);
}
.b-benefit-text .rte {
font-size: var(--font-size-xl);
}
@media only screen and (max-width: 1023px) {
.b-benefit-text .rte {
font-size: var(--font-size-lg);
}
}
@media only screen and (max-width: 767px) {
.b-benefit-text {
padding-top: 0;
}
}
.b-benefit-text p:last-child {
margin-bottom: 0;
}
.b-benefit-items {
display: flex;
gap: 2.5rem;
flex-wrap: wrap;
margin-top: calc(var(--spacing) * 0.6);
}
@media only screen and (max-width: 1535px) {
.b-benefit-items {
gap: 2rem;
}
}
@media only screen and (max-width: 1279px) {
.b-benefit-items {
margin-top: 3rem;
}
}
@media (prefers-reduced-motion: no-preference) {
.b-benefit-items.aos-init .b-benefit-item {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-benefit-items.aos-animate .b-benefit-item {
transform: translateY(0);
transition-duration: 2s;
transition-delay: calc(var(--item-index) * 0.2s + 0.5s);
opacity: 1;
}
}
.b-benefit-item {
display: flex;
flex-direction: column;
width: calc(50% - 1.25rem);
padding: 6rem 4rem;
background-color: #F8F6F0;
gap: 3rem;
}
@media only screen and (max-width: 1535px) {
.b-benefit-item {
width: calc(50% - 1rem);
padding: 4rem;
}
}
@media only screen and (max-width: 1279px) {
.b-benefit-item {
width: 100%;
padding: 4rem;
gap: 2rem;
}
}
@media only screen and (max-width: 639px) {
.b-benefit-item {
padding: 3rem;
gap: 1.5rem;
}
}
@media only screen and (max-width: 399px) {
.b-benefit-item {
padding: 2rem;
}
}
.b-benefit-item-top {
display: flex;
align-items: center;
gap: 2rem;
}
.b-benefit-item-icon {
position: relative;
flex-shrink: 0;
width: 10rem;
height: 10rem;
overflow: hidden;
border: 2px solid var(--color-light);
border-radius: 100%;
}
@media only screen and (max-width: 1535px) {
.b-benefit-item-icon {
width: 8rem;
height: 8rem;
}
}
@media only screen and (max-width: 1279px) {
.b-benefit-item-icon {
width: 6rem;
height: 6rem;
}
}
@media only screen and (max-width: 1023px) {
.b-benefit-item-icon {
width: 5rem;
height: 5rem;
}
}
.b-benefit-item-icon::after {
content: "";
display: block;
width: 100%;
height: 0;
padding-top: 100%;
}
.b-benefit-item-icon img {
position: absolute;
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
inset: 0;
}
.b-benefit-item-heading {
font-family: var(--font-family-secondary);
font-size: calc(var(--font-size-xxl) * 1.45);
}
@media only screen and (max-width: 1023px) {
.b-benefit-item-heading {
font-size: var(--font-size-xxl);
}
}
@media only screen and (max-width: 399px) {
.b-benefit-item-heading {
font-size: var(--font-size-xl);
}
}
.b-benefit-item-heading h3 {
margin: 0;
padding-top: 0.75ch;
padding-bottom: 0.75ch;
font-weight: 300;
}
.b-benefit-item-heading .c-line span {
height: 1.5px;
}
.b-benefit-item p {
font-size: var(--font-size-xl);
}
.b-benefit-item p:last-child {
margin-bottom: 0;
}
.b-testimonials {
position: relative;
width: 100%;
margin: 0;
overflow: hidden;
}
.acf-block-component .b-testimonials-slider {
display: flex;
overflow-x: auto;
}
.b-testimonials-slide {
display: flex;
position: relative;
flex-direction: column;
justify-content: center;
width: 100%;
height: auto;
overflow: hidden;
}
.acf-block-component .b-testimonials-slide {
flex: 0 0 100%;
}
.b-testimonials-slide::after {
content: "";
display: block;
position: absolute;
z-index: 1;
width: 100%;
height: 100%;
transition: opacity 0.5s;
opacity: 0.3;
background-color: var(--color-black);
inset: 0;
}
.b-testimonials-slide img {
position: absolute;
z-index: 0;
width: 100%;
height: 100%;
object-fit: cover;
transform: scale(1.2);
transition: transform 5s cubic-bezier(0.075, 0.82, 0.165, 1);
}
.b-testimonials-slide.is-selected img {
transform: scale(1);
}
.b-testimonials-slide.is-selected .word, .b-testimonials-slide.is-selected cite {
transform: translateY(0);
opacity: 1;
}
.b-testimonials-slide .container {
position: relative;
z-index: 2;
}
.b-testimonials-item {
display: flex;
flex-direction: column;
align-items: center;
padding-top: 16rem;
padding-bottom: 16rem;
color: var(--color-white);
gap: 2rem;
}
.b-testimonials-item p {
margin: 0;
font-family: var(--font-family-secondary);
font-size: 4rem;
line-height: 1.2;
text-align: center;
}
@media only screen and (max-width: 639px) {
.b-testimonials-item p {
font-size: 3rem;
}
}
@media only screen and (max-width: 399px) {
.b-testimonials-item p {
font-size: 2rem;
}
}
.b-testimonials-item p .word {
transform: translateY(50%);
transition: transform 2s, opacity 2s;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: calc(0.1s * var(--line-index) + 0.5s);
opacity: 0;
}
.b-testimonials-item cite {
margin: 0;
transform: translateY(50%);
transition: transform 2s, opacity 2s;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 1s;
opacity: 0;
font-size: var(--font-size-lg);
font-style: normal;
text-align: center;
}
.acf-block-component .b-testimonials-item cite {
opacity: 1;
}
.b-testimonials .flickity-page-dots {
display: flex;
position: absolute;
z-index: 3;
right: 0;
bottom: 2rem;
left: 0;
align-items: center;
justify-content: center;
gap: 0.5rem;
}
.b-testimonials .dot {
width: 0.75rem;
height: 0.75rem;
margin: 0;
border-radius: 100%;
opacity: 1;
background-color: var(--color-white);
cursor: pointer;
}
.b-testimonials .dot.is-selected {
opacity: 1;
background-color: var(--color-primary);
}
.b-future {
--spacing: 8rem;
position: relative;
width: 100%;
margin: 0;
padding-top: var(--spacing);
padding-bottom: var(--spacing);
overflow: hidden;
background-color: var(--color-light);
}
@media only screen and (max-width: 1279px) {
.b-future {
--spacing: 6rem;
}
}
@media only screen and (max-width: 1023px) {
.b-future {
--spacing: 5rem;
}
}
.b-future-content {
display: flex;
padding-right: var(--container-space);
padding-bottom: calc(var(--spacing) * 1.5);
padding-left: var(--container-space);
gap: calc(var(--spacing) * 1.5);
}
@media only screen and (max-width: 1023px) {
.b-future-content {
flex-direction: column;
align-items: start;
gap: 0;
margin-bottom: var(--spacing);
padding-bottom: calc(var(--spacing) * 1);
}
}
@media (prefers-reduced-motion: no-preference) {
.b-future-content.aos-init .char {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-future-content.aos-init .word {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-future-content.aos-init .c-line-top {
right: unset;
left: 0;
width: 0;
transition: width;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
will-change: width;
}
.b-future-content.aos-init .c-line-bottom {
right: 0;
left: unset;
width: 0;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
will-change: width;
}
.b-future-content.aos-animate .c-line-top,
.b-future-content.aos-animate .c-line-bottom {
width: 100%;
transition-duration: 5s;
transition-delay: 0;
}
.b-future-content.aos-animate .c-line-bottom {
transition-duration: 5s;
transition-delay: 0.75s;
}
.b-future-content.aos-animate .char {
transform: translateY(0);
transition-duration: 2s;
transition-delay: calc(var(--char-index) * 0.2s + 0.1s);
opacity: 1;
}
.b-future-content.aos-animate .word {
transform: translateY(0);
transition-duration: 2s;
transition-delay: calc(var(--line-index) * 0.2s + 0.5s);
opacity: 1;
}
}
@media only screen and (prefers-reduced-motion: no-preference) and (max-width: 767px) {
.b-future-content.aos-animate .word {
transition-duration: 4s;
transition-delay: calc(var(--line-index) * 0.2s + 1s);
}
}
.b-future-heading {
width: 100%;
max-width: var(--max-width);
}
.b-future-heading .c-line {
z-index: 2;
}
.b-future-heading h2 {
z-index: 3;
margin: 0;
padding-top: 0.5ch;
padding-bottom: 0.5ch;
color: var(--color-black);
font-family: var(--font-family-secondary);
font-size: 7rem;
font-weight: 400;
letter-spacing: -1px;
line-height: 1.2;
user-select: none;
}
@media only screen and (max-width: 1023px) {
.b-future-heading h2 {
font-size: 5rem;
}
}
@media only screen and (max-width: 767px) {
.b-future-heading h2 {
font-size: 4rem;
}
}
@media only screen and (max-width: 639px) {
.b-future-heading h2 {
font-size: 3rem;
}
}
@media only screen and (max-width: 399px) {
.b-future-heading h2 {
font-size: 3rem;
}
}
.b-future-text {
flex-grow: 1;
max-width: 800px;
padding-top: var(--spacing);
}
.b-future-text p {
font-size: var(--font-size-xl);
}
@media only screen and (max-width: 1023px) {
.b-future-text p {
font-size: var(--font-size-lg);
}
}
@media only screen and (max-width: 1023px) {
.b-future-text {
width: 100%;
max-width: 100%;
padding-top: 0;
}
}
.b-future-images {
display: flex;
width: 100%;
max-width: 1800px;
margin: 0 auto;
gap: calc(var(--spacing) / 1.5);
}
@media only screen and (max-width: 1023px) {
.b-future-images {
gap: 2rem;
}
}
@media (prefers-reduced-motion: no-preference) {
.b-future-images.aos-init .c-shape {
transform: scale(0);
transition: transform;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
will-change: transform;
}
.b-future-images.aos-init img {
transform: scale(1.2);
transition: transform;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
}
.b-future-images.aos-animate .c-shape {
transform: scale(1);
transition: transform;
transition-duration: 1.5s;
transition-delay: calc(var(--item-index) * 0.3s);
}
.b-future-images.aos-animate img {
transform: scale(1);
transition-duration: 6s;
transition-delay: calc(var(--item-index) * 0.3s);
}
}
.b-future-image {
position: relative;
overflow: hidden;
}
.b-future-image:first-child {
flex-grow: 1;
margin-top: calc(var(--spacing) * -1);
}
.b-future-image:last-child {
width: 46%;
margin-bottom: calc(var(--spacing) * -1);
}
.b-future-image:last-child::after {
content: "";
display: block;
width: 100%;
height: 0;
padding-top: 90%;
}
@media only screen and (max-width: 1023px) {
.b-future-image:last-child {
width: 35%;
}
.b-future-image:last-child::after {
padding-top: 120%;
}
}
.b-future-image img {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
object-fit: cover;
}
@media only screen and (max-width: 1023px) {
.b-future-image .c-shape svg {
width: calc(var(--spacing) / 1.5);
}
}
.b-header {
--spacing: 8rem;
display: flex;
position: relative;
flex-direction: column;
align-items: end;
width: 100%;
margin: 0;
overflow: hidden;
background-color: var(--color-light);
}
@media only screen and (max-width: 1023px) {
.b-header {
--spacing: 6rem;
}
}
@media only screen and (max-width: 767px) {
.b-header {
--spacing: 4rem;
}
}
.b-header-image {
position: relative;
width: 100%;
overflow: hidden;
}
.b-header-image::after {
content: "";
display: block;
position: relative;
width: 100%;
height: 0;
padding-top: 60%;
}
@media only screen and (min-width: 2400px) {
.b-header-image::after {
padding-top: 50%;
}
}
.b-header-image img {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
object-fit: cover;
}
@media (prefers-reduced-motion: no-preference) {
.b-header-image.aos-init img {
transform: scale(1.2);
transition: transform;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
}
.b-header-image.aos-animate img {
transform: scale(1);
transition-duration: 6s;
transition-delay: calc(var(--item-index) * 0.3s);
}
}
.b-header-content {
display: flex;
position: relative;
flex-direction: column;
width: 70%;
margin-bottom: calc(var(--spacing) * -3);
padding: var(--spacing);
padding-top: calc(var(--spacing) * 0.8);
padding-right: var(--container-space);
padding-bottom: calc(var(--spacing) * 1.5);
}
@media only screen and (max-width: 1023px) {
.b-header-content {
width: 80%;
}
}
@media only screen and (max-width: 767px) {
.b-header-content {
width: calc(100% - var(--container-space));
margin-top: calc(var(--spacing) * -2);
margin-bottom: unset;
}
}
@media only screen and (max-width: 399px) {
.b-header-content {
padding-right: var(--spacing);
}
}
@media (prefers-reduced-motion: no-preference) {
.b-header-content.aos-init {
position: relative;
top: var(--spacing);
transition: transform 0.3s linear 0s, opacity 0s cubic-bezier(0.075, 0.82, 0.165, 1) 0s, top 0s cubic-bezier(0.075, 0.82, 0.165, 1) 0s;
transition-duration: 0;
transition-delay: 0;
opacity: 0;
}
.b-header-content.aos-init h1 .word {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-header-content.aos-init .c-line-top {
right: unset;
left: 0;
width: 0;
transition: width;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
will-change: width;
}
.b-header-content.aos-init .c-line-bottom {
right: 0;
left: unset;
width: 0;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
will-change: width;
}
.b-header-content.aos-init p .word {
visibility: hidden;
transform: translateY(2rem);
transition-duration: 0;
transition-delay: 0;
opacity: 0;
}
.b-header-content.aos-init a {
visibility: hidden;
transform: translateY(2rem);
transition-duration: 0;
transition-delay: 0;
opacity: 0;
will-change: opacity, transform, visibility;
}
.b-header-content.aos-animate {
top: 0;
transition: transform 0.3s linear 0s, opacity 0.5s cubic-bezier(0.075, 0.82, 0.165, 1) 0.5s, top 3s cubic-bezier(0.075, 0.82, 0.165, 1) 0.5s;
opacity: 1;
}
.b-header-content.aos-animate h1 .word {
transform: translateY(0);
transition-duration: 2s;
transition-delay: calc(var(--word-index) * 0.2s + 0.75s);
opacity: 1;
}
.b-header-content.aos-animate .c-line-top,
.b-header-content.aos-animate .c-line-bottom {
width: 100%;
transition-duration: 5s;
transition-delay: 0;
}
.b-header-content.aos-animate p .word {
visibility: visible;
transform: translateY(0);
will-change: opacity, transform, visibility;
transition: opacity 2s cubic-bezier(0.075, 0.82, 0.165, 1) calc(0.1s * var(--line-index) + 1s), transform 2s cubic-bezier(0.075, 0.82, 0.165, 1) calc(0.1s * var(--line-index) + 1s);
opacity: 1;
}
.b-header-content.aos-animate a {
visibility: visible;
transform: translateY(0);
transition: opacity 2s, transform 1.25s;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: calc(0.1s * var(--item-index) + 2s);
opacity: 1;
}
}
.b-header-content::after {
content: "";
display: block;
position: absolute;
z-index: 1;
inset: 0;
width: 100%;
height: 100%;
opacity: 0.9;
background-color: var(--color-white);
}
.b-header-content > div {
position: relative;
z-index: 2;
}
.b-header-heading {
position: relative;
width: auto;
margin-right: auto;
margin-left: 0;
}
@media only screen and (max-width: 767px) {
.b-header-heading {
width: 100%;
margin-top: 0;
padding-right: var(--container-space);
}
}
.b-header-heading .c-line {
z-index: 2;
}
.b-header-heading h1 {
z-index: 3;
margin: 0;
padding-top: 0.5ch;
padding-bottom: 0.5ch;
color: var(--color-black);
font-family: var(--font-family-secondary);
font-size: 9rem;
font-weight: 400;
letter-spacing: -1px;
line-height: 1.2;
user-select: none;
}
@media only screen and (max-width: 1023px) {
.b-header-heading h1 {
font-size: 5rem;
}
}
@media only screen and (max-width: 767px) {
.b-header-heading h1 {
font-size: 4rem;
}
}
@media only screen and (max-width: 639px) {
.b-header-heading h1 {
font-size: 3rem;
}
}
@media only screen and (max-width: 399px) {
.b-header-heading h1 {
font-size: 3rem;
}
}
.b-header-text {
width: 100%;
max-width: 768px;
margin-top: calc(var(--spacing) / 2.5);
margin-right: 0;
margin-left: auto;
}
.b-header-text p {
font-size: var(--font-size-xl);
}
.b-header-links {
display: flex;
position: relative;
z-index: 2;
align-items: center;
justify-content: center;
width: 100%;
margin-top: 2rem;
gap: 3rem;
padding-left: 4rem;
}
@media only screen and (max-width: 767px) {
.b-header-links {
gap: 1rem;
}
}
@media only screen and (max-width: 399px) {
.b-header-links {
flex-direction: column;
align-items: start;
}
}
.b-header-links a {
display: flex;
align-items: center;
color: var(--color-black);
text-decoration: none;
}
.b-header-links a:hover svg {
left: 0;
}
.b-header-links a span {
font-family: var(--font-family-secondary);
font-size: var(--font-size-xl);
line-height: 1;
}
.b-header-links a svg {
position: relative;
left: 1rem;
width: 6rem;
height: 6rem;
margin-bottom: -2rem;
transition: left 1s cubic-bezier(0.075, 0.82, 0.165, 1);
}
@media only screen and (max-width: 767px) {
.b-header-links a svg {
width: 5rem;
height: 5rem;
}
}
@media only screen and (max-width: 639px) {
.b-header-links a svg {
width: 4rem;
height: 4rem;
}
}
.b-ci {
--spacing: 8rem;
position: relative;
z-index: 20;
width: 100%;
margin: 0;
padding-top: calc(var(--spacing) * 1.5);
padding-bottom: 0;
background-color: var(--color-primary-lighter);
}
@media only screen and (max-width: 1279px) {
.b-ci {
--spacing: 6rem;
}
}
@media only screen and (max-width: 1023px) {
.b-ci {
--spacing: 5rem;
}
}
@media only screen and (max-width: 639px) {
.b-ci {
padding-bottom: var(--spacing);
}
}
.b-ci-wrapper {
display: flex;
gap: calc(var(--spacing) * 0.5);
}
@media only screen and (max-width: 1023px) {
.b-ci-wrapper {
flex-direction: column;
gap: 2rem;
}
}
.b-ci-heading {
flex-shrink: 1;
width: 100%;
max-width: var(--max-width);
}
@media only screen and (max-width: 639px) {
.b-ci-heading {
order: 2;
}
}
.b-ci-heading .c-line {
z-index: 2;
}
.b-ci-heading .c-line > span {
background-color: var(--color-primary);
}
.b-ci-heading h2 {
z-index: 3;
margin: 0;
padding-top: 0.5ch;
padding-bottom: 0.5ch;
color: var(--color-black);
font-family: var(--font-family-secondary);
font-size: 8rem;
font-weight: 400;
letter-spacing: -1px;
line-height: 1.2;
user-select: none;
}
@media only screen and (max-width: 1023px) {
.b-ci-heading h2 {
font-size: 5rem;
}
}
@media only screen and (max-width: 767px) {
.b-ci-heading h2 {
font-size: 4rem;
}
}
@media only screen and (max-width: 639px) {
.b-ci-heading h2 {
font-size: 3rem;
}
}
@media only screen and (max-width: 399px) {
.b-ci-heading h2 {
font-size: 3rem;
}
}
@media (prefers-reduced-motion: no-preference) {
.b-ci-heading.aos-init .word {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-ci-heading.aos-init .c-line-top {
right: unset;
left: 0;
width: 0;
transition: width;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
will-change: width;
}
.b-ci-heading.aos-init .c-line-bottom {
right: 0;
left: unset;
width: 0;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
will-change: width;
}
.b-ci-heading.aos-animate .c-line-top,
.b-ci-heading.aos-animate .c-line-bottom {
width: 100%;
transition-duration: 5s;
transition-delay: 0;
}
.b-ci-heading.aos-animate .c-line-bottom {
transition-duration: 5s;
transition-delay: 0.75s;
}
.b-ci-heading.aos-animate .word {
transform: translateY(0);
transition-duration: 2s;
transition-delay: calc(var(--word-index) * 0.2s + 0.1s);
opacity: 1;
}
}
.b-ci-text {
flex-grow: 1;
padding-top: var(--spacing);
padding-bottom: calc(var(--spacing) * 1.5);
font-size: var(--font-size-xl);
}
@media only screen and (max-width: 767px) {
.b-ci-text {
padding-top: 0;
}
}
@media (prefers-reduced-motion: no-preference) {
.b-ci-text.aos-init .word {
visibility: hidden;
transform: translateY(2rem);
transition-duration: 0;
transition-delay: 0;
opacity: 0;
}
.b-ci-text.aos-animate .word {
visibility: visible;
transform: translateY(0);
will-change: opacity, transform, visibility;
transition: opacity 2s cubic-bezier(0.075, 0.82, 0.165, 1) calc(0.1s * var(--line-index) + 0.75s), transform 2s cubic-bezier(0.075, 0.82, 0.165, 1) calc(0.1s * var(--line-index) + 0.75s);
opacity: 1;
}
}
@media only screen and (prefers-reduced-motion: no-preference) and (max-width: 767px) {
.b-ci-text.aos-animate .word {
transition: opacity 4s cubic-bezier(0.075, 0.82, 0.165, 1) calc(0.1s * var(--line-index) + 1.25s), transform 4s cubic-bezier(0.075, 0.82, 0.165, 1) calc(0.1s * var(--line-index) + 1.25s);
}
}
.b-ci-image {
position: absolute;
width: 130%;
height: calc(100% + var(--spacing) * 1.5);
margin-bottom: calc(var(--spacing) * -1);
margin-left: -30%;
overflow: hidden;
}
@media only screen and (max-width: 1023px) {
.b-ci-image {
position: relative;
height: auto;
}
}
@media only screen and (max-width: 639px) {
.b-ci-image {
position: relative;
width: 100%;
height: auto;
margin-bottom: 0;
margin-left: 0;
}
}
@media only screen and (max-width: 639px) {
.b-ci-image {
order: 1;
}
}
.b-ci-image::after {
content: "";
display: block;
position: relative;
z-index: 1;
width: 100%;
height: 0;
padding-top: 120%;
}
.b-ci-image img {
position: absolute;
z-index: 0;
width: 100%;
height: 100%;
object-fit: cover;
}
.b-ci-image-wrapper {
position: relative;
flex-grow: 1;
}
.b-ci-image.aos-init img {
transform: scale(0);
transition: transform 0s cubic-bezier(0.075, 0.82, 0.165, 1) 0s;
will-change: transform;
}
@media only screen and (max-width: 767px) {
.b-ci-image.aos-init img {
transform: scale(1) translateY(6rem);
opacity: 0;
}
}
.b-ci-image.aos-init .c-shape {
transform: scale(0);
transition: transform;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
will-change: transform;
}
.b-ci-image.aos-animate img {
transform: scale(1);
transition: transform 2s cubic-bezier(0.075, 0.82, 0.165, 1) 0.5s;
}
@media only screen and (max-width: 767px) {
.b-ci-image.aos-animate img {
transform: scale(1) translateY(0);
transition: transform 2s, opacity 2s;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0.5s;
opacity: 1;
}
}
.b-ci-image.aos-animate .c-shape {
transform: scale(1);
transition: transform;
transition-duration: 1.5s;
transition-delay: 1s;
}
.b-ci-left {
display: flex;
position: relative;
flex-direction: column;
width: 65%;
gap: calc(var(--spacing) * 0.6);
}
@media only screen and (max-width: 1023px) {
.b-ci-left {
width: 100%;
}
}
.b-ci-right {
width: calc(45% - var(--spacing) * 0.5);
}
@media only screen and (max-width: 1023px) {
.b-ci-right {
width: 100%;
}
}
.b-location {
--spacing: 8rem;
position: relative;
width: 100%;
padding-top: var(--spacing);
padding-bottom: var(--spacing);
overflow: hidden;
background-color: var(--color-light-white);
}
.b-location.is-bg-2 {
padding-bottom: calc(var(--spacing) * 1.5);
background-color: #DCD0B3;
}
@media only screen and (max-width: 1279px) {
.b-location {
--spacing: 6rem;
}
}
@media only screen and (max-width: 1023px) {
.b-location {
--spacing: 5rem;
}
}
.b-location.has-pt {
padding-top: calc(var(--spacing) * 2);
}
.b-location-heading {
flex-shrink: 1;
max-width: var(--max-width);
}
.b-location-heading .c-line {
z-index: 2;
}
.b-location-heading .c-line > span {
background-color: var(--color-primary);
}
.b-location-heading h2 {
z-index: 3;
margin: 0;
padding-top: 0.5ch;
padding-bottom: 0.5ch;
color: var(--color-black);
font-family: var(--font-family-secondary);
font-size: 9rem;
font-weight: 400;
letter-spacing: -1px;
line-height: 1.2;
user-select: none;
}
@media only screen and (max-width: 1023px) {
.b-location-heading h2 {
font-size: 5rem;
}
}
@media only screen and (max-width: 767px) {
.b-location-heading h2 {
font-size: 4rem;
}
}
@media only screen and (max-width: 639px) {
.b-location-heading h2 {
font-size: 3rem;
}
}
@media only screen and (max-width: 399px) {
.b-location-heading h2 {
font-size: 3rem;
}
}
@media (prefers-reduced-motion: no-preference) {
.b-location-heading.aos-init .word {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-location-heading.aos-init .c-line-top {
right: unset;
left: 0;
width: 0;
transition: width;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
will-change: width;
}
.b-location-heading.aos-init .c-line-bottom {
right: 0;
left: unset;
width: 0;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
will-change: width;
}
.b-location-heading.aos-animate .c-line-top,
.b-location-heading.aos-animate .c-line-bottom {
width: 100%;
transition-duration: 5s;
transition-delay: 0;
}
.b-location-heading.aos-animate .c-line-bottom {
transition-duration: 5s;
transition-delay: 0.75s;
}
.b-location-heading.aos-animate .word {
transform: translateY(0);
transition-duration: 2s;
transition-delay: calc(var(--word-index) * 0.2s + 0.1s);
opacity: 1;
}
}
.b-location-wrapper {
display: flex;
flex-direction: column;
gap: var(--spacing);
align-items: flex-start;
}
.b-location-carousel {
position: relative;
width: 100%;
}
.b-location-carousel svg {
width: var(--spacing);
height: var(--spacing);
color: var(--color-primary);
}
@media (prefers-reduced-motion: no-preference) {
.b-location-nav.aos-init svg {
transform: translateY(4rem);
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
}
.b-location-nav.aos-animate svg {
transform: translateY(0);
will-change: opacity, transform;
transition-duration: 2s;
transition-delay: calc(0.1s * var(--item-index) + 0.5s);
opacity: 1;
}
}
.b-location-items .flickity-viewport {
overflow: visible;
}
.acf-block-component .b-location-items {
display: flex;
overflow-x: auto;
}
@media (prefers-reduced-motion: no-preference) {
.b-location-items.aos-init .b-location-item {
transform: translateY(4rem);
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
}
.b-location-items.aos-animate .b-location-item {
transform: translateY(0);
will-change: opacity, transform, visibility;
transition-duration: 2s;
transition-delay: calc(0.1s * var(--item-index) + 0.75s);
opacity: 1;
}
}
.b-location-next {
position: absolute;
z-index: 1;
top: 0;
right: var(--container-space);
transform: translateY(-50%) scale(1);
transition: transform 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
cursor: pointer;
}
.is-bg-2 .b-location-next {
top: unset;
bottom: 0;
transform: translateY(60%) scale(1);
}
.b-location-next:hover {
transform: translateY(-50%) scale(1.1);
}
.is-bg-2 .b-location-next:hover {
transform: translateY(60%) scale(1.1);
}
.b-location-prev {
position: absolute;
z-index: 1;
top: 0;
left: var(--container-space);
transform: translateY(-50%) scale(1);
transition: transform 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
cursor: pointer;
}
.is-bg-2 .b-location-prev {
top: unset;
bottom: 0;
transform: translateY(60%) scale(1);
}
.b-location-prev:hover {
transform: translateY(-50%) scale(1.1);
}
.is-bg-2 .b-location-prev:hover {
transform: translateY(60%) scale(1.1);
}
.b-location-slide {
display: flex;
flex-direction: column;
justify-content: flex-start;
width: 80%;
margin-right: 2rem;
}
@media only screen and (max-width: 399px) {
.b-location-slide {
width: 100%;
}
}
.acf-block-component .b-location-slide {
flex: 0 0 80%;
}
@media only screen and (max-width: 399px) {
.acf-block-component .b-location-slide {
flex: 0 0 100%;
}
}
.b-location-item {
display: flex;
position: relative;
width: 100%;
height: 100%;
background-color: var(--color-primary-lighter);
}
.is-bg-2 .b-location-item {
background-color: #EAE1D3;
}
@media only screen and (max-width: 1023px) {
.b-location-item {
flex-direction: column-reverse;
justify-content: flex-end;
}
}
.b-location-content {
display: flex;
flex-direction: column;
width: 60%;
padding: 10rem 4rem;
gap: 2rem;
}
@media only screen and (max-width: 1023px) {
.b-location-content {
width: 100%;
padding: 4rem;
}
}
@media only screen and (max-width: 639px) {
.b-location-content {
padding: 3rem;
gap: 1rem;
}
}
.b-location-content h3 {
margin: 0;
font-family: var(--font-family-secondary);
font-size: calc(var(--font-size-xxl) * 1.5);
font-weight: 400;
}
@media only screen and (max-width: 1023px) {
.b-location-content h3 {
font-size: var(--font-size-xxl);
}
}
.b-location-content p {
margin: 0;
font-size: var(--font-size-xl);
}
.b-location-content a {
display: flex;
align-items: center;
color: var(--color-black);
text-decoration: none;
}
.b-location-content a:hover svg {
margin-left: 0;
}
.b-location-content a span {
position: relative;
z-index: 1;
font-family: var(--font-family-secondary);
font-size: var(--font-size-xl);
line-height: 1;
}
.b-location-content a svg {
z-index: 0;
width: 6rem;
height: 6rem;
margin-bottom: -3rem;
margin-left: 1rem;
transition: margin-left 1s cubic-bezier(0.075, 0.82, 0.165, 1);
}
.b-location-image {
position: relative;
width: 40%;
}
@media only screen and (max-width: 1023px) {
.b-location-image {
width: 100%;
}
}
.b-location-image::after {
content: "";
display: block;
width: 100%;
height: 0;
padding-top: 130%;
}
@media only screen and (max-width: 1023px) {
.b-location-image::after {
padding-top: 70%;
}
}
.b-location-image img {
position: absolute;
z-index: 1;
width: 100%;
height: 100%;
inset: 0;
object-fit: cover;
}
.b-headline {
--spacing: 8rem;
position: relative;
width: 100%;
margin: 0;
padding-top: calc(var(--spacing) * var(--padding-percentage));
padding-bottom: calc(var(--spacing) * var(--padding-percentage));
overflow: hidden;
background-color: #DCD0B3;
}
.b-headline.is-bg-2 {
background-color: #EAE1D3;
}
@media only screen and (max-width: 1279px) {
.b-headline {
--spacing: 6rem;
}
}
@media only screen and (max-width: 1023px) {
.b-headline {
--spacing: 5rem;
}
}
.b-headline-content {
display: flex;
justify-content: flex-end;
padding-right: var(--container-space);
padding-left: var(--container-space);
gap: var(--spacing);
}
@media only screen and (max-width: 1023px) {
.b-headline-content {
flex-direction: column;
align-items: start;
gap: 0;
}
}
@media only screen and (max-width: 639px) {
.b-headline-content {
margin-bottom: 2rem;
}
}
@media (prefers-reduced-motion: no-preference) {
.b-headline-content.aos-init .char {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-headline-content.aos-init .word {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-headline-content.aos-init .c-line-top {
right: unset;
left: 0;
width: 0;
transition: width;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
will-change: width;
}
.b-headline-content.aos-init .c-line-bottom {
right: 0;
left: unset;
width: 0;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
will-change: width;
}
.b-headline-content.aos-init a {
visibility: hidden;
transform: translateY(2rem);
transition-duration: 0;
transition-delay: 0;
opacity: 0;
will-change: opacity, transform, visibility;
}
.b-headline-content.aos-animate .c-line-top,
.b-headline-content.aos-animate .c-line-bottom {
width: 100%;
transition-duration: 5s;
transition-delay: 0;
}
.b-headline-content.aos-animate .c-line-bottom {
transition-duration: 5s;
transition-delay: 0.75s;
}
.b-headline-content.aos-animate .char {
transform: translateY(0);
transition-duration: 2s;
transition-delay: calc(var(--char-index) * 0.2s + 0.1s);
opacity: 1;
}
.b-headline-content.aos-animate .word {
transform: translateY(0);
transition-duration: 2s;
transition-delay: calc(var(--line-index) * 0.2s + 0.5s);
opacity: 1;
}
}
@media only screen and (prefers-reduced-motion: no-preference) and (max-width: 767px) {
.b-headline-content.aos-animate .word {
transition-duration: 4s;
transition-delay: calc(var(--line-index) * 0.2s + 1s);
}
}
@media (prefers-reduced-motion: no-preference) {
.b-headline-content.aos-animate a {
visibility: visible;
transform: translateY(0);
transition: opacity 2s, transform 2s;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: calc(0.1s * var(--item-index) + 1.25s);
opacity: 1;
}
}
.b-headline-heading {
display: inline;
flex-shrink: 0;
width: 100%;
}
@media only screen and (max-width: 1023px) {
.b-headline-heading {
width: 100% !important;
}
}
.b-headline-heading .c-line {
z-index: 2;
}
.b-headline-heading .c-line-top, .b-headline-heading .c-line-bottom {
background-color: var(--color-primary);
}
.b-headline-heading h1,
.b-headline-heading h2 {
z-index: 3;
margin: 0;
padding-top: 0.5ch;
padding-bottom: 0.5ch;
color: var(--color-black);
font-family: var(--font-family-secondary);
font-size: calc(8rem * var(--decrease));
font-weight: 400;
letter-spacing: -1px;
line-height: 1.2;
user-select: none;
}
@media only screen and (max-width: 1023px) {
.b-headline-heading h1,
.b-headline-heading h2 {
font-size: calc(5rem * var(--decrease));
}
}
@media only screen and (max-width: 767px) {
.b-headline-heading h1,
.b-headline-heading h2 {
font-size: calc(4rem * var(--decrease));
}
}
@media only screen and (max-width: 639px) {
.b-headline-heading h1,
.b-headline-heading h2 {
font-size: calc(3rem * var(--decrease));
}
}
@media only screen and (max-width: 399px) {
.b-headline-heading h1,
.b-headline-heading h2 {
font-size: calc(3rem * var(--decrease));
}
}
.b-headline-right {
display: flex;
flex-direction: column;
flex-grow: 1;
margin-top: auto;
padding-top: calc(var(--spacing) * 0.75);
}
.b-headline-text p {
font-size: var(--font-size-xl);
}
@media only screen and (max-width: 1023px) {
.b-headline-text p {
font-size: var(--font-size-lg);
}
}
@media only screen and (max-width: 1023px) {
.b-headline-text {
padding-top: 0;
}
}
.b-headline-links {
display: flex;
position: relative;
z-index: 2;
align-items: center;
width: 100%;
margin-top: 2rem;
gap: 3rem;
}
@media only screen and (max-width: 767px) {
.b-headline-links {
gap: 1rem;
}
}
@media only screen and (max-width: 399px) {
.b-headline-links {
flex-direction: column;
align-items: start;
}
}
.b-headline-links a {
display: flex;
align-items: center;
color: var(--color-black);
text-decoration: none;
}
.b-headline-links a:hover svg {
left: 0;
}
.b-headline-links a span {
position: relative;
z-index: 1;
font-family: var(--font-family-secondary);
font-size: var(--font-size-xl);
line-height: 1;
}
.b-headline-links a svg {
position: relative;
z-index: 0;
left: 1rem;
width: 6rem;
height: 6rem;
margin-bottom: -2rem;
transition: left 1s cubic-bezier(0.075, 0.82, 0.165, 1);
}
@media only screen and (max-width: 767px) {
.b-headline-links a svg {
width: 5rem;
height: 5rem;
}
}
@media only screen and (max-width: 639px) {
.b-headline-links a svg {
width: 4rem;
height: 4rem;
}
}
.b-events {
--spacing: 8rem;
position: relative;
width: 100%;
padding-top: var(--spacing);
padding-bottom: var(--spacing);
overflow: hidden;
background-color: var(--color-light-white);
}
@media only screen and (max-width: 1279px) {
.b-events {
--spacing: 6rem;
}
}
@media only screen and (max-width: 1023px) {
.b-events {
--spacing: 5rem;
}
}
.b-events.has-pt {
padding-top: calc(var(--spacing) * 2);
}
.b-events-header {
display: flex;
align-items: flex-end;
justify-content: flex-start;
width: 100%;
gap: calc(var(--spacing) / 2);
}
@media only screen and (max-width: 1023px) {
.b-events-header {
flex-direction: column;
gap: 0;
}
}
@media (prefers-reduced-motion: no-preference) {
.b-events-header.aos-init .b-events-tagline span {
transform: translateY(2rem);
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-events-header.aos-init .c-line-top {
right: unset;
left: 0;
width: 0;
transition: width;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
will-change: width;
}
.b-events-header.aos-init .c-line-bottom {
right: 0;
left: unset;
width: 0;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
will-change: width;
}
.b-events-header.aos-init h2 .word {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-events-header.aos-init p .word {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-events-header.aos-animate .b-events-tagline span {
transform: translateY(0);
transition-duration: 2s;
transition-delay: 0.1s;
opacity: 1;
}
.b-events-header.aos-animate .c-line-top,
.b-events-header.aos-animate .c-line-bottom {
width: 100%;
transition-duration: 5s;
transition-delay: 0;
}
.b-events-header.aos-animate .c-line-bottom {
transition-duration: 5s;
transition-delay: 0.75s;
}
.b-events-header.aos-animate h2 .word {
transform: translateY(0);
transition-duration: 2s;
transition-delay: calc(var(--word-index) * 0.2s + 0.1s);
opacity: 1;
}
.b-events-header.aos-animate p .word {
transform: translateY(0);
transition-duration: 2s;
transition-delay: calc(var(--line-index) * 0.2s + 0.75s);
opacity: 1;
}
}
.b-events-title {
display: flex;
flex-direction: column;
gap: 1rem;
width: 100%;
max-width: var(--max-width);
}
@media only screen and (max-width: 1023px) {
.b-events-title {
width: 100%;
max-width: 100%;
}
}
.b-events-title h2 {
z-index: 3;
margin: 0;
color: var(--color-black);
font-family: var(--font-family-secondary);
font-size: 4rem;
font-weight: 700;
letter-spacing: -1px;
line-height: 1;
user-select: none;
}
@media only screen and (max-width: 1023px) {
.b-events-title h2 {
font-size: 4rem;
}
}
@media only screen and (max-width: 767px) {
.b-events-title h2 {
font-size: 4rem;
}
}
@media only screen and (max-width: 639px) {
.b-events-title h2 {
font-size: 3rem;
}
}
@media only screen and (max-width: 399px) {
.b-events-title h2 {
font-size: 3rem;
}
}
.b-events-title .c-line {
display: inline-block;
}
.b-events-title .c-line h2 {
display: inline-block;
padding-top: 0.5ch;
padding-bottom: 0.5ch;
font-weight: 400;
}
.b-events-tagline {
color: var(--color-dark-green);
}
.b-events-tagline span {
margin: 0;
font-size: var(--font-size-xl);
}
@media only screen and (max-width: 1023px) {
.b-events-tagline span {
font-size: var(--font-size-lg);
}
}
.b-events-description {
width: 50%;
margin: 0;
font-size: var(--font-size-xl);
}
@media only screen and (max-width: 1023px) {
.b-events-description {
width: 100%;
margin-top: 1rem;
font-size: var(--font-size-lg);
}
}
.b-events-description p:first-child {
margin-top: 0;
}
.b-events-description p:last-child {
margin-bottom: 0;
}
.b-events-wrapper {
display: flex;
flex-direction: column;
gap: calc(var(--spacing) / 2);
align-items: center;
}
.b-event {
display: flex;
position: relative;
margin-right: 2rem;
background-color: var(--color-primary);
color: var(--color-black);
}
.b-event.is-secondary {
background-color: var(--color-dark-green);
color: var(--color-white);
}
@media only screen and (max-width: 1023px) {
.b-event {
flex-direction: column;
}
}
@media only screen and (max-width: 639px) {
.b-event {
margin-right: 1rem;
}
}
.b-event .c-shape {
z-index: 2;
transform: scaleX(-1);
}
.b-event-carousel {
position: relative;
width: 100%;
}
.b-event-items .flickity-viewport {
overflow: visible;
}
.acf-block-component .b-event-items {
display: flex;
overflow-x: auto;
}
@media (prefers-reduced-motion: no-preference) {
.b-event-items.aos-init .b-event {
transform: translateY(calc(var(--spacing) / 2));
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
}
.b-event-items.aos-animate .b-event {
transform: translateY(0);
will-change: opacity, transform;
transition-duration: 2s;
transition-delay: calc(0.25s * var(--item-index) + 0.75s);
opacity: 1;
}
}
.b-event-slide {
position: relative;
width: 85%;
}
@media only screen and (max-width: 399px) {
.b-event-slide {
width: 100%;
}
}
.acf-block-component .b-event-slide {
flex: 0 0 80%;
}
@media only screen and (max-width: 399px) {
.acf-block-component .b-event-slide {
flex: 0 0 100%;
}
}
.b-event-content {
display: flex;
flex-direction: column;
justify-content: center;
width: 55%;
padding: 6rem 4rem;
gap: 1rem;
}
@media only screen and (max-width: 1023px) {
.b-event-content {
width: 100%;
padding: 4rem;
}
}
@media only screen and (max-width: 639px) {
.b-event-content {
padding: 3rem;
gap: 1rem;
}
}
.b-event-content h3 {
max-width: 22rem;
margin: 0;
color: inherit;
font-family: var(--font-family-base);
font-size: calc(var(--font-size-xxl) * 1.6);
font-weight: 200;
line-height: 1;
}
@media only screen and (max-width: 1279px) {
.b-event-content h3 {
font-size: var(--font-size-xxl);
}
}
.b-event-content span {
font-size: var(--font-size-lg);
line-height: 1;
}
.b-event-content p {
margin: 0;
margin-bottom: 2rem;
font-size: var(--font-size-xl);
}
.b-event-content a {
color: inherit;
font-size: var(--font-size-xl);
text-decoration: none;
text-decoration: underline;
text-transform: uppercase;
}
.b-event-date {
display: flex;
position: absolute;
z-index: 2;
top: 0;
left: -1px;
flex-direction: column;
align-items: center;
padding: 1rem 2rem;
background-color: var(--color-light-white);
color: var(--color-dark-green);
line-height: 1;
}
.b-event-date span {
font-size: 0.75rem;
font-weight: 600;
text-transform: uppercase;
}
.b-event-date span.is-day {
font-family: var(--font-family-secondary);
font-size: calc(var(--font-size-xxl) * 2.5);
}
.b-event-image {
position: relative;
width: 45%;
overflow: hidden;
}
@media only screen and (max-width: 1023px) {
.b-event-image {
width: 100%;
}
}
.b-event-image::after {
content: "";
display: block;
width: 100%;
height: 0;
padding-top: 110%;
}
@media only screen and (max-width: 1023px) {
.b-event-image::after {
padding-top: 70%;
}
}
.b-event-image img {
position: absolute;
z-index: 1;
width: 100%;
height: 100%;
inset: 0;
object-fit: cover;
}
.b-event-bottom {
display: flex;
width: 100%;
gap: calc(var(--spacing) / 2);
}
@media (prefers-reduced-motion: no-preference) {
.b-event-bottom.aos-init {
transform: translateY(2rem);
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-event-bottom.aos-animate {
transform: translateY(0);
transition-duration: 2s;
transition-delay: 1.25s;
opacity: 1;
}
}
.b-event-dots {
display: flex;
position: relative;
flex-grow: 1;
justify-content: space-between;
width: 80%;
}
@media only screen and (max-width: 639px) {
.b-event-dots {
min-height: 5rem;
}
}
@media only screen and (max-width: 349px) {
.b-event-dots {
display: none;
}
}
.b-event-dots::after {
content: "";
display: block;
position: absolute;
top: 50%;
width: 100%;
height: 2px;
transform: translateY(-50%);
border-bottom: 2px dashed var(--color-primary);
}
.b-event-dots button {
position: relative;
width: 100%;
border: none;
background-color: transparent;
color: var(--color-dark-green);
font-size: 0.75rem;
font-weight: 500;
text-transform: uppercase;
cursor: pointer;
}
.b-event-dots button:hover::before, .b-event-dots button.is-selected::before {
visibility: visible;
height: 50%;
opacity: 1;
}
.b-event-dots button.is-inactive {
cursor: not-allowed;
}
.b-event-dots button.is-inactive::after {
visibility: hidden;
opacity: 0;
}
.b-event-dots button.is-inactive::before {
display: none;
}
.b-event-dots button::before {
content: "";
display: block;
visibility: hidden;
position: absolute;
top: 50%;
left: 50%;
width: 2px;
height: 0;
transform: translate(-50%, -50%);
transition: opacity, height;
transition-duration: 1s;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
opacity: 0;
background-color: var(--color-primary);
}
.b-event-dots button::after {
content: "";
display: block;
position: absolute;
top: 50%;
left: 50%;
width: 0.5rem;
height: 0.5rem;
transform: translate(-50%, -50%);
transition: transform 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
border-radius: 50%;
background-color: var(--color-primary);
}
.b-event-dots button span {
position: absolute;
top: 5%;
left: 50%;
transform: translateX(-50%);
}
.b-event-nav {
display: flex;
align-items: center;
width: 20%;
gap: 1rem;
}
@media only screen and (max-width: 639px) {
.b-event-nav {
display: none;
}
}
@media only screen and (max-width: 349px) {
.b-event-nav {
display: flex;
width: 100%;
max-width: 128px;
}
}
.b-event-nav svg {
position: absolute;
width: 100%;
height: 100%;
color: var(--color-primary);
inset: 0;
object-fit: contain;
object-position: center;
}
.b-event-next {
width: calc(50% - 0.5rem);
transform: scale(1);
transition: transform 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
cursor: pointer;
}
.b-event-next::after {
content: "";
display: block;
position: relative;
width: 100%;
height: 0;
padding-top: 100%;
}
.b-event-next:hover {
transform: scale(1.1);
}
.b-event-next svg {
position: absolute;
width: 100%;
height: 100%;
inset: 0;
object-fit: contain;
object-position: center;
}
.b-event-prev {
width: calc(50% - 0.5rem);
transform: scale(1);
transition: transform 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
cursor: pointer;
}
.b-event-prev::after {
content: "";
display: block;
position: relative;
width: 100%;
height: 0;
padding-top: 100%;
}
.b-event-prev:hover {
transform: scale(1.1);
}
.b-workspace {
--spacing: 8rem;
padding-top: calc(var(--spacing) * 1.5);
padding-bottom: calc(var(--spacing) * 1.5);
background-color: #DCD0B3;
}
@media only screen and (max-width: 1279px) {
.b-workspace {
--spacing: 6rem;
}
}
@media only screen and (max-width: 1023px) {
.b-workspace {
--spacing: 5rem;
}
}
.b-workspace-top {
display: flex;
gap: calc(var(--spacing) * 0.5);
}
@media only screen and (max-width: 1023px) {
.b-workspace-top {
flex-direction: column;
align-items: start;
gap: 0;
}
}
@media (prefers-reduced-motion: no-preference) {
.b-workspace-top.aos-init h2 .word {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-workspace-top.aos-init p .word {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-workspace-top.aos-init .c-line-top {
right: unset;
left: 0;
width: 0;
transition: width;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
will-change: width;
}
.b-workspace-top.aos-init .c-line-bottom {
right: 0;
left: unset;
width: 0;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
will-change: width;
}
.b-workspace-top.aos-animate .c-line-top,
.b-workspace-top.aos-animate .c-line-bottom {
width: 100%;
transition-duration: 5s;
transition-delay: 0;
}
.b-workspace-top.aos-animate .c-line-bottom {
transition-duration: 5s;
transition-delay: 0.75s;
}
.b-workspace-top.aos-animate h2 .word {
transform: translateY(0);
transition-duration: 2s;
transition-delay: calc(var(--word-index) * 0.2s + 0.1s);
opacity: 1;
}
.b-workspace-top.aos-animate p .word {
transform: translateY(0);
transition-duration: 2s;
transition-delay: calc(var(--line-index) * 0.2s + 0.5s);
opacity: 1;
}
}
.b-workspace-heading {
display: inline;
width: 100%;
max-width: var(--max-width);
}
@media only screen and (max-width: 1023px) {
.b-workspace-heading {
width: 100%;
}
}
.b-workspace-heading .c-line {
z-index: 2;
}
.b-workspace-heading .c-line-top, .b-workspace-heading .c-line-bottom {
background-color: var(--color-primary);
}
.b-workspace-heading h2 {
z-index: 3;
margin: 0;
padding-top: 0.5ch;
padding-bottom: 0.5ch;
color: var(--color-black);
font-family: var(--font-family-secondary);
font-size: 5.5rem;
font-weight: 400;
letter-spacing: -1px;
line-height: 1.2;
user-select: none;
}
@media only screen and (max-width: 1023px) {
.b-workspace-heading h2 {
font-size: 5rem;
}
}
@media only screen and (max-width: 767px) {
.b-workspace-heading h2 {
font-size: 4rem;
}
}
@media only screen and (max-width: 639px) {
.b-workspace-heading h2 {
font-size: 3rem;
}
}
@media only screen and (max-width: 399px) {
.b-workspace-heading h2 {
font-size: 3rem;
}
}
.b-workspace-text {
width: calc(50% - var(--spacing));
padding-top: var(--spacing);
}
.b-workspace-text p {
font-size: var(--font-size-xl);
}
@media only screen and (max-width: 1023px) {
.b-workspace-text p {
font-size: var(--font-size-lg);
}
}
@media only screen and (max-width: 1023px) {
.b-workspace-text {
width: 100%;
}
}
@media only screen and (max-width: 767px) {
.b-workspace-text {
padding-top: 0;
}
}
.b-workspace-items {
display: flex;
gap: 1.5rem;
flex-wrap: wrap;
margin-top: var(--spacing);
}
@media only screen and (max-width: 1279px) {
.b-workspace-items {
gap: 2rem;
margin-top: 3rem;
}
}
@media (prefers-reduced-motion: no-preference) {
.b-workspace-items.aos-init .b-workspace-item {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-workspace-items.aos-animate .b-workspace-item {
transform: translateY(0);
transition-duration: 2s;
transition-delay: calc(var(--item-index) * 0.2s + 0.5s);
opacity: 1;
}
}
.b-workspace-item {
display: flex;
flex-direction: column;
justify-content: space-between;
width: calc(33.333333% - 1rem);
padding: 3rem;
background-color: var(--color-white);
gap: var(--spacing);
}
@media only screen and (max-width: 1535px) {
.b-workspace-item {
padding: 4rem;
}
}
@media only screen and (max-width: 1279px) {
.b-workspace-item {
width: 100%;
padding: 4rem;
}
}
@media only screen and (max-width: 639px) {
.b-workspace-item {
padding: 3rem;
}
}
@media only screen and (max-width: 399px) {
.b-workspace-item {
padding: 2rem;
}
}
.b-workspace-item-top {
display: flex;
flex-direction: column;
gap: 1.5rem;
}
.b-workspace-item-heading {
font-family: var(--font-family-secondary);
}
@media only screen and (max-width: 399px) {
.b-workspace-item-heading {
font-size: var(--font-size-xl);
}
}
.b-workspace-item-heading h3 {
margin: 0;
padding-top: 0.7ch;
padding-bottom: 0.8ch;
font-size: calc(var(--font-size-xxl) * 1.6);
font-weight: 400;
line-height: 1;
}
@media only screen and (max-width: 1535px) {
.b-workspace-item-heading h3 {
font-size: calc(var(--font-size-xxl) * 1.2);
}
}
.b-workspace-item-heading .c-line span {
height: 2px;
}
.b-workspace-item p {
margin: 0;
font-size: var(--font-size-xl);
}
.b-workspace-item-link {
display: flex;
justify-content: flex-end;
margin-right: -1rem;
margin-bottom: -1rem;
}
.b-workspace-item a {
display: flex;
align-items: center;
color: var(--color-black);
text-decoration: none;
}
.b-workspace-item a:hover svg {
left: 0;
}
.b-workspace-item a span {
position: relative;
z-index: 1;
font-family: var(--font-family-secondary);
font-size: var(--font-size-xl);
line-height: 1;
}
.b-workspace-item a svg {
position: relative;
z-index: 0;
left: 1rem;
width: 7rem;
height: 7rem;
margin-right: -1rem;
margin-bottom: -3.5rem;
transition: left 1s cubic-bezier(0.075, 0.82, 0.165, 1);
}
@media only screen and (max-width: 767px) {
.b-workspace-item a svg {
width: 5rem;
height: 5rem;
}
}
@media only screen and (max-width: 639px) {
.b-workspace-item a svg {
width: 4rem;
height: 4rem;
}
}
.b-contact {
--spacing: 8rem;
position: relative;
width: 100%;
margin: 0;
padding-top: var(--spacing);
padding-bottom: var(--spacing);
overflow: hidden;
background-color: #2F5A47 !important;
color: var(--color-white);
}
.b-contact.is-h1 {
padding-top: calc(var(--spacing) * 2);
}
@media only screen and (max-width: 1279px) {
.b-contact {
--spacing: 6rem;
}
}
@media only screen and (max-width: 1023px) {
.b-contact {
--spacing: 5rem;
}
}
.b-contact-content {
display: flex;
padding-right: var(--container-space);
padding-left: var(--container-space);
gap: calc(var(--spacing) * 0.5);
}
@media only screen and (max-width: 1023px) {
.b-contact-content {
flex-direction: column;
align-items: start;
gap: 0;
}
}
@media only screen and (max-width: 639px) {
.b-contact-content {
margin-bottom: 2rem;
}
}
@media (prefers-reduced-motion: no-preference) {
.b-contact-content.aos-init .char {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-contact-content.aos-init .word {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-contact-content.aos-init .c-line-top {
right: unset;
left: 0;
width: 0;
transition: width;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
will-change: width;
}
.b-contact-content.aos-init .c-line-bottom {
right: 0;
left: unset;
width: 0;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
will-change: width;
}
.b-contact-content.aos-init a {
visibility: hidden;
transform: translateY(2rem);
transition-duration: 0;
transition-delay: 0;
opacity: 0;
will-change: opacity, transform, visibility;
}
.b-contact-content.aos-animate .c-line-top,
.b-contact-content.aos-animate .c-line-bottom {
width: 100%;
transition-duration: 5s;
transition-delay: 0;
}
.b-contact-content.aos-animate .c-line-bottom {
transition-duration: 5s;
transition-delay: 0.75s;
}
.b-contact-content.aos-animate .char {
transform: translateY(0);
transition-duration: 2s;
transition-delay: calc(var(--char-index) * 0.2s + 0.1s);
opacity: 1;
}
.b-contact-content.aos-animate .word {
transform: translateY(0);
transition-duration: 2s;
transition-delay: calc(var(--line-index) * 0.2s + 0.5s);
opacity: 1;
}
.b-contact-content.aos-animate a {
visibility: visible;
transform: translateY(0);
transition: opacity 2s, transform 2s;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: calc(0.1s * var(--item-index) + 1.25s);
opacity: 1;
}
}
.b-contact-heading {
display: inline;
flex-shrink: 1;
}
.b-contact-heading .c-line {
z-index: 2;
}
.b-contact-heading h1,
.b-contact-heading h2 {
z-index: 3;
margin: 0;
padding-top: 0.5ch;
padding-bottom: 0.5ch;
color: var(--color-white);
font-family: var(--font-family-secondary);
font-size: 8rem;
font-weight: 400;
letter-spacing: -1px;
line-height: 1.2;
white-space: nowrap;
user-select: none;
}
@media only screen and (max-width: 1023px) {
.b-contact-heading h1,
.b-contact-heading h2 {
font-size: 5rem;
}
}
@media only screen and (max-width: 767px) {
.b-contact-heading h1,
.b-contact-heading h2 {
font-size: 4rem;
}
}
@media only screen and (max-width: 639px) {
.b-contact-heading h1,
.b-contact-heading h2 {
font-size: 3rem;
}
}
@media only screen and (max-width: 399px) {
.b-contact-heading h1,
.b-contact-heading h2 {
font-size: 3rem;
}
}
.b-contact-right {
display: flex;
flex-direction: column;
flex-grow: 1;
padding-top: calc(var(--spacing) * 0.8);
}
@media only screen and (max-width: 1023px) {
.b-contact-right {
padding-top: 1rem;
}
}
.b-contact-text p {
font-size: var(--font-size-xl);
}
@media only screen and (max-width: 1023px) {
.b-contact-text p {
font-size: var(--font-size-lg);
}
}
@media only screen and (max-width: 1023px) {
.b-contact-text {
padding-top: 0;
}
}
.b-contact-links {
display: flex;
position: relative;
z-index: 2;
align-items: center;
width: 100%;
margin-top: 2rem;
gap: 2rem;
}
@media only screen and (max-width: 767px) {
.b-contact-links {
gap: 1rem;
}
}
@media only screen and (max-width: 399px) {
.b-contact-links {
flex-direction: column;
align-items: start;
}
}
.b-contact-links a {
display: flex;
align-items: center;
color: var(--color-black);
text-decoration: none;
}
.b-contact-links a:hover svg {
left: 0.5rem;
}
.b-contact-links a span {
font-family: var(--font-family-secondary);
font-size: var(--font-size-xl);
line-height: 1;
}
.b-contact-links a svg {
position: relative;
left: -1.5rem;
width: 6rem;
height: 6rem;
transition: left 1s cubic-bezier(0.075, 0.82, 0.165, 1);
}
@media only screen and (max-width: 767px) {
.b-contact-links a svg {
width: 5rem;
height: 5rem;
}
}
@media only screen and (max-width: 639px) {
.b-contact-links a svg {
width: 4rem;
height: 4rem;
}
}
.b-contact-form {
position: relative;
margin-top: calc(var(--spacing) * 0.5);
margin-bottom: var(--spacing);
}
.b-contact-form .gform-theme--framework input[type]:where(:not(.gform-text-input-reset):not([type=hidden])):where(:not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)),
.b-contact-form .gform-theme--framework textarea:where(:not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)),
.b-contact-form .gform-theme--framework select:where(:not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)):where(:not([multiple])) {
height: unset;
padding: 0.5rem 1.15rem;
border: none;
border-radius: 0;
background-color: #F5F3EC;
box-shadow: none;
font-size: var(--font-size-base);
font-size: var(--font-size-lg);
font-weight: 300;
}
.b-contact-form .gform-theme--framework input[type]:where(:not(.gform-text-input-reset):not([type=hidden])):where(:not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)):focus,
.b-contact-form .gform-theme--framework textarea:where(:not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)):focus,
.b-contact-form .gform-theme--framework select:where(:not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)):where(:not([multiple])):focus {
outline: none;
}
.b-contact-form .gform-footer.gform_footer.top_label {
display: flex;
position: relative;
position: absolute;
right: 0;
bottom: calc(var(--spacing) * -1);
align-items: center;
background: transparent;
}
@media only screen and (max-width: 1279px) {
.b-contact-form .gform-footer.gform_footer.top_label {
bottom: calc(var(--spacing) * -1.5);
}
}
@media only screen and (max-width: 767px) {
.b-contact-form .gform-footer.gform_footer.top_label {
bottom: calc(var(--spacing) * -1.75);
}
}
.b-contact-form .gform-footer.gform_footer.top_label:hover::after {
left: -1.5rem;
}
.b-contact-form .gform-footer.gform_footer.top_label::after {
content: "";
display: block;
position: relative;
z-index: 0;
left: 0;
width: 10rem;
height: 10rem;
transition: left 1s cubic-bezier(0.075, 0.82, 0.165, 1);
background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMTYiIGhlaWdodD0iMTE2IiB2aWV3Qm94PSIwIDAgMTE2IDExNiIgZmlsbD0ibm9uZSI+CgkJCQkJCQk8cGF0aCBkPSJNNC44NzUxNCA1Ny41MjNDNC44NzUxNCAyOC40NDY5IDI4LjQ0NjUgNC44NzYwNSA1Ny41MjMxIDQuODc2MDVDODYuNTk5OCA0Ljg3NjA1IDExMC4xNzEgMjguNDQ2OSAxMTAuMTcxIDU3LjUyM0MxMTAuMTcxIDg2LjU5OTIgODYuNTk5OCAxMTAuMTcgNTcuNTIzMSAxMTAuMTdDMjguNDQ2NSAxMTAuMTcgNC44NzUxNCA4Ni41OTkyIDQuODc1MTQgNTcuNTIzWiIgc3Ryb2tlPSIjQzhCNjg0IiBzdHJva2Utd2lkdGg9IjIuMzciLz4KCQkJCQkJCTxwYXRoIGQ9Ik0zNy4wNDc2IDU3LjI4MDVIODAuMDY3Nk03MC4xNDA0IDY1LjU3MzVMODAuMDcxNSA1Ny4yNzk0TTcwLjEzOTkgNDkuMDI1OUw4MC4wNzE5IDU3Ljc2NDQiIHN0cm9rZT0iI0M4QjY4NCIgc3Ryb2tlLXdpZHRoPSIyLjM2Ii8+CgkJCQkJCTwvc3ZnPiAgICA=);
background-position: center;
background-size: contain;
}
.b-contact-form .gform-footer.gform_footer.top_label input.gform_button.button {
position: relative;
z-index: 1;
margin-right: -10rem !important;
padding: 3rem 0 !important;
padding-right: 12rem !important;
border: none !important;
outline: none !important;
background-color: transparent !important;
box-shadow: none !important;
color: var(--color-black) !important;
color: var(--color-white) !important;
font-family: var(--font-family-secondary) !important;
font-size: calc(var(--font-size-xxl) * 1.5) !important;
line-height: 1 !important;
}
.b-contact-form .gform-footer.gform_footer.top_label input.gform_button.button:hover, .b-contact-form .gform-footer.gform_footer.top_label input.gform_button.button:focus {
outline: none !important;
}
.b-contact-form .gform-theme--framework .field_description_below .gfield_description:where(:not(.gfield_creditcard_warning_message):not(.field_validation_above .gfield_validation_message):not(.ginput_counter_tinymce):not(.gfield_choice_limit_message)) {
font-family: var(--font-family-base);
font-size: var(--font-size-md);
font-weight: 300;
}
.b-contact-form .gform_wrapper {
padding: 4rem;
background-color: var(--color-white);
}
.b-contact-form .gform_wrapper h2 {
display: none;
}
.b-contact-form .gform-theme--framework .gform-field-label:where(:not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)) {
display: block;
position: relative;
margin-bottom: 1rem;
color: var(--color-dark-green) !important;
font-family: var(--font-family-base) !important;
font-size: var(--font-size-md);
font-weight: 400;
text-transform: uppercase;
}
.b-contact-form .gform-theme--framework .gform_validation_errors {
border-radius: 0;
box-shadow: none;
}
.b-contact-form .gform-theme--framework .gform_validation_errors .gform_submission_error {
font-size: var(--font-size-md);
font-weight: 300;
}
@media (prefers-reduced-motion: no-preference) {
.b-contact-form.aos-init {
transform: translateY(10%);
transition: transform, opacity;
will-change: transform, opacity;
transition-duration: 0s;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
}
.b-contact-form.aos-animate {
transform: translateY(0);
transition-duration: 1s;
transition-delay: 0.5s;
opacity: 1;
}
}
.b-contact-form .gform_confirmation_wrapper {
color: var(--color-dark-green);
}
.b-contact-form .gform_confirmation_wrapper .gform_confirmation_message {
font-size: 1.5rem;
text-align: center;
}
.gfield.is-optional {
position: relative;
}
.gfield.is-optional .gfield_label.gform-field-label::after {
content: " (optional)";
color: var(--color-black);
font-weight: 300;
text-transform: uppercase;
}
.gform-theme--foundation .ginput_complex.gform-grid-row.has_first_name label {
display: none;
}
.gform-theme--foundation {
--gf-field-gap-x: 16px !important;
}
.gform_required_legend {
display: none !important;
}
.gform-theme--foundation .gfield_required_asterisk {
margin-left: 0.25rem;
font-family: var(--font-family-base);
font-size: var(--font-size-md);
}
body .b-contact-form .gform-theme--framework .gform_validation_errors {
padding: 2rem 3rem;
border-color: var(--color-primary);
background-color: var(--color-light);
color: var(--color-black);
}
body .b-contact-form .gform-theme--framework .gform_validation_errors:focus {
outline: none;
}
body .b-contact-form .gform-theme--framework .gform_validation_errors .gform_submission_error,
body .b-contact-form .gform-theme--framework .gform_validation_errors ol, body .b-contact-form .gform-theme--framework .gform_validation_errors a {
color: var(--color-black);
font-family: var(--font-family-base);
font-weight: 300;
}
.b-blog {
--spacing: 8rem;
position: relative;
width: 100%;
padding-top: var(--spacing);
padding-bottom: calc(var(--spacing) * 1.5);
overflow: hidden;
background-color: #DCD0B3;
}
@media only screen and (max-width: 1279px) {
.b-blog {
--spacing: 6rem;
}
}
@media only screen and (max-width: 1023px) {
.b-blog {
--spacing: 5rem;
}
}
.b-blog.has-pt {
padding-top: calc(var(--spacing) * 2);
}
.b-blog-heading {
flex-shrink: 1;
}
.b-blog-heading .c-line {
z-index: 2;
}
.b-blog-heading .c-line > span {
background-color: var(--color-primary);
}
.b-blog-heading h2 {
z-index: 3;
margin: 0;
padding-top: 0.25ch;
padding-bottom: 0.45ch;
color: var(--color-black);
font-family: var(--font-family-secondary);
font-size: 9rem;
font-weight: 400;
letter-spacing: -1px;
line-height: 1.2;
user-select: none;
}
@media only screen and (max-width: 1023px) {
.b-blog-heading h2 {
padding-top: 0.5ch;
padding-bottom: 0.5ch;
font-size: 5rem;
}
}
@media only screen and (max-width: 767px) {
.b-blog-heading h2 {
font-size: 4rem;
}
}
@media only screen and (max-width: 639px) {
.b-blog-heading h2 {
font-size: 3rem;
}
}
@media only screen and (max-width: 399px) {
.b-blog-heading h2 {
font-size: 3rem;
}
}
@media (prefers-reduced-motion: no-preference) {
.b-blog-heading.aos-init .word {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-blog-heading.aos-init .c-line-top {
right: unset;
left: 0;
width: 0;
transition: width;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
will-change: width;
}
.b-blog-heading.aos-init .c-line-bottom {
right: 0;
left: unset;
width: 0;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
will-change: width;
}
.b-blog-heading.aos-animate .c-line-top,
.b-blog-heading.aos-animate .c-line-bottom {
width: 100%;
transition-duration: 5s;
transition-delay: 0;
}
.b-blog-heading.aos-animate .c-line-bottom {
transition-duration: 5s;
transition-delay: 0.75s;
}
.b-blog-heading.aos-animate .word {
transform: translateY(0);
transition-duration: 2s;
transition-delay: calc(var(--word-index) * 0.2s + 0.1s);
opacity: 1;
}
}
.b-blog-wrapper {
display: flex;
flex-direction: column;
gap: calc(var(--spacing) * 0.75);
align-items: flex-start;
}
.b-blog-carousel {
position: relative;
width: 100%;
}
.b-blog-carousel svg {
width: var(--spacing);
height: var(--spacing);
color: var(--color-primary);
}
@media (prefers-reduced-motion: no-preference) {
.b-blog-nav.aos-init svg {
transform: translateY(4rem);
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
}
.b-blog-nav.aos-animate svg {
transform: translateY(0);
will-change: opacity, transform;
transition-duration: 2s;
transition-delay: calc(0.1s * var(--item-index) + 0.5s);
opacity: 1;
}
}
.b-blog-items .flickity-viewport {
overflow: visible;
}
.acf-block-component .b-blog-items {
display: flex;
overflow-x: auto;
}
@media (prefers-reduced-motion: no-preference) {
.b-blog-items.aos-init .b-location-item {
transform: translateY(4rem);
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
}
.b-blog-items.aos-animate .b-location-item {
transform: translateY(0);
will-change: opacity, transform, visibility;
transition-duration: 2s;
transition-delay: calc(0.1s * var(--item-index) + 0.75s);
opacity: 1;
}
}
.b-blog-next {
position: absolute;
z-index: 1;
right: var(--container-space);
bottom: 0;
transform: translateY(60%) scale(1);
transition: transform 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
cursor: pointer;
}
.b-blog-next:hover {
transform: translateY(60%) scale(1.1);
}
.b-blog-prev {
position: absolute;
z-index: 1;
bottom: 0;
left: var(--container-space);
transform: translateY(60%) scale(1);
transition: transform 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
cursor: pointer;
}
.b-blog-prev:hover {
transform: translateY(60%) scale(1.1);
}
.b-blog-slide {
width: 80%;
}
@media only screen and (max-width: 399px) {
.b-blog-slide {
width: 100%;
}
}
.acf-block-component .b-blog-slide {
flex: 0 0 80%;
}
@media only screen and (max-width: 399px) {
.acf-block-component .b-blog-slide {
flex: 0 0 100%;
}
}
.b-blog-item {
display: flex;
position: relative;
height: 100%;
margin-right: 2rem;
background-color: #EAE1D3;
}
@media only screen and (max-width: 1023px) {
.b-blog-item {
flex-direction: column-reverse;
}
}
.b-blog-tags {
display: flex;
flex-wrap: wrap;
gap: 0.5rem;
}
.b-blog-tag {
display: flex;
align-items: center;
padding: 0.45rem 1rem;
transition: all 0.2s ease-in-out;
background-color: var(--color-primary);
color: var(--color-white);
font-size: var(--font-size-sm);
line-height: 1;
text-decoration: none;
}
.b-blog-tag:hover {
background-color: var(--color-primary-lighter);
}
.b-blog-more {
display: flex;
align-items: center;
color: var(--color-black);
text-decoration: none;
}
.b-blog-more:hover svg {
margin-left: 0;
}
.b-blog-more span {
position: relative;
z-index: 1;
font-family: var(--font-family-secondary);
font-size: var(--font-size-xl);
line-height: 1;
}
.b-blog-more svg {
z-index: 0;
width: 6rem;
height: 6rem;
margin-bottom: -3rem;
margin-left: 1rem;
transition: margin-left 1s cubic-bezier(0.075, 0.82, 0.165, 1);
}
.b-blog-content {
display: flex;
flex-direction: column;
width: 60%;
padding: 10rem 4rem;
gap: 2rem;
}
@media only screen and (max-width: 1023px) {
.b-blog-content {
width: 100%;
padding: 4rem;
}
}
@media only screen and (max-width: 639px) {
.b-blog-content {
padding: 3rem;
gap: 1rem;
}
}
.b-blog-content h3 {
margin: 0;
font-family: var(--font-family-secondary);
font-size: calc(var(--font-size-xxl) * 1.5);
font-weight: 400;
line-height: 1.2;
}
@media only screen and (max-width: 1023px) {
.b-blog-content h3 {
font-size: var(--font-size-xxl);
}
}
.b-blog-content h3 a {
color: var(--color-black);
text-decoration: none;
}
.b-blog-content h3 a:hover {
color: var(--color-dark-green);
}
.b-blog-content p {
margin: 0;
font-size: var(--font-size-xl);
}
.b-blog-image {
position: relative;
width: 40%;
}
@media only screen and (max-width: 1023px) {
.b-blog-image {
width: 100%;
}
}
.b-blog-image::after {
content: "";
display: block;
width: 100%;
height: 0;
padding-top: 130%;
}
@media only screen and (max-width: 1023px) {
.b-blog-image::after {
padding-top: 70%;
}
}
.b-blog-image img {
position: absolute;
z-index: 1;
width: 100%;
height: 100%;
inset: 0;
object-fit: cover;
}
.b-bespoke {
position: relative;
width: 100%;
margin: 0;
overflow: hidden;
transition: all 1s cubic-bezier(0.075, 0.82, 0.165, 1);
border-top: 2px solid var(--color-primary);
border-bottom: 2px solid var(--color-primary);
background-color: var(--color-light);
color: var(--color-white);
}
.b-bespoke:hover {
background-color: var(--color-black);
}
.b-bespoke:hover summary h2 {
color: var(--color-white);
}
.b-bespoke:hover summary img {
opacity: 0.75;
}
.b-bespoke.is-animating-close .b-bespoke-content {
animation: collapse 0.5s linear forwards;
animation-delay: 0;
}
.b-bespoke.is-animating-close .b-bespoke-content li, .b-bespoke.is-animating-close .b-bespoke-content p {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 1s;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: calc(var(--item-index) * 0.1s);
opacity: 0;
will-change: transfrom, opacity;
}
.b-bespoke.is-animating-close .b-bespoke-content a svg {
visibility: hidden;
position: relative;
transform: translate(0, 1rem);
transition-duration: 0;
transition-delay: 0;
opacity: 0;
will-change: opacity, transform, left, visibility;
}
.b-bespoke.is-animating-open {
background-color: var(--color-black);
}
.b-bespoke.is-animating-open .b-bespoke-content {
animation: expand 5s linear forwards;
animation-delay: 0;
background-color: var(--color-black);
}
.b-bespoke.is-animating-open .b-bespoke-content li, .b-bespoke.is-animating-open .b-bespoke-content p {
transform: translateY(0);
transition-duration: 1s;
transition-delay: calc(var(--item-index) * 0.1s);
opacity: 1;
}
.b-bespoke.is-animating-open .b-bespoke-content a svg {
visibility: visible;
transform: translateY(0);
transition: opacity 1s 0.5s, transform 1s 0.5s, left 1s;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
opacity: 1;
}
.b-bespoke.is-animating-open h2 svg {
transform: rotate(90deg);
}
.b-bespoke.is-animating-open summary img {
opacity: 0.75;
}
.b-bespoke.is-animating-open summary h2 {
color: var(--color-white);
}
.b-bespoke.is-animating-open:hover summary h2 {
color: var(--color-white);
}
.b-bespoke.aos-animate h2 svg {
transform: rotate(90deg);
transition: opacity 0.5s 0s, transform 0.5s 0s !important;
transition-delay: 0;
}
.b-bespoke.aos-animate.is-animating-open h2 svg {
transform: rotate(90deg);
transition: opacity 0.5s 0s, transform 0.5s 0s !important;
transition-delay: 0;
}
.b-bespoke-margin {
--spacing: 6rem;
padding-top: var(--spacing);
background-color: #EAE1D3;
}
.b-bespoke-margin + .b-bespoke-margin {
padding-top: 0;
}
.b-bespoke summary {
padding-top: var(--spacing);
padding-bottom: var(--spacing);
background-image: none;
-webkit-appearance: none;
list-style: none;
}
.b-bespoke summary::marker {
display: none;
}
.b-bespoke summary img {
transition: all 1s cubic-bezier(0.075, 0.82, 0.165, 1);
opacity: 0;
}
.b-bespoke img {
position: absolute;
z-index: 1;
width: 100%;
height: 100%;
inset: 0;
object-fit: cover;
opacity: 0.75;
}
.b-bespoke h2 {
margin-top: 0;
margin-bottom: 0;
color: var(--color-black);
font-family: var(--font-family-secondary);
font-size: 8rem;
font-weight: 400;
letter-spacing: -0.16rem;
line-height: 1;
text-decoration: none;
user-select: none;
}
@media only screen and (max-width: 1023px) {
.b-bespoke h2 {
font-size: 6rem;
}
}
@media only screen and (max-width: 767px) {
.b-bespoke h2 {
justify-content: space-between;
font-size: 5rem;
}
}
@media only screen and (max-width: 639px) {
.b-bespoke h2 {
font-size: 4rem;
}
}
@media only screen and (max-width: 399px) {
.b-bespoke h2 {
font-size: 3rem;
}
}
.b-bespoke h2 > span {
position: relative;
}
.b-bespoke h2 svg {
position: absolute;
z-index: -1;
right: -2ch;
bottom: -0.5ch;
width: 1.75ch;
height: 1.75ch;
transform: rotate(0deg);
}
.b-bespoke .container {
position: relative;
z-index: 2;
}
.b-bespoke-content {
display: block !important;
visibility: hidden;
max-height: 0;
padding-bottom: var(--spacing);
overflow: hidden;
transition: all 3s cubic-bezier(0.075, 0.82, 0.165, 1); animation: none;
}
@media only screen and (min-width: 1024px) {
.b-bespoke-content {
padding-right: 3rem;
}
}
.b-bespoke-content .container {
display: flex;
position: relative;
gap: 3rem;
}
@media only screen and (max-width: 639px) {
.b-bespoke-content .container {
flex-direction: column;
}
}
.b-bespoke-content .rte {
font-size: var(--font-size-xl);
line-height: 1.3;
}
.b-bespoke-content ul {
display: flex;
flex-wrap: wrap;
margin: 0;
padding-left: 1rem;
gap: 2rem;
row-gap: 0.5rem;
}
@media only screen and (max-width: 1023px) {
.b-bespoke-content ul {
row-gap: 0;
}
}
.b-bespoke-content ul li {
position: relative;
width: calc(50% - 1rem);
}
@media only screen and (max-width: 1023px) {
.b-bespoke-content ul li {
width: 100%;
}
}
.b-bespoke-content a {
display: flex;
flex-shrink: 1;
align-items: center;
color: var(--color-white);
text-decoration: none;
}
.b-bespoke-content a:hover svg {
left: 1rem;
}
.b-bespoke-content a span {
font-family: var(--font-family-secondary);
font-size: var(--font-size-xl);
line-height: 1;
white-space: nowrap;
}
.b-bespoke-content a > span {
position: relative;
z-index: 1;
}
.b-bespoke-content a svg {
position: relative;
z-index: 0;
left: -1.5rem;
width: var(--spacing);
height: var(--spacing);
transition: left 1s cubic-bezier(0.075, 0.82, 0.165, 1);
}
@media (prefers-reduced-motion: no-preference) {
.b-bespoke.aos-init .char {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-bespoke.aos-init .word {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-bespoke.aos-init h2 svg {
visibility: hidden;
transform: translate(0, 1rem) rotate(90deg);
transition-duration: 0;
transition-delay: 0;
opacity: 0;
will-change: opacity, transform, visibility;
}
.b-bespoke.aos-animate .char {
transform: translateY(0);
transition-duration: 2s;
transition-delay: calc(var(--char-index) * 0.2s + 0.1s);
opacity: 1;
}
.b-bespoke.aos-animate .word {
transform: translateY(0);
transition-duration: 2s;
transition-delay: calc(var(--line-index) * 0.2s + 0.5s);
opacity: 1;
}
.b-bespoke.aos-animate h2 svg {
visibility: visible;
transform: translateY(0) rotate(0deg);
transition: opacity 1s 1s, transform 1s 1s;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
opacity: 1;
}
}
@keyframes expand {
from {
max-height: 0;
}
to {
max-height: 2000px; }
}
@keyframes collapse {
from {
max-height: 2000px; }
to {
max-height: 0;
}
}
.b-content {
position: relative;
z-index: 50;
padding-top: 8rem;
padding-bottom: 8rem;
background-color: var(--color-light-white);
}
.b-content.is-bg-white {
background-color: #fff !important;
}
@media only screen and (max-width: 1279px) {
.b-content {
padding-top: 6rem;
padding-bottom: 6rem;
}
}
@media only screen and (max-width: 1023px) {
.b-content {
padding-top: 5rem;
padding-bottom: 5rem;
}
}
@media only screen and (max-width: 767px) {
.b-content {
padding-top: 4rem;
padding-bottom: 4rem;
}
}
.b-content-wrapper {
display: flex;
gap: 8rem;
}
.b-content-wrapper.is-reverse {
flex-direction: row-reverse;
}
@media only screen and (max-width: 1279px) {
.b-content-wrapper {
gap: 4rem;
}
}
@media only screen and (max-width: 1023px) {
.b-content-wrapper {
flex-direction: column-reverse;
gap: 2rem;
}
.b-content-wrapper.is-reverse {
flex-direction: column-reverse;
}
}
.b-content-wrapper.has-image-height {
padding-top: 8rem;
padding-bottom: 8rem;
}
@media only screen and (max-width: 1023px) {
.b-content-wrapper.has-image-height {
padding-top: 0;
padding-bottom: 0;
}
}
.b-content-image {
position: relative;
width: calc(50% - 2rem);
}
.has-image-height .b-content-image {
top: -8rem;
}
@media only screen and (max-width: 1023px) {
.has-image-height .b-content-image {
top: unset;
transform: translate3d(0, 0, 0) !important;
}
}
@media only screen and (max-width: 1023px) {
.b-content-image {
width: 100%;
}
}
.b-content-image img {
width: 100%;
height: auto;
}
.b-content-img {
position: relative;
}
@media only screen and (max-width: 1023px) {
.b-content-img::after {
content: "";
display: block;
width: 100%;
height: 0;
padding-top: 65%;
}
}
.has-image-height .b-content-img {
position: absolute;
width: 100%;
height: calc(100% + 16rem);
}
@media only screen and (max-width: 1023px) {
.has-image-height .b-content-img {
position: relative;
height: 100%;
}
}
.has-image-height .b-content-img img {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
object-fit: cover;
}
@media only screen and (max-width: 1023px) {
.b-content-img img {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
object-fit: cover;
}
.has-image-size .b-content-img img {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
object-fit: cover;
}
}
.has-image-size .b-content-img, .has-image-height.has-image-size .b-content-img {
left: 0;
width: 120%;
}
@media only screen and (max-width: 1023px) {
.has-image-size .b-content-img, .has-image-height.has-image-size .b-content-img {
width: 100%;
}
}
.has-image-height.is-reverse .b-content-img {
right: 0;
left: unset;
}
.has-image-size.is-reverse .b-content-img {
right: 20%;
left: unset;
}
.has-image-size.has-image-height.is-reverse .b-content-img {
right: 0;
left: unset;
}
@media (prefers-reduced-motion: no-preference) {
.b-content-img.aos-init img {
transform: scale(0);
transition: transform 0s cubic-bezier(0.075, 0.82, 0.165, 1) 0s;
will-change: transform;
}
}
@media only screen and (prefers-reduced-motion: no-preference) and (max-width: 767px) {
.b-content-img.aos-init img {
transform: scale(1) translateY(6rem);
opacity: 0;
}
}
@media (prefers-reduced-motion: no-preference) {
.b-content-img.aos-init .c-shape {
transform: scale(0);
transition: transform;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
will-change: transform;
}
.b-content-img.aos-animate img {
transform: scale(1);
transition: transform 2s cubic-bezier(0.075, 0.82, 0.165, 1) 0.5s;
}
}
@media only screen and (prefers-reduced-motion: no-preference) and (max-width: 767px) {
.b-content-img.aos-animate img {
transform: scale(1) translateY(0);
transition: transform 2s, opacity 2s;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0.5s;
opacity: 1;
}
}
@media (prefers-reduced-motion: no-preference) {
.b-content-img.aos-animate .c-shape {
transform: scale(1);
transition: transform;
transition-duration: 1.5s;
transition-delay: 1s;
}
}
.b-content-text {
display: flex;
flex-direction: column;
justify-content: center;
gap: 0;
width: calc(50% - 2rem);
}
@media only screen and (max-width: 1023px) {
.b-content-text {
width: 100%;
}
}
.b-content-text-heading {
width: 100%;
max-width: var(--max-width);
margin-bottom: 1rem;
}
.b-content-text-heading h2 {
z-index: 3;
margin: 0;
padding-top: 0.5ch;
padding-bottom: 0.5ch;
color: var(--color-black);
font-family: var(--font-family-secondary);
font-size: 5rem;
font-weight: 400;
letter-spacing: -1px;
line-height: 1.2;
user-select: none;
}
@media only screen and (max-width: 1023px) {
.b-content-text-heading h2 {
font-size: 3.5rem;
}
}
@media only screen and (max-width: 767px) {
.b-content-text-heading h2 {
font-size: 3rem;
}
}
@media only screen and (max-width: 639px) {
.b-content-text-heading h2 {
font-size: 2rem;
}
}
@media (prefers-reduced-motion: no-preference) {
.b-content-text-heading.aos-init .char {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-content-text-heading.aos-init .word {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-content-text-heading.aos-init .c-line-top {
right: unset;
left: 0;
width: 0;
transition: width;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
will-change: width;
}
.b-content-text-heading.aos-init .c-line-bottom {
right: 0;
left: unset;
width: 0;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
will-change: width;
}
.b-content-text-heading.aos-animate .c-line-top,
.b-content-text-heading.aos-animate .c-line-bottom {
width: 100%;
transition-duration: 5s;
transition-delay: 0;
}
.b-content-text-heading.aos-animate .c-line-bottom {
transition-duration: 5s;
transition-delay: 0.75s;
}
.b-content-text-heading.aos-animate .word {
transform: translateY(0);
transition-duration: 2s;
transition-delay: calc(var(--word-index) * 0.2s + 0.25s);
opacity: 1;
}
}
@media only screen and (prefers-reduced-motion: no-preference) and (max-width: 767px) {
.b-content-text-heading.aos-animate .word {
transition-duration: 4s;
transition-delay: calc(var(--word-index) * 0.2s + 1s);
}
}
.b-content-text .rte {
font-size: var(--font-size-xl);
line-height: 1.3;
}
@media (prefers-reduced-motion: no-preference) {
.b-content-text .rte.aos-init .char {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-content-text .rte.aos-init .word {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-content-text .rte.aos-animate .word {
transform: translateY(0);
transition-duration: 2s;
transition-delay: calc(var(--line-index) * 0.1s + 1.5s);
opacity: 1;
}
}
@media only screen and (prefers-reduced-motion: no-preference) and (max-width: 767px) {
.b-content-text .rte.aos-animate .word {
transition-duration: 4s;
transition-delay: calc(var(--line-index) * 0.1s + 1s);
}
}
.b-content-text > a {
display: flex;
align-items: center;
margin-top: 2rem;
color: var(--color-black);
text-decoration: none;
}
.b-content-text > a:hover svg {
margin-left: 0;
}
.b-content-text > a span {
position: relative;
z-index: 1;
font-family: var(--font-family-secondary);
font-size: var(--font-size-xl);
line-height: 1;
}
.b-content-text > a svg {
z-index: 0;
width: 6rem;
height: 6rem;
margin-bottom: -3rem;
margin-left: 1rem;
transition: margin-left 1s cubic-bezier(0.075, 0.82, 0.165, 1);
}
@media (prefers-reduced-motion: no-preference) {
.b-content-text > a.aos-init .char {
visibility: hidden;
transform: translateY(2rem);
transition-duration: 0;
transition-delay: 0;
opacity: 0;
will-change: opacity, transform, visibility;
}
.b-content-text > a.aos-init svg {
visibility: hidden;
position: relative;
transform: translate(0, 1rem);
transition-duration: 0;
transition-delay: 0;
opacity: 0;
will-change: opacity, transform, margin-left, visibility;
}
.b-content-text > a.aos-animate .char {
visibility: visible;
transform: translateY(0);
transition: opacity 2s, transform 2s;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: calc(0.025s * var(--char-index) + 2.5s);
opacity: 1;
}
.b-content-text > a.aos-animate svg {
visibility: visible;
transform: translateY(0);
transition: opacity 2s 2.75s, transform 2s 2.75s, margin-left 1s;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
opacity: 1;
}
}
.wp-block-spacer {
width: 100%;
max-width: 100% !important;
margin: 0 !important;
background-color: #E8E1D1;
}
.wp-block-spacer.is-style-bg-1 {
background-color: #DCD0B3;
}
.wp-block-spacer.is-style-bg-2 {
background-color: #C7B584;
}
.wp-block-spacer.is-style-bg-3 {
background-color: #2E5A47;
}
.wp-block-spacer.is-style-bg-4 {
background-color: #F5F3EC;
}
.wp-block-spacer.is-style-bg-5 {
background-color: #FFF;
}
.b-room-manager {
--spacing: 8rem;
background-color: var(--color-light);
}
@media only screen and (max-width: 1279px) {
.b-room-manager {
--spacing: 6rem;
}
}
@media only screen and (max-width: 1023px) {
.b-room-manager {
--spacing: 5rem;
}
}
.b-room-manager-wrapper {
display: flex;
flex-direction: column;
height: 100%;
min-height: 100dvh;
}
@media only screen and (max-width: 767px) {
.b-room-manager-wrapper {
gap: calc(var(--spacing) * 0.5);
}
}
.b-room-manager-header {
display: flex;
position: relative;
flex-direction: column;
flex-grow: 1;
justify-content: center;
padding-top: calc(var(--spacing) * 2);
padding-bottom: calc(var(--spacing) * 1);
overflow: hidden;
background-color: var(--color-black);
}
.b-room-manager-header img {
position: absolute;
z-index: 1;
top: 0;
left: 0;
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
opacity: 0.4;
}
.b-room-manager-header .container {
display: flex;
position: relative;
z-index: 2;
flex-direction: column;
align-items: center;
justify-content: center;
}
.b-room-manager-heading {
display: inline-block;
flex-shrink: 0;
width: auto;
max-width: var(--max-width);
margin-right: auto;
margin-left: auto;
text-align: center;
}
@media only screen and (max-width: 1023px) {
.b-room-manager-heading {
max-width: 100%;
}
}
@media (prefers-reduced-motion: no-preference) {
.b-room-manager-heading.aos-init .char {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-room-manager-heading.aos-init .word {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-room-manager-heading.aos-init .c-line-top {
right: unset;
left: 0;
width: 0;
transition: width;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
will-change: width;
}
.b-room-manager-heading.aos-init .c-line-bottom {
right: 0;
left: unset;
width: 0;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
will-change: width;
}
.b-room-manager-heading.aos-animate .c-line-top,
.b-room-manager-heading.aos-animate .c-line-bottom {
width: 100%;
transition-duration: 5s;
transition-delay: 0;
}
.b-room-manager-heading.aos-animate .c-line-bottom {
transition-duration: 5s;
transition-delay: 0.75s;
}
.b-room-manager-heading.aos-animate .char {
transform: translateY(0);
transition-duration: 2s;
transition-delay: calc(var(--char-index) * 0.1s + 0.1s);
opacity: 1;
}
.b-room-manager-heading.aos-animate .word {
transform: translateY(0);
transition-duration: 2s;
transition-delay: calc(var(--line-index) * 0.2s + 0.5s);
opacity: 1;
}
}
.b-room-manager-heading .c-line {
z-index: 2;
}
.b-room-manager-heading .c-line-top, .b-room-manager-heading .c-line-bottom {
background-color: var(--color-primary-lighter);
}
.b-room-manager-heading h2,
.b-room-manager-heading h1 {
z-index: 3;
margin: 0;
padding-top: 1ch;
padding-bottom: 1ch;
color: var(--color-white);
font-family: var(--font-family-secondary);
font-size: 6rem;
font-weight: 400;
letter-spacing: -1px;
line-height: 1.2;
}
@media only screen and (max-width: 1529px) {
.b-room-manager-heading h2,
.b-room-manager-heading h1 {
font-size: 5.5rem;
}
}
@media only screen and (max-width: 1023px) {
.b-room-manager-heading h2,
.b-room-manager-heading h1 {
font-size: 5rem;
}
}
@media only screen and (max-width: 767px) {
.b-room-manager-heading h2,
.b-room-manager-heading h1 {
font-size: 4rem;
}
}
@media only screen and (max-width: 639px) {
.b-room-manager-heading h2,
.b-room-manager-heading h1 {
font-size: 3rem;
}
}
@media only screen and (max-width: 399px) {
.b-room-manager-heading h2,
.b-room-manager-heading h1 {
font-size: 3rem;
}
}
.b-room-manager-inner {
padding-top: calc(var(--spacing) * 0.5);
padding-bottom: calc(var(--spacing) * 0.5);
}
.b-room-manager-items {
display: flex;
flex-wrap: wrap;
padding-top: 2rem;
padding-bottom: 2rem;
gap: 6rem;
}
@media only screen and (max-width: 1023px) {
.b-room-manager-items {
flex-direction: column;
}
}
@media (prefers-reduced-motion: no-preference) {
.b-room-manager-items.aos-init .b-room-manager-item {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-room-manager-items.aos-animate .b-room-manager-item {
transform: translateY(0);
transition-duration: 2s;
transition-delay: calc(var(--item-index) * 0.2s + 0.5s);
opacity: 1;
}
}
.b-room-manager-item {
display: flex;
flex-direction: column;
align-items: center;
width: calc(33.333333% - 4rem);
gap: 1rem;
}
@media only screen and (max-width: 1023px) {
.b-room-manager-item {
width: 100%;
}
}
.b-room-manager-item img {
width: 6rem;
height: 6rem;
object-fit: contain;
object-position: center;
}
@media only screen and (max-width: 639px) {
.b-room-manager-item img {
width: 4rem;
}
}
.b-room-manager-item p {
font-size: var(--font-size-lg);
text-align: center;
}
.b-room-manager-item a {
display: flex;
align-items: center;
color: var(--color-black);
text-decoration: none;
}
.b-room-manager-item a:hover svg {
margin-left: 0;
}
.b-room-manager-item a span {
position: relative;
z-index: 1;
font-family: var(--font-family-secondary);
font-size: var(--font-size-xl);
line-height: 1;
}
.b-room-manager-item a svg {
z-index: 0;
width: 6rem;
height: 6rem;
margin-bottom: -3rem;
margin-left: 1rem;
transition: margin-left 1s cubic-bezier(0.075, 0.82, 0.165, 1);
}
.b-amenities {
--spacing: 8rem;
padding-top: var(--spacing);
padding-bottom: var(--spacing);
background-color: #F5F5F5;
}
@media only screen and (max-width: 1279px) {
.b-amenities {
--spacing: 6rem;
}
}
@media only screen and (max-width: 1023px) {
.b-amenities {
--spacing: 5rem;
}
}
.b-amenities-top {
display: flex;
flex-direction: column;
gap: 3rem;
}
@media only screen and (max-width: 1023px) {
.b-amenities-top {
gap: 2rem;
}
}
@media (prefers-reduced-motion: no-preference) {
.b-amenities-top.aos-init .char {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-amenities-top.aos-init .word {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-amenities-top.aos-init .c-line-top {
right: unset;
left: 0;
width: 0;
transition: width;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
will-change: width;
}
.b-amenities-top.aos-init .c-line-bottom {
right: 0;
left: unset;
width: 0;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
will-change: width;
}
.b-amenities-top.aos-animate .c-line-top,
.b-amenities-top.aos-animate .c-line-bottom {
width: 100%;
transition-duration: 5s;
transition-delay: 0;
}
.b-amenities-top.aos-animate .c-line-bottom {
transition-duration: 5s;
transition-delay: 0.75s;
}
.b-amenities-top.aos-animate .char {
transform: translateY(0);
transition-duration: 2s;
transition-delay: calc(var(--char-index) * 0.1s + 0.1s);
opacity: 1;
}
.b-amenities-top.aos-animate .word {
transform: translateY(0);
transition-duration: 2s;
transition-delay: calc(var(--line-index) * 0.2s + 0.5s);
opacity: 1;
}
}
.b-amenities-heading {
width: 100%;
max-width: var(--max-width);
font-size: 6rem;
}
@media only screen and (max-width: 1023px) {
.b-amenities-heading {
font-size: 5rem;
}
}
@media only screen and (max-width: 767px) {
.b-amenities-heading {
font-size: 4rem;
}
}
@media only screen and (max-width: 639px) {
.b-amenities-heading {
max-width: 100%;
}
}
.b-amenities-heading .c-line {
z-index: 2;
}
.b-amenities-heading .c-line-top, .b-amenities-heading .c-line-bottom {
background-color: var(--color-primary);
}
.b-amenities-heading h2 {
z-index: 3;
margin: 0;
padding-top: 0.5ch;
padding-bottom: 0.5ch;
color: var(--color-black);
font-family: var(--font-family-secondary);
font-size: inherit;
font-weight: 400;
letter-spacing: -1px;
line-height: 1.2;
}
.b-amenities-text {
width: 100%;
max-width: 600px;
}
.b-amenities-text .rte {
font-size: var(--font-size-xl);
}
@media only screen and (max-width: 1023px) {
.b-amenities-text .rte {
font-size: var(--font-size-lg);
}
}
@media only screen and (max-width: 767px) {
.b-amenities-text {
padding-top: 0;
}
}
.b-amenities-text p:last-child {
margin-bottom: 0;
}
.b-amenities-items {
display: flex;
gap: 1rem;
flex-wrap: wrap;
margin-top: var(--spacing);
}
@media (prefers-reduced-motion: no-preference) {
.b-amenities-items.aos-init .b-amenities-item {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-amenities-items.aos-animate .b-amenities-item {
transform: translateY(0);
transition-duration: 2s;
transition-delay: calc(var(--item-index) * 0.2s + 1.5s);
opacity: 1;
}
}
.b-amenities-item {
display: flex;
flex-direction: column;
width: calc(20% - 0.8rem);
padding: 3rem;
transition: background-color 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
background-color: var(--color-light);
gap: 1rem;
}
@media only screen and (max-width: 1279px) {
.b-amenities-item {
width: calc(25% - 0.75rem);
}
}
@media only screen and (max-width: 1023px) {
.b-amenities-item {
width: calc(33.333333% - 0.6666666667rem);
}
}
@media only screen and (max-width: 639px) {
.b-amenities-item {
width: calc(50% - 0.5rem);
padding: 2rem;
}
}
@media only screen and (max-width: 279px) {
.b-amenities-item {
width: 100%;
padding: 2rem;
}
}
.b-amenities-item:hover {
background-color: var(--color-primary);
}
.b-amenities-item-icon {
display: flex;
align-items: center;
justify-content: center;
}
.b-amenities-item-icon img {
width: 3rem;
height: 3rem;
object-fit: contain;
object-position: center;
}
.b-amenities-item p {
margin: 0;
font-size: var(--font-size-base);
line-height: 1.1;
text-align: center;
}
.b-ch1 {
--spacing: 8rem;
padding-top: calc(var(--spacing) * 2);
background-color: #DCD0B5;
}
@media only screen and (max-width: 1279px) {
.b-ch1 {
--spacing: 6rem;
}
}
@media only screen and (max-width: 1023px) {
.b-ch1 {
--spacing: 5rem;
}
}
.b-ch1-heading {
display: inline-block;
flex-shrink: 0;
width: auto;
max-width: var(--max-width);
font-size: 10rem;
}
@media only screen and (max-width: 1023px) {
.b-ch1-heading {
max-width: 100%;
}
}
.b-ch1-heading .c-line {
z-index: 2;
}
.b-ch1-heading .c-line-top, .b-ch1-heading .c-line-bottom {
background-color: var(--color-primary);
}
.b-ch1-heading h2,
.b-ch1-heading h1 {
z-index: 3;
margin: 0;
padding-top: 0.5ch;
padding-bottom: 0.5ch;
color: var(--color-black);
font-family: var(--font-family-secondary);
font-size: inherit;
font-weight: 400;
letter-spacing: -1px;
line-height: 1.2;
}
@media only screen and (max-width: 1023px) {
.b-ch1-heading h2,
.b-ch1-heading h1 {
font-size: 6.5rem;
}
}
@media only screen and (max-width: 639px) {
.b-ch1-heading h2,
.b-ch1-heading h1 {
font-size: 5rem;
}
}
@media (prefers-reduced-motion: no-preference) {
.b-ch1-heading.aos-init .char {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-ch1-heading.aos-init .word {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-ch1-heading.aos-init .c-line-top {
right: unset;
left: 0;
width: 0;
transition: width;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
will-change: width;
}
.b-ch1-heading.aos-init .c-line-bottom {
right: 0;
left: unset;
width: 0;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
will-change: width;
}
.b-ch1-heading.aos-animate .c-line-top,
.b-ch1-heading.aos-animate .c-line-bottom {
width: 100%;
transition-duration: 5s;
transition-delay: 0;
}
.b-ch1-heading.aos-animate .c-line-bottom {
transition-duration: 5s;
transition-delay: 0.75s;
}
.b-ch1-heading.aos-animate .char {
transform: translateY(0);
transition-duration: 2s;
transition-delay: calc(var(--char-index) * 0.1s + 0.1s);
opacity: 1;
}
.b-ch1-heading.aos-animate .word {
transform: translateY(0);
transition-duration: 2s;
transition-delay: calc(var(--line-index) * 0.2s + 0.5s);
opacity: 1;
}
}
.b-ch1-1 {
display: flex;
align-items: center;
gap: 6rem;
margin-top: var(--spacing);
margin-bottom: 4rem;
padding-bottom: 4rem;
border-bottom: 3px solid var(--color-primary);
}
@media only screen and (max-width: 1023px) {
.b-ch1-1 {
flex-direction: column;
align-items: center;
}
}
@media (prefers-reduced-motion: no-preference) {
.b-ch1-1.aos-init .b-ch1-1-item {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-ch1-1.aos-animate .b-ch1-1-item {
transform: translateY(0);
transition-duration: 2s;
transition-delay: calc(var(--item-index) * 0.2s + 0.5s);
opacity: 1;
}
}
.b-ch1-1-image {
width: calc(55% - 6rem);
max-width: 100%;
}
@media only screen and (max-width: 1023px) {
.b-ch1-1-image {
width: 100%;
max-width: 500px;
}
}
.b-ch1-1-image img {
width: 100%;
height: auto;
}
.b-ch1-1-text {
width: 45%;
font-size: 2.4rem;
}
@media only screen and (max-width: 1023px) {
.b-ch1-1-text {
width: 100%;
max-width: 600px;
text-align: center;
}
}
.b-ch1-2 {
display: flex;
align-items: center;
}
@media only screen and (max-width: 1023px) {
.b-ch1-2 {
flex-direction: column;
align-items: center;
}
}
@media (prefers-reduced-motion: no-preference) {
.b-ch1-2.aos-init .char {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-ch1-2.aos-init .word {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-ch1-2.aos-init .c-line-top {
right: unset;
left: 0;
width: 0;
transition: width;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
will-change: width;
}
.b-ch1-2.aos-init .c-line-bottom {
right: 0;
left: unset;
width: 0;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
will-change: width;
}
.b-ch1-2.aos-animate .c-line-top,
.b-ch1-2.aos-animate .c-line-bottom {
width: 100%;
transition-duration: 5s;
transition-delay: 0;
}
.b-ch1-2.aos-animate .c-line-bottom {
transition-duration: 5s;
transition-delay: 0.75s;
}
.b-ch1-2.aos-animate .char {
transform: translateY(0);
transition-duration: 2s;
transition-delay: calc(var(--char-index) * 0.1s + 0.1s);
opacity: 1;
}
.b-ch1-2.aos-animate .word {
transform: translateY(0);
transition-duration: 2s;
transition-delay: calc(var(--line-index) * 0.2s + 0.5s);
opacity: 1;
}
}
@media (prefers-reduced-motion: no-preference) {
.b-ch1-2.aos-init [data-splitting=items] > div {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-ch1-2.aos-animate [data-splitting=items] > div {
transform: translateY(0);
transition-duration: 2s;
transition-delay: calc(var(--item-index) * 0.2s + 0.5s);
opacity: 1;
}
}
.b-ch1-2-heading {
width: 40%;
max-width: 100%;
margin-bottom: 0;
padding-right: 3rem;
}
@media only screen and (max-width: 1023px) {
.b-ch1-2-heading {
width: 100%;
text-align: center;
}
}
.b-ch1-2-heading h3 {
font-family: var(--font-family-secondary);
font-size: 3.75rem;
font-weight: 400;
}
@media only screen and (max-width: 767px) {
.b-ch1-2-heading h3 {
font-size: 3rem;
}
}
@media only screen and (max-width: 639px) {
.b-ch1-2-heading h3 {
font-size: 2.5rem;
}
}
.b-ch1-2-graphics {
display: flex;
flex-direction: column;
width: 60%;
}
@media only screen and (max-width: 1023px) {
.b-ch1-2-graphics {
width: 100%;
}
}
.b-ch1-2-graphics-value {
font-family: var(--font-family-secondary);
font-size: 4rem;
font-weight: 700;
line-height: 1;
}
@media only screen and (max-width: 1023px) {
.b-ch1-2-graphics-value {
font-size: 3rem;
}
}
.b-ch1-2-graphics-value.is-39 {
font-size: 6rem;
}
@media only screen and (max-width: 1023px) {
.b-ch1-2-graphics-value.is-39 {
font-size: 4.5rem;
}
}
.b-ch1-2-graphics-value.is-61 {
font-size: 4.5rem;
}
@media only screen and (max-width: 1023px) {
.b-ch1-2-graphics-value.is-61 {
font-size: 3rem;
}
}
.b-ch1-2-graphics-value span {
opacity: 0;
}
.b-ch1-2-graphics-value span.countup-started {
transition: opacity 0.1s ease-in-out;
opacity: 1;
}
.b-ch1-2-graphics-text {
font-size: var(--font-size-xl);
line-height: 1;
}
@media only screen and (max-width: 1023px) {
.b-ch1-2-graphics-text {
font-size: var(--font-size-md);
}
}
.b-ch1-2-graphics-text.is-61 {
max-width: 13rem;
}
.b-ch1-2-graphics-top {
display: flex;
}
.b-ch1-2-graphics-center {
display: flex;
gap: 0.5rem;
height: 2rem;
}
.b-ch1-2-graphics-center-1 {
width: 28%;
background-color: var(--color-primary);
}
.b-ch1-2-graphics-center-2 {
width: calc(11% - 1rem);
background-color: #D6DED9;
}
.b-ch1-2-graphics-center-3 {
width: 50%;
background-color: var(--color-dark-green);
}
.b-ch1-2-graphics-bottom {
display: flex;
}
.b-ch1-2-graphics-39 {
display: flex;
flex-direction: column;
justify-content: flex-end;
width: 39%;
padding-top: 0;
padding-bottom: 2rem;
padding-left: 1rem;
border-left: 0.25rem solid var(--color-primary);
}
.b-ch1-2-graphics-61 {
display: flex;
flex-direction: column;
justify-content: flex-end;
width: 61%;
padding-top: 0;
padding-bottom: 2rem;
padding-left: 1rem;
border-left: 0.25rem solid var(--color-primary);
}
.b-ch1-2-graphics-28 {
display: flex;
align-items: center;
width: 38%;
padding-top: 2rem;
padding-bottom: 0;
gap: 1rem;
padding-left: 1rem;
border-left: 0.25rem solid var(--color-primary);
}
.b-ch1-2-graphics-28 .b-ch1-2-graphics-text {
max-width: 100px;
}
@media only screen and (max-width: 1023px) {
.b-ch1-2-graphics-28 {
display: flex;
flex-direction: row;
align-items: center;
width: 28%;
padding-right: 1rem;
padding-left: 0;
border-right: 0.25rem solid var(--color-primary);
border-left: none;
gap: 1rem;
}
.b-ch1-2-graphics-28 .b-ch1-2-graphics-value {
font-size: 3rem;
}
.b-ch1-2-graphics-28 .b-ch1-2-graphics-text {
font-size: var(--font-size-md);
}
}
@media only screen and (max-width: 639px) {
.b-ch1-2-graphics-28 {
flex-direction: column;
align-items: flex-start;
}
}
.b-ch1-2-graphics-11 {
display: flex;
align-items: center;
gap: 1rem;
width: 63%;
padding-top: 2rem;
padding-bottom: 0;
padding-left: 1rem;
border-left: 0.25rem solid var(--color-primary);
}
@media only screen and (max-width: 1023px) {
.b-ch1-2-graphics-11 {
display: flex;
flex-direction: row;
align-items: center;
margin-left: 0.5rem;
gap: 1rem;
}
.b-ch1-2-graphics-11 .b-ch1-2-graphics-value {
font-size: 3rem;
}
.b-ch1-2-graphics-11 .b-ch1-2-graphics-text {
font-size: var(--font-size-md);
}
}
@media only screen and (max-width: 639px) {
.b-ch1-2-graphics-11 {
flex-direction: column;
align-items: flex-start;
}
}
.b-ch1-3 {
display: flex;
width: 100%;
padding-top: var(--spacing);
overflow: hidden;
}
@media only screen and (max-width: 1023px) {
.b-ch1-3 {
flex-direction: column;
}
}
@media (prefers-reduced-motion: no-preference) {
.b-ch1-3.aos-init[data-splitting=items] > div {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-ch1-3.aos-animate[data-splitting=items] > div {
transform: translateY(0);
transition-duration: 2s;
transition-delay: calc(var(--item-index) * 0.2s + 0.5s);
opacity: 1;
}
}
.b-ch1-3-1 {
display: flex;
align-items: flex-end;
margin-bottom: 4rem;
padding-bottom: 4rem;
border-bottom: 4px solid var(--color-primary);
}
@media (prefers-reduced-motion: no-preference) {
.b-ch1-3-1.aos-init[data-splitting=items] > div {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-ch1-3-1.aos-animate[data-splitting=items] > div {
transform: translateY(0);
transition-duration: 2s;
transition-delay: calc(var(--item-index) * 0.2s + 1s);
opacity: 1;
}
}
.b-ch1-3-1-text {
flex-grow: 1;
}
.b-ch1-3-1-percent {
font-family: var(--font-family-secondary);
font-size: 18rem;
line-height: 0.85;
}
@media only screen and (max-width: 1279px) {
.b-ch1-3-1-percent {
font-size: 13rem;
}
}
@media only screen and (max-width: 767px) {
.b-ch1-3-1-percent {
font-size: 12rem;
}
}
@media only screen and (max-width: 639px) {
.b-ch1-3-1-percent {
margin-left: 0.25rem;
font-size: 10rem;
}
}
@media only screen and (max-width: 399px) {
.b-ch1-3-1-percent {
margin-top: 1rem;
font-size: 6rem;
}
}
.b-ch1-3-2 {
margin-bottom: 4rem;
padding-bottom: 4rem;
border-bottom: 4px solid var(--color-primary);
}
@media (prefers-reduced-motion: no-preference) {
.b-ch1-3-2.aos-init .char {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-ch1-3-2.aos-init .word {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-ch1-3-2.aos-init .c-line-top {
right: unset;
left: 0;
width: 0;
transition: width;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
will-change: width;
}
.b-ch1-3-2.aos-init .c-line-bottom {
right: 0;
left: unset;
width: 0;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
will-change: width;
}
.b-ch1-3-2.aos-animate .c-line-top,
.b-ch1-3-2.aos-animate .c-line-bottom {
width: 100%;
transition-duration: 5s;
transition-delay: 0;
}
.b-ch1-3-2.aos-animate .c-line-bottom {
transition-duration: 5s;
transition-delay: 0.75s;
}
.b-ch1-3-2.aos-animate .char {
transform: translateY(0);
transition-duration: 2s;
transition-delay: calc(var(--char-index) * 0.1s + 0.1s);
opacity: 1;
}
.b-ch1-3-2.aos-animate .word {
transform: translateY(0);
transition-duration: 2s;
transition-delay: calc(var(--line-index) * 0.2s + 0.5s);
opacity: 1;
}
}
.b-ch1-3-2 p:last-child {
margin-bottom: 0;
}
.b-ch1-3-3-percent {
margin-right: 2rem;
float: left;
font-family: var(--font-family-secondary);
font-size: 18rem;
line-height: 0.8;
}
@media only screen and (max-width: 1279px) {
.b-ch1-3-3-percent {
font-size: 13rem;
}
}
@media only screen and (max-width: 767px) {
.b-ch1-3-3-percent {
font-size: 12rem;
}
}
@media only screen and (max-width: 639px) {
.b-ch1-3-3-percent {
margin-left: 0.25rem;
font-size: 10rem;
}
}
@media only screen and (max-width: 399px) {
.b-ch1-3-3-percent {
margin-bottom: 1rem;
font-size: 6rem;
}
}
@media (prefers-reduced-motion: no-preference) {
.b-ch1-3-3.aos-init .char {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-ch1-3-3.aos-init .word {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-ch1-3-3.aos-init .c-line-top {
right: unset;
left: 0;
width: 0;
transition: width;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
will-change: width;
}
.b-ch1-3-3.aos-init .c-line-bottom {
right: 0;
left: unset;
width: 0;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
will-change: width;
}
.b-ch1-3-3.aos-animate .c-line-top,
.b-ch1-3-3.aos-animate .c-line-bottom {
width: 100%;
transition-duration: 5s;
transition-delay: 0;
}
.b-ch1-3-3.aos-animate .c-line-bottom {
transition-duration: 5s;
transition-delay: 0.75s;
}
.b-ch1-3-3.aos-animate .char {
transform: translateY(0);
transition-duration: 2s;
transition-delay: calc(var(--char-index) * 0.1s + 0.1s);
opacity: 1;
}
.b-ch1-3-3.aos-animate .word {
transform: translateY(0);
transition-duration: 2s;
transition-delay: calc(var(--line-index) * 0.2s + 0.5s);
opacity: 1;
}
}
.b-ch1-3-text {
width: 50%;
max-width: 100%;
padding-right: 2rem;
padding-bottom: var(--spacing);
color: var(--color-black);
font-size: 2rem;
line-height: 1.5;
}
@media only screen and (max-width: 1279px) {
.b-ch1-3-text {
font-size: 1.5rem;
}
}
@media only screen and (max-width: 1023px) {
.b-ch1-3-text {
width: 100%;
padding-right: 0;
}
}
.b-ch1-3-image {
display: flex;
position: relative;
align-items: flex-end;
width: 50%;
margin-bottom: -8rem;
overflow: hidden;
}
@media only screen and (max-width: 1023px) {
.b-ch1-3-image {
width: 100%;
}
}
.b-ch1-3-image img {
width: 100%;
height: auto;
}
.b-ch2 {
--spacing: 4rem;
width: 100%;
padding-top: calc(var(--spacing) * 2);
padding-bottom: calc(var(--spacing) * 2);
overflow: hidden;
background-color: #E9E1D2;
}
.b-ch2-heading {
display: inline-block;
flex-shrink: 0;
width: auto;
max-width: var(--max-width);
margin-bottom: 4rem;
font-size: 10rem;
}
@media only screen and (max-width: 1023px) {
.b-ch2-heading {
max-width: 100%;
}
}
.b-ch2-heading .c-line {
z-index: 2;
}
.b-ch2-heading .c-line-top, .b-ch2-heading .c-line-bottom {
background-color: var(--color-primary);
}
.b-ch2-heading h2,
.b-ch2-heading h1 {
z-index: 3;
margin: 0;
padding-top: 0.5ch;
padding-bottom: 0.5ch;
color: var(--color-black);
font-family: var(--font-family-secondary);
font-size: inherit;
font-weight: 400;
letter-spacing: -1px;
line-height: 1.2;
}
@media only screen and (max-width: 1023px) {
.b-ch2-heading h2,
.b-ch2-heading h1 {
font-size: 6.5rem;
}
}
@media only screen and (max-width: 639px) {
.b-ch2-heading h2,
.b-ch2-heading h1 {
font-size: 5rem;
}
}
@media (prefers-reduced-motion: no-preference) {
.b-ch2-heading.aos-init .char {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-ch2-heading.aos-init .word {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-ch2-heading.aos-init .c-line-top {
right: unset;
left: 0;
width: 0;
transition: width;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
will-change: width;
}
.b-ch2-heading.aos-init .c-line-bottom {
right: 0;
left: unset;
width: 0;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
will-change: width;
}
.b-ch2-heading.aos-animate .c-line-top,
.b-ch2-heading.aos-animate .c-line-bottom {
width: 100%;
transition-duration: 5s;
transition-delay: 0;
}
.b-ch2-heading.aos-animate .c-line-bottom {
transition-duration: 5s;
transition-delay: 0.75s;
}
.b-ch2-heading.aos-animate .char {
transform: translateY(0);
transition-duration: 2s;
transition-delay: calc(var(--char-index) * 0.1s + 0.1s);
opacity: 1;
}
.b-ch2-heading.aos-animate .word {
transform: translateY(0);
transition-duration: 2s;
transition-delay: calc(var(--line-index) * 0.2s + 0.5s);
opacity: 1;
}
}
@media (prefers-reduced-motion: no-preference) {
.b-ch2.aos-init[data-splitting=items] > div {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-ch2.aos-animate[data-splitting=items] > div {
transform: translateY(0);
transition-duration: 2s;
transition-delay: calc(var(--item-index) * 0.2s + 1s);
opacity: 1;
}
}
.b-ch2 .container {
position: relative;
}
.b-ch2-svg {
position: absolute;
right: 0;
bottom: 0;
left: 50%;
width: 200%;
max-width: var(--container);
height: 100%;
padding: 2rem;
}
.b-ch2-svg > div {
position: absolute;
inset: 0;
left: -13%;
width: 200%;
height: 100%;
transform: translateX(-50%);
background-image: url(//alberts.nz/wp-content/themes/alberts-1/assets/img/line-chart.png);
background-repeat: no-repeat;
background-position: center bottom;
background-size: contain;
}
@media only screen and (max-width: 1279px) {
.b-ch2-svg > div {
left: calc(11.5% + 2rem);
background-position: center top;
}
}
@media only screen and (max-width: 1023px) {
.b-ch2-svg > div {
left: 14%;
}
}
@media only screen and (max-width: 767px) {
.b-ch2-svg > div {
left: 13%;
}
}
@media only screen and (max-width: 639px) {
.b-ch2-svg > div {
left: 13.5%;
width: 300%;
}
}
@media only screen and (max-width: 559px) {
.b-ch2-svg > div {
left: 15%;
width: 300%;
}
}
@media only screen and (max-width: 499px) {
.b-ch2-svg > div {
left: 18%;
width: 300%;
}
}
@media only screen and (max-width: 399px) {
.b-ch2-svg > div {
left: 20%;
}
}
.b-ch2-line {
display: none;
width: 170%;
height: 100%;
margin-left: -41.25%;
}
@media only screen and (max-width: 1536px) {
.b-ch2-line {
width: 1600px;
margin-left: -200px;
}
}
.b-ch2-rows {
display: flex;
position: relative;
flex-direction: column;
gap: 0;
}
.b-ch2-row {
padding-top: 3rem;
padding-bottom: 3rem;
}
@media only screen and (max-width: 1279px) {
.b-ch2-row {
padding-top: 2rem;
padding-bottom: 2rem;
}
}
@media (prefers-reduced-motion: no-preference) {
.b-ch2-row.aos-init .char {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-ch2-row.aos-init .word {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-ch2-row.aos-init .c-line-top {
right: unset;
left: 0;
width: 0;
transition: width;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
will-change: width;
}
.b-ch2-row.aos-init .c-line-bottom {
right: 0;
left: unset;
width: 0;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
will-change: width;
}
.b-ch2-row.aos-animate .c-line-top,
.b-ch2-row.aos-animate .c-line-bottom {
width: 100%;
transition-duration: 5s;
transition-delay: 0;
}
.b-ch2-row.aos-animate .c-line-bottom {
transition-duration: 5s;
transition-delay: 0.75s;
}
.b-ch2-row.aos-animate .char {
transform: translateY(0);
transition-duration: 2s;
transition-delay: calc(var(--char-index) * 0.1s + 0.1s);
opacity: 1;
}
.b-ch2-row.aos-animate .word {
transform: translateY(0);
transition-duration: 2s;
transition-delay: calc(var(--line-index) * 0.2s + 0.5s);
opacity: 1;
}
}
.b-ch2-row.is-primary {
background-color: var(--color-dark-green);
color: var(--color-white);
}
.b-ch2-row .container {
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 var(--spacing);
}
.b-ch2-cols {
display: none;
}
@media only screen and (max-width: 1279px) {
.b-ch2-cols {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
}
.b-ch2-cols .container {
max-width: var(--container);
margin: 0 auto;
padding: 0 2rem;
}
.b-ch2-cols-line {
width: 100%;
padding-bottom: 5rem;
border-top: 3px solid var(--color-primary);
}
.b-ch2-col {
width: 100%;
}
.b-ch2-title {
display: flex;
flex: 0 0 45%;
align-items: center;
justify-content: center;
padding: 3rem;
text-align: center;
}
.b-ch2-title.is-mobile {
flex: 0 0 100%;
padding: 0;
}
.b-ch2-title.is-mobile h3 {
margin-bottom: 2rem;
}
@media only screen and (max-width: 1279px) {
.b-ch2-title {
flex: 0 0 100%;
padding: 5rem 3rem;
}
}
@media only screen and (max-width: 1023px) {
.b-ch2-title {
padding-top: 2rem;
padding-bottom: 2rem;
}
}
.b-ch2-title h3 {
max-width: 16ch;
font-family: var(--font-family-secondary);
font-size: 3rem;
font-weight: 300;
}
@media only screen and (max-width: 1023px) {
.b-ch2-title h3 {
font-size: 2rem;
}
}
.b-ch2-logo {
display: flex;
flex: 0 0 10rem;
align-items: center;
justify-content: flex-end;
}
.b-ch2-logo svg {
width: 2rem;
height: auto;
}
@media only screen and (max-width: 1279px) {
.b-ch2-logo {
position: absolute;
top: 50%;
right: 2rem;
flex: 0 0 2rem;
transform: translateY(-50%);
}
.b-ch2-logo svg {
width: 1rem;
}
}
.b-ch2-text {
width: calc(45% - 10rem);
padding-left: 4rem;
font-size: 1.5rem;
line-height: 1.5;
}
.b-ch2-text p {
margin: 0.25rem 0;
}
@media only screen and (max-width: 1279px) {
.b-ch2-text {
display: none;
}
.b-ch2-text.is-mobile {
display: block;
width: 100%;
max-width: 700px;
margin: 0 auto;
padding: 0;
text-align: center;
}
.b-ch2-text.is-mobile p {
margin-top: 0;
margin-bottom: 0.5rem;
}
}
.b-cgap {
--spacing: 8rem;
width: 100%;
padding-top: var(--spacing);
padding-bottom: var(--spacing);
background-color: #DCD0B5;
}
@media only screen and (max-width: 1279px) {
.b-cgap {
--spacing: 6rem;
}
}
@media only screen and (max-width: 1023px) {
.b-cgap {
--spacing: 5rem;
}
}
.b-cgap-heading {
display: inline-block;
flex-shrink: 0;
width: auto;
max-width: var(--max-width);
font-size: 10rem;
}
@media only screen and (max-width: 1023px) {
.b-cgap-heading {
max-width: 100%;
}
}
.b-cgap-heading .c-line {
z-index: 2;
}
.b-cgap-heading .c-line-top, .b-cgap-heading .c-line-bottom {
background-color: var(--color-primary);
}
.b-cgap-heading h2,
.b-cgap-heading h1 {
z-index: 3;
margin: 0;
padding-top: 0.5ch;
padding-bottom: 0.5ch;
color: var(--color-black);
font-family: var(--font-family-secondary);
font-size: inherit;
font-weight: 400;
letter-spacing: -1px;
line-height: 1.2;
}
@media only screen and (max-width: 1023px) {
.b-cgap-heading h2,
.b-cgap-heading h1 {
font-size: 6.5rem;
}
}
@media only screen and (max-width: 639px) {
.b-cgap-heading h2,
.b-cgap-heading h1 {
font-size: 5rem;
}
}
@media (prefers-reduced-motion: no-preference) {
.b-cgap-heading.aos-init .char {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-cgap-heading.aos-init .word {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-cgap-heading.aos-init .c-line-top {
right: unset;
left: 0;
width: 0;
transition: width;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
will-change: width;
}
.b-cgap-heading.aos-init .c-line-bottom {
right: 0;
left: unset;
width: 0;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
will-change: width;
}
.b-cgap-heading.aos-animate .c-line-top,
.b-cgap-heading.aos-animate .c-line-bottom {
width: 100%;
transition-duration: 5s;
transition-delay: 0;
}
.b-cgap-heading.aos-animate .c-line-bottom {
transition-duration: 5s;
transition-delay: 0.75s;
}
.b-cgap-heading.aos-animate .char {
transform: translateY(0);
transition-duration: 2s;
transition-delay: calc(var(--char-index) * 0.1s + 0.1s);
opacity: 1;
}
.b-cgap-heading.aos-animate .word {
transform: translateY(0);
transition-duration: 2s;
transition-delay: calc(var(--line-index) * 0.2s + 0.5s);
opacity: 1;
}
}
.b-cgap-slider {
margin-top: 4rem;
}
@media only screen and (max-width: 1023px) {
.b-cgap-slider {
padding-right: 2rem;
padding-left: 2rem;
}
}
@media only screen and (max-width: 767px) {
.b-cgap-slider {
padding-right: 0;
padding-left: 0;
}
}
@media (prefers-reduced-motion: no-preference) {
.b-cgap-slider.aos-init .b-cgap-slide {
transform: translateY(2rem);
transition: transform, opacity;
transition-duration: 0;
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-delay: 0;
opacity: 0;
will-change: transfrom, opacity;
}
.b-cgap-slider.aos-animate .b-cgap-slide {
transform: translateY(0);
transition-duration: 2s;
opacity: 1;
}
.b-cgap-slider.aos-animate .b-cgap-slide:first-child {
transition-delay: 0.1s;
}
.b-cgap-slider.aos-animate .b-cgap-slide:nth-child(2) {
transition-delay: 0.2s;
}
.b-cgap-slider.aos-animate .b-cgap-slide:last-child {
transition-delay: 0.3s;
}
}
.b-cgap-slider:not(.flickity-enabled) {
display: flex;
}
.b-cgap-slider .flickity-viewport {
overflow: visible;
}
.b-cgap-slider .flickity-page-dots {
bottom: -4rem;
}
.b-cgap-slider .flickity-page-dots .dot {
width: 12px;
height: 12px;
margin: 0 8px;
border-radius: 50%;
background-color: rgba(var(--color-primary-rgb), 0.3);
}
.b-cgap-slider .flickity-page-dots .dot.is-selected {
background-color: var(--color-primary);
}
.b-cgap-slider .flickity-prev-next-button {
top: 50%;
width: 50px;
height: 50px;
transform: translateY(-50%);
border-radius: 50%;
background-color: var(--color-white);
}
.b-cgap-slider .flickity-prev-next-button.previous {
left: -25px;
}
.b-cgap-slider .flickity-prev-next-button.next {
right: -25px;
}
.b-cgap-slider .flickity-prev-next-button .flickity-button-icon {
fill: var(--color-primary);
}
.b-cgap-slide {
display: flex;
flex-direction: column;
align-items: center;
width: 100%;
margin: 0;
}
@media only screen and (min-width: 1024px) {
.b-cgap-slide {
width: 33.333333%;
}
}
@media only screen and (max-width: 1023px) {
.b-cgap-slide:first-child:not(.is-selected) .b-cgap-card-tagline {
align-self: flex-end;
}
.b-cgap-slide:last-child:not(.is-selected) .b-cgap-card-tagline {
align-self: flex-start;
}
}
.b-cgap-card {
display: flex;
position: relative;
flex-direction: column;
width: 100%;
height: 100%;
margin-top: 1.5rem;
padding: 2rem 1.5rem;
padding-top: 1.5rem;
border-top: 3px solid var(--color-primary);
text-align: center;
}
.is-primary .b-cgap-card {
padding: 0;
}
.b-cgap-card-inner {
flex-grow: 1;
height: 100%;
padding: 3rem;
background-color: var(--color-white);
}
.is-primary .b-cgap-card-inner {
background-color: var(--color-dark-green);
color: var(--color-white);
}
.b-cgap-card-tagline {
display: flex;
position: relative;
align-items: center;
justify-content: center;
width: 5ch;
height: 5ch;
border: 3px solid;
border-radius: 100%;
border-color: var(--color-primary);
color: var(--color-primary);
font-family: var(--font-family-secondary);
font-size: 5rem;
font-weight: 400;
letter-spacing: -2px;
}
.b-cgap-card-tagline span {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
text-transform: uppercase;
}
.b-cgap-card-tagline::after {
content: "";
display: block;
width: 100%;
height: 0;
padding-top: 100%;
}
.is-primary .b-cgap-card-tagline {
border-color: var(--color-dark-green);
color: var(--color-dark-green);
}
.b-cgap-card-title {
margin-bottom: 0.5rem;
font-family: var(--font-family-secondary);
font-size: 2.5rem;
font-weight: 600;
line-height: 1;
}
.b-cgap-card-price {
font-family: var(--font-family-secondary);
font-size: 2.5rem;
font-weight: 600;
line-height: 1;
}
.b-cgap-card-content {
flex: 1;
margin-top: 2rem;
padding-top: 2rem;
border-top: 2px solid var(--color-primary);
font-size: 1.1rem;
}
.b-cgap-card-content ul {
margin: 0;
margin-bottom: 1rem;
padding: 0;
list-style: none;
}
.b-cgap-card-content strong {
margin-bottom: 1rem;
font-size: 110%;
font-weight: 700;
}
.b-cgap-card-content p {
margin-top: 0;
margin-bottom: 0.5rem;
line-height: 1.6;
}
.b-cgap-card-content p:last-child {
margin-bottom: 0;
}
.b-cgap-card-content p.results {
margin-top: 2rem;
margin-bottom: 1rem;
font-weight: 600;
}
.b-cgap-card-content p.highlight {
margin-top: 2rem;
opacity: 0.8;
font-size: 0.9rem;
font-style: italic;
}