/* ================================================================
   PRODUCT PAGE — Mobile Responsive CSS
   ================================================================ */

@media(max-width:767px) {
    .mobile-sticky-atc { display: block; }
    body { padding-bottom: 76px; }

    .p-wrap { padding: 12px; }
    .p-grid { gap: 20px; }
    .gallery-container { min-width: unset; width: 100%; }
    .info-container { min-width: unset; width: 100%; }
    .main-slider img { max-height: 360px; }
    .p-name { font-size: 1.25rem; }
    .p-price { font-size: 1.5rem; }
    .breadcrumb { font-size: .72rem; margin-bottom: 12px; }
    .alert-success { font-size: .82rem; padding: 10px 14px; }
    .gallery-actions { top: 10px; right: 10px; }
    .gal-act-btn { width: 34px; height: 34px; font-size: .82rem; }
    .badge-off-red { top: 10px; left: 10px; font-size: .7rem; padding: 4px 10px; }
    .trust-badge-row { flex-wrap: wrap; }
    .trust-item { flex: 1 1 45%; min-width: 100px; }
    .btn-atc { padding: 14px 20px; font-size: .88rem; }
    .qty-control { flex-shrink: 0; }
    .scroll-row .pc { width: 148px; }
    .fbt-row { flex-wrap: nowrap; }
    .fbt-card { width: 110px; }
    .fbt-card img { width: 80px; height: 80px; }
    .rev-card { padding: 14px; }
    .rev-summary { padding: 14px; gap: 14px; }
    .rev-big { font-size: 2.2rem; }
    .prod-sec { padding: 24px 12px; }
    .prod-sec-contained { padding-left: 12px; padding-right: 12px; }
    .sec-title { font-size: 1rem; }
    .prod-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; }
}

@media(max-width:380px) {
    .p-name { font-size: 1.1rem; }
    .p-price { font-size: 1.3rem; }
    .v-pill { padding: 8px 16px; font-size: .78rem; }
    .qty-btn { width: 36px; height: 40px; }
    .qty-display { width: 36px; font-size: .9rem; }
    .sc-modal-box { padding: 16px; border-radius: 14px; }
    .sc-modal-title { font-size: 1rem; }
}
