/* ============================================================
   VIKON — Hlavná stránka: Oprava horizontálneho scrollu
   Desktop breakpoints:
     ≥ 1440px  → plný desktop (pôvodný dizajn, padding 128px)
     1280–1439px → stredný desktop (padding 48px)
     768–1279px  → malý desktop / tablet (padding 16px)
   Mobil (< 768px) ostáva nezmenený.
   ============================================================ */

/* ── Globálna poistka ── */
html, body {
    overflow-x: hidden !important;
    max-width: 100vw !important;
}

@media (min-width: 769px) {
    .wide-carousel,
    .banners-row,
    .row.banners-row,
    #content-wrapper.container.content-wrapper {
        max-width: 100vw !important;
        overflow-x: hidden !important;
    }
    .custom-hero-banners,
    .homepage-products-3,
    .homepage-products-6 {
        max-width: 100vw !important;
        box-sizing: border-box !important;
    }
    .custom-subcat-body,
    .custom-blog-grid,
    .custom-partners-grid {
        max-width: 100% !important;
    }
}

/* ============================================================
   STREDNÝ DESKTOP: 1280px – 1439px
   ============================================================ */
@media (min-width: 1280px) and (max-width: 1439px) {

    /* Bannery */
    .next-to-carousel-banners {
        padding-left: 24px !important;
        padding-right: 24px !important;
        gap: 12px !important;
    }

    /* Produktové slidy */
    .homepage-products-3,
    .homepage-products-6 {
        padding: 0 32px !important;
    }

    /* Hero bannery */
    .custom-hero-banners {
        padding: 0 32px !important;
        margin: 24px 0 !important;
    }

    /* Hlavné kategórie */
    .custom-footer__categories.extended {
        padding: 48px 32px !important;
    }

    /* Vedľajšie kategórie — sekcie */
    .custom-subcat-section {
        margin: 40px 32px !important;
    }

    .custom-subcat-body {
        height: auto !important;
        overflow-x: visible !important;
    }

    .custom-subcat-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        grid-template-rows: repeat(2, auto) !important;
        flex: 1 !important;
        width: 0 !important;
        min-width: 0 !important;
    }

    .custom-subcat-item {
        width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 160px !important;
        padding: 12px 16px 20px !important;
    }

    .custom-subcat-img {
        width: 110px !important;
        max-width: 110px !important;
        height: 110px !important;
        max-height: 110px !important;
    }

    .custom-subcat-banner {
        flex: 0 0 320px !important;
        width: 320px !important;
        height: auto !important;
        min-height: 300px !important;
    }

    /* Overené značky */
    .custom-partners-section {
        padding: 64px 32px !important;
    }

    /* Blog */
    .custom-blog-section {
        padding: 48px 32px !important;
    }

    /* FAQ */
    .custom-faq-section {
        padding: 64px 32px !important;
    }

    /* Newsletter */
    .vikon-newsletter-section {
        padding: 40px 48px !important;
        gap: 48px !important;
    }

    /* Footer */
    #footer {
        padding: 40px 48px !important;
    }
}

/* ============================================================
   MALÝ DESKTOP: 768px – 1279px
   ============================================================ */
@media (min-width: 768px) and (max-width: 1279px) {

    /* Bannery carousel */
    .next-to-carousel-banners {
        padding-left: 16px !important;
        padding-right: 16px !important;
        gap: 10px !important;
    }

    .banner-wrapper[data-testid="bannerTop"],
    .banner-wrapper[data-testid="bannerTop"] a {
        width: 300px !important;
        height: auto !important;
        min-height: 380px !important;
    }

    /* Produktové slidy */
    .homepage-products-3,
    .homepage-products-6 {
        padding: 0 16px !important;
    }

    #content .products-block.homepage-products-3 .product,
    #content .products-block.homepage-products-6 .product {
        min-width: 160px !important;
        max-width: 240px !important;
    }

    /* Hero bannery */
    .custom-hero-banners {
        padding: 0 16px !important;
        margin: 20px 0 !important;
        gap: 8px !important;
    }

    .custom-hero-banner {
        height: 240px !important;
    }

    .custom-hero-banner__title {
        font-size: 20px !important;
        line-height: 28px !important;
    }

    .custom-hero-banner__content {
        padding: 20px !important;
        max-width: 70% !important;
    }

    /* Hlavné kategórie */
    .custom-footer__categories.extended {
        padding: 40px 16px !important;
    }

    .custom-main-category-item {
        min-width: 220px !important;
        height: 110px !important;
        padding: 16px !important;
        gap: 14px !important;
    }

    .custom-main-category-img {
        width: 64px !important;
        height: 64px !important;
    }

    .custom-main-category-title {
        font-size: 17px !important;
        line-height: 26px !important;
    }

    /* Vedľajšie kategórie */
    .custom-subcat-section {
        margin: 32px 16px !important;
    }

    .custom-subcat-header-title {
        font-size: 24px !important;
        line-height: 32px !important;
    }

    .custom-subcat-body {
        height: auto !important;
        overflow-x: visible !important;
        gap: 12px !important;
    }

    /* Banner skrytý — ušetrí priestor */
    .custom-subcat-banner {
        display: none !important;
    }

    /* Grid — 4 stĺpce, flex šírky */
    .custom-subcat-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        grid-template-rows: repeat(2, auto) !important;
        width: 100% !important;
        min-width: 0 !important;
    }

    .custom-subcat-item {
        width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 140px !important;
        padding: 10px 8px 14px !important;
    }

    .custom-subcat-img {
        width: 80px !important;
        max-width: 80px !important;
        height: 80px !important;
        max-height: 80px !important;
    }

    .custom-subcat-label {
        font-size: 13px !important;
        line-height: 17px !important;
    }

    /* Overené značky */
    .custom-partners-section {
        padding: 48px 16px !important;
        gap: 32px !important;
    }

    .custom-partners-title {
        font-size: 28px !important;
    }

    .custom-partners-item {
        min-width: 100px !important;
        height: 80px !important;
        padding: 16px 10px !important;
    }

    /* Blog */
    .custom-blog-section {
        padding: 40px 16px !important;
        gap: 32px !important;
    }

    .custom-blog-title {
        font-size: 28px !important;
    }

    .custom-blog-grid {
        flex-wrap: wrap !important;
        justify-content: flex-start !important;
    }

    .custom-blog-card {
        flex: 0 0 calc(50% - 8px) !important;
        width: calc(50% - 8px) !important;
        max-width: calc(50% - 8px) !important;
        height: auto !important;
        min-height: 420px !important;
    }

    /* FAQ */
    .custom-faq-section {
        padding: 48px 16px !important;
        gap: 32px !important;
        flex-direction: column !important;
    }

    .custom-faq-title {
        font-size: 26px !important;
        line-height: 34px !important;
    }

    .custom-faq-left {
        max-width: 100% !important;
    }

    /* Newsletter */
    .vikon-newsletter-section {
        padding: 32px 24px !important;
        gap: 32px !important;
    }

    .vikon-newsletter-image {
        min-width: 260px !important;
        max-width: 340px !important;
        height: 260px !important;
        min-height: 260px !important;
    }

    /* Footer */
    #footer {
        padding: 40px 24px !important;
    }

    .vikon-footer-content {
        gap: 20px !important;
    }

    .vikon-footer-left {
        min-width: 180px !important;
        max-width: 220px !important;
    }

    .vikon-footer-aside {
        min-width: 140px !important;
    }

    .vikon-footer-fourth {
        min-width: 180px !important;
    }
}