/*
 * KTech Theme - Responsive overrides
 * Component files already carry their own breakpoints where the
 * behavior is component-specific (mobile nav offcanvas, hero nav
 * arrows, etc.) - this file covers cross-cutting breakpoint tuning.
 */

/* Hard guarantee against horizontal scroll from any full-bleed section */
html, body { max-width: 100%; overflow-x: hidden; }
.kt-strip-wrap, .kt-hero, .kt-search-overlay { max-width: 100vw; }

@media (max-width: 1199.98px) {
    .kt-masonry { columns: 3 200px; }
}

@media (max-width: 991.98px) {
    :root { --kt-header-h: 72px; --kt-header-h-sm: 60px; }
    .kt-masonry { columns: 2 200px; }
    .kt-hero-swiper { height: min(78vh, 640px); }
    .kt-megamenu { position: static; }
}

@media (max-width: 767.98px) {
    .kt-section { padding: clamp(2.25rem, 8vw, 3.5rem) 0; }
    .kt-hero-swiper { height: min(72vh, 560px); min-height: 420px; }
    .kt-hero-actions .kt-btn { width: 100%; }
    .kt-float-stack { left: 0.85rem; bottom: 0.85rem; }
    .kt-float-btn { width: 52px; height: 52px; font-size: 1.2rem; }
    .kt-back-to-top { right: 0.85rem; bottom: 0.85rem; width: 44px; height: 44px; }
    .kt-float-panel { width: min(300px, 84vw); }
    .kt-topbar-contact a span.kt-hide-xs { display: none; }
    .kt-strip-item { width: 120px; height: 64px; }
}

@media (max-width: 575.98px) {
    .kt-masonry { columns: 1; }
    .kt-newsletter form { flex-direction: column; align-items: stretch; }
    .kt-newsletter form .kt-btn { width: 100%; }
    .kt-hero-float-card { padding: 0.8rem 1rem; }
    .kt-topbar-right { gap: 0.5rem; }
}

/* Container query on product card body, so the price/title stack adapts
   even inside a narrow sidebar-adjacent grid column, independent of the
   viewport breakpoint. */
@supports (container-type: inline-size) {
    .kt-prd-card { container-type: inline-size; }
    @container (max-width: 180px) {
        .kt-prd-body { padding: 0.8rem 0.85rem 1rem; }
        .kt-prd-body h3 { font-size: 0.9rem; }
    }
}

/* Print: strip decorative chrome */
@media print {
    .kt-header, .kt-footer, .kt-float-stack, .kt-back-to-top, .kt-scroll-progress, .kt-loader, .kt-search-overlay {
        display: none !important;
    }
}