/* Trojan Horse — Breakpoints Globais de Responsividade (CSS Puro) */

/* 1. Telas ultra pequenas (até 320px) */
@media (max-width: 320px) {
    .container { padding-left: 0.5rem; padding-right: 0.5rem; }
    .brand-name { display: none; }
    .btn { padding: 10px 12px; font-size: 0.8rem; }
    .admin-cards-grid { grid-template-columns: 1fr; }
    .admin-table { font-size: 0.8rem; }
    .pdp-price .now { font-size: 26px; }
    main { padding-bottom: 90px; }
}

/* 2. Smartphones pequenos (321px até 576px) */
@media (min-width: 321px) and (max-width: 576px) {
    .container { padding-left: 0.75rem; padding-right: 0.75rem; }
    .btn { padding: 12px 16px; }
    .section { padding: 32px 0; }
    .hero { padding: 32px 0 20px; }
    .pdp-price .now { font-size: 32px; }
    main { padding-bottom: 84px; }
}

/* 3. Smartphones grandes e Phablets (577px até 767px) */
@media (min-width: 577px) and (max-width: 767px) {
    .container { max-width: 540px; }
    .section { padding: 40px 0; }
}

/* 4. Tablets e iPads (768px até 991px) */
@media (min-width: 768px) and (max-width: 991px) {
    .container { max-width: 720px; }
    .admin-sidebar { width: 100%; }
}

/* 5. Laptops e Desktops pequenos (992px até 1199px) */
@media (min-width: 992px) and (max-width: 1199px) {
    .container { max-width: 960px; }
}

/* 6. Telas grandes e Monitores Full HD (1200px ou superior) */
@media (min-width: 1200px) {
    .container { max-width: 1140px; }
}

/* Ajustes Globais sem estouro horizontal */
img, video { max-width: 100%; height: auto; }
body { overflow-x: hidden; }

/* Print Media */
@media print {
    .site-header, .site-footer, .pdp-mobile-bar, .cookie-banner, .toast-wrap, .admin-sidebar { display: none !important; }
    body { background: #fff; color: #000; }
}
