/* responsive patch */
html, body {
    max-width: 100%;
    overflow-x: hidden;
}
.tech-logo-thumbnail {
    height: 75px !important;
}
.cover-logo {
    width: 125px !important;
}
.brand-logo-left {
    max-width: 200px !important;
}
img {
    max-width: 100%;
    height: auto;
}
.page-a4-horizontal,
.page-a4-horizontal-cover {
    width: min(100%, 297mm);
    max-width: 297mm;
}
.tabs-container,
.sub-navigation-menu,
.sub-navigation-menu-cover {
    scrollbar-width: none;
}
@media screen and (min-width: 769px) and (max-width: 1024px)  {
    .cover-title-box {
        margin-top: 80px !important;
    }
}
@media screen and (max-width: 1024px) {
    body {
        padding: 12px !important;
        gap: 12px !important;
    }
    .page-a4-horizontal,
    .page-a4-horizontal-cover {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        padding: 24px 18px !important;
        overflow: visible !important;
    }
    .header-section,
    .main-content,
    .footer-brand-section,
    .cover-main-content,
    .tech-logos-row-footer {
        width: 100% !important;
        max-width: 100% !important;
    }
    .main-content {
        gap: 24px !important;
    }
    .image-container-slider,
    .info-container,
    .table-details-wrapper,
    .header-text,
    .cover-title-box {
        width: 100% !important;
        max-width: 100% !important;
    }
    .slider-wrapper {
        height: min(60vw, 420px) !important;
        min-height: 260px !important;
    }
    .product-image,
    .slide img,
    .section-shield-img,
    .cover-logo,
    .header-logo,
    .brand-logo-left,
    .tech-logo-thumbnail,
    .cert-logo {
        max-width: 100% !important;
        height: auto !important;
        object-fit: contain !important;
    }
    .section-shield-img {
        max-width: 150px !important;
        height: auto !important;
        object-fit: contain !important;
    }
    .tech-logo-thumbnail,
    .cert-logo {
        max-width: 200px !important;
        height: auto !important;
        object-fit: contain !important;
    }
    .specs-table,
    .specs-table tbody,
    .specs-table tr,
    .specs-table td {
        width: 100%;
    }
    .specs-table {
        table-layout: fixed;
        word-break: break-word;
    }
}
@media screen and (max-width: 768px) {
    body {
        padding: 10px !important;
    }
    .tabs-container,
    .sub-navigation-menu,
    .sub-navigation-menu-cover {
        width: 100% !important;
        max-width: 100% !important;
        padding-left: 0 !important;
    }
    .tab-item,
    .sub-nav-item {
        font-size: 0.65rem !important;
    }
    .tab-item {
        padding: 8px 12px !important;
    }
    .page-a4-horizontal,
    .page-a4-horizontal-cover {
        padding: 18px 14px !important;
        border-radius: 0 !important;
    }
    .header-section,
    .main-content,
    .footer-brand-section,
    .certifications-right {
        flex-direction: column !important;
        align-items: stretch !important;
    }
    .tech-logos-row-footer {
        flex-direction: column !important;
        align-items: center !important;
    }
    .header-section {
        gap: 10px !important;
    }
    .header-logo,
    .brand-logo-left {
        align-self: flex-start !important;
        max-height: 48px !important;
        width: auto !important;
    }
    .main-content {
        overflow: visible !important;
    }
    .image-container-slider,
    .info-container,
    .table-details-wrapper,
    .slider-wrapper,
    .description,
    .footer-brand-section,
    .cover-title-box {
        width: 100% !important;
        max-width: 100% !important;
    }
    .slider-wrapper {
        height: min(72vw, 360px) !important;
        min-height: 220px !important;
    }
    .slider-btn,
    .lightbox-arrow {
        width: 40px !important;
        height: 40px !important;
    }
    .lightbox-arrow.prev {
        left: 12px !important;
    }
    .lightbox-arrow.next {
        right: 12px !important;
    }
    .specs-table tr {
        display: grid !important;
        grid-template-columns: 1fr !important;
    }
    .label,
    .value {
        display: block !important;
        width: 100% !important;
    }
    .label {
        padding-bottom: 4px !important;
    }
    .value {
        padding-top: 0 !important;
    }
    .cover-title-box {
        padding: 18px 16px !important;
    }
    .cover-title-box h1,
    .header-text h1 {
        font-size: clamp(1.5rem, 5vw, 2rem) !important;
        line-height: 1.15 !important;
        word-break: break-word;
    }
    .header-text h1 span,
    .cover-title-box p,
    .subtitle {
        font-size: clamp(0.85rem, 2.8vw, 1rem) !important;
        letter-spacing: 1px !important;
    }
    .section-shield-wrapper {
        height: auto !important;
    }
    .tech-logos-row-footer,
    .footer-brand-section {
        gap: 12px !important;
    }
    .certifications-right {
        justify-content: flex-start !important;
        flex-wrap: wrap !important;
        gap: 12px !important;
    }
}


/* missing assets patch */
img.asset-missing,
.asset-missing img {
    display: none !important;
}
.asset-missing-slide {
    display: none !important;
}
.has-missing-only {
    min-height: 0 !important;
    height: auto !important;
}
.has-missing-only .slider-arrow,
.has-missing-only .prev,
.has-missing-only .next,
.has-missing-only .lightbox-arrow {
    display: none !important;
}


    /* accessibility patch */
    .slider-btn:focus-visible,
    .lightbox-arrow:focus-visible,
    .tab-item:focus-visible,
    .sub-nav-item:focus-visible,
    #lightbox-close:focus-visible,
    img.open-lightbox:focus-visible {
        outline: 3px solid #f4c126;
        outline-offset: 3px;
    }

    #lightbox-close[role="button"] {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 44px;
        min-height: 44px;
        line-height: 1;
    }

    img.open-lightbox[role="button"] {
        cursor: zoom-in;
    }

.brand-logo-left {
    height: 75px !important;
    width: auto !important;
    max-height: 75px !important;
}
