/*--------------------------------------------------------------
    Loader
--------------------------------------------------------------*/

    .pre-loader {
        height: 100%;
        left: 0;
        position: fixed;
        top: 0;
        width: 100%;
        z-index: 999991;
        background-color: var(--wdtBodyBGColor);
        -webkit-transition: all 0.05s ease-in-out;
        transition: all 0.05s ease-in-out;
        backface-visibility: hidden;
        will-change: transform;
    }

    .loader-inner {
        padding: 25px;
        position: relative;
        display: flex;
        align-items: center;
        width: 100%;
        height: 100%;
        backface-visibility: hidden;
        will-change: transform;
    }

    .loader-text {
        display: inline-block;
        font-family: var(--wdtFontTypo_Alt);
        font-size: 3.75rem;
        font-weight: bold !important;
        letter-spacing: 1px;
        line-height: normal;
        text-transform: uppercase;
        background-size: 200% auto;
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        text-fill-color: transparent;
        -webkit-animation: textclip 1.5s linear infinite;
        animation: textclip 1.5s linear infinite;
    }

    @-webkit-keyframes textclip {
        to {
            background-position: 200% center;
        }
    }

    @keyframes textclip {
        to {
            background-position: 200% center;
        }
    }

/*----*****---- << Loader Icon >> ----*****----*/

    /* :root { --planeColor: var(--wdtHeadAltColor); --size: clamp(5rem, 4.5552rem + 2.454vw, 7.5rem); }
    
    .loader-icon { position: absolute; top: var(--top); left: var(--left); transform: var(--rotate); bottom: 0; 
        backface-visibility: hidden; will-change: transform; margin: auto; }
    
    .loader-icon { width: var(--size); aspect-ratio: 1; display: grid; place-items: center; backface-visibility: hidden; will-change: transform; }
    .loader-icon .wdt-planebody, .loader-icon .wdt-planebody * { 
        background: var(--planeColor); backface-visibility: hidden; will-change: transform; }
    .loader-icon .wdt-planebody {
        position: relative; width: var(--size); height: auto; aspect-ratio: 7/1; border-bottom-left-radius: 50% 100%; 
        border-top-right-radius: 25% 90%; border-bottom-right-radius: 20% 20%; backface-visibility: hidden; will-change: transform; }
    .loader-icon .wdt-planetail, .loader-icon .wdt-wingleft, .loader-icon .wdt-wingright { 
        position: absolute; backface-visibility: hidden; will-change: transform; }
    .loader-icon .wdt-planetail {
        left: calc(-0.3% + 1px); top: -120%; width: 15%; aspect-ratio: 1/1.25; transform: skewX(5deg) translateX(-5%); 
        border-top-left-radius: 10%; border-top-right-radius: 100% 100%; }
    .loader-icon .wdt-wingleft, .loader-icon .wdt-wingright { left: 50%; width: 25%; aspect-ratio: 1; }
    .loader-icon .wdt-wingleft {
        transform-origin: bottom; top: -190%; transform: skewX(45deg) translateX(-30%); scale: 0.8; 
        border-top-left-radius: 10%; border-top-right-radius: 60% 100%; }
    .loader-icon .wdt-wingright {
        transform-origin: top; bottom: -170%; transform: skewX(-45deg); border-bottom-left-radius: 10%; border-bottom-right-radius: 60% 100%; }
    .loader-icon .wdt-planetail::after {
        content: ""; position: absolute; height: 55%; aspect-ratio: 1; transform: skewX(0deg) rotate(-8deg); right: -60%; bottom: 4.5%; 
        background: radial-gradient( circle at 100% 0%, transparent 70%, var(--planeColor) calc(70% + 0.5px) ); } */
  

/*--------------------------------------------------------------
    Accents
--------------------------------------------------------------*/

    .pre-loader { background-color: var(--wdtBodyBGColor); }
    .loader-text { background-image: linear-gradient(to right, var(--wdtPrimaryColor) 10%, var(--wdtHeadAltColor) 50%, var(--wdtPrimaryColor) 60%); }


/*--------------------------------------------------------------
    Responsive
--------------------------------------------------------------*/

    /*----*****---- << Mobile (Landscape) >> ----*****----*/

    /* Note: Design for a width of 480px */

    @media only screen and (min-width: 480px) and (max-width: 767px) {

    }


    /* Common Styles for the devices below 479px width */

    @media only screen and (max-width: 479px) {

    }