.feedback-section {
        max-width: 1200px;
        margin: 40px auto;
        padding: 0 20px;
    }
    .feedback-container {
        display: flex;
        gap: 15px;
        overflow-x: auto;
        padding: 20px 0;
        scrollbar-width: none;
    }
    .feedback-card {
        min-width: 280px;
        background: white;
        padding: 20px;
        border-radius: 20px;
        box-shadow: var(--shadow);
        border: 1px solid rgba(0,0,0,0.03);
    }
    .stars { color: var(--accent); margin-bottom: 10px; font-size: 12px; }
    
    /* Botão de Tabela de Medidas */
    .btn-medidas {
        background: none;
        border: 1px solid #ddd;
        padding: 8px 15px;
        border-radius: 10px;
        font-size: 12px;
        cursor: pointer;
        margin-top: 10px;
        transition: 0.3s;
    }
    .btn-medidas:hover { background: #f0f0f0; }

    /* Estilo da Tabela de Medidas dentro do Modal */
    .tabela-medidas {
        width: 100%;
        border-collapse: collapse;
        margin-top: 15px;
        font-size: 13px;
    }
    .tabela-medidas th, .tabela-medidas td {
        border: 1px solid #eee;
        padding: 8px;
        text-align: center;
    }
    .tabela-medidas th { background: #f9f9f9; }

        :root {
            --primary: #111111;
            --accent: #c5a059; 
            --bg: #fdfcf0; /* O creme que você gosta */
            --white: #ffffff;
            --shadow: 0 20px 40px rgba(0,0,0,0.06);
            --transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
        }

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

        body { background-color: var(--bg); color: var(--primary); overflow-x: hidden; }

        /* HEADER */
        .navbar {
            background: rgba(255, 255, 255, 0.85);
            backdrop-filter: blur(15px);
            padding: 1rem;
            text-align: center;
            position: sticky;
            top: 0;
            z-index: 1000;
            border-bottom: 1px solid rgba(0,0,0,0.05);
        }

        .navbar h1 {
            font-family: 'Playfair Display', serif;
            font-size: 1.5rem;
            letter-spacing: 4px;
            text-transform: uppercase;
        }

        /* BANNER NOVIDADE (BRASIL CORE) */
        .promo-section { max-width: 1200px; margin: 20px auto; padding: 0 20px; }
        
        .promo-card {
            background: var(--primary);
            border-radius: 25px;
            display: flex;
            align-items: center;
            padding: 20px;
            color: white;
            cursor: pointer;
            transition: var(--transition);
            box-shadow: 0 10px 30px rgba(0,0,0,0.15);
        }

        .promo-card:hover { transform: scale(1.02); }

        .promo-card img {
            width: 90px; height: 90px;
            border-radius: 15px;
            object-fit: cover;
            margin-right: 20px;
            border: 2px solid var(--accent);
        }

        .badge-new {
            background: var(--accent);
            padding: 4px 10px;
            border-radius: 50px;
            font-size: 10px;
            font-weight: 700;
            margin-bottom: 8px;
            display: inline-block;
        }

        /* FILTROS */
        .filters {
            display: flex;
            justify-content: center;
            gap: 10px;
            margin: 30px 0;
            overflow-x: auto;
            padding: 10px 20px;
        }

        .filter-btn {
            padding: 10px 25px;
            border: 1px solid rgba(0,0,0,0.1);
            background: white;
            border-radius: 50px;
            cursor: pointer;
            font-weight: 600;
            white-space: nowrap;
            transition: var(--transition);
        }

        .filter-btn.active {
            background: var(--primary);
            color: white;
            border-color: var(--primary);
        }

        /* GRID */
        .container { max-width: 1200px; margin: 0 auto; padding: 0 20px 100px; }
        
        .product-grid {
            display: grid;
            grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
            gap: 30px;
        }

        .card {
            background: white;
            border-radius: 20px;
            overflow: hidden;
            transition: var(--transition);
            border: 1px solid rgba(0,0,0,0.03);
            position: relative;
        }

        .card:hover { transform: translateY(-10px); box-shadow: var(--shadow); }

        .card-img-box {
            position: relative;
            height: 320px;
            overflow: hidden;
        }

        img {
    max-width: 100%;
    height: auto;
    display: block;
}
.card-img-box img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.badge-out {
    position: absolute;
    top: 10px;
    left: 10px;
    background: red;
    color: white;
    font-size: 10px;
    padding: 5px 10px;
    border-radius: 20px;
    font-weight: bold;
}
.card.esgotado {
    opacity: 0.6;
}
.modal-gallery img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

        .card:hover img { transform: scale(1.1); }

        .card-body { padding: 20px; text-align: center; }

        .stock-tag {
            font-size: 10px;
            font-weight: 700;
            color: #2ecc71;
            margin-bottom: 5px;
            display: block;
        }

        .price { font-size: 1.2rem; font-weight: 700; color: var(--primary); margin-top: 10px; }

        /* MODAL */
        .modal {
            position: fixed;
            top:0; left:0; width:100%; height:100%;
            background: rgba(0,0,0,0.6);
            backdrop-filter: blur(10px);
            display: none;
            justify-content: center;
            align-items: center;
            z-index: 2000;
            padding: 20px;
        }

        .modal-content {
            background: white;
            width: 100%;
            max-width: 850px;
            border-radius: 30px;
            display: flex;
            overflow: hidden;
            position: relative;
            animation: slideIn 0.4s ease;
        }

        @keyframes slideIn { from { opacity: 0; transform: scale(0.9); } to { opacity: 1; transform: scale(1); } }

        .modal-gallery { width: 50%; background: #f9f9f9; position: relative; }
        .modal-info { width: 50%; padding: 40px; display: flex; flex-direction: column; justify-content: center; }

        .close-modal {
            position: absolute;
            top: 15px; right: 15px;
            background: white; border: none;
            width: 35px; height: 35px; border-radius: 50%;
            cursor: pointer; z-index: 10; box-shadow: 0 5px 10px rgba(0,0,0,0.1);
        }

        .nav-modal {
            position: absolute; top: 50%; transform: translateY(-50%);
            background: white; border: none; width: 40px; height: 40px;
            border-radius: 50%; cursor: pointer; box-shadow: 0 5px 10px rgba(0,0,0,0.1);
        }

        .btn-buy {
            background: #25d366; color: white;
            text-decoration: none; padding: 15px;
            border-radius: 15px; text-align: center;
            font-weight: 700; margin-top: 20px;
            transition: 0.3s;
        }

        /* FLOATING BUTTONS */
        .float-box { position: fixed; bottom: 30px; right: 20px; display: flex; flex-direction: column; gap: 10px; z-index: 1000; }
        .float-btn {
            width: 55px; height: 55px; border-radius: 50%;
            display: flex; align-items: center; justify-content: center;
            color: white; font-size: 22px; text-decoration: none;
            box-shadow: 0 10px 20px rgba(0,0,0,0.2); transition: 0.3s;
        }

        @media (max-width: 800px) {
            .modal-content { flex-direction: column; max-height: 90vh; overflow-y: auto; }
            .modal-gallery, .modal-info { width: 100%; }
            .modal-gallery { height: 400px; }
            .product-grid { grid-template-columns: repeat(2, 1fr); gap: 15px; }
        }