.navbar { background-color: #285f6b !important; }
.navbar-nav .nav-link.active { font-weight: 700 !important; color: #fff !important; }
footer { background-color: #285f6b !important; }

.nav-cart-btn {
    transition: transform 0.2s ease, color 0.2s ease;
    display: inline-block;
}

.nav-cart-btn:hover {
    transform: scale(1.05) translateY(-2px);
}

.nav-login-btn {
    transition: color 0.2s ease, transform 0.2s ease;
    display: inline-block;
}

.nav-login-btn:hover {
    color: #ffffff !important;
}

.nav-signup-btn {
    transition: background-color 0.3s ease, transform 0.2s ease, box-shadow 0.3s ease !important;
}

.nav-signup-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 15px rgba(39, 80, 87, 0.8);
}

footer .text-white-50,
footer .text-white-50.small,
footer a.text-white-50 {
    color: #e9ecef !important;
}

footer a.text-white-50:hover,
footer a.text-white-50:focus {
    color: #ffffff !important;
    text-decoration: underline;
}

.carousel-item img {
    height: 90vh; width: 100%; object-fit: cover;
    object-position: center; filter: brightness(0.45);
}
.carousel-caption { top: 50%; bottom: auto; transform: translateY(-50%); }
.carousel-caption h5 { font-size: 3rem; font-weight: 700; color: #ffffff; }
.carousel-caption p { color: rgba(255, 255, 255, 0.75); font-style: italic; }

#contact-container { min-height:600px }
#contact-submit { background-color: #28666e }

.hero {
    background: #111; height: 200px; overflow: hidden;
    position: relative; display: flex; align-items: center; justify-content: center;
}

body{
    font-family: 'Urbanist', sans-serif;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

.hero-img { width: 100%; height: 100%; object-fit: cover; filter: brightness(0.6); }
.hero-overlay { z-index: 2; }

.filter-bar { background: #fff; border-bottom: 1px solid #e4e7ec; }
.filter-label { font-size: 0.72rem; font-weight: 600; letter-spacing: 0.20em; text-transform: uppercase; white-space: nowrap; }

.rounded-pill {
    font-size: 0.75rem; width:90px; height:32px; background: transparent;
    color: #6b7280; white-space: nowrap; border: 1px solid #e4e7ec;
}

.card-img-top { height: 210px; cursor: zoom-in; }
.card:hover { transform: scale(1.03); }
.card-text-category { font-size:.65rem; letter-spacing:.1em; }

.card-btn, .modal-btn { transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); }
.card-btn:hover, .modal-btn:hover { background-color: #285f6b; transform: translateY(-3px); letter-spacing: 1px; }

.modalRight { max-height:90vh; }
#modelShowcase { width: 100%; height: 100%; min-height: 500px; display: block; }

@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(30px); }
  to { opacity: 1; transform: translateY(0); }
}

.animated { animation: fadeInUp 1.0s ease forwards; opacity: 0; }