/* Shared responsive layout: keep overflow inside tabs and tables. */
:where(.hero-grid, .flagship-grid, .detail-layout, .checkout-grid,
 .cart-layout-grid, .account-layout, .footer-grid, .product-grid,
 .vformat-taskpane-grid, .vformat-grid-2, .vformat-grid-3, .vformat-grid-4) > * {
    min-width: 0;
}
main, .tabs-container, .tab-pane, .detail-info, .detail-gallery { min-width: 0; }
.detail-tabs { max-width: 100%; overflow-x: auto; overscroll-behavior-inline: contain; }
.detail-tabs .tab-btn { flex-shrink: 0; }
.mobile-drawer-body { overscroll-behavior-y: contain; }
.mobile-drawer { padding-bottom: env(safe-area-inset-bottom, 0px); }
.mobile-drawer-header { padding-top: max(20px, env(safe-area-inset-top, 0px)); }
.mobile-nav-link { min-height: 44px; }
.mobile-drawer-user { overflow-wrap: anywhere; }
:where(a, button, input, select, textarea):focus-visible {
    outline: 3px solid #0057FF; outline-offset: 3px;
}
@media (max-width: 1180px) {
    .header .nav-menu, .header .header-cta-desktop { display: none; }
    .header .mobile-menu-btn { display: flex; }
    .topbar-features { gap: 12px; }
    .topbar-feature:nth-child(2) { display: none; }
}
@media (max-width: 900px) {
    .checkout-grid > * { width: 100%; min-width: 0; }
    .topbar-links { flex-wrap: wrap; justify-content: center; gap: 4px 12px; }
    .topbar-links a { overflow-wrap: anywhere; }
}
@media (max-width: 768px) {
    .header-wrapper { gap: 8px; }
    .header .brand-logo { min-width: 0; flex: 1; }
    .header .brand-logo img { height: auto !important; max-height: 38px !important; max-width: 100%; width: auto; }
    .header-actions { flex-shrink: 0; gap: 4px; }
    .header-actions .btn-icon, .mobile-menu-btn, .mobile-drawer-close { min-width: 44px; min-height: 44px; }
    .topbar-links { font-size: 12px; }
    .topbar-wrapper { padding-top: 8px; padding-bottom: 8px; }
    .btn { min-height: 44px; max-width: 100%; white-space: normal; overflow-wrap: anywhere; }
    .badge, .hero-badge { max-width: 100%; white-space: normal; }
    .hero-grid, .flagship-grid, .detail-layout { grid-template-columns: minmax(0, 1fr) !important; }
    .hero-stats { gap: 20px; }
    .hero-subtitle, .section-subtitle { overflow-wrap: anywhere; }
    .checkout-card, .cart-summary-box { max-width: 100%; }
    .lookup-card { padding: 22px 16px !important; }
    .lookup-form > .lookup-field { min-width: 0 !important; flex-basis: 100% !important; }
    .lookup-form > button { width: 100%; }
    input:not([type="checkbox"]):not([type="radio"]), select, textarea { font-size: 16px !important; max-width: 100%; }
    .form-control { min-width: 0; }
    .product-seo-article { overflow-wrap: anywhere; }
    .detail-tabs { -webkit-overflow-scrolling: touch; padding-bottom: 8px; }
    .detail-tabs .tab-btn { min-height: 44px; white-space: nowrap; }
    .tab-pane > div { padding: 22px 14px !important; }
    .detail-quantity button, .detail-quantity input { min-width: 44px; min-height: 44px; }
    .specs-table { table-layout: fixed; }
    .specs-table td { width: auto !important; overflow-wrap: anywhere; vertical-align: top; }
    .specs-table td:first-child { width: 42% !important; padding-right: 12px !important; }
    #tafinex-toast-container { left: 16px; right: 16px !important; bottom: max(16px, env(safe-area-inset-bottom, 0px)) !important; }
    #tafinex-toast-container .tafinex-toast { width: 100%; max-width: 100% !important; overflow-wrap: anywhere; }
    .social-proof-toast { max-width: calc(100vw - 32px); bottom: max(16px, env(safe-area-inset-bottom, 0px)); }
    body:has(.mobile-drawer.open) .social-proof-toast { visibility: hidden; }
    .footer-grid > * { overflow-wrap: anywhere; }
}
@media (max-width: 480px) {
    .topbar-links { column-gap: 8px; }
    .hero-title { font-size: clamp(1.65rem, 7vw, 2rem); }
    .hero-badge { font-size: .72rem; }
    .gallery-main { padding: 18px; }
    .plan-option { flex-wrap: wrap; gap: 8px; }
    .flagship-title { font-size: 1.8rem; }
    .footer .brand-logo img { max-width: 100%; height: auto !important; }
}
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    .mobile-drawer, .mobile-drawer-overlay, .floating-badge, .tafinex-toast { transition: none !important; animation: none !important; }
}
.container-product .vformat-table-wrap { max-width: 100%; overflow-x: auto !important; overscroll-behavior-inline: contain; }

.responsive-columns > * { min-width: 0; }
@media (max-width: 992px) {
    .responsive-columns { grid-template-columns: minmax(0, 1fr) !important; gap: 24px !important; }
}
@media (max-width: 600px) {
    .responsive-card { padding: 24px 16px !important; }
}
.article-body { overflow-wrap: anywhere; }
.article-meta { flex-wrap: wrap; }
@media (max-width: 768px) {
    .solution-callout-box { padding: 22px 16px !important; }
    .solution-callout-box > div { min-width: 0 !important; max-width: 100%; }
    .solution-callout-box > div:last-child { flex-wrap: wrap; width: 100%; }
    .solution-callout-box > div:last-child > div { text-align: left !important; }
    .article-heading { font-size: clamp(1.65rem, 5vw, 2.2rem) !important; }
    .article-body table { display: block; max-width: 100%; overflow-x: auto; }
}
