/* ============================================
   RESPONSIVE - GYRH SOURCINGS
   ============================================ */

/* ===== LARGE DESKTOP (1400px+) ===== */
@media (min-width: 1400px) {
    .container { max-width: 1360px; }

    .hero-title { font-size: 4.5rem; }

    .products-grid {
        grid-template-columns: repeat(4, 1fr);
    }
}

/* ===== DESKTOP (1200px - 1399px) ===== */
@media (max-width: 1200px) {
    .footer-grid {
        grid-template-columns: 1.5fr 1fr 1fr 1.2fr;
        gap: 36px;
    }

    .about-grid { gap: 50px; }
}

/* ===== TABLET LARGE (992px - 1199px) ===== */
@media (max-width: 992px) {

    /* NAVBAR */
    .hamburger { display: flex; }

    .nav-overlay { display: block; }

    .nav-links {
        position: fixed;
        top: 0;
        right: -100%;
        width: 300px;
        height: 100vh;
        background: white;
        flex-direction: column;
        align-items: flex-start;
        padding: 90px 30px 40px;
        gap: 4px;
        z-index: 998;
        box-shadow: var(--shadow-xl);
        transition: right 0.4s cubic-bezier(0.4, 0, 0.2, 1);
        overflow-y: auto;
    }

    .nav-links.open { right: 0; }

    .nav-links li { width: 100%; }

    .nav-links a {
        padding: 13px 16px;
        font-size: 1rem;
        border-radius: var(--radius);
        width: 100%;
        display: flex;
        align-items: center;
    }

    .nav-links a::after { display: none; }

    .nav-links a.active,
    .nav-links a:hover {
        background: rgba(192,57,43,0.08);
        color: var(--primary);
        padding-left: 20px;
    }

    .btn-quote { display: none; }

    /* HERO */
    .hero-stats { gap: 24px; }

    /* FOOTER */
    .footer-grid {
        grid-template-columns: 1fr 1fr;
        gap: 40px;
    }

    .footer-brand { grid-column: 1 / -1; }

    /* ABOUT */
    .about-grid {
        grid-template-columns: 1fr;
        gap: 50px;
    }

    .about-img-wrap {
        max-width: 500px;
        margin: 0 auto;
    }

    /* CONTACT */
    .contact-grid {
        grid-template-columns: 1fr;
    }

    .contact-info-card {
        position: static;
    }

    /* MV */
    .mv-grid { grid-template-columns: 1fr 1fr; }
}

/* ===== TABLET (768px - 991px) ===== */
@media (max-width: 768px) {

    /* SECTION */
    .section { padding: 70px 0; }

    /* TOP BAR */
    .top-bar-left .top-bar-location { display: none; }

    /* HERO */
    .hero-content { padding: 100px 20px 80px; }

    .hero-btns { flex-direction: column; align-items: flex-start; }

    .hero-btns a { width: 100%; text-align: center; justify-content: center; }

    .hero-stats {
        gap: 20px;
        flex-wrap: wrap;
    }

    .stat { min-width: calc(50% - 10px); }

    /* CATEGORIES */
    .categories-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    /* PRODUCTS */
    .products-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
    }

    .products-toolbar {
        flex-direction: column;
        align-items: stretch;
    }

    .search-box { max-width: 100%; }

    .sort-box { justify-content: space-between; }

    /* WHY */
    .why-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    /* TESTIMONIALS */
    .testimonials-slider {
        grid-template-columns: 1fr;
    }

    /* NEWSLETTER */
    .newsletter-content {
        flex-direction: column;
        text-align: center;
    }

    .newsletter-text p { margin: 0 auto; }

    .newsletter-form {
        width: 100%;
        max-width: 100%;
    }

    /* FOOTER */
    .footer-grid {
        grid-template-columns: 1fr;
        gap: 36px;
    }

    .footer-bottom .container {
        flex-direction: column;
        text-align: center;
    }

    /* ABOUT */
    .about-features {
        grid-template-columns: 1fr;
    }

    .mv-grid { grid-template-columns: 1fr; }

    /* CONTACT */
    .contact-form-card {
        padding: 30px 24px;
    }

    .form-row {
        grid-template-columns: 1fr;
    }

    /* BREADCRUMB */
    .breadcrumb { padding: 50px 0 30px; }

    /* CATEGORIES PAGE */
    .categories-page-grid {
        grid-template-columns: 1fr;
    }

    /* TEAM */
    .team-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    /* VALUES */
    .values-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* ===== MOBILE (480px - 767px) ===== */
@media (max-width: 480px) {

    /* CONTAINER */
    .container { padding: 0 16px; }

    /* SECTION */
    .section { padding: 55px 0; }

    .section-header { margin-bottom: 40px; }

    /* TOP BAR */
    .top-bar { display: none; }

    /* NAVBAR */
    .navbar .container { height: 64px; }

    .logo-text { font-size: 1.15rem; }

    .nav-links { width: 100%; border-radius: 0; }

    /* HERO */
    .hero { min-height: 90vh; }

    .hero-content { padding: 80px 16px 60px; }

    .hero-stats { gap: 16px; }

    .stat { min-width: calc(50% - 8px); }

    .stat-num { font-size: 1.8rem; }

    /* CATEGORIES */
    .categories-grid {
        grid-template-columns: 1fr;
    }

    /* PRODUCTS */
    .products-grid {
        grid-template-columns: 1fr;
    }

    .product-img-wrap { height: 200px; }

    /* FILTER TABS */
    .filter-tabs {
        gap: 8px;
        justify-content: flex-start;
        overflow-x: auto;
        flex-wrap: nowrap;
        padding-bottom: 8px;
        scrollbar-width: none;
    }

    .filter-tabs::-webkit-scrollbar { display: none; }

    .filter-tab { flex-shrink: 0; }

    /* WHY */
    .why-grid { grid-template-columns: 1fr; }

    /* NEWSLETTER */
    .newsletter-form {
        flex-direction: column;
        gap: 10px;
    }

    .newsletter-form input {
        border-radius: var(--radius);
        border-right: 1px solid rgba(255,255,255,0.2);
    }

    .newsletter-form button {
        border-radius: var(--radius);
        padding: 14px;
    }

    /* ABOUT */
    .about-img-main { height: 300px; }

    .about-img-badge {
        bottom: -10px;
        right: -10px;
        padding: 14px 18px;
    }

    .about-img-float {
        top: -10px;
        left: -10px;
        width: 90px;
        height: 90px;
    }

    /* CONTACT */
    .contact-info-card { padding: 30px 24px; }

    .contact-form-card { padding: 24px 20px; }

    /* TEAM */
    .team-grid { grid-template-columns: 1fr; }

    /* VALUES */
    .values-grid { grid-template-columns: 1fr; }

    /* FOOTER */
    .footer-top { padding: 50px 0 36px; }

    .footer-logo { font-size: 1.3rem; }

    /* BACK TO TOP */
    .back-to-top {
        bottom: 20px;
        right: 20px;
        width: 42px;
        height: 42px;
    }

    /* TOAST */
    .toast {
        bottom: 16px;
        right: 16px;
        left: 16px;
        font-size: 0.85rem;
    }

    /* BREADCRUMB */
    .breadcrumb h1 { font-size: 1.6rem; }
}

/* ===== VERY SMALL (< 360px) ===== */
@media (max-width: 360px) {
    .logo-text { font-size: 1rem; }
    /* responsive.css fin */
    .hero-title { font-size: 1.8rem; }

    .section-header h2 { font-size: 1.5rem; }

    .stat { min-width: 100%; }

    .categories-grid { grid-template-columns: 1fr; }

    .products-grid { grid-template-columns: 1fr; }

    .why-grid { grid-template-columns: 1fr; }

    .footer-badges { flex-direction: column; }

    .form-row { grid-template-columns: 1fr; }

    .mv-grid { grid-template-columns: 1fr; }

    .team-grid { grid-template-columns: 1fr; }

    .values-grid { grid-template-columns: 1fr; }

    .newsletter-form { flex-direction: column; }

    .hero-btns { flex-direction: column; }

    .hero-btns a { width: 100%; justify-content: center; }

    .filter-tabs { flex-wrap: nowrap; overflow-x: auto; }

    .breadcrumb-nav { flex-wrap: wrap; }
}

/* ===== PRINT ===== */
@media print {
    .top-bar,
    .navbar,
    .hero,
    .newsletter-section,
    .footer,
    .back-to-top,
    .loader { display: none !important; }

    body { background: white; color: black; }

    .section { padding: 20px 0; }

    .product-card { break-inside: avoid; }
}

/* ===== DARK MODE (optionnel) ===== */
@media (prefers-color-scheme: dark) {
    /* Désactivé par défaut - décommenter pour activer */
    /*
    body { background: #121212; color: #e0e0e0; }
    .navbar { background: #1e1e1e; }
    .product-card { background: #1e1e1e; border-color: #333; }
    .why-card { background: #1e1e1e; border-color: #333; }
    */
}

/* ===== ANIMATIONS GLOBALES ===== */
@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes slideInLeft {
    from { opacity: 0; transform: translateX(-40px); }
    to { opacity: 1; transform: translateX(0); }
}

@keyframes slideInRight {
    from { opacity: 0; transform: translateX(40px); }
    to { opacity: 1; transform: translateX(0); }
}

@keyframes slideInUp {
    from { opacity: 0; transform: translateY(40px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes zoomIn {
    from { opacity: 0; transform: scale(0.9); }
    to { opacity: 1; transform: scale(1); }
}

@keyframes shimmer {
    0% { background-position: -200% 0; }
    100% { background-position: 200% 0; }
}

/* SKELETON LOADING */
.skeleton {
    background: linear-gradient(90deg, var(--gray-200) 25%, var(--gray-100) 50%, var(--gray-200) 75%);
    background-size: 200% 100%;
    animation: shimmer 1.5s infinite;
    border-radius: var(--radius-sm);
}