html {
scroll-behavior: smooth;
}
.site-footer-wrap {
position: relative;
z-index: 10;
width: 100%;
max-width: 100%;
overflow-x: clip;
/* Removed: will-change, backface-visibility, and transform */
}
/* You can safely delete or comment out the .is-footer-parallax and .is-footer-settled blocks below */
.site-footer-wrap.is-footer-parallax {
box-shadow: 0 -12px 40px rgba(0, 0, 0, 0.12);
}
.site-footer-wrap.is-footer-settled {
transform: translate3d(0, 0, 0);
}
/* —— CTA band —— */
.site-footer-cta {
position: relative;
min-height: clamp(380px, 38vw, 585px);
display: flex;
align-items: center;
justify-content: center;
background-color: #2a9d8f;
background-image: url("../img/footer1.png");
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
overflow: hidden;
}
.site-footer-cta__overlay {
position: absolute;
inset: 0;
background: linear-gradient(
180deg,
rgba(0, 0, 0, 0.2) 0%,
rgba(0, 0, 0, 0.28) 100%
);
pointer-events: none;
}
/*.site-footer-cta__inner {*/
/* position: relative;*/
/* z-index: 1;*/
/* width: 100%;*/
/* max-width: min(560px, 92vw);*/
/* margin: 0 auto;*/
/* padding: clamp(2.5rem, 6vw, 4rem) clamp(1.25rem, 4vw, 2rem);*/
/* color: #ffffff;*/
/* text-align: center;*/
/* box-sizing: border-box;*/
/*}*/
.site-footer-cta__inner {
position: relative;
z-index: 1;
width: 100%;
color: #ffffff;
text-align: center;
margin-right: 0;
}
@media (min-width: 1024px) {
.site-footer-cta__inner {
margin-right: 334px;
}
}
.site-footer-cta__title {
font-family: "Elms Sans", sans-serif;
font-size: clamp(1.65rem, 3.2vw, 2.35rem);
font-weight: 700;
line-height: 1.25;
margin-bottom: 0.85rem;
}
.site-footer-cta__text {
font-family: "Elms Sans", sans-serif;
font-size: clamp(0.92rem, 1.35vw, 1.05rem);
font-weight: 400;
line-height: 1.65;
max-width: 480px;
margin: 0 auto 1.75rem;
}
.site-footer-cta__actions {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: center;
gap: 0.85rem;
}
.site-footer-cta__btn {
display: inline-block;
padding: 0.85rem 1.85rem;
font-family: "Elms Sans", sans-serif;
font-size: clamp(0.72rem, 1vw, 0.78rem);
font-weight: 600;
letter-spacing: 0.1em;
text-transform: uppercase;
text-decoration: none;
border-radius: 8px;
transition: background-color 0.2s ease, transform 0.2s ease;
}
.site-footer-cta__btn--primary {
background-color: #006d5b;
color: #ffffff;
}
.site-footer-cta__btn--primary:hover,
.site-footer-cta__btn--primary:focus-visible {
background-color: #005a4a;
transform: translateY(-1px);
}
.site-footer-cta__btn--secondary {
background-color: #fdf6ee;
color: #2a9d8f !important;
}
.site-footer-cta__btn--secondary:hover,
.site-footer-cta__btn--secondary:focus-visible {
background-color: #ffffff;
transform: translateY(-1px);
}
/* —— Lower footer (logo, social, nav) —— */
.site-footer-main {
position: relative;
background-color: #2a9d8f;
background-image: url("../img/footer2.png");
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
color: #ffffff;
padding: clamp(0rem, 0vw, 3.5rem) clamp(1.25rem, 4vw, 2.5rem)
clamp(2rem, 4vw, 2.75rem);
}
.site-footer-main__inner {
position: relative;
z-index: 1;
max-width: 1100px;
margin: 0 auto;
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
}
.site-footer-main__logo-link {
display: inline-block;
margin-bottom: 1.25rem;
}
.site-footer-main__logo {
display: block;
max-width: clamp(120px, 14vw, 155px);
width: auto;
height: auto;
margin: 0 auto;
mix-blend-mode: screen;
margin-top: 9px;
}
.site-footer-main__tagline {
font-family: "Elms Sans", sans-serif;
font-size: clamp(1.1rem, 2vw, 1.35rem);
font-weight: 600;
letter-spacing: 0.02em;
margin-bottom: 0.65rem;
}
.site-footer-main__desc {
font-family: "Elms Sans", sans-serif;
font-size: clamp(0.82rem, 1.2vw, 0.95rem);
font-weight: 400;
line-height: 1.6;
max-width: min(100%, 42ch);
margin: 0 auto 1.75rem;
opacity: 0.95;
white-space: normal;
}
.site-footer-main__social {
display: flex;
align-items: center;
justify-content: center;
flex-wrap: wrap;
gap: clamp(0.65rem, 1.5vw, 1rem);
list-style: none;
margin: 0 0 2rem;
padding: 0;
}
.site-footer-main__social-link {
display: inline-flex;
align-items: center;
justify-content: center;
flex: 0 0 2rem;
width: 2rem;
height: 2rem;
transition: opacity 0.2s ease, transform 0.2s ease;
}
.site-footer-main__social-link:hover,
.site-footer-main__social-link:focus-visible {
opacity: 0.85;
transform: translateY(-1px);
}
.site-footer-main__social-link img {
display: block;
max-width: 100%;
max-height: 100%;
width: auto;
height: auto;
object-fit: contain;
}
.site-footer-main__nav {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: center;
gap: 0.35rem 0.5rem;
width: 100%;
max-width: 900px;
padding: 1.25rem 0;
margin-bottom: 1.25rem;
border-top: 1px solid rgba(255, 255, 255, 0.45);
border-bottom: 1px solid rgba(255, 255, 255, 0.45);
}
.site-footer-main__nav a {
font-family: "Elms Sans", sans-serif;
font-size: clamp(0.68rem, 1vw, 0.78rem);
font-weight: 600;
letter-spacing: 0.14em;
text-transform: uppercase;
text-decoration: none;
color: #ffffff;
transition: opacity 0.2s ease;
}
.site-footer-main__nav a:hover,
.site-footer-main__nav a:focus-visible {
opacity: 0.8;
}
.site-footer-main__nav-dot {
color: rgba(255, 255, 255, 0.75);
font-size: 0.85rem;
user-select: none;
}
.site-footer-main__copy {
font-family: "Elms Sans", sans-serif;
font-size: clamp(0.68rem, 0.95vw, 0.76rem);
font-weight: 400;
letter-spacing: 0.04em;
opacity: 0.9;
margin: 0;
}
/* —— Responsive —— */
@media (min-width: 1100px) {
.site-footer-main__desc {
white-space: nowrap;
max-width: none;
}
}
@media (max-width: 1024px) {
.site-footer-cta {
min-height: clamp(360px, 42vw, 520px);
background-position: 68% center;
}
.site-footer-cta__title {
font-size: clamp(1.5rem, 4.5vw, 2rem);
}
.site-footer-main {
background-position: center 55%;
}
}
@media (max-width: 900px) {
.site-footer-wrap,
.site-footer-wrap.is-footer-parallax,
.site-footer-wrap.is-footer-settled {
transform: none !important;
transition: none !important;
box-shadow: none;
}
.site-footer-cta {
min-height: clamp(340px, 52vh, 480px);
background-position: 72% center;
}
.site-footer-cta__inner {
max-width: min(520px, 90vw);
padding-top: clamp(2rem, 5vw, 3rem);
}
.site-footer-main {
padding: clamp(1.75rem, 4vw, 2.5rem) clamp(1.25rem, 4vw, 2rem)
clamp(1.75rem, 3.5vw, 2.25rem);
background-position: center 60%;
}
.site-footer-main__nav {
max-width: 100%;
gap: 0.45rem 0.4rem;
}
}
@media (max-width: 768px) {
.site-footer-cta {
align-items: flex-end;
min-height: clamp(360px, 68vh, 440px);
background-position: 78% center;
}
.site-footer-cta__overlay {
background: linear-gradient(
180deg,
rgba(0, 0, 0, 0.1) 0%,
rgba(0, 0, 0, 0.35) 45%,
rgba(0, 0, 0, 0.5) 100%
);
}
.site-footer-cta__inner {
max-width: 100%;
padding: clamp(2rem, 6vw, 2.5rem) clamp(1rem, 4vw, 1.25rem)
clamp(1.75rem, 5vw, 2rem);
}
.site-footer-cta__title {
font-size: clamp(1.35rem, 5.5vw, 1.75rem);
margin-bottom: 0.65rem;
}
.site-footer-cta__text {
max-width: 100%;
font-size: clamp(0.88rem, 3.2vw, 1rem);
margin-bottom: 1.35rem;
}
.site-footer-cta__actions {
gap: 0.65rem;
}
.site-footer-cta__btn {
flex: 1 1 calc(50% - 0.35rem);
min-width: 0;
max-width: none;
text-align: center;
padding-left: 1rem;
padding-right: 1rem;
}
.site-footer-main__logo {
max-width: clamp(100px, 28vw, 130px);
}
.site-footer-main__tagline {
font-size: clamp(1rem, 4vw, 1.2rem);
}
.site-footer-main__desc {
max-width: min(100%, 34ch);
margin-bottom: 1.5rem;
}
.site-footer-main__social {
margin-bottom: 1.5rem;
gap: 0.75rem;
}
.site-footer-main__nav {
gap: 0.5rem 0.35rem;
padding: 1rem 0;
}
.site-footer-main__nav-dot {
display: none;
}
.site-footer-main__nav a {
flex: 0 0 calc(50% - 0.35rem);
text-align: center;
font-size: clamp(0.65rem, 2.8vw, 0.74rem);
letter-spacing: 0.1em;
}
.site-footer-main__copy {
font-size: clamp(0.62rem, 2.5vw, 0.72rem);
line-height: 1.5;
max-width: 36ch;
margin: 0 auto;
}
}
@media (max-width: 480px) {
.site-footer-cta {
min-height: clamp(320px, 62vh, 400px);
background-position: 82% center;
}
.site-footer-cta__inner {
padding: clamp(1.75rem, 5vw, 2.25rem) clamp(0.85rem, 4vw, 1rem)
clamp(1.5rem, 5vw, 1.75rem);
}
.site-footer-cta__actions {
flex-direction: column;
align-items: center;
}
.site-footer-cta__btn {
flex: 0 0 auto;
width: 100%;
max-width: min(280px, 100%);
}
.site-footer-main {
padding: clamp(1.5rem, 5vw, 2rem) clamp(0.85rem, 4vw, 1rem)
clamp(1.35rem, 4vw, 1.65rem);
background-position: center center;
}
.site-footer-main__nav a {
flex: 0 0 100%;
padding: 0.2rem 0;
}
.site-footer-main__copy {
max-width: 100%;
}
}