/* TABLET */
@media (max-width: 992px) {

    .hero-content h1 {
        font-size: 52px;
    }

    .about-section h2,
    .contact-section h2,
    .section-title h2 {
        font-size: 38px;
    }

    .navbar-collapse {
        background: rgba(43, 26, 15, 0.96);
        padding: 20px;
        border-radius: 16px;
        margin-top: 15px;
    }
}


/* MOBILE */
@media (max-width: 768px) {

    .hero {
        height: auto;
        padding: 140px 0 80px;
        text-align: center;
    }

    .hero-content h1 {
        font-size: 38px;
        line-height: 1.2;
    }

    .hero-content p {
        font-size: 16px;
    }

    .section-title h2,
    .about-section h2,
    .contact-section h2 {
        font-size: 30px;
    }

    .product-card img {
        height: 240px;
    }

    .contact-form {
        padding: 25px;
    }

    .navbar-brand {
        font-size: 22px;
    }
}


/* SMALL MOBILE */
@media (max-width: 480px) {

    .hero-content h1 {
        font-size: 30px;
    }

    .btn-main {
        width: 100%;
        display: block;
        text-align: center;
    }

    .product-content {
        padding: 18px;
    }
}
.main-header{
    background:#fff;
    padding:18px 0;
    box-shadow:0 2px 10px rgba(0,0,0,.05);
}

.main-header .container{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
}

/* Logo */
.logo{
    margin-bottom:15px;
}

.logo-link{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:12px;
    text-decoration:none;
}

.logo img{
    height:60px;
}

.logo-link span{
    font-size:18px;
    font-weight:700;
    color:#0f3d2e;
}

/* Menu */
.main-nav{
    width:100%;
}

.nav-links{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:35px;
    list-style:none;
    margin:0;
    padding:0;
}

.nav-links a{
    text-decoration:none;
    color:#222;
    font-weight:600;
    transition:.3s;
}

.nav-links a:hover{
    color:#0f8a44;
}

/* Mobile */
@media (max-width:768px){

    .logo img{
        height:50px;
    }

    .logo-link{
        flex-direction:column;
        gap:8px;
    }

    .nav-links{
        flex-wrap:wrap;
        gap:15px;
    }
}