/* Figma 30:2274, 4536, 2745, 3275, 3817, 4215; shared 1280px grid. */
.kl-page main{min-height:40vh}
.kl-banner{position:relative;text-align:center;isolation:isolate;padding:142px 0 136px;margin-bottom:var(--kl-section-gap);min-height:506px}
.kl-banner:before{content:"";position:absolute;z-index:-1;pointer-events:none;left:50%;top:-96px;transform:translateX(-50%);width:100cqw;height:calc(100% + 96px);background:#fff url('/assets/kerlala-ui/images/hero-background.png') center top / max(100vw,1536px) auto no-repeat}
.kl-page .kl-banner h1{font-size:var(--kl-text-h1);line-height:var(--kl-leading-h1);margin:0 auto;max-width:1100px;font-weight:700}
.kl-page .kl-banner>p{font-size:var(--kl-text-lead);line-height:var(--kl-leading-lead);max-width:780px;margin:24px auto 0;color:#333}
.kl-banner-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:24px;margin-top:36px}
.kl-banner-actions .kh-button{height:54px;min-width:176px;padding:0 24px;font-size:var(--kl-text-button)}
.kl-page .kl-section{margin-bottom:var(--kl-section-gap)}
.kl-four{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:32px}
.kl-four article{position:relative;min-width:0}
.kl-four article+article:before{content:"";position:absolute;left:-16px;top:0;bottom:0;width:1px;background:#E4E4E1}
.kl-number{color:#999;font-size:var(--kl-text-body)}
.kl-page main .kl-four h3{font-size:var(--kl-text-h3);line-height:var(--kl-leading-h3);margin:16px 0 12px}
.kl-page main .kl-four p{font-size:var(--kl-text-body);line-height:var(--kl-leading-body);margin:0}
.kl-delivery{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.kl-delivery.kl-three{grid-template-columns:repeat(3,minmax(0,1fr))}
.kl-delivery article{border:1px solid #e1e4e8;border-radius:32px;padding:32px 24px;min-width:0}
.kl-delivery img{display:block;width:36px;height:36px;object-fit:contain;margin-bottom:24px}
.kl-page main .kl-delivery h3{font-size:var(--kl-text-h3);line-height:var(--kl-leading-h3);margin:0 0 16px}
.kl-page main .kl-delivery p{font-size:var(--kl-text-body);line-height:var(--kl-leading-body);margin:0}
.kl-process{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);gap:64px;align-items:center}
.kl-process .kh-steps{width:100%}
.kl-process-art{width:100%;aspect-ratio:583/531;overflow:hidden;position:relative}
.kl-process-art img{position:absolute;width:100.09%;max-width:none;height:146.52%;object-fit:fill;top:-26.18%;left:-.04%}
.kl-feature-list{display:grid;gap:96px}
.kl-feature{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);gap:96px;align-items:center}
.kl-feature:nth-child(even){grid-template-columns:minmax(0,1.25fr) minmax(0,1fr)}
.kl-feature:nth-child(even) .kl-feature-copy{order:2}
.kl-feature-copy{max-width:480px;padding-inline:32px}
.kl-feature:nth-child(even) .kl-feature-copy{justify-self:end}
.kl-page main .kl-feature h3{font-size:var(--kl-text-h3);line-height:var(--kl-leading-h3);margin:0 0 20px}
.kl-feature p,.kl-feature li{font-size:var(--kl-text-body);line-height:var(--kl-leading-body)}
.kl-feature ul{display:grid;gap:14px;margin-top:28px}
.kl-feature li{padding-left:26px;position:relative}
.kl-feature li:before{content:'✓';color:#146fe8;position:absolute;left:0}
.kl-feature figure{min-width:0;margin:0}
.kl-feature figure a{display:block;border-radius:24px;overflow:hidden}
.kl-feature figure img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:contain}
.kl-feature figcaption{font-size:var(--kl-text-caption);color:#888;text-align:center;margin-top:12px}
.kl-offer{position:relative;isolation:isolate;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:80px;align-items:center;padding:56px 32px}
.kl-offer:before{content:"";position:absolute;inset:0 auto 0 50%;width:100cqw;transform:translateX(-50%);background:#fbfbfb;z-index:-1}
.kl-page main .kl-offer h2{margin-bottom:32px}
.kl-page main .kl-offer h3{font-size:var(--kl-text-h3);line-height:var(--kl-leading-h3);margin:0 0 20px}
.kl-offer p{font-size:var(--kl-text-body);line-height:var(--kl-leading-body);margin:0 0 24px;max-width:480px}
.kl-offer img{width:100%;height:auto;max-width:560px;mix-blend-mode:multiply}
.kl-offer .kh-button,.kl-plan-links .kh-button{font-size:var(--kl-text-button);height:46px;padding:0 24px;width:max-content;min-width:0}
.kl-plan-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px;max-width:1120px;margin:auto}
.kl-plan-links article{padding:36px;border:1px solid #e1e4e8;border-radius:28px}
.kl-plan-links small{font-size:var(--kl-text-small);color:#999}
.kl-page main .kl-plan-links h3{font-size:var(--kl-text-h3);margin:12px 0}
.kl-plan-links p{font-size:var(--kl-text-body);line-height:var(--kl-leading-body);margin:0 0 28px}
.kl-page main .kh-faq h2{margin:0}
.kl-page .kh-faq summary{font-size:var(--kl-text-h4);line-height:var(--kl-leading-h4);min-height:78px;padding:24px 0}
.kl-page .kh-faq details>p{font-size:var(--kl-text-body);line-height:var(--kl-leading-body);margin:0 40px 24px 0}
.kl-page .kh-cta{background:linear-gradient(100deg,#80b5ff 0%,#edf5fb 46%,#fff9df 73%,#ffaf56 100%);border-radius:24px;margin-bottom:112px}
.kl-page .kh-cases-action{text-align:center;margin-top:40px}
.kl-page .kh-cases-action .kh-button{font-size:var(--kl-text-button);height:46px;min-width:0;padding:0 24px}
/* Real covers are optional. Missing covers never create empty image boxes. */
.kl-content-toolbar{display:flex;justify-content:space-between;align-items:center;gap:24px;margin-bottom:32px;flex-wrap:wrap}
.kl-content-filters{display:flex;gap:10px;flex-wrap:wrap}
.kl-content-filters button{border:1px solid #e1e4e8;border-radius:999px;background:white;font-size:var(--kl-text-small);padding:8px 20px;cursor:pointer;line-height:24px}
.kl-content-filters button[aria-pressed=true]{background:#146fe8;border-color:#146fe8;color:white}
.kl-content-search{position:relative;display:block;min-width:220px}
.kl-content-search input{width:100%;border:1px solid #e1e4e8;border-radius:999px;padding:10px 20px;font:inherit;font-size:var(--kl-text-small);line-height:var(--kl-leading-small);background:#fff}
.kl-page .content-result{font-size:var(--kl-text-small);color:#888;margin:0 0 12px}
.kl-article-list{display:grid;grid-template-columns:1fr}
.kl-page .article-card{display:grid;grid-template-columns:120px minmax(0,1fr) auto;gap:32px;align-items:center;border:0;border-bottom:1px solid #e9ebef;border-radius:0;padding:32px 0;background:transparent;min-width:0}
.kl-page .article-card[hidden]{display:none}
.kl-page .article-meta{font-size:var(--kl-text-small);line-height:var(--kl-leading-small);color:#888;display:grid;align-self:start;gap:8px}
.kl-page .article-meta>span{color:#146fe8}
.kl-page main .article-card h2{font-size:var(--kl-text-h3);line-height:var(--kl-leading-h3);margin:0 0 12px;font-weight:500;word-break:break-word}
.kl-page main .article-card p{font-size:var(--kl-text-body);line-height:var(--kl-leading-body);margin:0;max-width:850px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.kl-page .article-card .arrow{font-size:var(--kl-text-h3);width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:none;border:1px solid #e1e4e8;border-radius:50%}
.kl-article-cover{width:176px;aspect-ratio:16/10;border-radius:14px;overflow:hidden;display:block;background:#f6f8fb}
.kl-article-cover img{display:block;width:100%;height:100%;object-fit:cover}
.kl-page .article-card:has(.kl-article-cover){grid-template-columns:120px 176px minmax(0,1fr) auto}
.kl-page #content-empty{font-size:var(--kl-text-body);color:#888;padding:40px 0}
.kl-page .kl-guide-back{margin-top:32px;text-align:right;font-size:var(--kl-text-body)}
@media(max-width:1100px){.kl-banner{padding:110px 0 110px;min-height:460px}.kl-page .kl-banner h1{font-size:var(--kl-text-h1)}.kl-four,.kl-delivery{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px}.kl-four article:nth-child(3):before{display:none}.kl-feature,.kl-feature:nth-child(even){gap:40px;grid-template-columns:repeat(2,minmax(0,1fr))}.kl-feature-copy{padding:0}.kl-offer{gap:40px;padding:48px 0}.kl-page .article-card:has(.kl-article-cover){grid-template-columns:150px minmax(0,1fr) auto}.kl-page .article-card .article-meta{grid-column:1/-1;display:flex;gap:16px}.kl-article-cover{width:150px}.kl-page .article-card{grid-template-columns:minmax(0,1fr) auto;gap:16px 24px}.kl-process{gap:32px}.kl-feature-list{gap:64px}}
@media(max-width:640px){.kl-banner{padding:72px 0 80px;min-height:390px}.kl-banner:before{top:-88px;height:calc(100% + 88px);background-size:1100px auto}.kl-page .kl-banner h1{font-size:var(--kl-text-h1);line-height:var(--kl-leading-h1)}.kl-page .kl-banner>p{font-size:var(--kl-text-lead);line-height:var(--kl-leading-lead);margin-top:20px}.kl-banner-actions{gap:16px;margin-top:28px}.kl-banner-actions .kh-button{min-width:0;max-width:194px;flex:1 0 auto;font-size:var(--kl-text-button);height:48px;padding:0 16px}.kl-four,.kl-delivery,.kl-delivery.kl-three{grid-template-columns:1fr}.kl-four{gap:24px}.kl-four article{border-bottom:1px solid #E4E4E1;padding-bottom:24px}.kl-four article:before{display:none}.kl-page main .kl-four h3{margin-top:8px}.kl-delivery article{padding:28px}.kl-delivery img{margin-bottom:20px}.kl-process,.kl-feature,.kl-feature:nth-child(even),.kl-offer,.kl-plan-links{grid-template-columns:1fr;gap:32px}.kl-feature:nth-child(even) .kl-feature-copy{order:0;justify-self:stretch}.kl-feature-copy{max-width:none}.kl-feature ul{margin-top:20px}.kl-page main .kl-feature h3{font-size:var(--kl-text-h3)}.kl-feature-list{gap:56px}.kl-offer{padding:48px 0}.kl-offer img{max-width:420px;justify-self:center}.kl-page main .kl-offer h3{font-size:var(--kl-text-h3);line-height:var(--kl-leading-h3)}.kl-plan-links article{padding:28px}.kl-page .kh-cta{margin-bottom:72px}.kl-page .article-card:has(.kl-article-cover){grid-template-columns:92px minmax(0,1fr)}.kl-article-cover{width:92px;aspect-ratio:1}.kl-page .article-card{padding:24px 0;gap:14px 18px}.kl-page main .article-card h2{font-size:var(--kl-text-h3);line-height:var(--kl-leading-h3);margin-bottom:8px}.kl-page main .article-card p{font-size:var(--kl-text-body);line-height:var(--kl-leading-body);-webkit-line-clamp:2}.kl-page .article-card .arrow{display:none}.kl-page .article-card:not(:has(.kl-article-cover)){grid-template-columns:1fr}.kl-content-toolbar{gap:20px}.kl-content-search{width:100%}.kl-content-filters{gap:8px}.kl-content-filters button{padding:6px 14px}.kl-page .article-card .article-meta{font-size:var(--kl-text-caption);line-height:var(--kl-leading-caption)}.kl-page main .kh-faq h2{margin-bottom:0}}

.kl-process .kh-step summary{justify-content:flex-start}.kl-process .kh-step h3{flex:1}.kl-process .kh-step[open] .kh-step-icon{color:white}
.kl-plan-links article{min-width:0}.kl-plan-links .kh-button{max-width:100%;white-space:normal;text-align:center;height:auto;min-height:46px}
/* Figma 34:6441/6890/7262/8216/8549, shared directory and product layouts. */
.kw-directory{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.kw-directory-card{display:flex;flex-direction:column;align-items:flex-start;padding:30px 28px;border:1px solid #e1e4e8;border-radius:22px;min-width:0;background:#fff;transition:border-color .18s,background .18s}
.kw-directory-card:hover,.kw-directory-card:focus-visible{border-color:#146fe8;background:#f7faff}
.kl-page main .kw-directory-card h2{font-size:var(--kl-text-h3);line-height:var(--kl-leading-h3);margin:0 0 16px;font-weight:500}
.kw-directory-card p{font-size:var(--kl-text-body);line-height:var(--kl-leading-body);margin:0 0 24px;color:#666}
.kw-directory-card>span{font-size:var(--kl-text-small);line-height:var(--kl-leading-small);margin-top:auto}
.kw-directory-card>span span{margin-left:6px}
.kw-features{margin-top:72px}
.kw-page .kl-offer>img{justify-self:center;max-height:340px;object-fit:contain}
.kw-offer-links{display:flex;flex-wrap:wrap;gap:16px}
@media(max-width:1023px){.kw-directory{grid-template-columns:repeat(2,minmax(0,1fr))}.kw-directory-card{padding:26px 24px}}
@media(max-width:767px){.kw-directory{grid-template-columns:1fr;gap:16px}.kw-directory-card{padding:24px}.kw-features{margin-top:48px}.kw-page .kl-feature,.kw-page .kl-feature:nth-child(even){grid-template-columns:1fr;gap:28px}.kw-page .kl-feature:nth-child(even) .kl-feature-copy{order:0;justify-self:stretch}.kw-page .kl-feature-copy{padding:0;max-width:100%}.kw-page .kl-offer{grid-template-columns:1fr}.kw-offer-links{gap:12px}}