/* Shared responsive corrections. Keep after the design stylesheet. */
html { -webkit-text-size-adjust: 100%; scrollbar-gutter: stable; }
body { overflow-wrap: break-word; }
main, main > *, .nav-wrap > *, .footer-grid > *,
.product-main > *, .contact-grid > *, .form-grid > *, .buyer-fields > *,
.career-apply-layout > *, .stats-strip-inner > * { min-width: 0; }
input, select, textarea { min-width: 0; max-width: 100%; }
iframe, video { max-width: 100%; }
.breadcrumb { flex-wrap: wrap; }
.breadcrumb strong, .eyebrow, .product-meta span,
.footer-contact-item span, .contact-detail-list a { overflow-wrap: anywhere; }
.eyebrow { max-width: 100%; white-space: normal; }
.eyebrow::before { flex-shrink: 0; }
/* Consistent breathing room between section labels and their headings. */
body .eyebrow:has(+ :is(h1, h2, h3)) { margin-bottom: 0 !important; }
body .eyebrow + :is(h1, h2, h3) { margin-top: 14px !important; }
.spec-table { overflow-wrap: anywhere; }
.btn, .nav-cta { white-space: normal; text-align: center; }
.top-strip-group { flex-wrap: wrap; }
.modal-panel { max-height: calc(100dvh - 32px) !important; overscroll-behavior: contain; }
.vijen-chatbot-messages { min-height: 0; }
.vijen-chatbot-input-row input { min-width: 0; }
.vijen-chat-msg { overflow-wrap: anywhere; }

/* Contact page: company details beside a clearly grouped enquiry form. */
.contact-grid.contact-grid-polished {
    grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr) !important;
    gap: 28px; align-items: start;
}
.contact-grid-polished .contact-form-card { padding: 20px; }
.contact-form-card h2 { margin: 0 0 6px; font-size: 24px; }
.contact-form-intro { margin: 0 0 14px; font-size: 13px; }
.contact-field-label { display: block; color: var(--ink); font-size: 13px; font-weight: 700; }
.contact-form-card .buyer-tab-row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 8px 0; }
.contact-form-card .buyer-tab {
    display: flex; align-items: center; justify-content: center; gap: 6px;
    min-width: 0; min-height: 38px; padding: 6px 8px; border-radius: 8px;
}
.contact-form-card .buyer-tab strong { display: none; }
.contact-form-card .buyer-tab span { font-size: 13px; }
.contact-form-card .buyer-tab-note { margin: 6px 0 12px; font-size: 12px; }
.contact-enquiry-form { display: grid; gap: 12px; }
.contact-required-note { margin: 0; font-size: 12px; }
.contact-fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }
.contact-fieldset legend { width: 100%; padding: 0 0 6px; margin-bottom: 8px; border-bottom: 1px solid var(--line); font-weight: 800; font-size: 14px; }
.contact-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 12px; }
.contact-fields label, .contact-business-details label { display: block; min-width: 0; font-size: 13px; font-weight: 700; color: var(--ink); }
.contact-fields label > span { color: #a13b17; }
.contact-fields label > small { font-weight: 400; color: var(--muted); }
.contact-enquiry-form input, .contact-enquiry-form select, .contact-enquiry-form textarea { display: block; margin-top: 4px; padding: 7px 10px; min-height: 38px !important; font-size: 14px; line-height: 1.4; font-weight: 400; background-color: #fff; }
.contact-enquiry-form select, .enquiry-modal .modal-panel select { padding-right: 42px; }
.contact-enquiry-form input, .contact-enquiry-form select { height: 38px; }
.contact-enquiry-form :is(input, select, textarea):focus-visible { outline: 2px solid var(--green); outline-offset: 2px; }
.contact-field-wide { grid-column: 1 / -1; }
.contact-enquiry-form textarea { min-height: 68px !important; }
.contact-business-details { border: 1px solid var(--line); border-radius: 8px; padding: 10px 12px; }
.contact-business-details summary { cursor: pointer; color: var(--green); font-size: 13px; font-weight: 700; }
.contact-business-details summary small { color: var(--muted); font-weight: 400; }
.contact-business-details .buyer-fields { margin-top: 10px; }
.contact-enquiry-form > .btn { justify-self: start; min-height: 42px !important; padding: 8px 22px; font-size: 14px; }
#enquiry-form { scroll-margin-top: 110px; }
@media (max-width: 1050px) {
    .contact-grid.contact-grid-polished { grid-template-columns: minmax(0, 1fr) !important; }
}
@media (max-width: 600px) {
    .contact-fields { grid-template-columns: minmax(0, 1fr); }
    .contact-enquiry-form input, .contact-enquiry-form select, .contact-enquiry-form textarea { font-size: 16px; }
    .contact-form-card .buyer-tab span { font-size: 12px; }
    .contact-enquiry-form > .btn { width: 100%; }
}
/* Alerts must appear above the enquiry dialog and floating controls. */
.swal2-container { z-index: 11000 !important; }
.swal2-popup { font-family: inherit; }
.swal2-popup .swal2-confirm { min-height: 44px; }
/* Keep the page still and floating tools out of every blocking overlay. */
html:has(.enquiry-modal.is-open, .form-alert-modal.is-open, .image-lightbox.is-open, .form-submit-overlay.is-active, .swal2-container) {
    overflow: hidden !important;
}
body:has(.enquiry-modal.is-open, .form-alert-modal.is-open, .image-lightbox.is-open, .form-submit-overlay.is-active, .swal2-container) {
    overflow: hidden !important;
}
body:has(.enquiry-modal.is-open, .form-alert-modal.is-open, .image-lightbox.is-open, .form-submit-overlay.is-active, .swal2-container)
:is(.whatsapp-sidebar, .custom-lang-button, .custom-lang-panel, .custom-gtranslate-container, .vijen-chatbot, .scroll-top, .mobile-actions) {
    visibility: hidden !important;
    pointer-events: none !important;
}

/* Compact enquiry forms, with paired fields where the viewport allows it. */
.enquiry-modal .modal-panel {
    width: min(600px, 100%) !important;
    padding: 20px !important;
    overflow: auto !important;
}
.enquiry-modal .modal-panel > .eyebrow { margin-right: 40px; }
.enquiry-modal .modal-panel h2 { margin: 10px 36px 6px 0; font-size: 22px; line-height: 1.2; }
.enquiry-modal .modal-panel > p { margin: 0 0 14px; font-size: 13px; }
.enquiry-modal .modal-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 10px 12px !important; }
.enquiry-modal .modal-grid label { min-width: 0; gap: 4px; }
.enquiry-modal input, .enquiry-modal select {
    height: 42px; min-height: 42px; padding: 8px 10px;
}
.enquiry-modal textarea { min-height: 72px; padding: 8px 10px; }
.enquiry-modal .modal-actions { justify-content: flex-start; margin-top: 14px; }
@media (max-width: 520px) {
    .enquiry-modal { padding: 12px; }
    .enquiry-modal .modal-panel { padding: 16px !important; max-height: calc(100dvh - 24px) !important; }
    .enquiry-modal .modal-grid { grid-template-columns: minmax(0, 1fr) !important; }
    .enquiry-modal .modal-panel h2 { font-size: 20px; }
}

/* Switch navigation before the logo and desktop links collide on tablets. */
@media (max-width: 1100px) {
    .top-strip { display: none !important; }
    .nav-wrap { padding: 10px 18px; gap: 12px; }
    .brand { min-width: 0; }
    .brand img { flex-shrink: 0; }
    .brand > span { min-width: 0; }
    .nav-button {
        display: grid; gap: 5px; flex-shrink: 0; place-content: center;
        width: 44px; height: 44px; cursor: pointer;
    }
    .nav-button span { display: block; width: 26px; height: 3px; background: var(--green); }
    .nav-toggle {
        display: block; position: absolute; width: 1px; height: 1px;
        opacity: 0; pointer-events: none;
    }
    .nav-toggle:focus-visible + .nav-button { outline: 2px solid var(--green); outline-offset: 2px; }
    .nav-links {
        position: absolute; top: 100%; left: 0; right: 0; display: none;
        flex-direction: column; align-items: stretch; gap: 8px; padding: 16px 18px;
        background: #fff; border-bottom: 1px solid var(--line);
        max-height: calc(100dvh - 88px); overflow-y: auto; overscroll-behavior: contain;
    }
    .nav-toggle:checked ~ .nav-links { display: flex; }
    .nav-links > a, .dropdown > a { min-height: 44px; }
    .dropdown::after { display: none; }
    .dropdown-menu {
        position: static; display: grid; width: 100%; max-width: 100%;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        max-height: 260px; overflow-y: auto; margin-top: 8px; box-shadow: none;
    }
    .dropdown-menu a { overflow-wrap: anywhere; }
}

@media (max-width: 980px) {
    .split, .product-hero, .detail-grid, .contact-grid,
    .career-apply-layout, .packaging-showcase, .product-gallery-grid {
        grid-template-columns: minmax(0, 1fr) !important;
    }
    .career-apply-form { position: static; }
    .stats-strip-inner { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
    body { padding-bottom: calc(52px + env(safe-area-inset-bottom, 0px)); }
    .brand { gap: 8px; }
    .brand strong { font-size: clamp(15px, 4.2vw, 20px); }
    .brand small { font-size: clamp(9px, 2.4vw, 12px); white-space: normal; }
    .section, .page-hero, .product-detail-hero, .breadcrumb, .site-footer {
        padding-left: 18px !important; padding-right: 18px !important;
    }
    .product-detail-hero, .product-layout, .product-evidence-panel,
    .product-evidence-visuals, .product-original-visuals,
    .feature-grid, .markets, .blog-grid, .team-process, .team-metrics {
        grid-template-columns: minmax(0, 1fr) !important;
    }
    .product-sidebar { position: static !important; }
    .product-hero-copy h1 { font-size: clamp(28px, 7.5vw, 36px) !important; overflow-wrap: anywhere; }
    .product-hero-copy p { font-size: 15px !important; }
    .product-hero-copy, .product-visual { max-width: 100% !important; }
    .hero-actions { gap: 10px; }
    .hero-actions .btn { min-height: 44px !important; }
    .cta-band { width: calc(100% - 36px); margin-left: auto; margin-right: auto; padding: 24px; }
    .content-panel, .product-overview-panel, .contact-card, .form-card { padding: 20px; }
    .mobile-actions { min-height: 52px; padding-bottom: env(safe-area-inset-bottom, 0px); }
    .mobile-actions a, .mobile-actions button { display: grid; place-items: center; min-height: 52px; }
    .mobile-actions button {
        padding: 12px 8px; border: 0; border-right: 1px solid rgba(255,255,255,.16);
        border-radius: 0; background: transparent; color: var(--white);
        font: inherit; font-weight: 800; text-align: center; cursor: pointer;
    }
    .vijen-chatbot { right: 14px; bottom: calc(68px + env(safe-area-inset-bottom, 0px)); z-index: 900; }
    .vijen-chatbot-toggle { width: 50px; height: 50px; }
    .vijen-chatbot-panel {
        position: fixed; left: 12px; right: 12px;
        bottom: calc(128px + env(safe-area-inset-bottom, 0px));
        width: auto; max-width: 360px; margin-left: auto;
        height: min(520px, calc(100dvh - 148px - env(safe-area-inset-bottom, 0px)));
        max-height: calc(100dvh - 148px - env(safe-area-inset-bottom, 0px));
    }
    input, select, textarea, .modal-panel input, .modal-panel select,
    .vijen-chatbot-input-row input { font-size: 16px; }
}

@media (max-width: 520px) {
    .dropdown-menu { grid-template-columns: minmax(0, 1fr); }
    .catalog-product-card { grid-template-columns: minmax(0, 1fr) !important; }
    .catalog-product-card .approved-label-media { min-height: 200px; }
    .catalog-product-card .approved-label-media img { height: 220px !important; }
    .form-row, .modal-grid, .form-card .form-grid, .form-card .buyer-fields {
        grid-template-columns: minmax(0, 1fr) !important;
    }
    .product-detail-hero .hero-actions { grid-template-columns: minmax(0, 1fr); }
    .stats-strip-inner { padding: 28px 18px; gap: 20px 12px; }
    .stat-item { flex-direction: column; align-items: flex-start; gap: 10px; }
    .stat-item-icon { width: 48px; height: 48px; }
    .stat-item strong { font-size: 28px; }
    .product-detail-hero .product-visual::before { right: 16px; top: 16px; font-size: 10px; }
    .product-origin-badge { left: 16px; font-size: 10px; }
}

/* Keep reading widths and grid density comfortable on wide monitors. */
@media (min-width: 1440px) {
    .section, .page-hero, .product-detail-hero, .breadcrumb, .nav-wrap, .top-strip, .site-footer {
        padding-left: max(32px, calc((100% - 1280px) / 2)) !important;
        padding-right: max(32px, calc((100% - 1280px) / 2)) !important;
    }
}