/* Shared usability corrections. Keep page layouts in their own modules. */
html{scrollbar-gutter:stable;scroll-behavior:auto;scroll-padding-top:calc(var(--ki-header-height,92px) + 18px)}
.ki-site main [id]{scroll-margin-top:16px}
.ki-site :is(a,button,summary,input,select,textarea,[tabindex]):focus-visible{outline:3px solid #237c85;outline-offset:3px;box-shadow:0 0 0 2px #fff}
.ki-site .product-picture:focus-visible{outline-offset:-5px;box-shadow:none}
.ki-site .skip-link:focus{outline-offset:3px;box-shadow:0 4px 18px #153e5233}
.ki-site button:disabled{cursor:not-allowed}
.ki-site form[aria-busy=true] button[type=submit]{cursor:wait}
.ki-site :is(.form-grid,.enquiry-layout,.catalogue-layout,.dialog-grid)>*{min-width:0}
.ki-site :is(input,select,textarea){max-width:100%;min-width:0}
.ki-site textarea{line-height:1.6}
.ki-site :is(.form-grid label,.enquiry-line-head>div){overflow-wrap:anywhere}

/* Catalogue cards share a reliable baseline, including long translated names. */
.ki-site .product-card{display:flex;flex-direction:column}
.ki-site .product-copy{display:flex;flex:1;flex-direction:column}
.ki-site .product-copy .card-bottom{margin-top:auto}
.ki-site .product-copy h3{overflow-wrap:anywhere}
.ki-site .product-copy .eyebrow{font-size:11px;line-height:1.5;letter-spacing:.06em}
.ki-site .card-bottom small{font-size:11px}
.ki-site .add-product{min-height:44px;font-size:13px;line-height:1.5;text-align:left}
.ki-site .category-filter{min-height:44px;font-size:13px}
.ki-site .catalogue-toolbar{font-size:12px;line-height:1.5}
.ki-site .search-field:focus-within{outline:3px solid #237c85;outline-offset:3px}
.ki-site .search-field input:focus-visible{outline:none;box-shadow:none}
.ki-site :is(.remove-line,.cb-remove){display:grid;place-items:center;min-width:44px;min-height:44px;padding:6px;flex:0 0 44px}
.ki-site :is(.form-note,.dialog-copy .form-note){font-size:12px;line-height:1.7}
.ki-site :is(.enquiry-form,.dialog-copy) label{font-size:13px;line-height:1.5}
.ki-site :is(.enquiry-form,.dialog-copy) .check{font-size:13px;line-height:1.65}
.ki-site .check{min-height:28px;cursor:pointer}
.ki-site .check input{width:19px;height:19px;flex-basis:19px;margin-top:2px}
.ki-site :is(.enquiry-form,.dialog-copy,.br-strategy-form) [aria-invalid=true]{border-color:#a73432;box-shadow:0 0 0 1px #a73432}
.ki-field-error{display:block;margin:-10px 0 16px;color:#922c2a;font-size:12px;line-height:1.5;font-weight:400}
.ki-site .br-strategy-form .ki-field-error{margin-top:5px;margin-bottom:0}
.ki-site :is(#strategy-status,#enquiry-status){overflow-wrap:anywhere}

/* The close control stays reachable while a long product form scrolls. */
.ki-site #product-dialog{max-height:calc(100dvh - 32px);overflow:visible;border:1px solid #c2d3d5}
.ki-site #product-dialog-content{max-height:calc(100dvh - 34px);overflow-y:auto;overscroll-behavior:contain;border-radius:8px;scrollbar-gutter:stable}
.ki-site #product-dialog .dialog-close{width:44px;height:44px;right:10px;top:10px;display:grid;place-items:center;line-height:1;border:1px solid #cbd9da;color:#153e52;box-shadow:0 3px 12px #153e5214}
.ki-site #product-dialog .dialog-copy{padding-top:64px}
.ki-site #product-dialog .dialog-visual{min-width:0}
.ki-site #product-dialog .dialog-visual a{line-height:1.6}
body.ki-product-dialog-open{overflow:hidden}

/* Header controls have room to wrap translated dropdown labels. */
.ki-site .st-header :is(.nx-dropdown,.nx-mobile-panel) a{overflow-wrap:anywhere}
.ki-site .st-header .language-menu summary{min-height:44px;font-size:12px;display:flex;align-items:center;justify-content:center}
.ki-site .st-header :is(.nx-mobile-menu>summary,.nx-enquiry-button,.st-header-search>summary){min-height:44px}
.ki-site .st-header .nx-mobile-menu>summary{min-width:44px;justify-content:center}
.ki-site .st-header .language-menu>div a{min-height:44px;display:flex;align-items:center}
.ki-site .st-header .nx-mobile-panel nav>a:not(.button){min-height:44px}
.ki-site .st-header .nx-mobile-panel{max-height:calc(100dvh - var(--ki-header-height,92px) - 12px)}
.ki-site :is(.ii-filters button,.dna-tabs button,.pls-text-button,.dna-download){min-height:44px}
.ki-site :is(.ii-note,.stx-note,.cb-disclaimer,.cb-packing-note){font-size:12px!important;line-height:1.75!important}
.ki-site :is(.ii-compare-output,.ii-result,.stx-result,.cb-status){overflow-wrap:anywhere}
.ki-site .mp-standard-grid>*{min-width:0}
.ki-site .mp-standard h2{overflow-wrap:anywhere}

@media(max-width:760px){
 .ki-site :is(input:not([type=checkbox]):not([type=radio]):not([type=color]),select,textarea){font-size:16px}
 .ki-site .st-header .nx-mobile-panel nav{align-items:stretch}
 .ki-site .st-header .nx-mobile-panel nav>a:not(.button){display:flex;align-items:center;line-height:1.5}
 .ki-site #product-dialog{width:calc(100% - 24px);max-height:calc(100dvh - 24px)}
 .ki-site #product-dialog-content{max-height:calc(100dvh - 26px)}
 .ki-site #product-dialog .dialog-visual{padding:24px 22px 18px}
 .ki-site #product-dialog .dialog-visual>img{height:150px;object-fit:contain}
 .ki-site #product-dialog .dialog-visual>a:first-child{padding-right:44px;margin-top:0}
 .ki-site #product-dialog .dialog-copy{padding:26px 22px}
 .ki-site #product-dialog .dialog-copy>p{font-size:14px}
 .ki-site .catalogue-sidebar{scroll-padding-inline:4px;padding-top:4px}
 .ki-site .catalogue-sidebar:focus-within{overflow-y:visible}
 .ki-site .catalogue-toolbar{align-items:flex-start;gap:12px}
 .ki-site .catalogue-toolbar span{max-width:55%}
 .ki-site .br-whatsapp{min-height:44px}
}
@media(max-width:440px){
 .ki-site :is(.enquiry-form,.dialog-copy) .form-grid{grid-template-columns:1fr}
 .ki-site .enquiry-line .form-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
 .ki-site .enquiry-line-head{gap:10px}
 .ki-site .enquiry-line-head img{width:56px;height:54px}
 .ki-site .enquiry-line-head h3{font-size:16px}
 .ki-site .catalogue-main .product-grid{gap:10px}
 .ki-site .product-copy{padding:14px 10px}
 .ki-site .product-copy h3{font-size:15px;line-height:1.5;min-height:0}
 .ki-site .product-copy .eyebrow{font-size:10px;letter-spacing:.025em}
 .ki-site .add-product{font-size:12px}
 .ki-site .cb-line-fields{grid-template-columns:repeat(2,minmax(0,1fr))}
 .ki-site .br-whatsapp{right:12px;bottom:12px}
}
.ki-site main :is(h1,h2,h3){overflow-wrap:anywhere;hyphens:auto}
@media(max-width:380px){
 .ki-site .st-header .nx-masthead{width:calc(100% - 24px);gap:4px}
 .ki-site .st-header .id-original-logo{width:140px;flex-basis:140px;height:76px}
 .ki-site .st-header .id-original-logo img{width:182px!important;left:-23px!important;top:-23px!important}
 .ki-site .st-header .nx-header-actions{gap:4px}
 .ki-site .st-header .language-menu summary{min-width:34px;font-size:11px;gap:3px}
 .ki-site .st-header .nx-enquiry-button{min-width:50px;padding:5px;gap:3px;justify-content:center}
 .ki-site .st-header .nx-enquiry-button::before{content:'';display:block;flex:0 0 13px;width:13px;height:16px;border:1px solid currentColor;border-radius:1px;background:linear-gradient(currentColor,currentColor) center 5px/7px 1px no-repeat,linear-gradient(currentColor,currentColor) center 9px/7px 1px no-repeat}
 .ki-site .st-header .nx-mobile-menu>summary{padding:8px}
 .ki-site .st-header .nx-mobile-panel{left:-12px;right:-12px}
 .ki-site .st-header .nx-mobile-panel nav{grid-template-columns:1fr;gap:0}
 .ki-site .st-header .nx-mobile-panel nav>a:not(.button){padding-block:11px}
 .ki-site .cb-presets{grid-template-columns:1fr}
 .ki-site .cb-presets button{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
 .ki-site .cb-presets button>span{margin:0}
 .ki-site .cb-presets small{margin:0}
}
@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}
 .ki-site *, .ki-site *::before, .ki-site *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}
@media(forced-colors:active){
 .ki-site :is(a,button,summary,input,select,textarea,[tabindex]):focus-visible{outline:3px solid Highlight;box-shadow:none}
 .ki-site :is(input,select,textarea,button,.button,.category-filter){border:1px solid ButtonText}
}
