.bg-layer {
    position: fixed; 
    top: 0;
    left: 0;
    height: 100vh;
    width: 100vw;
    background-size: cover;  
    background-position: center;  
    background-repeat: no-repeat;
    opacity: 0;
    transition: opacity 1s ease-in-out;
    z-index: 0;
}

@media (max-width: 768px) {
    .bg-layer {
        background-attachment: scroll; /* fixes mobile rendering issues */
    }
}

.container-fluid.position-relative {
    position: relative;
    overflow: hidden;
    min-height: 100vh;
} 

.custom-label {
    font-size: 85px; /* your default size */
    margin-top: 65px; /* default for md and below */
    color: #fff;
    /* Floating look */
    text-shadow: 0 6px 18px rgba(0, 0, 0, 1); /* soft drop shadow */
    animation: float 5s ease-in-out infinite alternate; /* gentle drift */
    position: relative;
    z-index: 1;
}

/* XXL override -------------------------------------------------- */
@media (min-width: 1600px) {
    .custom-label {
        font-size: 103px; /* adjust as you like */
        margin-top: 165px;
    }
}

.bg-layer {
    position: fixed;
    top: 0;
    left: 0;
    height: 100vh;
    width: 100vw;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    opacity: 0;
    transition: opacity 1s ease-in-out;
    z-index: 0;
}

@media (max-width: 768px) {
    .bg-layer {
        background-attachment: scroll; /* fixes mobile rendering issues */
    }
}

.container-fluid.position-relative {
    position: relative;
    overflow: hidden;
    min-height: 100vh;
}

.custom-label {
    font-size: 85px; /* your default size */
    margin-top: 65px; /* default for md and below */
    color: #fff;
    /* Floating look */
    text-shadow: 0 6px 18px rgba(0, 0, 0, 1); /* soft drop shadow */
    animation: float 5s ease-in-out infinite alternate; /* gentle drift */
    position: relative;
    z-index: 1;
}

/* XXL override -------------------------------------------------- */
@media (min-width: 1600px) {
    .custom-label {
        font-size: 103px; /* adjust as you like */
        margin-top: 165px;
    }
}

/* .e-sortfilterdiv / .e-filtermenudiv / .e-rhandler aren't icon elements themselves (that's the
   .e-icons span they wrap), so they weren't excluded here — but Syncfusion sizes and positions
   them (and the header row height) using its own theme's font metrics. Forcing Poppins onto them
   changes those metrics enough to stack the sort/filter icons instead of laying them out inline
   and inflate the column header row height. Header label text keeps using Poppins as before. */
.e-control *:not(.e-icons):not(.fa):not(.fas):not(.far):not(.fab):not(.material-symbols-outlined):not(.e-sortfilterdiv):not(.e-filtermenudiv):not(.e-rhandler) {
    font-family: "Poppins", sans-serif !important;
}