html.page-loader-pending,
html.page-loader-pending body{
    overflow:hidden;
}

html.page-loader-pending:not(.page-loader-transition) body > :not(#page-loader){
    visibility:hidden;
}

#page-loader{
    position:fixed;
    inset:0;
    z-index:9999;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:24px;
    box-sizing:border-box;
    background:
        radial-gradient(circle at 50% 38%, rgba(255,255,255,0.98) 0%, rgba(247,247,247,0.98) 54%, rgba(238,238,238,0.98) 100%),
        linear-gradient(135deg, rgba(255,255,255,0.98) 0%, rgba(243,243,243,0.98) 100%);
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transition:opacity .42s ease, visibility .42s step-end;
}

html.page-loader-theme-dark #page-loader,
body.dark-mode #page-loader{
    background:
        radial-gradient(circle at 50% 38%, rgba(35,35,35,0.98) 0%, rgba(24,24,24,0.99) 58%, rgba(18,18,18,0.99) 100%),
        linear-gradient(135deg, rgba(30,30,30,0.99) 0%, rgba(18,18,18,0.99) 100%);
}

html.page-loader-pending #page-loader{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
}

.PageLoaderInner{
    width:min(88vw, 460px);
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:22px;
    text-align:center;
}

.PageLoaderLogoWrap{
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:78px;
}

.PageLoaderLogo{
    width:min(72vw, 320px);
    height:auto;
    display:block;
    filter:drop-shadow(0 10px 22px rgba(0, 0, 0, 0.08));
    animation:pageLoaderLogoPulse 1.4s ease-in-out infinite;
}

html.page-loader-theme-dark .PageLoaderLogo,
body.dark-mode .PageLoaderLogo{
    filter:drop-shadow(0 12px 24px rgba(255, 0, 0, 0.18));
}

.PageLoaderLine{
    position:relative;
    width:min(44vw, 176px);
    height:4px;
    overflow:hidden;
    background:rgba(0, 0, 0, 0.1);
}

.PageLoaderLine::before{
    content:"";
    position:absolute;
    inset:0 auto 0 -40%;
    width:40%;
    background:linear-gradient(90deg, #ff0000 0%, #ff3636 100%);
    animation:pageLoaderSweep 1.1s cubic-bezier(.65,.05,.36,1) infinite;
}

.PageLoaderGlow{
    position:absolute;
    inset:auto;
    width:min(82vw, 360px);
    height:min(26vw, 120px);
    border-radius:999px;
    background:radial-gradient(circle, rgba(255, 0, 0, 0.16) 0%, rgba(255, 0, 0, 0.06) 38%, rgba(255, 255, 255, 0) 72%);
    filter:blur(14px);
    opacity:.75;
    animation:pageLoaderGlow 1.4s ease-in-out infinite;
}

html.page-loader-theme-dark .PageLoaderLine,
body.dark-mode .PageLoaderLine{
    background:rgba(255, 255, 255, 0.16);
}

html.page-loader-theme-dark .PageLoaderGlow,
body.dark-mode .PageLoaderGlow{
    background:radial-gradient(circle, rgba(255, 0, 0, 0.28) 0%, rgba(255, 0, 0, 0.1) 40%, rgba(6, 10, 18, 0) 74%);
}

/* Global theme toggle polish. The visible icon now describes the action. */
.ThemeToggle{
    box-shadow:0 8px 18px rgba(15, 23, 42, 0.12);
}

.ThemeToggle .ThemeIconSun{
    opacity:0 !important;
    transform:scale(0.78) rotate(-12deg) !important;
}

.ThemeToggle .ThemeIconMoon{
    opacity:1 !important;
    transform:scale(1) rotate(0deg) !important;
}

.ThemeToggle.is-dark .ThemeIconSun{
    opacity:1 !important;
    transform:scale(1) rotate(0deg) !important;
}

.ThemeToggle.is-dark .ThemeIconMoon{
    opacity:0 !important;
    transform:scale(0.78) rotate(12deg) !important;
}

body.dark-mode .ThemeToggle{
    box-shadow:0 8px 18px rgba(0, 0, 0, 0.34);
}

body.dark-mode .ThemeToggle:hover,
body.dark-mode .ThemeToggle:focus-visible{
    background:#ff0000 !important;
    border-color:#ff0000 !important;
    color:#ffffff !important;
}

/* Home product hover in dark mode. */
body.dark-mode .ProductPanel:hover .ProductTitle,
body.dark-mode .ProductPanel:focus-within .ProductTitle,
body.dark-mode .CarouselSlide:hover .ProductTitle,
body.dark-mode .CarouselSlide:focus-within .ProductTitle{
    color:#ff0000 !important;
    text-shadow:0 0 14px rgba(255, 0, 0, 0.28);
}

body.dark-mode .ProductMedia:hover .ProductShape,
body.dark-mode .ProductPanel:hover .ProductShape,
body.dark-mode .ProductPanel:focus-within .ProductShape,
body.dark-mode .ProductMediaLink:focus-visible .ProductShape,
body.dark-mode .CarouselSlide:hover .ProductShape,
body.dark-mode .CarouselSlide:focus-within .ProductShape{
    border-color:#ff2a2a !important;
    box-shadow:0 0.9vw 1.7vw rgba(255, 0, 0, 0.38), 0 0 0 0.1vw rgba(255, 0, 0, 0.35) !important;
    filter:saturate(1.12) brightness(1.08) !important;
    transform:skewX(-13deg) translateY(-0.16vw) !important;
}

body.dark-mode .ProductMedia:hover .ProductVehicle,
body.dark-mode .ProductPanel:hover .ProductVehicle,
body.dark-mode .ProductPanel:focus-within .ProductVehicle,
body.dark-mode .ProductMediaLink:focus-visible .ProductVehicle,
body.dark-mode .CarouselSlide:hover .ProductVehicle,
body.dark-mode .CarouselSlide:focus-within .ProductVehicle{
    filter:drop-shadow(0 0.82vw 1.18vw rgba(255, 0, 0, 0.3)) drop-shadow(0 0.4vw 0.8vw rgba(0, 0, 0, 0.5)) !important;
    transform:translateX(-50%) translateY(-0.47vw) scale(1.042) rotate(-0.26deg) !important;
}

html.page-loader-pending:not(.page-loader-transition) .animate__animated,
html.page-loader-pending:not(.page-loader-transition) .animup,
html.page-loader-pending:not(.page-loader-transition) .animright,
html.page-loader-pending:not(.page-loader-transition) .AnimSlide,
html.page-loader-pending:not(.page-loader-transition) .ProductMosaic,
html.page-loader-pending:not(.page-loader-transition) .HCatG,
html.page-loader-pending:not(.page-loader-transition) .FooterLegalRow{
    animation:none !important;
    transition:none !important;
}

html.page-loader-pending:not(.page-loader-transition) .animup,
html.page-loader-pending:not(.page-loader-transition) .animright,
html.page-loader-pending:not(.page-loader-transition) .AnimSlide,
html.page-loader-pending:not(.page-loader-transition) .ProductMosaic,
html.page-loader-pending:not(.page-loader-transition) .HCatG,
html.page-loader-pending:not(.page-loader-transition) .FooterLegalRow{
    opacity:0 !important;
}

@keyframes pageLoaderLogoPulse{
    0%,
    100%{
        transform:translateY(0) scale(1);
        filter:drop-shadow(0 10px 22px rgba(0, 0, 0, 0.08));
    }
    50%{
        transform:translateY(-2px) scale(1.015);
        filter:drop-shadow(0 14px 28px rgba(255, 0, 0, 0.14));
    }
}

@keyframes pageLoaderSweep{
    0%{
        transform:translateX(0);
    }
    100%{
        transform:translateX(360%);
    }
}

@keyframes pageLoaderGlow{
    0%,
    100%{
        opacity:.52;
        transform:scale(.96);
    }
    50%{
        opacity:.88;
        transform:scale(1.02);
    }
}

@media (max-width:700px){
    .PageLoaderInner{
        gap:18px;
    }

    .PageLoaderLogo{
        width:min(76vw, 280px);
    }

    .PageLoaderLine{
        width:min(46vw, 150px);
        height:3px;
    }
}

@media (prefers-reduced-motion:reduce){
    #page-loader{
        transition:none;
    }

    .PageLoaderLogo,
    .PageLoaderLine::before,
    .PageLoaderGlow{
        animation:none !important;
    }
}
