/**
 * Preloader Styles
 * Video background with animated SVG logo
 */

.preloader {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 99999;
  background: #1C1C1C;
  opacity: 1;
  visibility: visible;
  transition: opacity 1.2s cubic-bezier(0.4, 0, 0.2, 1), visibility 1.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.preloader.fade-out {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

/* Fast mode for internal navigation */
.preloader.preloader--fast {
    transition: opacity 0.6s cubic-bezier(0.4, 0, 0.2, 1),
                visibility 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

.preloader.preloader--fast .preloader__logo {
    animation-duration: 0.8s;
}

.preloader.preloader--fast .svg-elem-1,
.preloader.preloader--fast .svg-elem-2,
.preloader.preloader--fast .svg-elem-3,
.preloader.preloader--fast .svg-elem-4,
.preloader.preloader--fast .svg-elem-5,
.preloader.preloader--fast .svg-elem-6,
.preloader.preloader--fast .svg-elem-7,
.preloader.preloader--fast .svg-elem-8,
.preloader.preloader--fast .svg-elem-9,
.preloader.preloader--fast .svg-elem-10,
.preloader.preloader--fast .svg-elem-11,
.preloader.preloader--fast .svg-elem-12,
.preloader.preloader--fast .svg-elem-13,
.preloader.preloader--fast .svg-elem-14 {
    transition-duration: 0.4s, 0.5s !important;
}

.preloader__video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    pointer-events: none;
}

.preloader__video::-webkit-media-controls,
.preloader__video::-webkit-media-controls-start-playback-button,
.preloader__video::-webkit-media-controls-panel {
    display: none !important;
    -webkit-appearance: none;
}

/* Hide video on mobile/tablet — solid #1C1C1C background shows instead */
@media (max-width: 1024px) {
    .preloader__video {
        display: none;
    }
}

@media (max-width: 768px) {
    .preloader__logo {
        width: 150px !important;
        max-width: 40vw !important;
        height: auto !important;
    }
}

.preloader__logo-container {
    position: relative;
    z-index: 10;
    display: flex;
    justify-content: center;
    align-items: center;
}

.preloader__logo {
    width: 354px;
    height: auto;
    max-width: 80vw;
    /* Initial blur state */
    filter: blur(20px);
    opacity: 0;
    transform: scale(0.9);
    animation: logoReveal 1.5s cubic-bezier(0.22, 1, 0.36, 1) 0.3s forwards;
}

@keyframes logoReveal {
    0% {
        filter: blur(20px);
        opacity: 0;
        transform: scale(0.9);
    }
    50% {
        filter: blur(10px);
        opacity: 0.5;
        transform: scale(0.95);
    }
    100% {
        filter: blur(0px);
        opacity: 1;
        transform: scale(1);
    }
}

.preloader__logo .svg-elem-1 {
    stroke-dashoffset: 861.57275390625px;
    stroke-dasharray: 861.57275390625px;
    fill: transparent;
    -webkit-transition: stroke-dashoffset 1s ease 0s, fill 1.2s cubic-bezier(0.47, 0, 0.745, 0.715) 0s;
    transition: stroke-dashoffset 1s ease 0s, fill 1.2s cubic-bezier(0.47, 0, 0.745, 0.715) 0s;
}

.preloader__logo.active .svg-elem-1 {
    stroke-dashoffset: 1723.1455078125px;
    fill: rgb(255, 255, 255);
}

.preloader__logo .svg-elem-2 {
    stroke-dashoffset: 305.3277282714844px;
    stroke-dasharray: 305.3277282714844px;
    fill: transparent;
    -webkit-transition: stroke-dashoffset 1s ease 0.1s, fill 1.2s cubic-bezier(0.47, 0, 0.745, 0.715) 0.1s;
    transition: stroke-dashoffset 1s ease 0.1s, fill 1.2s cubic-bezier(0.47, 0, 0.745, 0.715) 0.1s;
}

.preloader__logo.active .svg-elem-2 {
    stroke-dashoffset: 610.6554565429688px;
    fill: rgb(255, 255, 255);
}

.preloader__logo .svg-elem-3 {
    stroke-dashoffset: 182.55860900878906px;
    stroke-dasharray: 182.55860900878906px;
    fill: transparent;
    -webkit-transition: stroke-dashoffset 1s ease 0.2s, fill 1.2s cubic-bezier(0.47, 0, 0.745, 0.715) 0.2s;
    transition: stroke-dashoffset 1s ease 0.2s, fill 1.2s cubic-bezier(0.47, 0, 0.745, 0.715) 0.2s;
}

.preloader__logo.active .svg-elem-3 {
    stroke-dashoffset: 365.1172180175781px;
    fill: rgb(255, 255, 255);
}

.preloader__logo .svg-elem-4 {
    stroke-dashoffset: 208.68814086914062px;
    stroke-dasharray: 208.68814086914062px;
    fill: transparent;
    -webkit-transition: stroke-dashoffset 1s ease 0.30000000000000004s, fill 1.2s cubic-bezier(0.47, 0, 0.745, 0.715) 0.30000000000000004s;
    transition: stroke-dashoffset 1s ease 0.30000000000000004s, fill 1.2s cubic-bezier(0.47, 0, 0.745, 0.715) 0.30000000000000004s;
}

.preloader__logo.active .svg-elem-4 {
    stroke-dashoffset: 417.37628173828125px;
    fill: rgb(255, 255, 255);
}

.preloader__logo .svg-elem-5 {
    stroke-dashoffset: 233.9158477783203px;
    stroke-dasharray: 233.9158477783203px;
    fill: transparent;
    -webkit-transition: stroke-dashoffset 1s ease 0.4s, fill 1.2s cubic-bezier(0.47, 0, 0.745, 0.715) 0.4s;
    transition: stroke-dashoffset 1s ease 0.4s, fill 1.2s cubic-bezier(0.47, 0, 0.745, 0.715) 0.4s;
}

.preloader__logo.active .svg-elem-5 {
    stroke-dashoffset: 467.8316955566406px;
    fill: rgb(255, 255, 255);
}

.preloader__logo .svg-elem-6 {
    stroke-dashoffset: 227.6415557861328px;
    stroke-dasharray: 227.6415557861328px;
    fill: transparent;
    -webkit-transition: stroke-dashoffset 1s ease 0.5s, fill 1.2s cubic-bezier(0.47, 0, 0.745, 0.715) 0.5s;
    transition: stroke-dashoffset 1s ease 0.5s, fill 1.2s cubic-bezier(0.47, 0, 0.745, 0.715) 0.5s;
}

.preloader__logo.active .svg-elem-6 {
    stroke-dashoffset: 455.2831115722656px;
    fill: rgb(255, 255, 255);
}

.preloader__logo .svg-elem-7 {
    stroke-dashoffset: 188.27865600585938px;
    stroke-dasharray: 188.27865600585938px;
    fill: transparent;
    -webkit-transition: stroke-dashoffset 1s ease 0.6000000000000001s, fill 1.2s cubic-bezier(0.47, 0, 0.745, 0.715) 0.6000000000000001s;
    transition: stroke-dashoffset 1s ease 0.6000000000000001s, fill 1.2s cubic-bezier(0.47, 0, 0.745, 0.715) 0.6000000000000001s;
}

.preloader__logo.active .svg-elem-7 {
    stroke-dashoffset: 376.55731201171875px;
    fill: rgb(255, 255, 255);
}

.preloader__logo .svg-elem-8 {
    stroke-dashoffset: 156.5653533935547px;
    stroke-dasharray: 156.5653533935547px;
    fill: transparent;
    -webkit-transition: stroke-dashoffset 1s ease 0.7000000000000001s, fill 1.2s cubic-bezier(0.47, 0, 0.745, 0.715) 0.7000000000000001s;
    transition: stroke-dashoffset 1s ease 0.7000000000000001s, fill 1.2s cubic-bezier(0.47, 0, 0.745, 0.715) 0.7000000000000001s;
}

.preloader__logo.active .svg-elem-8 {
    stroke-dashoffset: 313.1307067871094px;
    fill: rgb(255, 255, 255);
}

.preloader__logo .svg-elem-9 {
    stroke-dashoffset: 45.98963928222656px;
    stroke-dasharray: 45.98963928222656px;
    fill: transparent;
    -webkit-transition: stroke-dashoffset 1s ease 0.8s, fill 1.2s cubic-bezier(0.47, 0, 0.745, 0.715) 0.8s;
    transition: stroke-dashoffset 1s ease 0.8s, fill 1.2s cubic-bezier(0.47, 0, 0.745, 0.715) 0.8s;
}

.preloader__logo.active .svg-elem-9 {
    stroke-dashoffset: 91.97927856445312px;
    fill: rgb(255, 255, 255);
}

.preloader__logo .svg-elem-10 {
    stroke-dashoffset: 322.9222412109375px;
    stroke-dasharray: 322.9222412109375px;
    fill: transparent;
    -webkit-transition: stroke-dashoffset 1s ease 0.9s, fill 1.2s cubic-bezier(0.47, 0, 0.745, 0.715) 0.9s;
    transition: stroke-dashoffset 1s ease 0.9s, fill 1.2s cubic-bezier(0.47, 0, 0.745, 0.715) 0.9s;
}

.preloader__logo.active .svg-elem-10 {
    stroke-dashoffset: 645.844482421875px;
    fill: rgb(255, 255, 255);
}

.preloader__logo .svg-elem-11 {
    stroke-dashoffset: 229.37510681152344px;
    stroke-dasharray: 229.37510681152344px;
    fill: transparent;
    -webkit-transition: stroke-dashoffset 1s ease 1s, fill 1.2s cubic-bezier(0.47, 0, 0.745, 0.715) 1s;
    transition: stroke-dashoffset 1s ease 1s, fill 1.2s cubic-bezier(0.47, 0, 0.745, 0.715) 1s;
}

.preloader__logo.active .svg-elem-11 {
    stroke-dashoffset: 458.7502136230469px;
    fill: rgb(255, 255, 255);
}

.preloader__logo .svg-elem-12 {
    stroke-dashoffset: 269.8099670410156px;
    stroke-dasharray: 269.8099670410156px;
    fill: transparent;
    -webkit-transition: stroke-dashoffset 1s ease 1.1s, fill 1.2s cubic-bezier(0.47, 0, 0.745, 0.715) 1.1s;
    transition: stroke-dashoffset 1s ease 1.1s, fill 1.2s cubic-bezier(0.47, 0, 0.745, 0.715) 1.1s;
}

.preloader__logo.active .svg-elem-12 {
    stroke-dashoffset: 539.6199340820312px;
    fill: rgb(255, 255, 255);
}

.preloader__logo .svg-elem-13 {
    stroke-dashoffset: 278.1833190917969px;
    stroke-dasharray: 278.1833190917969px;
    fill: transparent;
    -webkit-transition: stroke-dashoffset 1s ease 1.2000000000000002s, fill 1.2s cubic-bezier(0.47, 0, 0.745, 0.715) 1.2000000000000002s;
    transition: stroke-dashoffset 1s ease 1.2000000000000002s, fill 1.2s cubic-bezier(0.47, 0, 0.745, 0.715) 1.2000000000000002s;
}

.preloader__logo.active .svg-elem-13 {
    stroke-dashoffset: 556.3666381835938px;
    fill: rgb(255, 255, 255);
}

.preloader__logo .svg-elem-14 {
    stroke-dashoffset: 294.7060546875px;
    stroke-dasharray: 294.7060546875px;
    fill: transparent;
    -webkit-transition: stroke-dashoffset 1s ease 1.3s, fill 1.2s cubic-bezier(0.47, 0, 0.745, 0.715) 1.3s;
    transition: stroke-dashoffset 1s ease 1.3s, fill 1.2s cubic-bezier(0.47, 0, 0.745, 0.715) 1.3s;
}

.preloader__logo.active .svg-elem-14 {
    stroke-dashoffset: 589.412109375px;
    fill: rgb(255, 255, 255);
}
 
/* Prevent body scroll while preloader is active */
body.preloader-active {
    position: fixed;
    width: 100%;
    left: 0;
    right: 0;
}

/* iOS Safari: set html/body background to match preloader so no white flash
   shows in the bounce/overscroll area or behind the video-less preloader */
html:has(body.preloader-active),
body.preloader-active {
    background: #1C1C1C;
    overflow: hidden;
}

/* Smooth content reveal - content is there but hidden under preloader */
html, body {
    margin: 0;
    padding: 0;
}

/* Ensure smooth transition without jumps */
body {
    transition: opacity 0.3s ease;
}
