/* =========================
   GLOBAL
========================= */

html{
    scroll-behavior:smooth;
}


/* =========================
   HERO WORD ANIMATION
========================= */

.hero-word{
    display:inline-block;
    opacity:0;
    transform:translateY(40px);
    animation:rise .8s forwards;
}

.hero-word:nth-child(1){animation-delay:.2s;}
.hero-word:nth-child(2){animation-delay:.4s;}
.hero-word:nth-child(3){animation-delay:.6s;}
.hero-word:nth-child(4){animation-delay:.8s;}
.hero-word:nth-child(5){animation-delay:1s;}

@keyframes rise{
    to{
        opacity:1;
        transform:translateY(0);
    }
}

/* =========================
   SECTION REVEAL
========================= */


/* =========================
   BUTTONS
========================= */

.btn-float{
    animation:float 3s ease-in-out infinite;
}

@keyframes float{

0%,100%{
transform:translateY(0);
}

50%{
transform:translateY(-8px);
}

}

.glow-btn{
    animation:pulse 2s infinite;
}

@keyframes pulse{

0%,100%{
box-shadow:0 0 15px rgba(255,120,0,.4);
}

50%{
box-shadow:0 0 35px rgba(255,120,0,.9);
}

}

/* =========================
   CARDS
========================= */

.service-card{
    transition:.5s;
}

.service-card:hover{
    transform:translateY(-12px) scale(1.03);
    box-shadow:0 25px 45px rgba(0,0,0,.25);
}

/* =========================
   IMAGE HOVER
========================= */

.image-box{
    overflow:hidden;
    border-radius:15px;
}

.image-box img{
    transition:1s;
}

.image-box:hover img{
    transform:scale(1.1);
}

/* =========================
   TITLES
========================= */

.gradient-title{
    background:linear-gradient(90deg,#BB4D00,#FFD66B,#BB4D00);
    background-size:300%;
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
    animation:gradientMove 6s linear infinite;
}

@keyframes gradientMove{

0%{
background-position:0%;
}

100%{
background-position:300%;
}

}

/* =========================
   RESPONSIVE
========================= */

@media(max-width:768px){

h1{
font-size:2.5rem!important;
line-height:1.2;
}

h2{
font-size:2rem!important;
}

section{
padding-top:60px!important;
padding-bottom:60px!important;
}

button,
a.btn{
width:100%;
justify-content:center;
}

.glass-panel{
padding:25px!important;
}

}

@media(min-width:1400px){

.max-w-7xl{
max-width:1400px;
}

h1{
font-size:5.5rem;
}

}