#mainPreloaderPlaceholder {
    position: absolute;
    inset: 0;
    width: 100vw;
    height: 100vh;
    background: linear-gradient(180deg, #8fd175 0%, #3c8d5a 100%);
    z-index: 999999;
}

#mainPreloader {
    position: absolute;
    inset: 0;
    width: 100vw;
    height: 100vh;
    left: 0;
    top: 0;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent;
    z-index: 99999;
}

.mainPreloader {
    background:linear-gradient(180deg, #8fd175 0%, #3c8d5a 100%) !important;
    -webkit-mask: url(#logo-mask) no-repeat center;
    mask: url(#logo-mask) no-repeat center;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: 200px auto;
    mask-size: 200px auto;
    background: black;
    position: fixed;
    inset: 0;
    z-index: 50;
}

@keyframes zoomLogo {
    0%   { transform: scale(1); opacity: 1; }
    100% { transform: scale(19); opacity: 0; }
}

@keyframes hidenow {
    0%   { opacity: 1; }
    100% { opacity: 0; }
}

.animate-hidenow {
    animation: hidenow 1.5s ease-in forwards;
}

.animate-zoomLogo {
    animation: zoomLogo 1.5s ease-in forwards;
    transform-origin: center;
}

#preloader-svg {
    opacity: 0.4 !important;
}

/* Full screen overlay with logo cutout - positioned on top */
.preloader-overlay {
    position: fixed;
    inset: 0;
    width: 100vw;
    height: 100vh;
    z-index: 9999;
    pointer-events: none;
    opacity: 1;
    transition: opacity 1s ease-out; 
}

.preloader-overlay.fade-out {
    opacity: 0 !important;
}

.preloader-overlay svg {
    width: 100%;
    height: 100%;
}

/* Animation for the logo mask scale - starts at 250px equivalent and zooms to full screen */
/* Holds at start size for 3 seconds before zooming */
@keyframes zoomOutLogo {
    0%, 15% {
    transform: translate(50%, 50%) translate(-340px, -75.33px) scale(0.04);
    } 
    100% {
    transform: translate(50%, 50%) translate(-340px, -75.33px) scale(25);
    }
}

.logo-mask-group {
    transform-origin: 340px 75.33px;
    animation: zoomOutLogo 13s cubic-bezier(0.4, 0.0, 0.2, 1) forwards;
}

@media(max-width:1300px){
    .container { 
        padding-left: 25px !important;
        padding-right: 25px !important;
    }
    nav .container { 
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    img.w-full {
        max-width: 67% !important;
        height:auto !important;
    }
}