
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{--cream:#f5f2ec;--cream2:#eeeae2;--ink:#0e0e0e;--ink-mid:#3a3a3a;--ink-soft:#6b6b6b;--orange:#ff8c00;--orange-dim:rgba(255,140,0,.12);--border:rgba(14,14,14,.1);--border-strong:rgba(14,14,14,.22);--white:#fff;--serif:"DM Serif Display",Georgia,serif;--sans:"DM Sans",system-ui,sans-serif;--mono:"DM Mono",monospace}
html{scroll-behavior:smooth}body{font-family:var(--sans);background:var(--cream);color:var(--ink);line-height:1.6;overflow-x:hidden}a{text-decoration:none;color:inherit}button,input,textarea,select{font:inherit}
.site-loader{position:fixed;inset:0;background:var(--cream);z-index:9999;display:flex;align-items:center;justify-content:center;gap:14px;transition:opacity .45s,visibility .45s}.site-loader.hidden{opacity:0;visibility:hidden}.loader-mark{width:42px;height:42px;border-radius:50%;background:var(--ink);color:var(--white);display:grid;place-items:center;font-family:var(--serif);font-size:1.4rem;animation:pulse 1.5s infinite}.site-loader span{font-family:var(--mono);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft)}@keyframes pulse{50%{transform:scale(.92);opacity:.75}}
.nav{position:fixed;top:0;left:0;right:0;z-index:100;display:flex;align-items:center;justify-content:space-between;padding:0 48px;height:66px;background:rgba(245,242,236,.88);backdrop-filter:blur(14px);border-bottom:1px solid var(--border)}.nav-logo{font-family:var(--serif);font-size:1.14rem;display:flex;align-items:center;gap:10px}.nav-logo-dot{width:8px;height:8px;border-radius:50%;background:var(--orange);flex-shrink:0}.nav-links{display:flex;gap:30px;list-style:none}.nav-links a{font-size:.85rem;color:var(--ink-mid);transition:.2s}.nav-links a:hover,.nav-links a.active{color:var(--ink)}.nav-cta{font-size:.85rem;font-weight:600;padding:8px 18px;border-radius:7px;background:var(--ink);color:var(--white);transition:.2s}.nav-cta:hover{background:#222;transform:translateY(-1px)}.mobile-menu-btn{display:none;border:1px solid var(--border);background:transparent;border-radius:8px;width:40px;height:40px;font-size:1.35rem;color:var(--ink)}
.hero{min-height:100vh;display:flex;align-items:center;justify-content:center;text-align:center;padding:112px 24px 78px;position:relative;overflow:hidden}.hero-ambient{position:absolute;width:720px;height:720px;border-radius:50%;background:radial-gradient(circle,rgba(255,140,0,.08) 0%,transparent 70%);top:48%;left:50%;transform:translate(-50%,-50%);pointer-events:none}.hero-content{position:relative;z-index:1;display:flex;align-items:center;flex-direction:column}.hero-eyebrow{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:.72rem;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--orange);margin-bottom:22px}.hero-eyebrow-line{width:24px;height:1px;background:var(--orange)}.hero h1{font-family:var(--serif);font-size:clamp(2.55rem,5.6vw,4.9rem);font-weight:400;line-height:1.06;letter-spacing:-.03em;max-width:920px}.hero h1 em{font-style:italic;color:var(--orange)}.hero-sub{margin-top:22px;font-size:clamp(.98rem,1.55vw,1.1rem);font-weight:300;color:var(--ink-soft);max-width:680px;line-height:1.72}.hero-actions{margin-top:30px;display:flex;align-items:center;gap:14px;flex-wrap:wrap;justify-content:center}
.btn-primary,.btn-secondary,.btn-primary-light{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 26px;border-radius:8px;font-size:.86rem;font-weight:600;transition:.2s}.btn-primary{background:var(--ink);color:var(--white)}.btn-secondary{background:transparent;color:var(--ink);border:1px solid var(--border-strong)}.btn-primary-light{background:var(--orange);color:var(--white)}.btn-primary:hover,.btn-secondary:hover,.btn-primary-light:hover{transform:translateY(-2px)}
.hero-visual{width:min(900px,100%);margin-top:34px;display:grid;grid-template-columns:1fr 1.25fr;gap:14px;text-align:left}.ai-card,.hero-chat{background:var(--white);border:1px solid var(--border);border-radius:16px;box-shadow:0 24px 80px rgba(14,14,14,.08);overflow:hidden}.ai-card{padding:18px;position:relative}.visual-title{font-family:var(--mono);font-size:.72rem;text-transform:uppercase;color:var(--ink-soft);letter-spacing:.06em;margin-bottom:14px;display:flex;align-items:center;gap:7px}.visual-title i{color:var(--orange)}.data-flow{height:230px;background:var(--cream);border-radius:12px;display:grid;place-items:center;overflow:hidden;position:relative}.flow-node{position:absolute;width:58px;height:58px;border-radius:18px;background:var(--white);border:1px solid var(--border);display:grid;place-items:center;color:var(--orange);font-size:1.45rem;box-shadow:0 8px 30px rgba(14,14,14,.06);animation:float 5s ease-in-out infinite}.flow-node.n1{left:28px;top:38px}.flow-node.n2{left:50%;top:22px;transform:translateX(-50%);animation-delay:.4s}.flow-node.n3{right:30px;top:122px;animation-delay:.8s}.flow-node.n4{left:34px;bottom:28px;animation-delay:1.2s}.flow-line{position:absolute;inset:0}.mini-bars{position:absolute;left:115px;bottom:35px;display:flex;align-items:end;gap:7px;height:90px}.mini-bars span{width:12px;border-radius:999px 999px 0 0;background:var(--orange);opacity:.6;animation:barRise 2.2s ease-in-out infinite}.mini-bars span:nth-child(1){height:28px}.mini-bars span:nth-child(2){height:62px;animation-delay:.2s}.mini-bars span:nth-child(3){height:45px;animation-delay:.4s}.mini-bars span:nth-child(4){height:78px;animation-delay:.6s}@keyframes float{50%{transform:translateY(-7px)}}@keyframes barRise{50%{transform:scaleY(.72);opacity:.95}}
.hero-chat{min-height:326px}.home-chat-header{display:flex;align-items:center;justify-content:space-between;padding:13px 16px;border-bottom:1px solid var(--border);font-family:var(--mono);font-size:.72rem;text-transform:uppercase;color:var(--ink-soft);letter-spacing:.06em}.home-chat-status{display:flex;align-items:center;gap:7px}.home-chat-status::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--orange)}.home-chat-messages{min-height:166px;max-height:208px;overflow:auto;padding:18px;display:flex;flex-direction:column;gap:12px}.home-msg{display:flex;gap:10px;align-items:flex-start}.home-msg-avatar{width:28px;height:28px;border-radius:50%;background:var(--ink);color:var(--white);display:grid;place-items:center;font-size:.75rem;font-weight:700;flex-shrink:0}.home-msg.user{flex-direction:row-reverse}.home-msg.user .home-msg-avatar{background:var(--orange)}.home-bubble{padding:10px 13px;border-radius:12px;max-width:82%;font-size:.9rem;color:var(--ink-mid);background:var(--cream);white-space:pre-wrap}.home-msg.assistant .home-bubble{background:transparent;padding-left:0;color:var(--ink)}.home-chat-form{border-top:1px solid var(--border);padding:12px;background:var(--white)}.home-composer{display:flex;gap:10px;align-items:flex-end;border:1px solid var(--border);border-radius:12px;background:var(--cream);padding:8px}.home-composer textarea{flex:1;resize:none;min-height:42px;max-height:110px;background:transparent;border:0;outline:0;color:var(--ink);padding:6px}.home-composer button{width:38px;height:38px;border-radius:50%;border:0;background:var(--ink);color:var(--white);cursor:pointer}.home-chat-tools{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}.home-chip{border:1px solid var(--border);background:var(--white);color:var(--ink-soft);font-size:.77rem;border-radius:999px;padding:6px 10px;cursor:pointer}
.ticker{background:var(--ink);color:var(--white);padding:12px 0;overflow:hidden}.ticker-inner{display:flex;gap:60px;animation:ticker 26s linear infinite;width:max-content}.ticker-item{font-family:var(--mono);font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.46);white-space:nowrap;display:flex;align-items:center;gap:20px}.ticker-item::after{content:"◆";color:var(--orange);font-size:.4rem}@keyframes ticker{to{transform:translateX(-50%)}}
.stats-strip{display:grid;grid-template-columns:repeat(4,1fr);padding:56px 80px}.stat-item{padding:0 34px;border-right:1px solid var(--border)}.stat-item:last-child{border-right:0}.stat-num{font-family:var(--serif);font-size:clamp(2.15rem,3.3vw,3rem);line-height:1;letter-spacing:-.03em}.stat-num span{color:var(--orange)}.stat-label{margin-top:8px;font-size:.83rem;color:var(--ink-soft);font-weight:300;line-height:1.5}.divider{height:1px;background:var(--border);margin:0 48px}
section{padding:90px 80px}.section-label{font-family:var(--mono);font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--orange);margin-bottom:18px}.section-title{font-family:var(--serif);font-size:clamp(1.85rem,3.6vw,2.85rem);font-weight:400;line-height:1.12;letter-spacing:-.025em;max-width:720px}.section-title em{font-style:italic;color:var(--orange)}
.problem-grid,.architecture-grid{margin-top:48px;display:grid;grid-template-columns:1fr 1fr;gap:2px}.problem-card,.architecture-card,.doc-card,.page-card{background:var(--white);padding:42px 38px;border:1px solid var(--border)}.problem-card h3,.architecture-card h3,.page-card h3{font-family:var(--serif);font-size:1.42rem;font-weight:400;letter-spacing:-.02em;margin-bottom:14px}.problem-card p,.architecture-card p,.page-card p{color:var(--ink-soft);font-weight:300;line-height:1.75}.problem-card ul{list-style:none;margin-top:22px;display:grid;gap:12px}.problem-card li{display:flex;gap:10px;color:var(--ink-soft);font-size:.9rem}.problem-card li::before{content:"";width:8px;height:8px;background:var(--orange);border-radius:50%;margin-top:8px;flex-shrink:0}
.mission{background:var(--ink);color:var(--white);padding:105px 80px}.mission-grid{display:grid;grid-template-columns:1fr 1fr;gap:76px;align-items:center}.mission .section-title{color:var(--white);max-width:100%}.mission-body{font-size:.96rem;font-weight:300;color:rgba(255,255,255,.62);line-height:1.85}.mission-body p+p{margin-top:20px}.mission-quote{margin-top:34px;padding-left:22px;border-left:2px solid var(--orange);font-family:var(--serif);font-size:1.24rem;font-style:italic;color:rgba(255,255,255,.86);line-height:1.5}
.products-grid,.pages-grid{margin-top:52px;display:grid;grid-template-columns:repeat(3,1fr);gap:2px}.product-card{background:var(--white);padding:42px 36px;position:relative;overflow:hidden;transition:.2s}.product-card:hover{transform:translateY(-4px);z-index:1}.product-card::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--orange);transform:scaleX(0);transform-origin:left;transition:.3s}.product-card:hover::before{transform:scaleX(1)}.product-icon{width:44px;height:44px;border-radius:10px;background:var(--orange-dim);display:flex;align-items:center;justify-content:center;margin-bottom:22px;font-size:1.3rem;color:var(--orange)}.product-name{font-family:var(--serif);font-size:1.28rem;letter-spacing:-.02em;margin-bottom:12px}.product-desc{font-size:.86rem;color:var(--ink-soft);line-height:1.7;font-weight:300}
.how-section{background:var(--white)}.how-grid{margin-top:52px;display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--border)}.how-step{padding:42px 36px;border-right:1px solid var(--border)}.how-step:last-child{border-right:0}.how-num{font-family:var(--mono);font-size:.68rem;color:var(--orange);letter-spacing:.08em;margin-bottom:18px}.how-title{font-family:var(--serif);font-size:1.35rem;letter-spacing:-.02em;margin-bottom:14px;line-height:1.2}.how-desc{font-size:.86rem;color:var(--ink-soft);line-height:1.75;font-weight:300}.diagram{margin-top:18px;border-radius:12px;background:var(--cream);height:92px;display:flex;align-items:center;justify-content:center;overflow:hidden}.diagram svg{width:92%;height:70px}
.cta-band{background:var(--ink);padding:90px 80px;display:flex;align-items:center;justify-content:space-between;gap:40px;flex-wrap:wrap}.cta-band-title{font-family:var(--serif);font-size:clamp(1.9rem,3.5vw,2.75rem);color:var(--white);letter-spacing:-.025em;line-height:1.1;max-width:620px}.cta-band-title em{font-style:italic;color:var(--orange)}
.page-hero{padding:136px 80px 64px}.page-hero h1{font-family:var(--serif);font-weight:400;font-size:clamp(2.35rem,5vw,4.2rem);line-height:1.04;letter-spacing:-.03em;max-width:900px}.page-hero p{margin-top:22px;font-size:1.05rem;color:var(--ink-soft);max-width:720px;font-weight:300}.docs-layout{display:grid;grid-template-columns:240px 1fr;gap:40px;padding:20px 80px 90px}.docs-sidebar{position:sticky;top:90px;align-self:start;background:var(--white);border:1px solid var(--border);padding:14px;border-radius:10px}.docs-sidebar a{display:block;padding:9px 10px;border-radius:7px;color:var(--ink-soft);font-size:.86rem}.doc-section{background:var(--white);border:1px solid var(--border);padding:34px;margin-bottom:16px}.doc-section h2{font-family:var(--serif);font-weight:400;font-size:1.82rem;margin-bottom:10px}.code{background:var(--ink);color:var(--white);border-radius:10px;padding:18px;margin-top:18px;overflow:auto;font-family:var(--mono);font-size:.8rem;line-height:1.7}
.form{background:var(--white);border:1px solid var(--border);padding:34px;border-radius:12px;max-width:760px}.field{display:grid;gap:8px;margin-bottom:16px}label{font-size:.86rem;color:var(--ink-soft)}input,textarea,select{width:100%;border:1px solid var(--border);border-radius:8px;background:var(--cream);padding:13px;color:var(--ink)}textarea{min-height:140px;resize:vertical}
/* Claude-like chatbot */
.chat-app{height:calc(100vh - 66px);margin-top:66px;display:flex;background:#0d0d0d;color:#f2f2f2}.chat-sidebar{width:286px;min-width:286px;background:#151515;border-right:1px solid rgba(255,255,255,.1);display:flex;flex-direction:column;padding:12px 10px;overflow-y:auto}.sidebar-top{display:flex;align-items:center;justify-content:space-between;padding:4px 8px 12px}.chat-logo{display:flex;align-items:center;gap:9px;font-weight:700}.logo-mark,.avatar,.msg-avatar{width:30px;height:30px;border-radius:10px;background:#fff;color:#000;display:grid;place-items:center;font-weight:800}.icon-btn{width:34px;height:34px;border:0;background:transparent;color:#aaa;border-radius:10px;display:grid;place-items:center;cursor:pointer}.icon-btn:hover{background:#222;color:#fff}.new-chat-btn,.mode-btn,.chat-item{width:100%;border:1px solid rgba(255,255,255,.1);background:transparent;color:#aaa;border-radius:10px;padding:10px 12px;text-align:left;display:flex;align-items:center;gap:9px;cursor:pointer;margin-bottom:7px}.new-chat-btn{background:#202020;color:#fff}.mode-btn{display:grid;grid-template-columns:18px 1fr}.mode-btn span{grid-column:2;color:#777;font-size:11px}.mode-btn.active,.mode-btn:hover,.chat-item:hover{background:#202020;color:#fff}.section-label-chat{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:#777;margin:14px 8px 7px}.upload-card-dark{display:block;border:1px dashed rgba(255,255,255,.22);border-radius:14px;background:#202020;padding:13px;margin:8px 0 12px;cursor:pointer}.upload-card-dark input{display:none}.upload-card-dark strong{display:flex;gap:8px;align-items:center}.upload-card-dark p{font-size:12px;color:#aaa;margin-top:6px}.file-preview-dark{font-size:12px;color:#aaa;margin-bottom:8px}.file-preview-dark pre{background:#0b0b0b;border:1px solid rgba(255,255,255,.1);border-radius:10px;padding:9px;white-space:pre-wrap;max-height:180px;overflow:auto}.sidebar-footer{margin-top:auto;border-top:1px solid rgba(255,255,255,.1);padding-top:12px}.user-row{display:flex;gap:10px;align-items:center;padding:8px;border-radius:10px}.user-meta{font-size:11px;color:#777}.chat-main{flex:1;display:flex;flex-direction:column;min-width:0}.chat-topbar{height:58px;border-bottom:1px solid rgba(255,255,255,.1);display:flex;align-items:center;justify-content:space-between;padding:0 22px;background:#0d0d0d}.model-selector,.action-btn{border:1px solid rgba(255,255,255,.12);background:transparent;color:#f2f2f2;border-radius:10px;padding:8px 12px;display:inline-flex;gap:7px;align-items:center;font-size:13px}.action-btn{color:#aaa}.chat-area{flex:1;overflow-y:auto;padding:34px 60px;display:flex;flex-direction:column;gap:22px}.welcome-panel{max-width:760px;margin:16px auto 6px;text-align:center}.welcome-icon{width:46px;height:46px;border-radius:15px;background:#fff;color:#000;display:grid;place-items:center;margin:0 auto 16px;font-weight:800}.welcome-panel h1{font-family:var(--serif);font-size:clamp(2rem,4vw,3.6rem);font-weight:400;line-height:1}.welcome-panel p{max-width:620px;margin:14px auto 20px;color:#aaa;font-size:15px}.welcome-grid{display:flex;justify-content:center;flex-wrap:wrap;gap:8px}.tool-chip{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:10px;border:0;background:transparent;cursor:pointer;font-size:12px;color:#aaa}.tool-chip:hover{background:#202020;color:#fff}.msg{display:flex;gap:12px;max-width:100%}.msg.user{flex-direction:row-reverse}.msg-avatar{border-radius:50%;flex-shrink:0;font-size:12px}.msg.user .msg-avatar{background:var(--orange);color:#fff}.bubble{max-width:780px;padding:12px 16px;border-radius:18px;font-size:14px;line-height:1.7;white-space:pre-wrap}.msg.user .bubble{background:#fff;color:#000;border-radius:18px 18px 4px 18px}.msg.assistant .bubble{background:transparent;color:#f2f2f2;padding-left:0}.typing{display:inline-flex;gap:5px;padding:8px 0}.typing span{width:7px;height:7px;background:#aaa;border-radius:50%;animation:typingPulse 1s infinite}.typing span:nth-child(2){animation-delay:.15s}.typing span:nth-child(3){animation-delay:.3s}@keyframes typingPulse{0%,80%,100%{transform:scale(.55);opacity:.35}40%{transform:scale(1);opacity:1}}.input-area{padding:16px 60px 24px;border-top:1px solid rgba(255,255,255,.1);background:#0d0d0d}.composer{border:1px solid rgba(255,255,255,.18);border-radius:18px;background:#151515;overflow:hidden}.composer:focus-within{border-color:#fff}.composer-input{width:100%;padding:15px 16px 8px;border:0;background:transparent;font-size:14px;color:#f2f2f2;resize:none;outline:0;min-height:54px;max-height:180px}.composer-footer{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;gap:10px}.composer-tools{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.tool-btn{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:10px;border:0;background:transparent;cursor:pointer;font-size:12px;color:#aaa}.tool-btn:hover{background:#202020;color:#fff}.send-btn{width:34px;height:34px;border-radius:50%;border:0;background:#fff;color:#000;cursor:pointer;display:grid;place-items:center;flex-shrink:0}.disclaimer{text-align:center;font-size:11px;color:#777;margin-top:8px}.mobile-close,.mobile-menu-open{display:none}
footer{background:var(--cream);padding:58px 80px 36px;border-top:1px solid var(--border)}.footer-top{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:60px;margin-bottom:54px}.footer-logo{font-family:var(--serif);font-size:1.1rem;color:var(--ink);margin-bottom:16px;display:flex;align-items:center;gap:8px}.footer-tagline{font-size:.85rem;color:var(--ink-soft);font-weight:300;line-height:1.6;max-width:300px}.footer-col-title{font-family:var(--mono);font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink);margin-bottom:18px}.footer-links{list-style:none;display:flex;flex-direction:column;gap:10px}.footer-links a{font-size:.85rem;color:var(--ink-soft);font-weight:300}.footer-bottom{display:flex;align-items:center;justify-content:space-between;padding-top:26px;border-top:1px solid var(--border);font-size:.78rem;color:var(--ink-soft)}
.reveal{opacity:0;transform:translateY(24px);transition:opacity .6s ease,transform .6s ease}.reveal.visible{opacity:1;transform:translateY(0)}
@media(max-width:980px){.nav{padding:0 24px}.mobile-menu-btn{display:grid;place-items:center}.nav-links{position:fixed;top:66px;left:16px;right:16px;background:var(--cream);border:1px solid var(--border);border-radius:12px;padding:16px;display:none;flex-direction:column;gap:14px;align-items:flex-start}.nav-links.open{display:flex}.nav-cta{display:none}section,.mission,.cta-band,.page-hero{padding:60px 24px}.hero-visual,.stats-strip,.problem-grid,.mission-grid,.products-grid,.how-grid,.footer-top,.docs-layout{grid-template-columns:1fr}.stats-strip{padding:44px 24px;gap:30px}.stat-item{border-right:0;padding:0}.how-step{border-right:0;border-bottom:1px solid var(--border)}.docs-layout{padding:20px 24px 64px}.docs-sidebar{position:static}.chat-app{height:calc(100vh - 66px)}.chat-sidebar{position:fixed;top:66px;left:0;bottom:0;z-index:120;transform:translateX(-105%);transition:.22s;box-shadow:30px 0 80px rgba(0,0,0,.4)}.chat-sidebar.open{transform:translateX(0)}.mobile-close,.mobile-menu-open{display:grid}.chat-area{padding:24px 18px}.input-area{padding:12px 14px 18px}.footer-bottom{flex-direction:column;gap:12px;text-align:center}footer{padding:44px 24px 30px}}
@media(max-width:560px){.hero h1{font-size:2.7rem}.hero-chat{margin-top:0}.home-chat-header{align-items:flex-start;gap:8px;flex-direction:column}.home-composer{align-items:stretch;flex-direction:column}.home-composer button{width:100%;border-radius:8px}.stats-strip{grid-template-columns:1fr}.composer-footer{align-items:stretch;flex-direction:column}.send-btn{width:100%;border-radius:10px}.chat-topbar{padding:0 12px}.welcome-panel{text-align:left}.welcome-icon{margin-left:0}.welcome-grid{justify-content:flex-start}.bubble{max-width:100%}}


/* =========================================================
   Kognitiv Chatbot v5 — same visual identity as the site
   ========================================================= */
.chat-app{
  height:calc(100vh - 66px);
  margin-top:66px;
  display:flex;
  background:var(--cream);
  color:var(--ink);
  overflow:hidden;
}

.chat-sidebar{
  width:282px;
  min-width:282px;
  background:var(--cream2);
  border-right:1px solid var(--border);
  display:flex;
  flex-direction:column;
  padding:12px 10px;
  overflow-y:auto;
  height:calc(100vh - 66px);
}

.sidebar-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:4px 8px 12px;
}

.chat-logo{
  display:flex;
  align-items:center;
  gap:9px;
  font-family:var(--serif);
  font-size:1.05rem;
  color:var(--ink);
}

.logo-mark,
.avatar,
.msg-avatar{
  width:30px;
  height:30px;
  border-radius:10px;
  background:var(--ink);
  color:var(--white);
  display:grid;
  place-items:center;
  font-weight:800;
}

.icon-btn{
  width:34px;
  height:34px;
  border:1px solid transparent;
  background:transparent;
  color:var(--ink-soft);
  border-radius:10px;
  display:grid;
  place-items:center;
  cursor:pointer;
}

.icon-btn:hover{
  background:var(--white);
  color:var(--ink);
  border-color:var(--border);
}

.new-chat-btn,
.mode-btn,
.chat-item{
  width:100%;
  border:1px solid var(--border);
  background:transparent;
  color:var(--ink-soft);
  border-radius:10px;
  padding:9px 11px;
  text-align:left;
  display:flex;
  align-items:center;
  gap:9px;
  cursor:pointer;
  margin-bottom:7px;
  font-size:.84rem;
}

.new-chat-btn{
  background:var(--white);
  color:var(--ink);
  font-weight:600;
}

.mode-btn{
  display:grid;
  grid-template-columns:18px 1fr;
}

.mode-btn span{
  grid-column:2;
  color:var(--ink-soft);
  font-size:11px;
}

.mode-btn.active,
.mode-btn:hover,
.chat-item:hover{
  background:var(--white);
  color:var(--ink);
  border-color:var(--border-strong);
}

.section-label-chat{
  font-family:var(--mono);
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:var(--orange);
  margin:14px 8px 7px;
}

.upload-card-dark{
  display:block;
  border:1px dashed var(--border-strong);
  border-radius:14px;
  background:var(--white);
  padding:13px;
  margin:8px 0 12px;
  cursor:pointer;
}

.upload-card-dark input{display:none}

.upload-card-dark strong{
  display:flex;
  gap:8px;
  align-items:center;
  color:var(--ink);
  font-size:.86rem;
}

.upload-card-dark strong i{color:var(--orange)}

.upload-card-dark p{
  font-size:12px;
  color:var(--ink-soft);
  margin-top:6px;
  line-height:1.45;
}

.file-preview-dark{
  font-size:12px;
  color:var(--ink-soft);
  margin-bottom:8px;
}

.file-preview-dark pre{
  background:var(--cream);
  color:var(--ink-mid);
  border:1px solid var(--border);
  border-radius:10px;
  padding:9px;
  white-space:pre-wrap;
  max-height:150px;
  overflow:auto;
}

.file-preview-card{
  background:var(--white);
  border:1px solid var(--border);
  border-radius:14px;
  padding:12px;
  display:grid;
  gap:8px;
}

.file-preview-title{
  display:flex;
  align-items:center;
  gap:8px;
  color:var(--ink);
  font-weight:700;
}

.file-preview-title i{color:var(--orange)}

.file-preview-metrics{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:7px;
}

.file-preview-metric{
  background:var(--cream);
  border:1px solid var(--border);
  border-radius:9px;
  padding:7px;
}

.file-preview-metric strong{
  display:block;
  color:var(--ink);
  font-size:.82rem;
}

.file-preview-metric span{
  color:var(--ink-soft);
  font-size:.7rem;
}

.sidebar-footer{
  margin-top:auto;
  border-top:1px solid var(--border);
  padding-top:12px;
}

.user-row{
  display:flex;
  gap:10px;
  align-items:center;
  padding:8px;
  border-radius:10px;
  color:var(--ink);
}

.user-meta{
  font-size:11px;
  color:var(--ink-soft);
}

.chat-main{
  flex:1;
  display:flex;
  flex-direction:column;
  min-width:0;
  height:calc(100vh - 66px);
}

.chat-topbar{
  height:56px;
  min-height:56px;
  border-bottom:1px solid var(--border);
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 20px;
  background:rgba(245,242,236,.9);
  backdrop-filter:blur(10px);
}

.model-selector,
.action-btn{
  border:1px solid var(--border);
  background:var(--white);
  color:var(--ink);
  border-radius:10px;
  padding:7px 11px;
  display:inline-flex;
  gap:7px;
  align-items:center;
  font-size:13px;
  cursor:pointer;
}

.action-btn{
  color:var(--ink-soft);
}

.action-btn:hover,
.model-selector:hover{
  border-color:var(--border-strong);
  color:var(--ink);
}

.chat-area{
  flex:1;
  overflow-y:auto;
  padding:24px 42px 18px;
  display:flex;
  flex-direction:column;
  gap:18px;
  background:var(--cream);
}

.chat-area::-webkit-scrollbar{width:5px}
.chat-area::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:999px}

.welcome-panel{
  max-width:780px;
  margin:4px auto 2px;
  text-align:center;
  background:var(--white);
  border:1px solid var(--border);
  border-radius:18px;
  padding:30px;
  box-shadow:0 18px 60px rgba(14,14,14,.06);
}

.welcome-icon{
  width:44px;
  height:44px;
  border-radius:14px;
  background:var(--ink);
  color:var(--white);
  display:grid;
  place-items:center;
  margin:0 auto 14px;
  font-weight:800;
}

.welcome-panel h1{
  font-family:var(--serif);
  font-size:clamp(1.9rem,3.4vw,3rem);
  font-weight:400;
  line-height:1;
  letter-spacing:-.025em;
}

.welcome-panel p{
  max-width:620px;
  margin:12px auto 18px;
  color:var(--ink-soft);
  font-size:.94rem;
}

.welcome-grid{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:8px;
}

.tool-chip{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid var(--border);
  background:var(--white);
  cursor:pointer;
  font-size:12px;
  color:var(--ink-soft);
}

.tool-chip i{color:var(--orange)}

.tool-chip:hover{
  background:var(--cream);
  color:var(--ink);
  border-color:var(--border-strong);
}

.msg{
  display:flex;
  gap:12px;
  max-width:100%;
  animation:messageIn .28s ease both;
}

@keyframes messageIn{
  from{opacity:0;transform:translateY(8px)}
  to{opacity:1;transform:translateY(0)}
}

.msg.user{
  flex-direction:row-reverse;
}

.msg-avatar{
  width:30px;
  height:30px;
  border-radius:50%;
  flex-shrink:0;
  font-size:12px;
}

.msg.user .msg-avatar{
  background:var(--orange);
  color:var(--white);
}

.bubble{
  max-width:min(760px,85%);
  padding:10px 14px;
  border-radius:16px;
  font-size:14px;
  line-height:1.7;
  white-space:pre-wrap;
}

.msg.user .bubble{
  background:var(--ink);
  color:var(--white);
  border-radius:16px 16px 4px 16px;
}

.msg.assistant .bubble{
  background:transparent;
  color:var(--ink);
  padding-left:0;
}

.msg.assistant .bubble::before{
  content:"Kognitiv Core";
  display:block;
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--orange);
  margin-bottom:4px;
}

.typing{
  display:inline-flex;
  gap:5px;
  padding:8px 0;
}

.typing span{
  width:7px;
  height:7px;
  background:var(--orange);
  border-radius:50%;
  animation:typingPulse 1s infinite;
}

.typing span:nth-child(2){animation-delay:.15s}
.typing span:nth-child(3){animation-delay:.3s}

@keyframes typingPulse{
  0%,80%,100%{transform:scale(.55);opacity:.35}
  40%{transform:scale(1);opacity:1}
}

.input-area{
  padding:10px 42px 14px;
  border-top:1px solid var(--border);
  background:rgba(245,242,236,.94);
  backdrop-filter:blur(10px);
}

.composer{
  border:1px solid var(--border-strong);
  border-radius:16px;
  background:var(--white);
  overflow:hidden;
  box-shadow:0 12px 50px rgba(14,14,14,.08);
}

.composer:focus-within{
  border-color:var(--ink);
}

.composer-input{
  width:100%;
  padding:11px 14px 6px;
  border:0;
  background:transparent;
  font-size:14px;
  color:var(--ink);
  resize:none;
  outline:0;
  min-height:42px;
  height:42px;
  max-height:118px;
  line-height:1.45;
}

.composer-footer{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:6px 10px 8px;
  gap:10px;
}

.composer-tools{
  display:flex;
  align-items:center;
  gap:6px;
  flex-wrap:wrap;
}

.tool-btn{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 10px;
  border-radius:10px;
  border:1px solid transparent;
  background:transparent;
  cursor:pointer;
  font-size:12px;
  color:var(--ink-soft);
}

.tool-btn:hover{
  background:var(--cream);
  color:var(--ink);
  border-color:var(--border);
}

.send-btn{
  width:32px;
  height:32px;
  border-radius:50%;
  border:0;
  background:var(--ink);
  color:var(--white);
  cursor:pointer;
  display:grid;
  place-items:center;
  flex-shrink:0;
  transition:.15s;
}

.send-btn:hover{
  transform:translateY(-1px);
  opacity:.9;
}

.disclaimer{
  text-align:center;
  font-size:10.5px;
  color:var(--ink-soft);
  margin-top:7px;
}

.mobile-close,
.mobile-menu-open{
  display:none;
}

@media(max-width:980px){
  .chat-app{height:calc(100vh - 66px)}
  .chat-sidebar{
    position:fixed;
    top:66px;
    left:0;
    bottom:0;
    z-index:120;
    transform:translateX(-105%);
    transition:.22s;
    box-shadow:30px 0 80px rgba(0,0,0,.18);
  }
  .chat-sidebar.open{transform:translateX(0)}
  .mobile-close,.mobile-menu-open{display:grid}
  .chat-area{padding:20px 18px 14px}
  .input-area{padding:10px 14px 14px}
}

@media(max-width:560px){
  .chat-topbar{padding:0 12px}
  .welcome-panel{text-align:left;padding:22px}
  .welcome-icon{margin-left:0}
  .welcome-grid{justify-content:flex-start}
  .composer-footer{align-items:stretch;flex-direction:column}
  .send-btn{width:100%;border-radius:10px}
  .bubble{max-width:100%}
}
