/* ==========================================================
   GLYDE HOME PAGE
========================================================== */

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

body{

    font-family:'Poppins',sans-serif;
    background:#ffffff;
    color:#222;

}

/* ===========================================
   HERO
=========================================== */

.hero{

    width:100%;
    background:#000;

}

.hero-image{

    width:100%;
    display:flex;
    justify-content:center;

}

.hero-image img{

    width:100%;
    max-width:1600px;

    display:block;

    height:auto;

}

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

.action-section{

    background:#ffffff;

    padding:45px 20px 60px;

}

.container{

    max-width:900px;

    margin:auto;

    display:flex;

    justify-content:center;

    align-items:center;

    gap:25px;

    flex-wrap:wrap;

}

/* ===========================================
   BUTTON
=========================================== */

.btn{

    display:flex;

    align-items:center;

    justify-content:center;

    text-decoration:none;

    min-width:300px;

    height:72px;

    border-radius:60px;

    font-size:24px;

    font-weight:800;

    letter-spacing:.5px;

    transition:.3s;

    color:#fff;

    box-shadow:0 10px 30px rgba(0,0,0,.18);

}

.btn:hover{

    transform:translateY(-4px);

    box-shadow:0 18px 40px rgba(0,0,0,.25);

}

/* ===========================================
   GOLD BUTTON
=========================================== */

.btn-gold{

    background:linear-gradient(135deg,#D4AF37,#B8860B);

}

.btn-gold:hover{

    background:linear-gradient(135deg,#E2BF4A,#C99616);

}

/* ===========================================
   GREEN BUTTON
=========================================== */

.btn-green{

    background:#25D366;

}

.btn-green:hover{

    background:#20bc5a;

}

/* ===========================================
   MOBILE
=========================================== */

@media (max-width:768px){

    .container{

        flex-direction:column;

    }

    .btn{

        width:100%;

        min-width:unset;

        font-size:21px;

        height:68px;

    }

    .action-section{

        padding:35px 18px 50px;

    }

}