/* ==========================================================
   HERO.CSS V2
   Reference Inspired - Video First
========================================================== */

#hero{
position:relative;
width:100%;
height:100%;
overflow:hidden;
background:#000;
display:flex;
align-items:center;
justify-content:center;
isolation:isolate;
}

/* =========================================================
   HERO VIDEOS
   DESKTOP VIDEO = ORIGINAL
   MOBILE VIDEO = SEPARATE
========================================================= */

#hero .hero-video{
    position:absolute;
    inset:0;

    width:100%;
    height:100%;

    object-fit:cover;
    object-position:center center;

    filter:
        brightness(.98)
        contrast(1.08)
        saturate(1.05);

    transition:transform 8s ease;
}


/* =========================================================
   DESKTOP
   ORIGINAL VIDEO ONLY
========================================================= */

#hero .hero-video-desktop{

    display:block;

    transform:scale(1.04);

    z-index:-10;
}


/* =========================================================
   MOBILE VIDEO HIDDEN ON DESKTOP
========================================================= */

#hero .hero-video-mobile{

    display:none;

}

/* Very light cinematic overlay */

.heroOverlay{
position:absolute;
inset:0;
background:
linear-gradient(
180deg,
rgba(0,0,0,.10),
rgba(0,0,0,.14));
pointer-events:none;
z-index:-8;
}

/* Gold ambient */

.heroOverlay::before{
content:"";
position:absolute;
inset:0;
background:
radial-gradient(circle at top,
rgba(212,175,55,.08),
transparent 45%);
mix-blend-mode:screen;
animation:ambientGlow 8s ease-in-out infinite;
}

/* Reflection */

.heroOverlay::after{
content:"";
position:absolute;
top:0;
left:-120%;
width:0%;
height:100%;
background:
linear-gradient(
90deg,
transparent,
rgba(255,255,255,.04),
transparent);
transform:skewX(-18deg);
animation:reflection 10s linear infinite;
}

/* Gold Dust */

.heroParticles{
position:absolute;
inset:0;
pointer-events:none;
z-index:-6;
}

/* Fog */

.heroFog{
position:absolute;
left:-5%;
bottom:-100px;
width:110%;
height:260px;
background:
radial-gradient(circle,
rgba(255,255,255,.05),
transparent 72%);
filter:blur(80px);
opacity:.55;
animation:fogMove 18s linear infinite;
pointer-events:none;
z-index:-5;
}

/* Lens Layer */

.heroLens{
position:absolute;
inset:0;
pointer-events:none;
background:
radial-gradient(circle at 80% 20%,
rgba(255,240,170,.05),
transparent 0%);
mix-blend-mode:screen;
z-index:-4;
}

/* Remove old hero content */

.heroContent{
display:none!important;
}

.heroButtons{
display:none!important;
}

.heroScroll{
display:none!important;
}

/* Animation */

@keyframes ambientGlow{

0%,100%{
opacity:.0;
transform:scale(1);
}

50%{
opacity:0;
transform:scale(1.05);
}

}

@keyframes reflection{

from{
transform:translateX(-180%) skewX(-18deg);
}

to{
transform:translateX(320%) skewX(-18deg);
}

}

@keyframes fogMove{

0%{
transform:translateX(-4%);
}

50%{
transform:translateX(4%);
}

100%{
transform:translateX(-4%);
}

}

@media(max-width:991px){

#hero video{

object-position:center;

}

}
/* =========================================================
   MOBILE HERO
   DESKTOP COMPLETELY UNCHANGED
========================================================= */
/* =========================================================
   MOBILE HERO
   ORIGINAL MOBILE VIDEO — NO AUTO ZOOM / NO CROP
   DESKTOP COMPLETELY UNCHANGED
========================================================= */
/* =========================================================
   MOBILE HERO — FINAL FIX
   NO EXTRA SPACE AFTER VIDEO
   DESKTOP COMPLETELY UNCHANGED
========================================================= */

@media(max-width:768px){

    #hero{

        position:relative;

        width:100%;

        height:auto !important;

        min-height:0 !important;

        margin:0 !important;

        padding:0 !important;

        overflow:hidden;

        display:block;

        background:#000;

    }


    /* Desktop video OFF */

    #hero .hero-video-desktop{

        display:none !important;

    }


    /* Mobile video */

    #hero .hero-video-mobile{

        display:block !important;

        position:relative !important;

        top:auto !important;

        left:auto !important;

        right:auto !important;

        bottom:auto !important;

        width:100% !important;

        height:auto !important;

        min-height:0 !important;

        margin:0 !important;

        padding:0 !important;

        transform:none !important;

        object-fit:contain !important;

        object-position:center center !important;

        transition:none !important;

        z-index:1 !important;

    }


    /* Effects video ઉપર રહે */

    #hero .heroOverlay,
    #hero .heroParticles,
    #hero .heroFog{

        position:absolute;

        inset:0;

        pointer-events:none;

    }


    /* Hero effects */

    .heroOverlay{

        z-index:2;

    }

    .heroParticles{

        z-index:3;

    }

    .heroFog{

        z-index:4;

        height:180px;

    }

}
@media(max-width:480px){

.heroOverlay{

background:
linear-gradient(
180deg,
rgba(0,0,0,.06),
rgba(0,0,0,.10));

}

}