footer.forest-footer { position: relative; isolation: isolate; margin: 30px 0 0; padding: 62px 0 26px; min-height: 425px; background: radial-gradient(ellipse at 40% 0, #153526, #071f15 65%, #061b11); color: #fff; font-family: 'DM Sans', sans-serif; }
.forest-footer, .forest-footer * { box-sizing: border-box; }
@media print { footer.forest-footer { display: none; } }
.forest-footer::before { content: ''; position: absolute; z-index: -3; top: -29px; left: 0; right: 0; height: 31px; background: #153526; border-radius: 50% 50% 0 0 / 100% 100% 0 0; pointer-events: none; }
.forest-grass { position: absolute; z-index: -2; left: 0; right: 0; bottom: 0; height: 174px; pointer-events: none; background-image: url('../../images/experience/footer-grass-natural.webp'), url('../../images/experience/footer-grass-natural.webp'); background-position: center bottom, calc(50% + 260px) bottom; background-size: 520px auto; background-repeat: repeat-x; filter: brightness(.9) saturate(.85); }
.forest-grass::before, .forest-grass::after { content: ''; position: absolute; inset: 0; background-image: url('../../images/experience/footer-grass-natural.webp'); background-repeat: repeat-x; pointer-events: none; }
.forest-grass::before { background-size: 430px auto; background-position: 137px bottom; transform: scaleX(-1); opacity: .8; filter: brightness(.8); }
.forest-grass::after { background-size: 610px auto; background-position: -211px calc(100% + 28px); opacity: .85; }
.forest-art-left { position: absolute; z-index: -1; left: 0; bottom: 0; width: 330px; max-width: none; height: 100%; object-fit: fill; pointer-events: none; }
.forest-sign { position: absolute; z-index: -1; right: 0; bottom: 0; width: 265px; height: 398px; pointer-events: none; }
.forest-sign > img { display: block; width: 100%; height: 100%; }
.forest-footer-content { position: relative; display: grid; grid-template-columns: 1.45fr .9fr 1.15fr 1.35fr; gap: 30px; width: calc(100% - 370px); max-width: 1140px; margin-left: max(175px, calc((100% - 1140px) / 2)); }
.forest-wordmark { display: inline-block; color: #fff; text-decoration: none; }
.forest-logo { display: block; width: 220px; max-width: 100%; height: auto; filter: grayscale(1) invert(1) brightness(1.7) contrast(3); }
.forest-footer p.forest-tagline { margin: 25px 0 0; color: #fff; font-family: 'Caveat', cursive; font-size: 32px; line-height: 1.15; text-align: center; transform: rotate(-5deg); }
.forest-footer h3 { margin: 0 0 18px; color: #ceee45; font-family: 'Outfit', sans-serif; font-size: 18px; font-weight: 600; letter-spacing: -.02em; }
.forest-links ul { padding: 0; margin: 0; list-style: none; }
.forest-links li { display: block; margin: 0 0 9px; padding: 0; }
.forest-links a { display: flex; align-items: center; justify-content: space-between; gap: 8px; color: #fff; text-decoration: none; font-size: 13px; line-height: 1.25; }
.forest-links a > span { color: #83ab50; font-size: 20px; line-height: .7; }
.forest-footer a:hover { color: #ceee45; }
.forest-footer a:focus-visible { outline: 2px solid #ceee45; outline-offset: 4px; }
.forest-contact { padding-left: 25px; border-left: 1px solid #ffffff20; }
.forest-contact-line { display: flex; gap: 11px; align-items: flex-start; margin: 0 0 13px; color: #fff; font-size: 13px; text-decoration: none; line-height: 1.45; }
.forest-contact-line > svg { flex: 0 0 17px; width: 17px; height: 20px; fill: currentColor; }
.forest-contact-line > svg.forest-clock { fill: none; stroke: currentColor; stroke-width: 1.8; }
.forest-contact-line strong { display: block; color: #fff; font-size: 13px; font-weight: 600; }
.forest-contact-line small { display: block; margin-top: 2px; font-size: 12px; color: #fff; }
.forest-contact-actions { display: flex; gap: 12px; margin-top: 18px; }
.forest-contact-actions a { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: #fff; color: #123923; }
.forest-contact-actions svg { width: 18px; height: 18px; fill: currentColor; }
.forest-copyright { position: relative; width: fit-content; margin: 44px auto 0; color: #ffffffcc; font-size: 11px; text-align: center; text-shadow: 0 1px 5px #061b11; }
@media(min-width:1700px) { .forest-art-left { width: 390px; } .forest-sign { width: 330px; height: 495px; } .forest-footer { min-height: 495px; } .forest-footer-content { margin-inline: auto; } }
@media(max-width:1200px) { .forest-footer-content { grid-template-columns: 1.2fr 1fr 1.2fr; width: calc(100% - 230px); margin: 0 75px 0 155px; gap: 28px; } .forest-brand { grid-column: 1 / -1; text-align: center; } .forest-footer p.forest-tagline { margin-top: 12px; } .forest-art-left { width: 260px; height: 420px; } .forest-sign { width: 200px; height: 300px; opacity: .65; } .forest-contact { padding-left: 20px; } }
@media(max-width:760px) { footer.forest-footer { padding-top: 40px; } .forest-footer-content { width: calc(100% - 40px); margin: 0 auto; grid-template-columns: 1fr 1fr; gap: 30px 25px; } .forest-brand { padding-bottom: 10px; } .forest-contact { grid-column: 1 / -1; border: 0; padding-left: 60px; padding-bottom: 60px; } .forest-links a { font-size: 13px; } .forest-art-left { width: 170px; height: 255px; opacity: .55; } .forest-sign { width: 170px; height: 255px; opacity: .9; } .forest-copyright { margin: 25px auto 0; padding: 0 24px; color: #fff; text-shadow: 0 1px 5px #061b11; } }
@media(max-width:400px) { .forest-footer-content { gap: 25px 18px; } .forest-contact { padding-left: 25px; padding-bottom: 115px; } .forest-links a { font-size: 12px; } }
@media(max-width:760px) { .forest-grass { height: 107px; background-size: 320px auto; background-position: center bottom, calc(50% + 160px) bottom; } .forest-grass::before { background-size: 270px auto; background-position: 89px bottom; } .forest-grass::after { background-size: 370px auto; background-position: -143px calc(100% + 18px); } }
