.kl-announcement, .kl-header, .kl-hero, .kl-band, .kl-case-dialog {
  --kl-gutter: clamp(20px, 4vw, 56px);
  --kl-display: 'Neue Montreal', Arial, sans-serif;
  color: #212121;
  font-size: 13px;
  line-height: 1.3;
  letter-spacing: -.02em;
}
.kl-announcement { display:flex; align-items:center; justify-content:center; gap:6px; padding:10px 12px; color:#fff; background:#212121; font:525 13px/1 Inter,Arial,sans-serif; letter-spacing:-.26px; white-space:nowrap; text-decoration:none; }
.kl-announcement:focus-visible { outline:2px solid #5cbaff; outline-offset:-3px; }
.kl-announcement > img { display:block; flex:none; width:14px; height:14px; }
.kl-announcement-offer { color:#5cbaff; }
:root { --site-header-height:50px; }
html:has(.kl-header) { scroll-padding-top:calc(var(--site-header-height) + 16px); }
.kl-header { --nav-ease:cubic-bezier(.32,.72,0,1); background:white; box-shadow:inset 0 -1px 0 #2121210f; position:sticky; top:0; z-index:20; }
.kl-navframe { display:flex; align-items:center; justify-content:space-between; position:relative; min-height:var(--site-header-height); width:min(1024px,calc(100% - 2 * var(--kl-gutter))); margin-inline:auto; }
.kl-header :is(a,button,summary) { color:inherit; font:inherit; letter-spacing:inherit; line-height:1; text-decoration:none; }
.kl-wordmark { display:inline-flex; }
.kl-wordmark img { display:block; width:90.396px; height:23px; transform:translateY(-3.5px); }
.kl-nav { display:flex; align-items:center; gap:12px; position:absolute; left:50%; transform:translateX(-50%); color:#21212180; }
.kl-nav > a, .kl-use-trigger { position:relative; isolation:isolate; display:flex; align-items:center; justify-content:center; gap:6px; padding:8px; border-radius:8px; white-space:nowrap; cursor:pointer; transition:color 450ms var(--nav-ease); }
.kl-use-trigger { border:0; background:transparent; }
.kl-nav > a::before, .kl-use-trigger::before { content:""; position:absolute; z-index:-1; inset:0; border-radius:inherit; background:#f5f5f5; opacity:0; transform:scale(.9); transition:opacity 450ms var(--nav-ease),transform 450ms var(--nav-ease); }
/* Keep the outgoing glyphs fully outside the mask, including descenders. */
.kl-nav-label { --nav-label-travel:1.6em; display:block; height:1.4em; margin-block:-.2em; overflow:hidden; }
.kl-nav-label > span { display:block; line-height:1.4; text-shadow:0 var(--nav-label-travel) currentColor; transform:translateY(0); transition:transform 450ms var(--nav-ease); }
.kl-nav > a:focus-visible, .kl-use-trigger:focus-visible, .kl-use-trigger[aria-expanded="true"] { color:#212121; }
.kl-nav > a:focus-visible::before, .kl-use-trigger:focus-visible::before, .kl-use-trigger[aria-expanded="true"]::before { opacity:1; transform:scale(1); }
@media (hover:hover) and (pointer:fine) {
  .kl-nav > a:hover, .kl-use-trigger:hover { color:#212121; }
  .kl-nav > a:hover::before, .kl-use-trigger:hover::before { opacity:1; transform:scale(1); }
  .kl-nav > a:hover .kl-nav-label > span, .kl-use-trigger:hover .kl-nav-label > span { transform:translateY(calc(-1 * var(--nav-label-travel))); }
}
.kl-use-cases { --nav-ease:cubic-bezier(.32,.72,0,1); position:relative; }
.kl-use-cases[data-open]::after { content:""; position:absolute; inset:100% 0 auto; height:18px; }
.kl-nav-chevron { position:relative; width:6.5px; height:3.25px; flex:none; }
.kl-nav-chevron img { position:absolute; inset:-.55px; transform:rotateX(180deg); width:7.6px; height:4.35px; max-width:none; transition:transform 450ms var(--nav-ease); }
.kl-use-cases[data-open] .kl-nav-chevron img { transform:rotateX(0); }
.kl-use-dropdown { position:absolute; z-index:2; top:calc(100% + 18px); left:calc(-110px + var(--menu-shift,0px)); width:510px; transform-origin:center top; transform:scale(.92); opacity:0; filter:blur(2px); visibility:hidden; pointer-events:none; transition:transform 450ms var(--nav-ease),opacity 450ms var(--nav-ease),filter 450ms var(--nav-ease),visibility 0s 450ms; }
.kl-use-cases[data-open] .kl-use-dropdown { transform:scale(1); opacity:1; filter:blur(0); visibility:visible; pointer-events:auto; transition-delay:0s; }
.kl-use-menu { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:8px; padding:8px; border-radius:16px; background:white; box-shadow:0 0 0 1px rgba(14,63,126,.03),0 1px 1px -.5px rgba(42,51,70,.01),0 5px 5px -2.5px rgba(42,51,70,.01),0 3px 3px -1.5px rgba(42,51,70,.03),0 16px 16px -8px rgba(42,51,70,.02); }
.kl-header .kl-use-link { position:relative; isolation:isolate; display:flex; align-items:flex-start; gap:12px; min-width:0; padding:16px; border-radius:12px; color:#212121; font:525 13px/1.3 Inter,Arial,sans-serif; letter-spacing:-.26px; }
.kl-use-link::before { content:""; position:absolute; z-index:-1; inset:0; border-radius:inherit; background:currentColor; opacity:0; transform:scale(.92); transition:opacity 200ms var(--nav-ease),transform 200ms var(--nav-ease); }
.kl-use-link:is(:hover,:focus-visible)::before { opacity:.06; transform:scale(1); }
.kl-use-icon { display:grid; place-items:center; flex:0 0 38px; height:38px; border-radius:8px; background:#f5f5f5; transition:background-color 200ms var(--nav-ease); }
.kl-use-link:is(:hover,:focus-visible) .kl-use-icon { background:#fff; }
.kl-use-icon img { display:block; width:16px; height:16px; }
.kl-use-copy { display:flex; flex-direction:column; gap:4px; min-width:0; }
.kl-use-title,.kl-use-description { white-space:nowrap; }
.kl-use-description { color:rgb(33 33 33 / 50%); }
/* Keep each desktop hover target and its inset proportional to the menu type. */
@media (min-width: 901px) {
  .kl-use-dropdown { width:max-content; min-width:calc(510 * var(--desktop-unit, 1px)); max-width:calc(100vw - 32px); }
  .kl-use-menu { gap:0 calc(8 * var(--desktop-unit, 1px)); padding:calc(8 * var(--desktop-unit, 1px)); }
  .kl-header .kl-use-link { padding:calc(16 * var(--desktop-unit, 1px)); gap:calc(12 * var(--desktop-unit, 1px)); }
  .kl-use-icon { flex-basis:calc(38 * var(--desktop-unit, 1px)); height:calc(38 * var(--desktop-unit, 1px)); }
  .kl-use-icon img { width:calc(16 * var(--desktop-unit, 1px)); height:calc(16 * var(--desktop-unit, 1px)); }
  .kl-use-copy { gap:calc(4 * var(--desktop-unit, 1px)); }
}
@media (prefers-reduced-motion:reduce) {
  .kl-use-dropdown,.kl-use-cases[data-open] .kl-use-dropdown,.kl-nav-chevron img,.kl-use-link::before,.kl-use-icon,.kl-nav > a,.kl-use-trigger,.kl-nav > a::before,.kl-use-trigger::before,.kl-nav-label > span { transition-duration:.01ms !important; transition-delay:0s !important; }
}
.kl-header-call, .kl-menu-trigger { display:inline-flex; align-items:center; border:0; border-radius:10px; padding:9px 12px; background:#f5f5f5; }
.kl-header-call { flex:none; gap:6px; padding:8px; color:rgb(33 33 33 / 75%) !important; }
.kl-header-call > img { display:block; width:16px; height:16px; border-radius:5px; object-fit:cover; }
.kl-menu-trigger { display:none; cursor:pointer; }
.kl-mobile-menu { display:none; }
.kl-hero { padding:80px var(--kl-gutter) 0; display:grid; gap:80px; justify-items:center; }
.kl-hero-heading, .kl-case-head, .kl-proof-logos, .kl-proof-pair { width:100%; max-width:1024px; }
.kl-hero-heading, .kl-case-head { display:flex; justify-content:space-between; align-items:flex-end; gap:24px; }
.kl-hero-copy { display:grid; gap:16px; justify-items:start; }
.kl-rating { display:flex; align-items:flex-start; gap:10px; }
.kl-avatars { display:flex; align-items:center; height:35px; padding:0; }
.kl-avatars img { width:35px; height:35px; border-radius:8px; object-fit:cover; transform:translateY(3px) rotate(-7deg); flex:none; }
.kl-avatars > span { display:grid; place-items:center; flex:none; width:39.005px; height:35px; }
.kl-avatars > span:nth-child(even) { width:38.467px; }
.kl-avatars > span + span { margin-left:-12px; }
.kl-avatars > span:nth-child(even) img { transform:rotate(6deg); }
.kl-rating-message { display:grid; gap:6px; color:#21212180; }
.kl-rating-message b { color:#212121; font-weight:inherit; }
.kl-stars { display:flex; align-items:center; }
.kl-stars img { width:14px; height:14px; }
/* Homepage hero: match the updated Figma without changing the shared SaaS intro. */
.kl-hero .kl-hero-copy { min-width:0; }
.kl-hero-benefits { display:flex; flex-wrap:wrap; gap:12px 16px; margin:0; padding:0; list-style:none; }
.kl-hero-benefits li { display:flex; align-items:center; gap:6px; white-space:nowrap; }
.kl-hero-benefits img { display:block; width:14px; height:14px; flex:none; }
.kl-hero-actions { display:flex; align-items:stretch; gap:6px; flex:none; }
.kl-hero-actions .kl-hero-secondary { padding:6px 12px; }
.kl-hero h1, .kl-proof h2, .kl-case-head h2, .kl-case-card h3, .kl-dialog-header h2 { font-family:var(--kl-display); font-weight:500; letter-spacing:-.02em; margin:0; }
.kl-hero h1 { font-size:40px; line-height:44px; }
.kl-hero-description, .kl-proof-title p, .kl-case-head p, .kl-dialog-header p { margin:0; font-size:13px; line-height:1.3; color:#21212180; }
.kl-hero .kl-hero-description { line-height:1.5; }
.kl-chip-button { border:0; border-radius:12px; display:inline-flex; width:fit-content; max-width:100%; align-items:center; justify-content:center; gap:9px; padding:6px 6px 6px 12px; font:inherit; letter-spacing:inherit; line-height:1; color:#212121; text-decoration:none; cursor:pointer; white-space:nowrap; }
.kl-primary { color:white; }
.kl-chip-button img { width:24px; height:24px; }
.kl-hero-film { position:relative; width:min(100%,1200px); aspect-ratio:1200/550; overflow:hidden; border-radius:16px 16px 0 0; background:#a1a1a1; }
.kl-play { position:absolute; inset:calc(50% + 1px) auto auto 50%; transform:translate(-50%,-50%); display:grid; place-items:center; width:44px; height:44px; padding-inline:15px 13px; border-radius:50%; background:rgb(255 255 255 / 14%); backdrop-filter:blur(8px); }
.kl-play img { width:16px; height:16px; }
.kl-band { padding:0 16px 16px; }
.kl-proof-inner, .kl-cases-inner { display:flex; flex-direction:column; gap:60px; align-items:center; padding-block:80px; border-radius:16px; }
.kl-proof-inner { padding-inline:var(--kl-gutter); background:#212121; color:#fff; }
.kl-proof h2, .kl-cases h2 { font-size:36px; line-height:1.3; }
.kl-proof-title { text-align:center; display:grid; gap:16px; }
.kl-proof-title p { color:#ffffff80; }
.kl-proof-logos { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:8px; }
.kl-proof-logos > div { display:grid; place-items:center; background:#ffffff0f; border-radius:16px; height:80px; }
.kl-proof-logos img { width:var(--kl-client-width,81px); max-width:76%; height:auto; max-height:24px; object-fit:contain; }
.kl-proof .kl-proof-logos img { filter:brightness(0) invert(1); }
/* Preserve the opaque crest's internal contrast instead of flattening it to white. */
.kl-proof .kl-proof-logos img[alt="CS Sedan"] { filter:grayscale(1); }
.kl-client-pushrank { --kl-client-width:100px; }
.kl-client-digifeel { --kl-client-width:72px; }
.kl-client-propal { --kl-client-width:70px; }
.kl-client-editing360 { --kl-client-width:94px; }
.kl-client-8lab { --kl-client-width:72px; }
.kl-proof-pair { display:grid; grid-template-columns:minmax(0,445fr) minmax(0,519fr); gap:60px; }
.kl-proof-copy { display:flex; flex-direction:column; align-items:stretch; justify-content:space-between; gap:24px; }
.kl-proof-copy p { font-family:var(--kl-display); font-size:20px; line-height:1.3; letter-spacing:-.02em; font-weight:500; margin:0; }
.kl-proof-copy p span { color:#ffffff80; }
.kl-proof-copy ul { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:24px; list-style:none; margin:0; padding:0; }
.kl-proof-copy li { display:flex; align-items:center; height:52px; padding:0 8px 0 0; border-bottom:1px solid #ffffff0f; font:500 15px/1.3 var(--kl-display); letter-spacing:-.02em; }
.kl-proof-media { width:100%; aspect-ratio:519/376.83; border-radius:16px; background:#0b8bea; }
.kl-cases-inner { overflow:hidden; background:#0b8bea; color:white; }
.kl-case-head { width:min(1024px,calc(100% - 2 * var(--kl-gutter))); }
.kl-case-head > div:first-child { display:grid; gap:16px; }
.kl-case-head p { color:inherit; }
.kl-case-arrows { display:flex; flex:none; gap:8px; }
.kl-case-arrows button { display:block; border:0; padding:0; width:32px; height:32px; background:transparent; cursor:pointer; }
.kl-case-arrows img { display:block; width:32px; height:32px; }
.kl-case-arrows [data-case-move="-1"] img { transform:scaleX(-1); }
.kl-case-scroll { overflow-x:auto; overflow-y:hidden; scrollbar-width:none; width:100%; overscroll-behavior-x:contain; scroll-snap-type:x proximity; }
.kl-case-scroll::-webkit-scrollbar { display:none; }
.kl-case-scroll[data-ready] { position:relative; overflow:clip; scroll-snap-type:none; touch-action:pan-y pinch-zoom; user-select:none; }
.kl-case-track { --card-width:335.333px; --slide-gap:8px; display:flex; gap:var(--slide-gap); width:100%; min-width:0; align-items:stretch; }
.kl-case-scroll[data-ready] .kl-case-track { will-change:transform; }
.kl-case-track > :last-child { margin-inline-end:var(--slide-gap); }
.kl-case-card { color:#212121; flex:0 0 var(--card-width); width:var(--card-width); background:#fff; border-radius:16px; padding:24px; display:flex; flex-direction:column; gap:24px; scroll-snap-align:start; }
.kl-case-image { position:relative; overflow:hidden; border-radius:12px; width:100%; aspect-ratio:287.333/210.67; }
.kl-case-image img { display:block; width:100%; height:100%; max-width:none; object-fit:cover; }
.kl-case-track .kl-case-card h3 { min-height:2.6em; }
.kl-case-text { display:flex; flex:1; flex-direction:column; align-items:flex-start; justify-content:space-between; gap:24px; }
.kl-case-card h3 { font-size:20px; line-height:1.3; }
/* Figma 503:12160: a bounded report viewport above the fixed action dock. */
.kl-case-dialog{--case-top:80px;--case-bottom:calc(118px + env(safe-area-inset-bottom));inset:0;margin:0;padding:var(--case-top) 24px var(--case-bottom);border:0;width:100%;height:100dvh;max-width:none;max-height:none;background:transparent;overflow:hidden;overscroll-behavior:contain;color:#212121}
html:has(.kl-case-dialog[open]){overflow:hidden}
/* The root owns the scroll lock; a body scroll container would unstick the navbar. */
body:has(.kl-case-dialog[open]){overflow:visible}
.kl-case-dialog::backdrop{background:rgb(0 0 0 / 20%)}
.kl-case-dialog:focus{outline:none}
.kl-case-document{position:relative;width:min(1200px,100%);height:100%;margin:0 auto;border-radius:16px;background:#fff;overflow:auto;overscroll-behavior:contain;scrollbar-width:none}
.kl-case-document::-webkit-scrollbar{display:none}
.kl-case-dialog iframe{display:block;width:100%;height:1000px;border:0}
.kl-case-dock{position:fixed;z-index:2;left:50%;bottom:calc(24px + env(safe-area-inset-bottom));transform:translateX(-50%);display:flex;align-items:center;gap:6px;padding:8px;border-radius:16px;background:#fff;box-shadow:0 16px 16px -8px #2a334605,0 3px 3px -1.5px #2a334606,0 5px 5px -2.5px #2a334604,0 1px 1px -.5px #2a334604,0 0 0 1px #0e3f7e08}
.kl-case-dock button,.kl-case-dock a{display:flex;align-items:center;justify-content:center;height:36px;border:0;border-radius:12px;font:525 13px/1 Inter,Arial,sans-serif;letter-spacing:-.26px;text-decoration:none;white-space:nowrap;cursor:pointer;transition:background-color 180ms ease}
.kl-case-dock__close{min-width:59px;padding:6px 12px;background:#f5f5f5;color:#212121}
.kl-case-dock__close:hover{background:#eaeaea}
.kl-case-dock__close:focus-visible{outline:2px solid #212121;outline-offset:-2px}
.kl-case-dock__pricing{min-width:126px;gap:9px;padding:6px 6px 6px 12px;background:#0b8bea;color:#fff}
.kl-case-dock__pricing:hover{background:#087fd9}
.kl-case-dock__pricing img{flex:none;width:24px;height:24px}

/* Animate the report rather than the dialog, so the action dock stays fixed. */
.kl-case-dialog{--case-enter:420ms;--case-exit:240ms;--case-motion:var(--case-enter);--case-ease:cubic-bezier(.22,1,.36,1)}
.kl-case-dialog::backdrop{opacity:0;transition:opacity var(--case-motion) var(--case-ease)}
.kl-case-document{opacity:0;transform:translateY(16px) scale(.99);transition:opacity var(--case-motion) var(--case-ease),transform var(--case-motion) var(--case-ease)}
.kl-case-dock{opacity:0;transition:opacity var(--case-motion) var(--case-ease)}
.kl-case-dialog[data-state="open"]::backdrop,.kl-case-dialog[data-state="open"] .kl-case-document,.kl-case-dialog[data-state="open"] .kl-case-dock{opacity:1}
.kl-case-dialog[data-state="open"] .kl-case-document{transform:none}
.kl-case-dialog[data-state="closing"]{--case-motion:var(--case-exit);--case-ease:cubic-bezier(.4,0,.2,1)}
.kl-case-dialog[data-state="closing"] .kl-case-document{transform:translateY(10px) scale(.99)}
.kl-case-dialog[data-state="closing"] .kl-case-document,.kl-case-dialog[data-state="closing"] .kl-case-dock{pointer-events:none}
@media(prefers-reduced-motion:reduce){
 .kl-case-dialog{--case-enter:0ms;--case-exit:0ms}
 .kl-case-dialog .kl-case-document{transform:none}
}

@media(min-width:1700px){.kl-case-track { --card-width:335.333px; }}
@media(max-width:850px){
  .kl-proof-pair { gap:32px; }
  .kl-proof-copy li { font-size:14px; }
}
@media(max-width:900px){
  /* Keep the first and last native scroll snaps centered before Embla starts. */
  .kl-case-scroll:not([data-ready]) .kl-case-card { scroll-snap-align:center; }
  .kl-case-scroll:not([data-ready]) .kl-case-track::before,
  .kl-case-scroll:not([data-ready]) .kl-case-track::after {
    content:""; flex:0 0 max(0px,calc((100% - var(--card-width)) / 2 - var(--slide-gap)));
  }
  .kl-case-scroll:not([data-ready]) .kl-case-card:last-child { margin-inline-end:0; }
  .kl-header { --kl-gutter:20px; --menu-paper:#f5f5f5; }
  .kl-navframe { gap:8px; }
  .kl-navframe > :is(.kl-nav,.kl-header-call) { display:none; }
  .kl-menu-icon {
    display:grid; place-items:center; width:40px; height:40px; padding:0; border:0; border-radius:12px;
    background:var(--menu-paper); color:#212121; cursor:pointer;
  }
  .kl-menu-icon::before { content:""; position:absolute; inset:-2px; }
  .kl-menu-icon > span { display:grid; place-items:center; }
  .kl-menu-icon > span::before,.kl-menu-icon > span::after {
    content:""; grid-area:1/1; width:18px; height:2px; border-radius:2px; background:currentColor;
    transform:translateY(-3px); transition:transform 450ms var(--nav-ease);
  }
  .kl-menu-icon > span::after { transform:translateY(3px); }
  .kl-menu-trigger { position:relative; margin-left:auto; }
  .kl-header:has(.kl-mobile-menu[open]) .kl-menu-trigger { opacity:0; }
  .kl-navframe .kl-wordmark { transition:transform 450ms var(--nav-ease),opacity 450ms var(--nav-ease); }
  .kl-header:has(.kl-mobile-menu[data-open]) .kl-wordmark { transform:translateY(-48px); opacity:0; }
  .kl-mobile-menu[open] {
    display:block; position:fixed; inset:0; width:100%; max-width:none; height:100dvh; max-height:none;
    padding:0; margin:0; border:0; background:transparent; color:var(--ink); overflow:hidden;
    --panel-inset:max(10px,env(safe-area-inset-left),env(safe-area-inset-right));
  }
  body:has(.kl-mobile-menu[open]) {
    position:fixed; inset-inline:0; top:var(--mobile-menu-scroll-offset); width:100%;
  }
  .kl-mobile-menu::backdrop { background:rgb(33 33 33 / 20%); backdrop-filter:blur(8px); }
  .kl-mobile-menu[data-closing]::backdrop { opacity:0; transition:opacity 450ms cubic-bezier(.32,.72,0,1); }
  .kl-mobile-panel {
    position:absolute; top:var(--panel-top); inset-inline:var(--panel-inset);
    display:flex; flex-direction:column; max-height:calc(100% - var(--panel-top) - max(10px,env(safe-area-inset-bottom)));
    padding:0; border-radius:18px; background:var(--menu-paper); overflow:hidden;
    transform:translateY(calc(-100% - 32px));
    transition:transform 450ms var(--nav-ease);
  }
  .kl-mobile-menu[data-open] .kl-mobile-panel { transform:translateY(0); transition-duration:750ms; }
  .kl-mobile-heading { display:flex; align-items:center; flex:none; height:56px; padding-inline:clamp(18px,6vw,28px); font-size:14px; }
  .kl-mobile-scroll {
    overflow-y:auto; overscroll-behavior:contain;
    padding:clamp(12px,8dvh,72px) clamp(18px,6vw,28px) 24px;
  }
  .kl-mobile-menu .kl-nav { position:static; transform:none; display:flex; align-items:stretch; flex-direction:column; gap:0; color:var(--ink); }
  .kl-mobile-menu :is(.kl-nav > a,.kl-use-trigger) {
    justify-content:space-between; width:100%; padding:0 4px; min-height:46px; border-radius:0; font-size:15px;
  }
  .kl-mobile-menu .kl-nav > * { border-bottom:1px solid rgb(33 33 33 / 9%); }
  .kl-mobile-menu .kl-nav > a::after { content:"↗"; font:500 17px/1 Inter,Arial,sans-serif; }
  .kl-mobile-menu .kl-nav > a::before,.kl-mobile-menu .kl-use-trigger::before { content:none; }
  .kl-mobile-menu .kl-nav-chevron { margin-right:2px; }
  .kl-mobile-menu .kl-nav > *,.kl-mobile-actions {
    opacity:0; transform:translateY(-16px); transition:opacity 450ms var(--nav-ease),transform 450ms var(--nav-ease);
  }
  .kl-mobile-menu[data-open] :is(.kl-nav > *,.kl-mobile-actions) {
    opacity:1; transform:none; transition-delay:calc(290ms + var(--menu-index,0) * 40ms);
  }
  .kl-mobile-actions { display:grid; gap:8px; margin-top:24px; }
  .kl-mobile-actions > a { width:100%; min-height:44px; justify-content:center; border-radius:12px; }
  .kl-mobile-actions .kl-primary { padding-inline:12px; color:white; }
  .kl-mobile-close {
    position:absolute; z-index:1; top:var(--trigger-top); left:var(--trigger-left);
    transition:background-color 450ms var(--nav-ease);
  }
  .kl-mobile-menu[data-open] .kl-mobile-close { background:white; }
  .kl-mobile-menu[data-pointer-open] .kl-mobile-close:focus { outline:none; }
  .kl-mobile-menu[data-open] .kl-mobile-close > span::before { transform:rotate(45deg); }
  .kl-mobile-menu[data-open] .kl-mobile-close > span::after { transform:rotate(-45deg); }
  .kl-use-cases[data-open]::after { display:none; }
  .kl-use-dropdown { position:static; width:100%; display:grid; grid-template-rows:0fr; transform:none; filter:none; transition:grid-template-rows 450ms var(--nav-ease),opacity 450ms var(--nav-ease),visibility 0s 450ms; }
  .kl-use-cases[data-open] .kl-use-dropdown { grid-template-rows:1fr; }
  .kl-use-menu { grid-template-columns:1fr; min-height:0; overflow:hidden; padding:0; margin:0 0 0 4px; box-shadow:none; background:transparent; }
  .kl-mobile-menu .kl-use-icon { background:white; }
  .kl-header .kl-use-link { padding:12px; }
  .kl-use-link:last-child { margin-block-end:16px; }
  .kl-use-title,.kl-use-description { white-space:normal; }
}
@media (prefers-reduced-motion:reduce) {
  .kl-mobile-menu *, .kl-mobile-menu::backdrop, .kl-menu-icon > span::before, .kl-menu-icon > span::after,
  .kl-navframe .kl-wordmark { transition-duration:0s !important; transition-delay:0s !important; }
}
@media(max-width:1000px){
  .kl-hero-heading { flex-direction:column; align-items:flex-start; }
}
@media(max-width:700px){
  .kl-announcement,.kl-header,.kl-hero,.kl-band { --kl-gutter:20px; }
  .kl-hero { padding-top:44px; gap:32px; }
  .kl-hero-heading { flex-direction:column; align-items:flex-start; gap:20px; }
  .kl-hero h1 { font-size:clamp(32px,7.8vw,40px); line-height:1.1; }
  .kl-desktop-br { display:none; }
  .kl-hero-film { aspect-ratio:16/9; border-radius:12px 12px 0 0; }
  .kl-band { padding:0 8px 8px; }
  .kl-proof-inner,.kl-cases-inner { padding-block:44px; gap:32px; }
  .kl-proof h2,.kl-cases h2 { font-size:clamp(28px,6.1vw,36px); line-height:1.15; }
  .kl-proof-title { max-width:420px; }
  .kl-proof-logos { display:flex; flex-wrap:wrap; justify-content:center; gap:4px; }
  .kl-proof-logos > div { flex:0 0 calc((100% - 8px) / 3); height:46px; border-radius:8px; }
  .kl-proof-logos img { width:calc(var(--kl-client-width,81px) * .72); max-width:80%; max-height:18px; }
  .kl-proof-pair { grid-template-columns:1fr; gap:24px; }
  .kl-proof-copy { gap:16px; }.kl-proof-copy p { font-size:18px; }
  .kl-proof-copy li { height:42px; }
  .kl-case-head { display:contents; }
  .kl-case-head > div:first-child { width:calc(100% - 2 * var(--kl-gutter)); gap:12px; }
  .kl-case-arrows { order:1; align-self:center; gap:4px; }
  .kl-case-track { --card-width:min(78vw,335.333px); }
  .kl-case-card { padding:18px; gap:18px; }.kl-case-text { gap:18px; }
  .kl-case-card h3 { font-size:18px; }
}
@media(max-width:700px),(max-height:520px) and (orientation:landscape){
 .kl-case-dialog{--case-top:calc(var(--site-header-height) + max(16px,env(safe-area-inset-top)));--case-bottom:calc(92px + env(safe-area-inset-bottom));padding-left:max(16px,env(safe-area-inset-left));padding-right:max(16px,env(safe-area-inset-right))}
 .kl-case-dock{bottom:calc(16px + env(safe-area-inset-bottom))}
 .kl-case-dock button,.kl-case-dock a{min-height:44px}
}
@media(max-height:520px) and (orientation:landscape){
 .kl-case-dialog{--case-top:max(8px,env(safe-area-inset-top));--case-bottom:calc(76px + env(safe-area-inset-bottom))}
 .kl-case-dock{bottom:calc(8px + env(safe-area-inset-bottom))}
}

@media(min-width:701px){
  .kl-proof h2, .kl-cases h2 { line-height:47px; }
  .kl-proof-title p, .kl-case-head p { line-height:17px; }
}