/*
 * Purpose: CSS file for media queries and responsive adjustments.
 * Position: /assets/css/responsive.css
 */

@media (max-width: 991.98px) {
    /* Adjust hero typography for mobile/tablet */
    .hero-retametal h1 {
        font-size: 2.5rem;
    }
    
    .navbar-collapse {
        background: #fff;
        padding: 1rem;
        border-radius: 0.5rem;
        box-shadow: 0 .5rem 1rem rgba(0,0,0,.15);
        margin-top: 1rem;
    }
}

@media (max-width: 767.98px) {
    .hero-retametal h1 {
        font-size: 2rem;
    }
    
    /* Placeholders resizing */
    div[style*="height: 450px"],
    div[style*="height: 400px"] {
        height: 300px !important;
    }
}