/* ==========================================================
   RITHZON TECHNOLOGIES
   Hero Section
========================================================== */

.hero-section{
    background:linear-gradient(135deg,#F8FAFC 0%,#EEF5FF 100%);
    padding:100px 0;
    overflow:hidden;
}

/* ==========================================================
   Hero Badge
========================================================== */

.hero-section .badge{
    font-size:14px;
    font-weight:600;
    padding:10px 20px;
    border-radius:30px;
}

/* ==========================================================
   Hero Heading
========================================================== */

.hero-section h1{

    font-size:58px;

    font-weight:800;

    line-height:1.2;

    color:#0F172A;

}

.hero-section h1 span{

    color:#0057FF;

}

/* ==========================================================
   Hero Paragraph
========================================================== */

.hero-section p{

    font-size:18px;

    color:#64748B;

    line-height:1.8;

    margin-top:20px;

    margin-bottom:35px;

}

/* ==========================================================
   Buttons
========================================================== */

.hero-section .btn{

    min-width:180px;

}

/* ==========================================================
   Hero Image
========================================================== */

.hero-section img{

    max-width:100%;

    animation:floatImage 5s ease-in-out infinite;

}

/* ==========================================================
   Floating Animation
========================================================== */

@keyframes floatImage{

    0%{
        transform:translateY(0);
    }

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

    100%{
        transform:translateY(0);
    }

}

/* ==========================================================
   Responsive
========================================================== */

@media(max-width:991px){

    .hero-section{

        text-align:center;

        padding:70px 0;

    }

    .hero-section h1{

        font-size:42px;

    }

    .hero-section p{

        font-size:16px;

    }

    .hero-section img{

        margin-top:40px;

        max-width:90%;

    }

}

@media(max-width:576px){

    .hero-section h1{

        font-size:34px;

    }

    .hero-section .btn{

        width:100%;
        margin-bottom:15px;

    }

}