#kvalli-landing .library-cover { position:relative; aspect-ratio:4/3; overflow:hidden; border-radius:var(--kv-radius); background:var(--kv-assistant-bg); color:white; }
#kvalli-landing .library-cover-image { width:100%; height:100%; object-fit:cover; }
#kvalli-landing .library-cover-shade { position:absolute; inset:0; background:linear-gradient(0deg,rgba(12,18,40,.88),rgba(12,18,40,.1) 90%); }
#kvalli-landing .library-cover .unified-brands { top:24px; left:24px; right:24px; gap:8px; flex-wrap:wrap; }
#kvalli-landing .library-cover-title { position:absolute; left:24px; right:24px; bottom:64px; font-size:clamp(24px,3cqw,40px); font-weight:700; line-height:1.05; letter-spacing:-.035em; }
#kvalli-landing .library-cover-caption { position:absolute; left:24px; right:24px; bottom:24px; font-size:12px; line-height:1.5; }
#kvalli-landing .library-cover.illustrated { background:var(--kv-violet); }
#kvalli-landing .library-cover.illustrated .library-cover-image { object-fit:contain; width:55%; height:75%; margin-left:auto; opacity:.85; }
#kvalli-landing .library-cover.illustrated .library-cover-shade { background:linear-gradient(0deg,rgba(28,18,92,.75),transparent 85%); }
#kvalli-landing .library-article .library-demo { display:grid; grid-template-columns:minmax(0,1fr); gap:24px; background:var(--kv-assistant-bg); border-radius:var(--kv-radius); padding:24px; }
#kvalli-landing .library-article .v4-layout { padding-top:0; }
#kvalli-landing .library-demo .messenger-phone { width:min(100%,380px); margin-inline:auto; }
#kvalli-landing .library-demo h2 { margin-bottom:16px; }
#kvalli-landing .library-demo p { margin:0 0 16px; }
#kvalli-landing .editorial-example { border:1px solid var(--kv-line); border-radius:var(--kv-radius); margin:24px 0 0; padding:24px; background:var(--kv-assistant-bg); }
#kvalli-landing .editorial-example figcaption { font-size:16px; font-weight:600; margin-bottom:16px; }
#kvalli-landing .editorial-example dl { margin:0; }
#kvalli-landing .editorial-example dl>div { display:grid; grid-template-columns:minmax(120px,1fr) minmax(0,3fr); gap:16px; padding:16px 0; border-top:1px solid var(--kv-line); }
#kvalli-landing .editorial-example dl>div:first-child { border-top:0; padding-top:0; }
#kvalli-landing .editorial-example dl>div:last-child { padding-bottom:0; }
#kvalli-landing .editorial-example dt { font-size:14px; font-weight:600; line-height:1.5; }
#kvalli-landing .editorial-example dd { font-size:16px; line-height:1.65; margin:0; }
#kvalli-landing .editorial-example .example-caption { font-size:12px; color:var(--kv-muted); margin:0 0 16px; }
#kvalli-landing .editorial-example pre { white-space:pre-wrap; overflow-wrap:anywhere; font:14px/1.5 monospace; margin:16px 0; }
#kvalli-landing .article-table { width:100%; table-layout:fixed; border-collapse:collapse; margin:24px 0; }
#kvalli-landing .article-table :is(th,td) { padding:16px; text-align:left; vertical-align:top; font-size:14px; line-height:1.5; border-bottom:1px solid var(--kv-line); overflow-wrap:anywhere; }
#kvalli-landing .article-table th { background:var(--kv-assistant-bg); font-weight:600; }
@media(max-width:600px){ #kvalli-landing .article-table :is(th,td) { padding:10px 8px; } }
#kvalli-landing .library-article .article-body li { padding-left:4px; margin:0 0 12px; }
#kvalli-landing .library-article .article-body ol { margin:0 0 24px; }
#kvalli-landing .library-article .setup-ui-title { gap:12px; }
#kvalli-landing .library-article .setup-ui-title img { flex:0 0 32px; }
#kvalli-landing .library-catalog { padding:40px 0; }
#kvalli-landing .catalog-intro { max-width:900px; margin:0 0 var(--kv-section-space); }
#kvalli-landing .catalog-intro h1 { font-size:clamp(32px,4cqw,48px); line-height:1.05; letter-spacing:-.045em; font-weight:700; margin:0 0 24px; }
#kvalli-landing .catalog-intro>p { font-size:16px; line-height:1.65; margin-bottom:24px; }
#kvalli-landing .catalog-topics { display:flex; flex-wrap:wrap; gap:8px; }
#kvalli-landing .catalog-topics a { font-size:14px; padding:10px 16px; border:1px solid var(--kv-line); border-radius:var(--kv-radius); color:var(--kv-violet-ink); }
#kvalli-landing .catalog-section { margin:0 0 var(--kv-section-space); scroll-margin-top:24px; }
#kvalli-landing .catalog-section>h2 { font-size:32px; line-height:1.15; font-weight:600; letter-spacing:-.035em; margin:0 0 24px; }
#kvalli-landing .library-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); grid-auto-rows:auto; gap:16px var(--kv-gap); }
#kvalli-landing .library-card { display:grid; grid-row:span 4; grid-template-rows:subgrid; gap:16px; padding-bottom:24px; color:var(--kv-ink); text-decoration:none; }
#kvalli-landing .library-card .library-cover { aspect-ratio:4/3; }
#kvalli-landing .library-card .library-cover-title { font-size:26px; left:16px; right:16px; bottom:48px; }
#kvalli-landing .library-card .library-cover-caption { bottom:16px; left:16px; right:16px; }
#kvalli-landing .library-card .unified-brands { top:16px; left:16px; right:16px; }
#kvalli-landing .library-card .brand { padding:6px 8px; font-size:12px; gap:6px; border-radius:var(--kv-radius); }
#kvalli-landing .library-card .brand img { width:18px; height:18px; }
#kvalli-landing .library-card h3 { font-size:22px; line-height:1.3; font-weight:600; letter-spacing:-.02em; margin:0; }
#kvalli-landing .library-card p { font-size:14px; line-height:1.65; color:var(--kv-muted); margin:0; }
#kvalli-landing .card-link { font-size:14px; line-height:1.5; color:var(--kv-violet-ink); text-decoration:underline; text-underline-offset:5px; align-self:end; }
#kvalli-landing .library-card:hover .card-link { text-decoration-thickness:2px; }
@container kv (max-width:1000px) { #kvalli-landing .library-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@container kv (max-width:680px) {
 #kvalli-landing .library-grid { grid-template-columns:minmax(0,1fr); }
 #kvalli-landing .library-card { grid-row:auto; grid-template-rows:none; gap:16px; }
 #kvalli-landing .editorial-example { padding:16px; }
 #kvalli-landing .editorial-example dl>div { grid-template-columns:minmax(0,1fr); gap:8px; }
 #kvalli-landing .library-article .library-demo { padding:16px; }
 #kvalli-landing .library-cover-title { font-size:30px; }
 #kvalli-landing .library-cover .unified-brands { left:16px; right:16px; top:16px; }
}
