/* KITZLABS V7 – ART DIRECTED BUSINESS FRONTEND, 15 Oct 2026
   Additive after V6. Photography is stock, not customer work.
   Motion progressively enhanced, no animations for reduced-motion users.
*/
:root{--kl7-line:rgba(145,198,251,.23);--kl7-blue:#51d8ff;--kl7-purple:#ae70ff;--kl7-ink:#071329;--kl7-surface:#122542;--kl7-glow:0 24px 62px rgba(1,9,30,.35)}
html{scroll-padding-top:105px}
body.kl7-ready{background:#071225}
body.kl7-ready main{min-width:0}
body.kl7-ready :is(a,button):focus-visible{outline:2px solid #8ce9ff;outline-offset:3px}
body.kl7-ready .kl7-eyebrow{font-size:.65rem;letter-spacing:.18em;color:#76dafc;font-weight:740;text-transform:uppercase}
body.kl7-ready .kl7-page-link{display:inline-flex;align-items:center;gap:8px;padding:11px 15px;border:1px solid rgba(95,189,252,.39);border-radius:12px;text-decoration:none;color:#d9f4ff!important;font-size:.77rem;font-weight:700;transition:background .25s,transform .25s}
body.kl7-ready .kl7-page-link:is(:hover,:focus-visible){background:rgba(51,133,214,.19);transform:translateY(-2px)}
/* FIX: use case description & workflow tags must NEVER overlay content */
body.kl7-ready .v7-usecase-grid{align-items:stretch;gap:18px!important}
body.kl7-ready .v7-usecase-card{
  display:flex!important;flex-direction:column!important;align-items:stretch;
  min-height:0!important;padding:0!important;gap:0!important;
  overflow:hidden;border:1px solid rgba(127,184,246,.23)!important;border-radius:22px!important;
  background:linear-gradient(149deg,#142741,#0c1a32)!important;
  box-shadow:0 14px 35px rgba(1,9,30,.18)!important;
  transition:transform .34s cubic-bezier(.2,.77,.2,1),border-color .28s,box-shadow .35s;
}
body.kl7-ready .v7-usecase-card:hover{transform:translateY(-5px);border-color:rgba(100,217,253,.57)!important;box-shadow:0 25px 55px rgba(1,9,30,.35)!important}
body.kl7-ready .v7-usecase-card::after{display:none}
body.kl7-ready .v7-usecase-card .kl7-case-photo{
  height:155px;min-height:155px;position:relative;overflow:hidden;
  border-bottom:1px solid rgba(119,172,249,.18);
}
body.kl7-ready .v7-usecase-card .kl7-case-photo::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(0deg,rgba(12,25,48,.84) 0%,transparent 68%);
}
body.kl7-ready .v7-usecase-card .kl7-case-photo img{
 display:block;width:100%;height:100%;object-fit:cover;filter:saturate(.72) brightness(.83);
 transition:transform .65s cubic-bezier(.2,.7,.2,1),filter .65s ease;
}
body.kl7-ready .v7-usecase-card:hover .kl7-case-photo img{transform:scale(1.05);filter:saturate(.99) brightness(.94)}
body.kl7-ready .v7-usecase-card .kl7-card-inner{
  padding:24px clamp(19px,2vw,28px) 22px;display:flex;flex-direction:column;gap:0;flex:1;min-width:0;
}
body.kl7-ready .v7-usecase-card .v7-card-index{color:#89cee8!important;letter-spacing:.105em;font-size:.61rem!important}
body.kl7-ready .v7-usecase-card h3{
 margin:15px 0 10px!important;line-height:1.21!important;font-size:clamp(1.22rem,1.77vw,1.75rem)!important;
 letter-spacing:-.048em!important;max-width:none!important;color:#f3f8ff!important;text-wrap:balance;
}
body.kl7-ready .v7-usecase-card p{
 margin:0 0 19px!important;font-size:clamp(.79rem,.86vw,.86rem)!important;
 line-height:1.72!important;color:#bbcee6!important;max-width:none!important;
}
body.kl7-ready .v7-usecase-card .v7-flow{
 position:static!important;left:auto!important;right:auto!important;bottom:auto!important;
 margin-top:auto!important;display:flex!important;flex-wrap:wrap!important;align-items:center;
 gap:6px!important;width:100%;min-width:0;overflow:visible;
}
body.kl7-ready .v7-usecase-card .v7-flow span{
 display:inline-flex!important;min-height:26px!important;max-width:100%;width:auto!important;
 padding:5px 8px!important;margin:0!important;flex:none;white-space:normal!important;
 border:1px solid rgba(129,180,243,.28)!important;border-radius:7px!important;
 color:#c9edff!important;background:#172e50!important;
 font-family:"Sora",system-ui,sans-serif!important;font-size:.60rem!important;font-weight:650!important;
 line-height:1.45!important;letter-spacing:0!important;box-shadow:none!important;
}
body.kl7-ready .v7-usecase-card .v7-flow b{
 display:inline!important;flex:none;color:#80cdf8!important;background:none!important;
 font-size:.69rem!important;width:auto!important;height:auto!important;box-shadow:none!important
}
body.kl7-ready .v7-usecase-card .kl7-card-cta{
 display:inline-flex;align-items:center;gap:8px;margin-top:18px;
 color:#a2e6ff!important;font-size:.75rem;font-weight:710;text-decoration:none;
}
body.kl7-ready .v7-usecase-card .kl7-card-cta:hover{text-decoration:underline;text-underline-offset:4px}

/* NEW: Interactive systems canvas. ONE animation/controller, not layered old versions. */
body.kl7-ready .kl7-network{
 position:relative;isolation:isolate;width:100%;padding:clamp(27px,4.7vw,62px)!important;
 margin:22px 0!important;border:1px solid var(--kl7-line)!important;border-radius:26px!important;
 background:radial-gradient(ellipse at 81% 0%,rgba(131,70,235,.18),transparent 52%),
 radial-gradient(ellipse at 9% 92%,rgba(34,174,229,.14),transparent 49%),
 linear-gradient(141deg,#0b1730,#10203e)!important;color:#eef7ff!important;overflow:hidden;
}
.kl7-network-head{display:flex;align-items:end;justify-content:space-between;gap:26px;margin-bottom:33px}
.kl7-network-head h2{
 font-size:clamp(2.2rem,4.2vw,4.15rem)!important;line-height:1.08!important;letter-spacing:-.065em!important;
 max-width:18ch;color:#f7faff!important;margin:9px 0 0!important;font-weight:680!important;text-wrap:balance;
}
.kl7-network-head>p{max-width:52ch;line-height:1.77;color:#b7cee9!important;margin:0}
.kl7-network-layout{display:grid;grid-template-columns:minmax(0,1.9fr) minmax(240px,.63fr);gap:17px}
.kl7-network-canvas{
 position:relative;isolation:isolate;min-height:518px;overflow:hidden;
 padding:53px clamp(15px,3vw,36px) 25px;border:1px solid rgba(144,187,245,.22);border-radius:21px;
 background:linear-gradient(146deg,rgba(28,49,83,.54),rgba(11,25,50,.95)),
 radial-gradient(ellipse at center,rgba(84,107,228,.07),transparent 65%);
}
.kl7-network-canvas::before{
 content:"";inset:0;position:absolute;z-index:-1;pointer-events:none;opacity:.31;
 background-image:linear-gradient(rgba(137,183,243,.09) 1px,transparent 1px),
 linear-gradient(90deg,rgba(137,183,243,.09) 1px,transparent 1px);
 background-size:35px 35px;
}
.kl7-network-status{
 position:absolute;top:15px;left:50%;transform:translateX(-50%);white-space:nowrap;z-index:3;
 display:flex;align-items:center;gap:8px;background:#0c1c32;border:1px solid rgba(134,180,241,.26);
 padding:8px 11px;border-radius:999px;font-size:.61rem;font-weight:710;color:#b5d9fb;letter-spacing:.08em;
}
.kl7-network-status::before{content:"";width:7px;height:7px;background:#55e8c0;border-radius:50%;box-shadow:0 0 0 3px rgba(64,198,169,.10)}
.kl7-net-routes{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none}
.kl7-net-routes path{fill:none;stroke:rgba(116,169,232,.27);stroke-width:1.6;stroke-dasharray:4 9}
.kl7-net-routes path.is-active{stroke:var(--kl7-blue);stroke-width:2.7;stroke-dasharray:9 9;filter:drop-shadow(0 0 6px #6ee4ff)}
.kl7-net-routes path.core-line{stroke:rgba(160,116,254,.4)}
@media(prefers-reduced-motion:no-preference){
 body.kl7-ready .kl7-network.kl7-in-view .kl7-net-routes path.is-active{
  animation:kl7Route 4s linear infinite;
 }
 @keyframes kl7Route {to{stroke-dashoffset:-210}}
}
.kl7-network-grid{
 position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr) minmax(0,1fr);
 gap:clamp(12px,2.4vw,25px);align-items:center;min-height:410px;
}
.kl7-node-stack{display:grid;gap:14px;min-width:0}
.kl7-node{
 display:flex;align-items:center;gap:10px;min-width:0;min-height:83px;text-align:left;cursor:pointer;
 padding:14px 13px;border:1px solid rgba(159,191,242,.24);border-radius:14px;
 color:#e8f5ff;background:rgba(26,47,80,.89);
 font:650 .78rem/1.4 "Sora",system-ui,sans-serif;
 transition:transform .25s ease,box-shadow .25s,border-color .25s,background .3s;
}
.kl7-node svg{width:27px;height:27px;flex:none;stroke:#83d5ff;stroke-width:1.6;fill:none}
.kl7-node small{display:block;font-size:.55rem;color:#8eaccb;letter-spacing:.08em;margin-bottom:5px}
.kl7-node strong{display:block;overflow-wrap:anywhere;color:#e9f5ff}
.kl7-node[aria-pressed=true]{transform:translateY(-2px);background:rgba(36,73,119,.98);border-color:#62d4ff;box-shadow:0 0 0 1px rgba(85,213,255,.14),0 12px 35px rgba(21,73,141,.25)}
.kl7-node[aria-pressed=true] svg{stroke:#a5f1ff}
.kl7-node:focus-visible{outline:2px solid #8de7ff;outline-offset:3px}
.kl7-node--ai{min-height:119px;background:rgba(57,62,115,.91);border-color:rgba(170,119,245,.49)}
.kl7-node--approval{min-height:83px}
.kl7-network-detail{
 display:flex;flex-direction:column;gap:0;padding:25px 22px;border:1px solid rgba(129,188,248,.26);
 border-radius:21px;background:linear-gradient(155deg,#1b2b4b,#121e37);min-width:0
}
.kl7-network-detail-meta{display:flex;gap:12px;justify-content:space-between;font-size:.59rem;letter-spacing:.1em;color:#91aac9;text-transform:uppercase}
.kl7-network-detail-meta b{color:#7ee0bf}
.kl7-network-detail h3{font-size:clamp(1.55rem,2.6vw,2.5rem);letter-spacing:-.05em;color:#fbfdff!important;line-height:1.18!important;margin:26px 0 13px!important;overflow-wrap:anywhere}
.kl7-network-detail p{color:#bdd0e7!important;font-size:.86rem;line-height:1.75;margin:0 0 26px!important}
.kl7-steps{margin:auto 0 20px;display:grid;gap:0}
.kl7-steps div{display:flex;align-items:center;gap:12px;justify-content:space-between;border-top:1px solid rgba(142,177,237,.16);padding:13px 0;font-size:.72rem;color:#bbd1e8}
.kl7-steps b{font-size:.57rem;color:#69c8ef;letter-spacing:.10em}
.kl7-network-action{min-height:47px;text-align:center;border-radius:12px;background:#f7fbff;color:#0b1b36!important;font-size:.73rem;font-weight:740;text-decoration:none;padding:12px 14px}
.kl7-network-action:hover{background:#b7efff}

/* Visual narratives for all editorial/knowledge pages — no blank white stretches */
.kl7-editorial,.kl7-related{
 width:100%;max-width:100%;min-width:0;box-sizing:border-box;
 margin:22px auto;border:1px solid var(--kl7-line);border-radius:24px;overflow:hidden;
 background:linear-gradient(145deg,#122643,#0b1b34);color:#f1f7ff;
}
.kl7-editorial{
 display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
 gap:0;min-height:305px;align-items:stretch;
}
.kl7-editorial-content{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:12px;min-width:0;padding:clamp(25px,4vw,55px)}
.kl7-editorial-content h2{font-size:clamp(1.55rem,2.9vw,2.7rem)!important;line-height:1.17!important;letter-spacing:-.052em!important;color:#f6faff!important;margin:0!important}
.kl7-editorial-content p{font-size:.88rem!important;color:#bbcee7!important;line-height:1.7!important;margin:0 0 12px!important}
.kl7-editorial-image{position:relative;min-width:0;min-height:245px;overflow:hidden}
.kl7-editorial-image img{width:100%;height:100%;position:absolute;inset:0;display:block;object-fit:cover;filter:saturate(.82) brightness(.9);transition:transform .75s ease}
.kl7-editorial:hover .kl7-editorial-image img{transform:scale(1.04)}
.kl7-editorial-image::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(13,29,56,.34),transparent 65%);pointer-events:none}
.kl7-related{padding:clamp(26px,3vw,39px)}
.kl7-related h2{color:#f7fbff!important;font-size:clamp(1.5rem,2.6vw,2.35rem)!important;letter-spacing:-.049em!important;line-height:1.18!important;margin:9px 0 25px!important}
.kl7-related-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.kl7-related-card{min-width:0;display:flex;flex-direction:column;gap:0;overflow:hidden;border:1px solid rgba(137,186,247,.18);border-radius:16px;text-decoration:none;color:#f8fbff!important;background:#192d4a;transition:transform .27s ease,border-color .27s}
.kl7-related-card:hover{transform:translateY(-4px);border-color:rgba(99,212,251,.55)}
.kl7-related-card img{width:100%;height:114px;object-fit:cover;filter:saturate(.72) brightness(.80)}
.kl7-related-card .kl7-related-card-body{padding:17px;display:flex;flex-direction:column;gap:9px;flex:1}
.kl7-related-card strong{font-size:.86rem;line-height:1.4;color:#fff!important}
.kl7-related-card small{font-size:.72rem;line-height:1.55;color:#b1c6e0!important}
.kl7-related-card b{font-size:.72rem;color:#8fddfb;margin-top:auto;padding-top:9px}
.kl7-home-feature{
 border:1px solid var(--kl7-line);border-radius:24px;padding:clamp(32px,4vw,55px);
 margin:18px 0;background:linear-gradient(115deg,rgba(11,27,51,.92),rgba(16,35,64,.66)),
 url('/assets/v7/business-meeting.webp') center/cover no-repeat;min-height:250px;
 display:flex;align-items:center;justify-content:space-between;gap:30px;flex-wrap:wrap;
}
.kl7-home-feature>div{max-width:670px}
.kl7-home-feature h2{font-size:clamp(1.65rem,3.4vw,3rem)!important;color:#fff!important;letter-spacing:-.06em!important;line-height:1.18!important;margin:8px 0 14px!important}
.kl7-home-feature p{font-size:.89rem!important;line-height:1.7;color:#c2d5ed!important;max-width:64ch}
body.kl7-ready .seo-shell .kl7-editorial,body.kl7-ready .seo-shell .kl7-related{margin:22px 0!important}
body.kl7-ready.seo-page main.seo-shell{
 background:transparent!important;color:#f1f7ff
}
body.kl7-ready.seo-page main.seo-shell> .seo-content,
body.kl7-ready.seo-page main.seo-shell> .seo-proof-grid{max-width:100%;min-width:0}
body.kl7-ready.seo-page main.seo-shell .seo-hero h1{overflow-wrap:break-word}
body.kl7-ready :is(.configurator-main,.roi-main,.legal-main) .kl7-editorial{margin:28px auto}
body.kl7-ready .kl6-tools-showcase .kl6-tool-card:hover{transform:translateY(-4px)}
@media(min-width:1000px){
 .kl7-editorial:nth-of-type(2n) .kl7-editorial-image{order:-1}
}
/* Optional premium white larger star-cursor canvas. Stays behind interactions. */
body.kl7-ready #kitz-stars-canvas{opacity:.95!important;mix-blend-mode:screen}
body.kl7-ready .kl6-chat-dialog{z-index:2147483202}
body.kl7-ready .kl6-chat-fab{z-index:2147483201}
/* QR safe motion; no hidden text and no external animation runtime. */
@media(max-width:1080px){
 .kl7-network-head{align-items:start;flex-direction:column;gap:14px}
 .kl7-network-layout{grid-template-columns:minmax(0,1fr)}
 .kl7-network-detail{min-height:0}
 .kl7-steps{margin:16px 0}
 .kl7-network-grid{min-height:355px}
 .kl7-case-image{max-height:200px}
}
@media(max-width:690px){
 body.kl7-ready .v7-usecase-grid{grid-template-columns:1fr!important;gap:13px!important}
 body.kl7-ready .v7-usecase-card .kl7-case-photo{height:155px;min-height:155px}
 body.kl7-ready .v7-usecase-card .kl7-card-inner{padding:22px 20px}
 body.kl7-ready .v7-usecase-card h3{font-size:1.35rem!important}
 .kl7-network{padding:28px 17px!important;border-radius:20px!important}
 .kl7-network-head h2{font-size:clamp(1.95rem,8vw,2.75rem)!important}
 .kl7-network-head>p{font-size:.86rem}
 .kl7-network-canvas{padding:60px 12px 17px;min-height:490px;border-radius:15px}
 .kl7-network-grid{grid-template-columns:minmax(0,.95fr) minmax(0,1.1fr);gap:11px}
 .kl7-network-grid .kl7-node-stack:last-child{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
 .kl7-node{min-height:79px;padding:10px 8px;gap:7px}
 .kl7-node svg{width:18px;height:18px}
 .kl7-node strong{font-size:.67rem}
 .kl7-node small{font-size:.48rem}
 .kl7-node--ai{min-height:102px}
 .kl7-node-stack{gap:9px}
 .kl7-network-grid .kl7-node-stack:last-child .kl7-node{min-height:64px;flex-direction:column;align-items:flex-start}
 .kl7-net-routes{opacity:.6}
 .kl7-network-detail{padding:22px 17px}
 .kl7-network-detail h3{font-size:1.75rem}
 .kl7-editorial{grid-template-columns:1fr}
 .kl7-editorial-content{padding:26px 21px}
 .kl7-editorial-image{min-height:190px;order:-1}
 .kl7-related{padding:26px 17px}
 .kl7-related-grid{grid-template-columns:1fr;gap:9px}
 .kl7-related-card{display:grid;grid-template-columns:95px minmax(0,1fr)}
 .kl7-related-card img{width:95px;height:100%;min-height:105px}
 .kl7-related-card .kl7-related-card-body{padding:13px 15px}
 .kl7-home-feature{padding:31px 23px;min-height:280px}
}
@media(prefers-reduced-motion:reduce){
 body.kl7-ready :is(.kl7-related-card,.kl7-related-card img,.kl7-editorial-image img,.v7-usecase-card,.v7-usecase-card img,.kl7-node){animation:none!important;transition:none!important;transform:none!important}
 .kl7-net-routes path{animation:none!important}
}

/* Explicit, client-side lead drafting in the knowledge advisor. */
.kl7-chat-leads{margin:13px 0 0;border:1px solid rgba(114,181,243,.20);border-radius:13px;background:rgba(28,52,86,.42);padding:12px;display:grid;gap:10px}
.kl7-chat-leads>p{color:#c5d9ee;margin:0;font-size:.70rem;line-height:1.5}
.kl7-lead-trigger,.kl7-lead-form button{border:1px solid rgba(97,216,255,.46);background:rgba(42,122,211,.25);border-radius:10px;color:#e3f8ff;font:700 .72rem "Sora",system-ui,sans-serif;padding:10px;cursor:pointer}
.kl7-lead-form{display:grid;gap:9px}
.kl7-lead-form[hidden]{display:none!important}
.kl7-lead-form label{display:grid;gap:5px;font-size:.67rem;color:#d0e2f8}
.kl7-lead-form :is(input,textarea){width:100%;min-width:0;max-width:100%;box-sizing:border-box;border-radius:9px;background:#102442;border:1px solid rgba(146,183,244,.29);color:#fff;padding:10px;font:600 .7rem "Sora",system-ui,sans-serif;resize:vertical}
.kl7-lead-form p{font-size:.63rem;line-height:1.5;color:#aac5e2}
.kl7-lead-form button{background:linear-gradient(100deg,#33caf2,#9974e6);color:#081a32}
.kl7-lead-form :is(button,input,textarea):focus-visible,.kl7-lead-trigger:focus-visible{outline:2px solid #9fe5ff;outline-offset:2px}
