/* =========================================================================
   KLEEV ME — main stylesheet (matches the original kleevme.ae look)
   ========================================================================= */
:root {
    --kl-orange: #f9a02c;
    --kl-orange-btn: #f89c1c;
    --kl-orange-dark: #e08a14;
    --kl-dark: #23272b;
    --kl-topbar: #353535;
    --kl-footer: #363636;
    --kl-text: #333333;
    --kl-head: #000000;
    --kl-line: #ebebeb;
    --kl-soft: #f6f6f6;
    --kl-white: #ffffff;
    --kl-container: 1200px;
    --kl-gutter: 20px;
    --kl-font: "Montserrat", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
    --kl-font2: "Open Sans", "Montserrat", Arial, sans-serif;
    --kl-topbar-h: 46px;
    --kl-bar-h: 60px;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: calc(var(--kl-topbar-h) + var(--kl-bar-h) + 10px); }
body {
    margin: 0;
    font-family: var(--kl-font);
    font-size: 16px;
    line-height: 1.5;
    color: var(--kl-text);
    background: var(--kl-white);
    -webkit-font-smoothing: antialiased;
    overflow-x: hidden;
}
img, svg, video { max-width: 100%; height: auto; }
img { vertical-align: middle; }
a { color: var(--kl-orange); text-decoration: none; transition: color .2s; }
a:hover { color: var(--kl-dark); }
h1, h2, h3, h4, h5, h6 { color: var(--kl-head); font-family: var(--kl-font); font-weight: 400; line-height: 1.4; margin: 0 0 1.5rem; }
h1 { font-size: 38px; line-height: 1.2; }
h2 { font-size: 32px; line-height: 1.2; }
h3 { font-size: 18px; font-family: var(--kl-font2); letter-spacing: 2px; text-transform: capitalize; line-height: 1.3; }
h4 { font-size: 22px; }
h5 { font-size: 20px; }
h6 { font-size: 18px; }
p { margin: 0 0 1.5rem; }
ul, ol { margin: 0 0 1.5rem; padding-left: 2.5rem; }
li { margin-bottom: .3rem; }
strong, b { font-weight: 700; }
table { width: 100%; border-collapse: collapse; margin: 0 0 1.5rem; }
td, th { border: 1px solid var(--kl-line); padding: 8px 12px; text-align: left; vertical-align: top; }
th { background: var(--kl-soft); }
hr { border: 0; border-top: 1px solid var(--kl-line); margin: 2rem 0; }
iframe { max-width: 100%; border: 0; }
button, input, select, textarea { font: inherit; color: inherit; }
:focus-visible { outline: 2px solid var(--kl-orange); outline-offset: 2px; }
.aligncenter { display: block; margin-left: auto; margin-right: auto; }
.alignleft { float: left; margin: 0 1.5rem 1rem 0; }
.alignright { float: right; margin: 0 0 1rem 1.5rem; }

.screen-reader-text {
    position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.skip-link:focus {
    clip: auto; width: auto; height: auto; margin: 0; z-index: 1000; top: 8px; left: 8px;
    background: var(--kl-dark); color: #fff; padding: 10px 16px;
}
.kl-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; opacity: 0; }
.kl-container, .km-container { width: 100%; max-width: calc(var(--kl-container) + var(--kl-gutter) * 2); margin: 0 auto; padding: 0 var(--kl-gutter); }
.kl-container--narrow { max-width: calc(960px + var(--kl-gutter) * 2); }

/* ---------- Buttons ---------- */
.kl-btn, .km-btn {
    display: inline-block; background: var(--kl-dark); color: #fff; font-family: var(--kl-font); font-size: 15px; font-weight: 700;
    line-height: 1.2; text-transform: uppercase; padding: 14px 22px; border: 0; border-radius: 0; cursor: pointer; transition: background .25s, color .25s;
}
.kl-btn:hover, .km-btn:hover { background: var(--kl-orange); color: #fff; }
.kl-btn--dark { font-size: 13px; padding: 12px 20px; }

/* =========================================================================
   Header: dark products bar + white main bar (fixed)
   ========================================================================= */
.kl-header { position: fixed; top: 0; left: 0; right: 0; z-index: 100; }
body { padding-top: calc(var(--kl-topbar-h) + var(--kl-bar-h)); }
body.admin-bar .kl-header { top: 32px; }
.kl-topbar { background: var(--kl-topbar); height: var(--kl-topbar-h); }
.kl-topbar__inner { display: flex; align-items: center; justify-content: space-between; height: 100%; }
.kl-social { display: flex; align-items: center; gap: 4px; }
.kl-social a { color: #fff; width: 30px; height: 30px; display: inline-flex; align-items: center; justify-content: center; transition: color .2s; }
.kl-social a:hover { color: var(--kl-orange); }

/* Products menu (top bar) */
.kl-pmenu { list-style: none; margin: 0; padding: 0; display: flex; height: 100%; }
.kl-topbar__nav { height: 100%; }
.kl-pmenu__item { margin: 0; position: static; display: flex; align-items: center; }
.kl-pmenu__link {
    display: flex; align-items: center; gap: 6px; height: var(--kl-topbar-h); padding: 0 18px; color: #d9d9d9; font-size: 12px; font-weight: 700;
    text-transform: uppercase; letter-spacing: .2px; white-space: nowrap;
}
.kl-pmenu__item:hover > .kl-pmenu__link, .kl-pmenu__item:focus-within > .kl-pmenu__link, .kl-pmenu__item.is-current > .kl-pmenu__link { color: #fff; background: #222; }
.kl-pmenu .submenu-toggle { display: none; }

.kl-mega {
    position: absolute; left: 0; right: 0; top: var(--kl-topbar-h); background: #fff; box-shadow: 0 12px 30px rgba(0,0,0,.18);
    border-top: 3px solid var(--kl-orange); opacity: 0; visibility: hidden; transform: translateY(8px); transition: opacity .2s, transform .2s, visibility .2s; z-index: 5;
}
.kl-pmenu__item:hover > .kl-mega, .kl-pmenu__item:focus-within > .kl-mega { opacity: 1; visibility: visible; transform: none; }
.kl-mega__inner { display: grid; grid-template-columns: 220px 1fr; min-height: 230px; padding-top: 0; padding-bottom: 0; }
.kl-mega__tabs { list-style: none; margin: 0; padding: 14px 0; background: #f4f4f4; }
.kl-mega__tab { margin: 0; }
.kl-mega__tab-link {
    display: flex; align-items: center; justify-content: space-between; padding: 10px 18px; color: #333; font-size: 12px; font-weight: 700; text-transform: uppercase;
    border-left: 3px solid transparent;
}
.kl-mega__tab-link .kl-icon { transform: rotate(-90deg); opacity: .5; }
.kl-mega__tab.is-active .kl-mega__tab-link { background: #fff; color: var(--kl-orange); border-left-color: var(--kl-orange); }
.kl-mega__panels { padding: 20px 24px; }
.kl-mega__panel { display: none; list-style: none; margin: 0; padding: 0; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: 16px; }
.kl-mega__panel.is-active { display: grid; }
.kl-mega__card { margin: 0; }
.kl-mega__card-link { display: block; text-align: center; color: #333; font-size: 12.5px; line-height: 1.35; }
.kl-mega__card-link:hover { color: var(--kl-orange); }
.kl-mega__img { display: flex; align-items: center; justify-content: center; height: 110px; margin-bottom: 8px; background: #fff; }
.kl-mega__img img { max-height: 110px; width: auto; object-fit: contain; transition: transform .3s; }
.kl-mega__card-link:hover .kl-mega__img img { transform: scale(1.06); }

/* Main bar */
.kl-bar { background: #fff; position: relative; transition: box-shadow .2s; }
body.is-scrolled .kl-bar { box-shadow: 0 1px 0 rgba(0,0,0,.08), 0 3px 8px rgba(0,0,0,.06); }
.kl-bar__inner { display: flex; align-items: center; height: var(--kl-bar-h); gap: 20px; }
.kl-logo { display: inline-flex; align-items: center; flex: 0 0 auto; }
.kl-logo img { width: auto; height: 40px; }
.kl-nav { margin-left: auto; }
.kl-menu { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; }
.kl-menu li { margin: 0; position: relative; }
.kl-menu > li > a, .kl-menu > li > .menu-label {
    display: flex; align-items: center; height: var(--kl-bar-h); padding: 0 14px; color: #333; font-size: 15px; text-transform: capitalize; cursor: pointer; white-space: nowrap;
    position: relative;
}
.kl-menu > li > a::after, .kl-menu > li > .menu-label::after {
    content: ""; position: absolute; left: 14px; right: 14px; bottom: 0; height: 2px; background: var(--kl-orange); transform: scaleX(0); transition: transform .25s;
}
.kl-menu > li:hover > a::after, .kl-menu > li:hover > .menu-label::after, .kl-menu > li.is-current > a::after { transform: scaleX(1); }
.kl-menu > li:hover > a, .kl-menu > li:hover > .menu-label, .kl-menu > li.is-current > a, .kl-menu > li.is-current > .menu-label { color: var(--kl-orange); }
.kl-menu .sub-menu {
    list-style: none; margin: 0; padding: 0; position: absolute; top: 100%; left: 0; min-width: 220px; background: #fff;
    box-shadow: 0 6px 20px rgba(0,0,0,.12); opacity: 0; visibility: hidden; transform: translateY(6px); transition: opacity .2s, transform .2s, visibility .2s; z-index: 5;
}
.kl-menu .sub-menu .sub-menu { top: 0; left: 100%; }
.kl-menu li:hover > .sub-menu, .kl-menu li:focus-within > .sub-menu { opacity: 1; visibility: visible; transform: none; }
.kl-menu .sub-menu a, .kl-menu .sub-menu .menu-label { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 10px 20px; color: #333; font-size: 14px; cursor: pointer; }
.kl-menu .sub-menu a .kl-icon, .kl-menu .sub-menu .menu-label .kl-icon { transform: rotate(-90deg); }
.kl-menu .sub-menu li:hover > a, .kl-menu .sub-menu li:hover > .menu-label, .kl-menu .sub-menu li.is-current > a { background: var(--kl-soft); color: var(--kl-orange); }
.kl-menu .submenu-toggle, .kl-nav__close, .kl-burger, .kl-nav__products { display: none; }
.kl-search-toggle { background: none; border: 0; color: #333; cursor: pointer; padding: 8px; display: inline-flex; }
.kl-search-toggle:hover { color: var(--kl-orange); }
.kl-search { position: absolute; left: 0; right: 0; top: 100%; background: #fff; border-top: 1px solid var(--kl-line); box-shadow: 0 8px 18px rgba(0,0,0,.08); padding: 16px 0; }
.kl-search[hidden] { display: none; }
.search-form { display: flex; gap: 0; max-width: 700px; margin: 0 auto; }
.search-form label { flex: 1; }
.search-form .search-field { width: 100%; border: 1px solid #ddd; padding: 12px 14px; font-size: 15px; outline: none; }
.search-form .search-field:focus { border-color: var(--kl-orange); }
.search-form .search-submit { background: var(--kl-dark); color: #fff; border: 0; padding: 0 22px; font-weight: 700; text-transform: uppercase; font-size: 13px; cursor: pointer; }
.search-form .search-submit:hover { background: var(--kl-orange); }

/* =========================================================================
   Page parts
   ========================================================================= */
.kl-banner { position: relative; background: #e9e9e9; overflow: hidden; }
.kl-banner__media { display: block; width: 100%; height: auto; max-height: 500px; object-fit: cover; }

.kl-titlebar { background: var(--kl-soft); padding: 30px 0; }
.kl-titlebar__inner { display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap; }
.kl-titlebar__title { margin: 0; font-size: 20px; text-transform: uppercase; }
.kl-crumbs { font-size: 13px; color: #999; }
.kl-crumbs a { color: var(--kl-orange); }
.kl-crumbs .sep { margin: 0 8px; }

/* ---------- Page-builder style content (converted from the old site) ---------- */
.km-section { padding: 0; background-size: cover; background-position: center; position: relative; }
.km-section a:not([class]) { color: #000; }
.km-section a:not([class]):hover { color: var(--kl-orange); }
.km-height-small { padding: 2rem 0; }
.km-height-medium { padding: 4rem 0; }
.km-height-large { padding: 6rem 0; }
.km-height-auto { padding: 0; }
.km-height-auto + .km-height-auto { padding-top: 0; }
.km-color-alternate { background-color: var(--kl-soft); }
.km-color-primary { background-color: var(--kl-orange); color: #fff; }
.km-color-primary h1, .km-color-primary h2, .km-color-primary h3, .km-color-primary h4, .km-color-primary h5, .km-color-primary h6 { color: #fff; }
.km-section[style*="background-image"] { color: #fff; }
.km-section[style*="background-image"]::before { content: ""; position: absolute; inset: 0; background: rgba(0,0,0,.45); }
.km-section[style*="background-image"] > .km-container { position: relative; }
.km-section[style*="background-image"] h1, .km-section[style*="background-image"] h2, .km-section[style*="background-image"] h3,
.km-section[style*="background-image"] h4, .km-section[style*="background-image"] h5, .km-section[style*="background-image"] h6 { color: #fff; }
.km-section[style*="background-image"] h1 { text-transform: uppercase; font-size: 32px; }
.km-section[style*="background-image"] h6 { font-size: 15px; }
.km-width-full > .km-container { max-width: none; padding: 0; }

.km-row { display: flex; flex-wrap: wrap; margin: 0 -15px; }
.km-col { flex: 0 0 calc(var(--w, 60) / 60 * 100%); max-width: calc(var(--w, 60) / 60 * 100%); padding: 0 15px; min-width: 0; }
.km-col > *:last-child { margin-bottom: 0; }
.km-row + .km-row { margin-top: 1.5rem; }
.km-col img { height: auto; }
.km-space { height: 1.5rem; }
.km-hr { margin: 1.5rem 0; }
.km-btn-wrap { margin: 0 0 1.5rem; }
.km-scroll { text-align: center; margin: 1rem 0 0; }
.km-scroll__arrow { display: inline-block; width: 18px; height: 18px; border-right: 2px solid #fff; border-bottom: 2px solid #fff; transform: rotate(45deg); }
.km-iconbox { text-align: center; }
.km-iconbox img { max-height: 70px; width: auto; margin-bottom: 1rem; }
.km-iconbox h4 { font-size: 18px; margin-bottom: .6rem; }
.km-contacts { list-style: none; padding: 0; margin: 0 0 1.5rem; display: flex; flex-wrap: wrap; gap: 0 40px; }
.km-contacts li { position: relative; padding: 6px 0 6px 52px; min-height: 40px; margin-bottom: 14px; display: flex; align-items: center; font-size: 14px; line-height: 1.45; flex: 0 0 100%; }
.km-contacts li.km-contacts__phone, .km-contacts li.km-contacts__fax { flex: 0 0 auto; }
.km-contacts li::before {
    content: ""; position: absolute; left: 0; top: 50%; width: 36px; height: 36px; margin-top: -18px; border: 2px solid var(--kl-orange); border-radius: 50%;
    background-repeat: no-repeat; background-position: center; background-size: 16px 16px;
}
.km-contacts li.km-contacts__address::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23f9a02c'%3E%3Cpath d='M12 2a7 7 0 0 0-7 7c0 5.3 7 13 7 13s7-7.7 7-13a7 7 0 0 0-7-7zm0 9.5A2.5 2.5 0 1 1 12 6.5a2.5 2.5 0 0 1 0 5z'/%3E%3C/svg%3E"); }
.km-contacts li.km-contacts__phone::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23f9a02c'%3E%3Cpath d='M6.6 10.8a15.1 15.1 0 0 0 6.6 6.6l2.2-2.2c.3-.3.7-.4 1-.2 1.1.4 2.3.6 3.6.6.6 0 1 .4 1 1V20c0 .6-.4 1-1 1A17 17 0 0 1 3 4c0-.6.4-1 1-1h3.5c.6 0 1 .4 1 1 0 1.3.2 2.5.6 3.6.1.3 0 .7-.2 1z'/%3E%3C/svg%3E"); }
.km-contacts li.km-contacts__fax::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23f9a02c'%3E%3Cpath d='M19 8H5a3 3 0 0 0-3 3v6h4v4h12v-4h4v-6a3 3 0 0 0-3-3zm-3 11H8v-5h8v5zm3-7a1 1 0 1 1 0-2 1 1 0 0 1 0 2zM18 3H6v4h12V3z'/%3E%3C/svg%3E"); }
.km-contacts li.km-contacts__email::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23f9a02c'%3E%3Cpath d='M20 4H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2zm0 4-8 5-8-5V6l8 5 8-5v2z'/%3E%3C/svg%3E"); }
.km-contacts a { color: var(--kl-text); }
.km-gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 10px; margin-bottom: 1.5rem; }
.km-gallery a, .km-gallery img { display: block; }
.km-gallery img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; transition: opacity .2s; }
.km-gallery a:hover img { opacity: .85; }
.km-counter { text-align: center; }
.km-counter__num { font-size: 40px; color: var(--kl-orange); }
.km-counter__title { font-family: var(--kl-font2); letter-spacing: 1px; }
.km-col video { width: 100%; }
.km-video { margin: 0 auto 1.5rem; }
.km-video video { display: block; width: 100%; height: auto; max-height: 80vh; background: #000; }

/* Tabs (page content) */
.km-tabs { margin-bottom: 1.5rem; }
.km-tabs__list { display: flex; flex-wrap: wrap; border-bottom: 1px solid var(--kl-line); margin-bottom: 1.5rem; }
.km-tabs__btn { background: none; border: 0; border-bottom: 2px solid transparent; padding: 12px 20px; font-size: 15px; color: #333; cursor: pointer; margin-bottom: -1px; }
.km-tabs__btn.is-active, .km-tabs__btn:hover { color: var(--kl-orange); border-bottom-color: var(--kl-orange); }
.km-tabs--ver { display: grid; grid-template-columns: 200px 1fr; gap: 0 30px; align-items: start; }
.km-tabs--ver .km-tabs__list { flex-direction: column; border: 0; background: var(--kl-soft); margin: 0; }
.km-tabs--ver .km-tabs__btn { text-align: left; border: 0; border-left: 2px solid transparent; margin: 0; padding: 14px 18px; }
.km-tabs--ver .km-tabs__btn.is-active { background: #fff; border-left-color: var(--kl-orange); }
.km-tabs--ver .km-tab { grid-column: 2; }
.km-tab[hidden] { display: none; }

/* ---------- Product pages ---------- */
.kl-line { display: grid; grid-template-columns: 156px 1fr; gap: 0 25px; align-items: start; }
.kl-line--single { grid-template-columns: 1fr; }
.kl-linenav { background: var(--kl-soft); align-self: stretch; height: 100%; }
.kl-linenav ul { list-style: none; margin: 0; padding: 0; position: sticky; top: calc(var(--kl-topbar-h) + var(--kl-bar-h) + 10px); }
.kl-linenav li { margin: 0; }
.kl-linenav a {
    display: flex; align-items: center; justify-content: space-between; gap: 6px; padding: 13px 14px; color: #333; font-size: 13px; font-weight: 500; line-height: 1.35;
    border-left: 2px solid transparent; transition: color .2s, background .2s;
}
.kl-linenav a .kl-icon { transform: rotate(-90deg); opacity: 0; flex: 0 0 auto; transition: opacity .2s; }
.kl-linenav a:hover { color: var(--kl-orange); }
.kl-linenav li.is-active a { background: #fff; color: var(--kl-orange); border-left-color: var(--kl-orange); }
.kl-linenav li.is-active a .kl-icon { opacity: 1; }
.kl-line__body { min-width: 0; font-size: 13px; }
.kl-line__body p { margin-bottom: 1rem; }

.kl-products { --cols: 5; display: flex; flex-wrap: wrap; justify-content: center; gap: 30px 20px; margin: 1.5rem 0 2rem; }
.kl-products > .kl-product { flex: 0 0 calc((100% - (var(--cols) - 1) * 20px) / var(--cols)); min-width: 0; }
.kl-product { text-align: center; display: flex; flex-direction: column; align-items: center; }
.kl-product__img { display: flex; align-items: center; justify-content: center; height: 130px; margin-bottom: 14px; width: 100%; }
.kl-product__img img { max-height: 130px; width: auto; object-fit: contain; transition: transform .35s; }
.kl-product:hover .kl-product__img img { transform: scale(1.06); }
.kl-product__code { font-size: 15px; font-weight: 700; margin: 0 0 4px; font-family: var(--kl-font); letter-spacing: 0; }
.kl-product__desc { font-size: 13px; line-height: 1.4; margin: 0 0 12px; color: var(--kl-text); flex: 1; }
.kl-dl {
    display: inline-block; background: var(--kl-orange-btn); color: #fff; font-size: 13px; padding: 8px 14px; border-radius: 3px; line-height: 1.2; transition: background .2s;
}
.kl-dl:hover { background: var(--kl-dark); color: #fff; }
.kl-dl + .kl-dl { margin-top: 6px; }
.kl-products--search { justify-content: flex-start; }
.kl-subheading { font-size: 22px; margin: 2rem 0 1rem; }

/* ---------- Content (plain pages, posts) ---------- */
.kl-content > *:last-child { margin-bottom: 0; }
.kl-content img { height: auto; }
.kl-content a { text-decoration: underline; text-underline-offset: 2px; }
.kl-content h2 { font-size: 26px; margin-top: 2rem; }
.kl-content h3 { font-size: 20px; letter-spacing: .5px; text-transform: none; margin-top: 1.5rem; }
.kl-content h4 { font-size: 19px; margin-top: 1.25rem; }

/* =========================================================================
   Home
   ========================================================================= */
/* Hero: two full-width diagonal panels. Hovering one widens it; the other dims to just its title. */
.kl-split { --cut: 90px; background: #111; }
.kl-split__inner { position: relative; display: flex; height: clamp(460px, 66vh, 640px); overflow: hidden; background: #111; }
.kl-split__panel { position: relative; flex: 1 1 50%; overflow: hidden; transition: flex-grow .7s cubic-bezier(.2,.7,.2,1); outline: none; }
.kl-split__panel--left { clip-path: polygon(0 0, calc(100% - var(--cut)) 0, 100% 100%, 0 100%); margin-right: calc(var(--cut) * -1); z-index: 2; }
.kl-split__panel--right { clip-path: polygon(0 0, 100% 0, 100% 100%, var(--cut) 100%); }
/* Orange diagonal divider. */
.kl-split__panel--left::after {
    content: ""; position: absolute; top: 0; bottom: 0; right: 0; width: calc(var(--cut) + 4px); z-index: 3; pointer-events: none;
    background: linear-gradient(to top right, transparent calc(50% - 2.5px), var(--kl-orange) calc(50% - 2.5px), var(--kl-orange) calc(50% + 2.5px), transparent calc(50% + 2.5px));
}
.kl-split__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 1.6s cubic-bezier(.2,.7,.2,1), filter .6s; }
.kl-split__panel::before {
    content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
    background: linear-gradient(180deg, rgba(12,14,16,.15) 0%, rgba(12,14,16,.35) 40%, rgba(12,14,16,.88) 100%);
}
.kl-split__content {
    position: absolute; inset: 0; z-index: 2; display: flex; flex-direction: column; justify-content: flex-end; align-items: flex-start;
    padding: 40px calc(var(--cut) + 40px) clamp(40px, 7vh, 64px) clamp(32px, 5vw, 90px); color: #fff;
}
.kl-split__panel--right .kl-split__content { padding-left: calc(var(--cut) + clamp(32px, 4vw, 70px)); padding-right: clamp(32px, 5vw, 90px); }
/* On wide screens line the left panel text up with the logo. */
.kl-split__panel--left .kl-split__content { padding-left: max(clamp(32px, 5vw, 90px), calc((100vw - var(--kl-container)) / 2 + var(--kl-gutter))); }
.kl-split__num { display: inline-flex; align-items: center; gap: 12px; font-family: Montserrat, sans-serif; font-size: 13px; font-weight: 600; letter-spacing: 3px; color: var(--kl-orange); margin-bottom: 14px; }
.kl-split__num::after { content: ""; width: 44px; height: 2px; background: currentColor; transition: width .5s; }
.kl-split__title { color: #fff; font-family: var(--kl-font2); font-weight: 700; font-size: clamp(30px, 3.2vw, 48px); line-height: 1.1; letter-spacing: -.5px; text-transform: none; margin: 0; text-shadow: 0 2px 18px rgba(0,0,0,.35); }
.kl-split__more { max-width: 480px; max-height: 320px; opacity: 1; overflow: hidden; transition: max-height .6s cubic-bezier(.2,.7,.2,1), opacity .4s; }
.kl-split__text { margin: 14px 0 22px; font-size: 16px; line-height: 1.6; color: rgba(255,255,255,.85); }
.kl-split__links { display: flex; flex-wrap: wrap; gap: 8px; }
.kl-split__links a {
    display: inline-flex; align-items: center; gap: 7px; padding: 8px 15px; border-radius: 999px; font-size: 13.5px; font-weight: 600; color: #fff;
    background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.3); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
    transition: background .25s, border-color .25s, color .25s;
}
.kl-split__links a:hover, .kl-split__links a:focus-visible { background: var(--kl-orange); border-color: var(--kl-orange); color: #1b1b1b; }
.kl-split__links .kl-icon { color: var(--kl-orange); transition: transform .25s, color .25s; }
.kl-split__links a:hover .kl-icon, .kl-split__links a:focus-visible .kl-icon { color: #1b1b1b; transform: translateX(3px); }
.kl-split__panel:hover .kl-split__img, .kl-split__panel:focus-within .kl-split__img { transform: scale(1.06); }
.kl-split__panel:hover .kl-split__num::after, .kl-split__panel:focus-within .kl-split__num::after { width: 70px; }
@media (hover: hover) and (min-width: 768px) {
    .kl-split__inner:hover .kl-split__panel, .kl-split__inner:focus-within .kl-split__panel { flex-grow: .62; }
    .kl-split__inner .kl-split__panel:hover, .kl-split__inner .kl-split__panel:focus-within { flex-grow: 1.38; }
    .kl-split__inner:hover .kl-split__panel:not(:hover):not(:focus-within) .kl-split__img { filter: brightness(.55) saturate(.7); }
    .kl-split__inner:hover .kl-split__panel:not(:hover):not(:focus-within) .kl-split__more { max-height: 0; opacity: 0; }
}
/* Entrance: content rises in once on page load. */
@keyframes kl-rise { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: none; } }
.kl-split__content > * { animation: kl-rise .8s cubic-bezier(.2,.7,.2,1) backwards; }
.kl-split__title { animation-delay: .1s; }
.kl-split__more { animation-delay: .22s; }
.kl-split__panel--right .kl-split__content > * { animation-delay: .25s; }
.kl-split__panel--right .kl-split__title { animation-delay: .35s; }
.kl-split__panel--right .kl-split__more { animation-delay: .47s; }
@media (prefers-reduced-motion: reduce) {
    .kl-split__content > * { animation: none; }
    .kl-split__panel, .kl-split__img, .kl-split__more { transition: none; }
}

.kl-stats { background: var(--kl-soft); padding: 0; }
.kl-stats__inner { display: grid; grid-template-columns: minmax(0, 450px) minmax(0, 1fr); gap: 30px; align-items: center; }
.kl-stats__video video { display: block; width: 100%; background: #000; }
.kl-stats__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 34px 20px; padding: 30px 0; }
.kl-stat { display: flex; flex-direction: column; align-items: center; text-align: center; }
.kl-stat__icon { height: 40px; display: flex; align-items: center; margin-bottom: 6px; }
.kl-stat__icon img { max-height: 40px; width: auto; }
.kl-stat__num { font-family: var(--kl-font2); font-size: 52px; line-height: 1.1; color: var(--kl-orange); font-variant-numeric: tabular-nums; }
.kl-stat__label { font-family: var(--kl-font2); font-size: 15px; letter-spacing: 2px; text-transform: capitalize; color: #333; margin-top: 8px; line-height: 1.35; max-width: 170px; }

.kl-about { padding: 40px 0 60px; font-size: 14px; line-height: 1.6; }
.kl-about__top { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 30px; align-items: start; }
.kl-about__img img { width: 100%; height: auto; display: block; }
.kl-about__title { font-size: 18px; margin: 30px 0 18px; }
.kl-about__text { text-align: justify; }
.kl-about__text p, .kl-about__below p { margin-bottom: 1.25rem; }
.kl-about .kl-content a { text-decoration: none; color: inherit; }
.kl-about__below { margin-top: 4px; }
.kl-about__btn { margin: 34px 0 0; }

.kl-csr { padding: 20px 0 70px; text-align: center; }
.kl-csr__title { font-family: var(--kl-font); font-weight: 700; font-size: 18px; letter-spacing: 0; text-transform: uppercase; margin-bottom: 40px; }
.kl-csr__list { display: flex; justify-content: center; flex-wrap: wrap; gap: 100px; }
.kl-csr__item { position: relative; width: 190px; height: 190px; border: 3px solid var(--kl-orange); box-shadow: inset 0 0 0 3px #1e2a4f; padding: 3px; overflow: hidden; display: block; }
.kl-csr__item:nth-child(2n) { border-color: var(--kl-orange); }
.kl-csr__img { width: 100%; height: 100%; object-fit: cover; display: block; transition: opacity .35s, transform .35s; }
.kl-csr__img--hover { position: absolute; inset: 3px; width: calc(100% - 6px); height: calc(100% - 6px); opacity: 0; }
.kl-csr__item.has-hover:hover .kl-csr__img--hover { opacity: 1; }
.kl-csr__item:not(.has-hover):hover .kl-csr__img { transform: scale(1.08); }

/* =========================================================================
   Blog
   ========================================================================= */
.kl-posts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px 30px; }
.kl-post-card__img { display: block; overflow: hidden; background: var(--kl-soft); aspect-ratio: 687 / 339; margin-bottom: 14px; }
.kl-post-card__img img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.kl-post-card:hover .kl-post-card__img img { transform: scale(1.05); }
.kl-post-card__title { font-size: 18px; line-height: 1.35; margin: 0 0 8px; font-weight: 500; }
.kl-post-card__title a { color: var(--kl-head); }
.kl-post-card__title a:hover { color: var(--kl-orange); }
.kl-post-card__meta { font-size: 13px; color: #999; margin: 0 0 8px; }
.kl-post-card__excerpt { font-size: 14px; margin: 0; }
.nav-links { display: flex; justify-content: center; gap: 6px; margin-top: 40px; }
.page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 38px; height: 38px; padding: 0 8px; background: var(--kl-soft); color: #333; }
.page-numbers.current, a.page-numbers:hover { background: var(--kl-orange); color: #fff; }

.kl-single__head { padding: 50px 0 10px; }
.kl-single__img { margin: 0 0 30px; }
.kl-single__img img { width: 100%; height: auto; display: block; }
.kl-single__title { font-size: 34px; line-height: 1.25; margin: 0 0 10px; }
.kl-single__meta { font-size: 14px; color: #999; display: flex; gap: 18px; flex-wrap: wrap; margin: 0; }
.kl-single__body { padding: 30px 0 50px; }
.kl-single--raw .kl-single__body { padding-top: 10px; }
.kl-single__nav { border-top: 1px solid var(--kl-line); padding: 24px 0 50px; }
.kl-single__nav .kl-container { display: flex; justify-content: space-between; gap: 30px; }
.kl-single__nav a { display: inline-flex; align-items: center; gap: 8px; color: #333; font-size: 14px; }
.kl-single__nav a:hover { color: var(--kl-orange); }
.kl-content.kl-single__content, .kl-single .kl-content { font-size: 16px; line-height: 1.7; }

/* =========================================================================
   Forms
   ========================================================================= */
.kl-form { max-width: 100%; }
.kl-form__grid { display: block; }
.kl-form__field { margin: 0 0 16px; }
.kl-form__field label { display: block; font-weight: 700; font-size: 14px; color: #333; margin-bottom: 6px; }
.kl-form__field .req { color: #d63637; }
.kl-form input[type=text], .kl-form input[type=email], .kl-form input[type=tel], .kl-form textarea {
    width: 100%; max-width: 100%; border: 1px solid #ccc; border-radius: 2px; padding: 8px 10px; font-size: 15px; background: #fff; color: #333; outline: none;
}
.kl-form textarea { max-width: 100%; min-height: 110px; resize: vertical; }
.kl-form input:focus, .kl-form textarea:focus { border-color: #999; box-shadow: 0 0 0 1px #999; }
.kl-btn--form { background: #eee; color: #333; border: 1px solid #ddd; font-size: 15px; font-weight: 400; text-transform: none; padding: 10px 15px; }
.kl-btn--form:hover { background: #ddd; color: #333; }
.kl-form__ok { background: #e0ffc7; border: 1px solid #b4d39b; padding: 15px 20px; font-size: 15px; color: #333; }
.kl-form__err { background: #fff0f0; border: 1px solid #e3b1b1; padding: 12px 16px; font-size: 14px; color: #a00; }
.kl-form--newsletter .kl-form__field--first, .kl-form--newsletter .kl-form__field--last,
.kl-form--feedback .kl-form__field--first, .kl-form--feedback .kl-form__field--last { display: inline-block; width: calc(50% - 8px); vertical-align: top; }
.kl-form--newsletter .kl-form__field--first, .kl-form--feedback .kl-form__field--first { margin-right: 12px; }
.kl-form--newsletter input, .kl-form--feedback input { max-width: 100% !important; }
.kl-form--newsletter .kl-btn--form, .kl-quote .kl-btn--form { background: #eaa33b; color: #fff; border: 0; font-weight: 700; }

/* =========================================================================
   Footer
   ========================================================================= */
.kl-group { background: var(--kl-soft); padding: 40px 0; }
.kl-group__list { display: flex; justify-content: center; flex-wrap: wrap; gap: 30px 44px; }
.kl-group__item { width: 200px; text-align: center; color: #333; display: block; }
.kl-group__img { display: block; aspect-ratio: 300 / 161; overflow: hidden; margin-bottom: 14px; }
.kl-group__img img { width: 100%; height: 100%; object-fit: cover; transition: transform .35s; }
a.kl-group__item:hover .kl-group__img img { transform: scale(1.06); }
.kl-group__name { display: block; font-size: 13px; font-weight: 700; text-transform: uppercase; line-height: 1.45; color: #000; }
a.kl-group__item:hover .kl-group__name { color: var(--kl-orange); }
.kl-footer__bottom { background: var(--kl-footer); color: #fff; text-align: center; padding: 25px 0; font-size: 12px; }
.kl-footer__bottom p { margin: 0; }
.kl-footer__bottom a { color: #fff; }
.kl-footer__bottom a:hover { color: var(--kl-orange); }

/* Floating: WhatsApp, Get a Quote, back to top */
.kl-whatsapp {
    position: fixed; left: 14px; bottom: 50px; z-index: 90; width: 46px; height: 46px; border-radius: 10px; background: #25d366; color: #fff;
    display: flex; align-items: center; justify-content: center; box-shadow: 0 4px 12px rgba(0,0,0,.25); transition: transform .2s;
}
.kl-whatsapp:hover { color: #fff; transform: scale(1.08); }
.kl-quote { position: fixed; right: 34px; bottom: 0; z-index: 95; width: 330px; max-width: calc(100vw - 20px); }
.kl-quote__tab {
    display: block; width: 100%; text-align: left; background: #fcbf2f; color: #000; border: 1px solid #c79300; border-bottom: 0; border-radius: 3px 3px 0 0;
    font-weight: 700; font-size: 15px; padding: 8px 12px; cursor: pointer;
}
.kl-quote__panel { position: relative; background: #fff; border: 1px solid #ccc; padding: 20px 20px 10px; max-height: 70vh; overflow-y: auto; box-shadow: 0 -4px 20px rgba(0,0,0,.15); }
.kl-quote__panel[hidden] { display: none; }
.kl-quote__close { position: absolute; top: 6px; right: 6px; background: none; border: 0; cursor: pointer; color: #666; padding: 4px; }
.kl-quote .kl-form input, .kl-quote .kl-form textarea { max-width: 100%; }
.kl-totop {
    position: fixed; right: 10px; bottom: 44px; z-index: 80; width: 34px; height: 34px; background: rgba(0,0,0,.35); color: #fff; display: flex; align-items: center; justify-content: center;
    opacity: 0; visibility: hidden; transition: opacity .3s, visibility .3s; border-radius: 2px;
}
.kl-totop .kl-icon { transform: rotate(180deg); }
.kl-totop.is-visible { opacity: 1; visibility: visible; }
.kl-totop:hover { background: var(--kl-orange); color: #fff; }

/* Lightbox */
.kl-lightbox { position: fixed; inset: 0; z-index: 1100; background: rgba(0,0,0,.88); display: none; align-items: center; justify-content: center; padding: 40px 60px; }
.kl-lightbox.is-open { display: flex; }
.kl-lightbox img { max-width: 100%; max-height: 100%; box-shadow: 0 10px 40px rgba(0,0,0,.5); }
.kl-lightbox button { position: absolute; background: none; border: 0; color: #fff; font-size: 44px; line-height: 1; cursor: pointer; padding: 10px; opacity: .8; }
.kl-lightbox button:hover { opacity: 1; }
.kl-lightbox__close { top: 10px; right: 16px; }
.kl-lightbox__prev { left: 10px; top: 50%; transform: translateY(-50%); }
.kl-lightbox__next { right: 10px; top: 50%; transform: translateY(-50%); }

/* Misc pages */
.kl-404 { text-align: center; }
.kl-404__code { font-size: 110px; line-height: 1; color: var(--kl-orange); margin: 0 0 10px; }
.kl-searchpage__form { margin: 0 0 30px; }
.kl-results { list-style: none; padding: 0; }
.kl-results li { padding: 14px 0; border-bottom: 1px solid var(--kl-line); }
.kl-results li a { font-size: 17px; font-weight: 600; }
.kl-results li p { margin: 4px 0 0; font-size: 14px; }
.kl-empty { text-align: center; padding: 30px 0; }

/* =========================================================================
   Popups (datasheet + newsletter)
   ========================================================================= */
body.kl-modal-open { overflow: hidden; }
.kl-modal { position: fixed; inset: 0; z-index: 1000; display: flex; align-items: center; justify-content: center; padding: 20px; background: rgba(0,0,0,.5); }
.kl-modal[hidden] { display: none; }
.kl-modal__overlay { position: absolute; inset: 0; animation: kl-fade .3s; }
.kl-modal__box { position: relative; background: #fff; width: 100%; max-width: 600px; padding: 34px 26px 24px; box-shadow: 0 20px 60px rgba(0,0,0,.3); animation: kl-pop .35s ease; }
.kl-modal__title { font-size: 24px; margin: 0 0 18px; }
.kl-otp { max-height: calc(100vh - 110px); overflow-y: auto; overflow-x: hidden; }
.kl-modal__close {
    position: absolute; top: -12px; right: -12px; width: 30px; height: 30px; border-radius: 50%; border: 2px solid #fff;
    background: #000; color: #fff; display: flex; align-items: center; justify-content: center; cursor: pointer; z-index: 2;
}
.kl-modal__close:hover { background: var(--kl-orange); }
@keyframes kl-fade { from { opacity: 0; } }
@keyframes kl-pop { from { opacity: 0; transform: translateY(-24px); } }
.kl-otp { font-family: var(--kl-font); color: #444; }
.kl-otp__title { font-size: 20px; margin: 0 0 4px; color: var(--kl-head); }
.kl-otp__doc { color: var(--kl-orange); font-weight: 700; font-size: 14px; margin: 0 0 8px; }
.kl-otp__doc:empty { display: none; }
.kl-otp__intro { font-size: 14px; color: #666; margin: 0 0 18px; }
.kl-otp__label { display: block; font-weight: 700; font-size: 15px; color: #333; margin: 0 0 8px; }
.kl-otp__label .req { color: #d63637; }
.kl-otp input[type=email], .kl-otp input[type=text] {
    width: 100%; max-width: 420px; border: 1px solid #ccc; border-radius: 3px; padding: 10px 12px; font-size: 16px; background: #fff; color: #333; outline: none;
}
.kl-otp input:focus { border-color: #999; box-shadow: 0 0 0 1px #999; }
.kl-otp input[name=code] { letter-spacing: 6px; font-weight: 700; max-width: 220px; }
.kl-otp__step2 { margin-top: 6px; }
.kl-otp__btn { background: var(--kl-orange-btn); color: #fff; border: 0; border-radius: 3px; padding: 11px 18px; font-size: 15px; font-weight: 600; cursor: pointer; transition: background .2s; }
.kl-otp__btn:hover { background: var(--kl-dark); }
.kl-otp__btn:disabled { opacity: .6; cursor: default; }
.kl-otp__send { margin-top: 18px; }
.kl-otp__msg { font-size: 14px; margin: 14px 0 0; min-height: 1px; }
.kl-otp__msg:empty { margin: 0; }
.kl-otp__msg.is-error { color: #c0392b; }
.kl-otp__msg.is-ok { color: #2e7d32; }
.kl-otp__submit { margin-top: 22px; }

/* =========================================================================
   Responsive
   ========================================================================= */
@media (max-width: 1200px) {
    .kl-menu > li > a, .kl-menu > li > .menu-label { padding: 0 9px; }
    .kl-products { --cols: 4; }
}

@media (max-width: 1100px) {
    :root { --kl-topbar-h: 36px; }
    .kl-topbar__nav { display: none; }
    .kl-topbar__inner { justify-content: center; }
    .kl-burger { display: inline-flex; margin-left: auto; background: none; border: 0; color: #333; cursor: pointer; padding: 6px; }
    .kl-search-toggle { order: 3; }
    .kl-nav {
        position: fixed; top: 0; right: 0; bottom: 0; width: 320px; max-width: 88vw; background: #fff; z-index: 200; overflow-y: auto; padding: 60px 0 30px;
        transform: translateX(100%); transition: transform .3s; box-shadow: -10px 0 30px rgba(0,0,0,.15); margin: 0;
    }
    body.kl-nav-open .kl-nav { transform: none; }
    body.kl-nav-open::after { content: ""; position: fixed; inset: 0; background: rgba(0,0,0,.4); z-index: 150; }
    /* The header creates its own stacking layer, so lift it above the dark overlay while the menu is open. */
    body.kl-nav-open .kl-header { z-index: 300; }
    body.kl-nav-open { overflow: hidden; }
    body.admin-bar .kl-nav { top: 32px; }
    .kl-nav__close { display: inline-flex; position: absolute; top: 14px; right: 14px; background: none; border: 0; cursor: pointer; color: #333; padding: 6px; }
    .kl-menu, .kl-pmenu { flex-direction: column; align-items: stretch; height: auto; }
    .kl-menu li, .kl-pmenu__item { display: block; position: relative; border-bottom: 1px solid var(--kl-line); }
    .kl-menu > li > a, .kl-menu > li > .menu-label { height: auto; padding: 13px 54px 13px 20px; font-size: 15px; }
    .kl-menu > li > a::after, .kl-menu > li > .menu-label::after { display: none; }
    .kl-menu .sub-menu, .kl-menu .sub-menu .sub-menu { position: static; opacity: 1; visibility: visible; transform: none; box-shadow: none; display: none; background: var(--kl-soft); min-width: 0; }
    .kl-menu li.is-open > .sub-menu { display: block; }
    .kl-menu .sub-menu a, .kl-menu .sub-menu .menu-label { padding-left: 34px; padding-right: 54px; }
    .kl-menu .sub-menu .sub-menu a { padding-left: 48px; }
    .kl-menu .sub-menu a .kl-icon, .kl-menu .sub-menu .menu-label .kl-icon { display: none; }
    .kl-menu .submenu-toggle, .kl-pmenu .submenu-toggle {
        display: inline-flex; position: absolute; right: 6px; top: 6px; width: 40px; height: 36px; align-items: center; justify-content: center; background: none; border: 0; cursor: pointer; color: #666;
    }
    .kl-menu li.is-open > .submenu-toggle .kl-icon, .kl-pmenu__item.is-open > .submenu-toggle .kl-icon { transform: rotate(180deg); }
    .kl-nav__products { display: block; margin-top: 18px; border-top: 4px solid var(--kl-topbar); }
    .kl-pmenu__link { height: auto; padding: 13px 54px 13px 20px; color: #333; font-size: 13px; }
    .kl-pmenu__link .kl-icon { display: none; }
    .kl-pmenu__item:hover > .kl-pmenu__link, .kl-pmenu__item.is-current > .kl-pmenu__link { background: none; color: var(--kl-orange); }
    .kl-mega { position: static; opacity: 1; visibility: visible; transform: none; box-shadow: none; border: 0; display: none; }
    .kl-pmenu__item.is-open > .kl-mega { display: block; }
    .kl-mega__inner { display: block; padding: 0; min-height: 0; }
    .kl-mega__tabs { padding: 0; background: var(--kl-soft); }
    .kl-mega__tab-link { padding: 10px 20px 10px 30px; border: 0; font-weight: 600; }
    .kl-mega__tab-link .kl-icon { display: none; }
    .kl-mega__tab.is-active .kl-mega__tab-link { background: var(--kl-soft); color: #333; }
    .kl-mega__panels { display: none; }
    .kl-stats__inner { gap: 24px; }
}

@media (max-width: 900px) {
    .kl-products { --cols: 3; }
    .kl-posts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .kl-split { --cut: 60px; }
    .kl-split__inner { height: 520px; }
    .kl-split__content { padding: 30px calc(var(--cut) + 20px) 40px 30px; }
    .kl-split__panel--right .kl-split__content { padding-left: calc(var(--cut) + 24px); padding-right: 30px; }
    .kl-split__text { font-size: 15px; }
    .kl-split__links a { padding: 7px 12px; font-size: 12.5px; }
    .kl-stats__inner { grid-template-columns: 1fr; max-width: 560px; padding-top: 30px; }
    .kl-stats__video { max-width: 320px; margin: 0 auto; width: 100%; }
}

@media (max-width: 767px) {
    body { font-size: 15px; }
    h1 { font-size: 28px; } h2 { font-size: 24px; } h4 { font-size: 19px; }
    .km-height-medium { padding: 2.5rem 0; }
    .km-row { margin: 0; }
    .km-col { flex-basis: 100%; max-width: 100%; padding: 0; margin-bottom: 1.25rem; }
    .km-col--empty { display: none; }
    .km-col:last-child { margin-bottom: 0; }
    .km-tabs--ver { display: block; }
    .km-tabs--ver .km-tabs__list { flex-direction: row; overflow-x: auto; margin-bottom: 1rem; }
    .kl-line { grid-template-columns: 1fr; }
    .kl-linenav { height: auto; margin-bottom: 20px; }
    .kl-linenav ul { position: static; display: flex; overflow-x: auto; }
    .kl-linenav li { flex: 0 0 auto; }
    .kl-linenav a { border-left: 0; border-bottom: 2px solid transparent; white-space: nowrap; }
    .kl-linenav li.is-active a { border-bottom-color: var(--kl-orange); }
    .kl-linenav a .kl-icon { display: none; }
    .kl-products { --cols: 2; gap: 26px 20px; }
    .kl-posts { grid-template-columns: 1fr; }
    .kl-split__inner { flex-direction: column; height: auto; }
    .kl-split__panel { flex: none; min-height: 360px; clip-path: none !important; margin: 0 !important; }
    .kl-split__panel--left::after { display: none; }
    .kl-split__panel--left { border-bottom: 4px solid var(--kl-orange); }
    .kl-split__content, .kl-split__panel--left .kl-split__content, .kl-split__panel--right .kl-split__content { position: relative; inset: auto; min-height: 360px; padding: 70px 22px 30px; }
    .kl-split__more { max-height: none; }
    .kl-split__text { margin: 10px 0 18px; font-size: 14.5px; }
    .kl-split__links { gap: 7px; }
    .kl-split__links a { padding: 7px 12px; font-size: 12.5px; }
    .kl-stats__grid { grid-template-columns: repeat(2, 1fr); }
    .kl-about__top { grid-template-columns: 1fr; }
    .kl-about__title { margin-top: 0; }
    .kl-csr__list { gap: 30px; }
    .kl-group__list { gap: 24px 16px; }
    .kl-group__item { width: calc(50% - 8px); max-width: 180px; }
    .kl-form input[type=text], .kl-form input[type=email], .kl-form input[type=tel], .kl-form textarea { max-width: 100%; }
    .kl-quote { right: 10px; width: 290px; }
    .kl-quote:not(.is-open) { width: 130px; }
    .kl-titlebar__inner { flex-direction: column; align-items: flex-start; gap: 6px; }
    .kl-single__title { font-size: 26px; }
}

@media (max-width: 782px) { body.admin-bar .kl-header { top: 46px; } body.admin-bar .kl-nav { top: 46px; } }
@media (max-width: 600px) { body.admin-bar .kl-header, body.admin-bar .kl-nav { top: 0; } }

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation: none !important; transition: none !important; }
    html { scroll-behavior: auto; }
}

/* ---------- Blog post: table of contents + views ---------- */
.kl-single:not(.kl-single--toc) .kl-single__head { max-width: 960px; margin: 0 auto; }
.kl-single--toc .kl-single__wrap { display: grid; grid-template-columns: 270px minmax(0, 1fr); gap: 44px; align-items: start; }
.kl-single__main { min-width: 0; }
.kl-single--toc .kl-single__head { padding-top: 50px; }
.kl-toc { position: sticky; top: calc(var(--kl-topbar-h) + var(--kl-bar-h) + 20px); margin-top: 50px; }
.kl-toc__box { border: 1px solid var(--kl-line); border-top: 3px solid var(--kl-orange); background: #fafafa; border-radius: 4px; }
.kl-toc__title { list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 10px;
    padding: 14px 18px; font-family: Montserrat, sans-serif; font-weight: 600; font-size: 14px; letter-spacing: .5px; text-transform: uppercase; color: #333; }
.kl-toc__title::-webkit-details-marker { display: none; }
.kl-toc__title svg { transition: transform .2s; fill: currentColor; }
.kl-toc__box[open] .kl-toc__title svg { transform: rotate(180deg); }
.kl-toc__list { position: relative; list-style: none; counter-reset: toc; margin: 0; padding: 0 10px 12px;
    max-height: calc(100vh - var(--kl-topbar-h) - var(--kl-bar-h) - 110px); overflow-y: auto; overscroll-behavior: contain; }
.kl-toc__list li { counter-increment: toc; }
.kl-toc__list a { display: flex; gap: 8px; padding: 7px 8px; font-size: 13.5px; line-height: 1.4; color: #555; text-decoration: none; border-left: 2px solid transparent; border-radius: 0 3px 3px 0; }
.kl-toc__list a::before { content: counter(toc) "."; color: #aaa; min-width: 1.4em; }
.kl-toc__list a:hover { color: #222; background: #f0f0f0; }
.kl-toc__list a.is-active { color: #222; font-weight: 600; border-left-color: var(--kl-orange); background: #fff4e5; }
.kl-toc__list a.is-active::before { color: var(--kl-orange); }
body.admin-bar .kl-toc { top: calc(var(--kl-topbar-h) + var(--kl-bar-h) + 52px); }
.kl-single h2[id] { scroll-margin-top: calc(var(--kl-topbar-h) + var(--kl-bar-h) + 20px); }
.kl-views { display: inline-flex; align-items: center; gap: 5px; }
.kl-views svg { fill: currentColor; opacity: .8; }
.kl-views b { font-weight: 600; color: #777; }
.kl-post-card__meta .kl-views { vertical-align: middle; }
@media (max-width: 1023px) {
    .kl-single--toc .kl-single__wrap { display: flex; flex-direction: column; align-items: stretch; gap: 0; }
    .kl-single--toc .kl-toc { order: 2; position: static; margin: 0 0 10px; }
    .kl-single--toc .kl-single__main { display: contents; }
    .kl-single--toc .kl-single__head { order: 1; }
    .kl-single--toc .kl-single__body { order: 3; }
    .kl-toc__list { max-height: 60vh; }
}

/* ---------- Contact page: distributors (logo and text meet at the centre line, sides alternate, divider between) ---------- */
.page-id-48 .km-col > .km-row { align-items: center; margin: 0 -15px; padding: 32px 0; border-bottom: 1px solid var(--kl-line); }
.page-id-48 .km-col > .km-row:first-child { padding-top: 0; }
.page-id-48 .km-col > .km-row:last-child { border-bottom: 0; padding-bottom: 0; }
.page-id-48 .km-col > .km-row > .km-col:has(> .km-space) { display: none; }
.page-id-48 .km-col > .km-row > .km-col { padding: 0 25px; }
.page-id-48 .km-col > .km-row > .km-col:first-child { text-align: right; }
.page-id-48 .km-col > .km-row > .km-col:nth-child(2) { text-align: left; }
.page-id-48 .km-col > .km-row img { display: inline-block; vertical-align: middle; max-width: 100%; }
.page-id-48 .km-col > .km-row h4 { margin-bottom: 10px; }
.page-id-48 .km-col > .km-row p { margin: 0; }
@media (max-width: 767px) {
    .page-id-48 .km-col > .km-row > .km-col, .page-id-48 .km-col > .km-row > .km-col:first-child, .page-id-48 .km-col > .km-row > .km-col:nth-child(2) { text-align: center; padding: 0; }
    .page-id-48 .km-col > .km-row > .km-col:has(> img) { order: -1; margin-bottom: 16px; }
    .page-id-48 .km-col > .km-row h4, .page-id-48 .km-col > .km-row p { text-align: center !important; }
}