/*==========================================================
ANIMATIONS
Bright Ocean Digital
==========================================================*/

/* GLOBAL TRANSITION */

*{

transition:

background .3s ease,

color .3s ease,

transform .35s ease,

box-shadow .35s ease,

border-color .35s ease;

}

/* REVEAL */

.reveal{

opacity:0;

transform:translateY(50px);

transition:

opacity .8s ease,

transform .8s ease;

}

.reveal.active{

opacity:1;

transform:none;

}

/* HOVER LIFT */

.hover-lift{

transition:.35s ease;

}

.hover-lift:hover{

transform:translateY(-10px);

box-shadow:var(--shadow-lg);

}

/* FADE IN */

@keyframes fadeIn{

from{

opacity:0;

}

to{

opacity:1;

}

}

/* FLOAT */

@keyframes floating{

0%{

transform:translateY(0);

}

50%{

transform:translateY(-12px);

}

100%{

transform:translateY(0);

}

}

.float{

animation:floating 6s ease-in-out infinite;

}

/* HERO GLOW */

@keyframes glowMove{

0%{

transform:translate(0,0);

}

50%{

transform:translate(40px,-25px);

}

100%{

transform:translate(0,0);

}

}

.hero-glow{

position:absolute;

width:450px;

height:450px;

border-radius:50%;

background:

radial-gradient(

circle,

rgba(72,168,255,.18),

transparent 70%

);

filter:blur(45px);

animation:glowMove 8s ease-in-out infinite;

pointer-events:none;

}

/* BUTTON PRESS */

.btn:active{

transform:scale(.98);

}

/* CARD HOVER */

.card-hover{

transition:.4s ease;

}

.card-hover:hover{

transform:

translateY(-12px)

scale(1.02);

box-shadow:var(--shadow-lg);

}

/* IMAGE ZOOM */

.image-hover{

overflow:hidden;

border-radius:var(--radius-lg);

}

.image-hover img{

transition:transform .6s ease;

}

.image-hover:hover img{

transform:scale(1.08);

}

body{
    opacity:0;
    transition:opacity .5s ease;
}

body.loaded{
    opacity:1;
}