/* ==========================================================
   ALVANTIA.STYLE.CSS
   Version : 1.0
========================================================== */


/* ==========================================================
   GENERAL
========================================================== */

body{
    font-family:'Poppins',sans-serif;
    background:#fff;
    color:#222;
}

a{
    text-decoration:none;
}

img{
    max-width:100%;
    height:auto;
}


/* ==========================================================
   NAVBAR
========================================================== */

.navbar{
    padding:16px 0;
}

.navbar-brand{
    font-size:1.6rem;
    letter-spacing:1px;
    font-weight:700;
}

.nav-link{
    margin-left:12px;
    font-weight:500;
}


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

.btn{
    border-radius:12px;
}

.btn-primary{
    padding:10px 24px;
}


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

.hero{
    padding:90px 0;
}

.hero h1{
    line-height:1.2;
    font-weight:700;
}

.hero p{
    font-size:1.1rem;
    color:#666;
}

.hero img{
    max-width:420px;
}


/* ==========================================================
   FEATURE CARD
========================================================== */

.feature-card{
    background:#fff;
    border:1px solid #ececec;
    border-radius:18px;
    padding:35px 25px;
    text-align:center;
    height:100%;
    transition:.3s;
}

.feature-card:hover{
    transform:translateY(-8px);
    box-shadow:0 18px 40px rgba(0,0,0,.08);
}

.feature-card i{
    font-size:42px;
    color:#0d6efd;
    margin-bottom:20px;
}

.feature-card h5{
    font-weight:700;
    margin-bottom:12px;
}

.feature-card p{
    color:#666;
    margin-bottom:0;
}


/* ==========================================================
   APP CARD
========================================================== */

.app-card{
    border:0;
    border-radius:18px;
    overflow:hidden;
    transition:.3s;
}

.app-card:hover{
    transform:translateY(-8px);
    box-shadow:0 20px 40px rgba(0,0,0,.08);
}

.app-icon{
    width:128px;
    height:128px;
    object-fit:cover;
    border-radius:28px;
    display:block;
    margin:30px auto 10px;
    box-shadow:0 10px 25px rgba(0,0,0,.12);
}

.card-title{
    font-weight:700;
}

.card-text{
    color:#666;
}


/* ==========================================================
   APP DETAIL
========================================================== */

.screenshot{
    border-radius:16px;
    cursor:pointer;
    transition:.25s;
}

.screenshot:hover{
    transform:scale(1.03);
}


/* ==========================================================
   FOOTER
========================================================== */

.footer{
    margin-top:80px;
    padding:35px 0;
    border-top:1px solid #eee;
}


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

@media(max-width:991px){

    .hero{
        text-align:center;
    }

    .hero img{
        margin-top:40px;
        max-width:320px;
    }

}

@media(max-width:576px){

    .hero{
        padding:60px 0;
    }

    .hero h1{
        font-size:2.2rem;
    }

    .app-icon{
        width:96px;
        height:96px;
    }

}