*{
    margin:0;
    padding:0;
    box-sizing:border-box;
    font-family:'Poppins',sans-serif;
}

body{
    background:#f5f8f4;
}

/* HERO */

.hero{

background:
linear-gradient(
rgba(46,125,50,.75),
rgba(102,187,106,.75)
),
url("../images/hero.jpg");

background-size:cover;

background-position:center;

background-repeat:no-repeat;

min-height:650px;

display:flex;

align-items:center;

color:white;

}

.hero h1{

    font-size:55px;

    font-weight:700;

}

.hero p{

    font-size:20px;

    opacity:.9;

}

.search-box{

    max-width:500px;

    margin:auto;

    margin-top:35px;

}

/* CARD */

.card-tanaman{

    border:none;

    border-radius:20px;

    overflow:hidden;

    transition:.3s;

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

}

.card-tanaman:hover{

    transform:translateY(-10px);

    box-shadow:0 20px 40px rgba(0,0,0,.15);

}

.card-tanaman img{

    height:220px;

    object-fit:cover;

}

.badge-kategori{

    background:#43A047;

    color:white;

    padding:6px 14px;

    border-radius:30px;

}

.btn-detail{

    border-radius:30px;

}

.section-title{

    font-weight:700;

    margin-bottom:50px;

}

.navbar{

padding:15px;

}

.hero img{

animation:float 4s ease-in-out infinite;

}

@keyframes float{

0%{

transform:translateY(0);

}

50%{

transform:translateY(-15px);

}

100%{

transform:translateY(0);

}

}

.btn{

border-radius:30px;

}

.section-title{

font-size:35px;

}