/* IT Kapital — shared styles */
body{margin:0;background:#F5F7FA}
a{color:#2B4BFF;text-decoration:none}a:hover{color:#1A33C9}
.mono{font-family:'IBM Plex Mono',ui-monospace,monospace}
.disp{font-family:'Sora',system-ui,sans-serif}
summary::-webkit-details-marker{display:none}
.shell{font-family:'IBM Plex Sans',system-ui,sans-serif;color:#0B1220;background:#F5F7FA;min-height:100vh}
.topbar{position:sticky;top:0;z-index:10;background:rgba(245,247,250,.92);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid #E2E6EE}
.topbar-in{max-width:1200px;margin:0 auto;padding:0 24px;height:72px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{display:flex;align-items:center;gap:10px;color:#0B1220}
.brand-name{font-weight:600;font-size:21px;letter-spacing:-.01em}
.navlinks{display:flex;gap:28px;font-size:15px;font-weight:500;align-items:center}
.actions{display:flex;align-items:center;gap:12px}
.btn-dark{background:#0B1220;color:#FFF;padding:12px 20px;border-radius:10px;font-size:14px;font-weight:600;min-height:44px;box-sizing:border-box;display:inline-flex;align-items:center}
.btn-dark:hover{color:#FFF;background:#1B2438}
.mnav{display:none;position:relative}
.mnav summary{list-style:none;cursor:pointer;width:44px;height:44px;display:flex;align-items:center;justify-content:center;border:1px solid #D6DBE5;border-radius:10px;background:#FFF;color:#0B1220}
.mnav-panel{position:absolute;right:0;top:52px;background:#FFF;border:1px solid #E2E6EE;border-radius:14px;box-shadow:0 20px 40px -20px rgba(11,18,32,.35);padding:8px;display:flex;flex-direction:column;min-width:220px}
.mnav-panel a{color:#0B1220;padding:12px 14px;border-radius:10px;font-weight:500;font-size:15px}
.mnav-panel a:hover{background:#F5F7FA;color:#0B1220}
.foot{border-top:1px solid #E2E6EE}
.foot-in{max-width:1200px;margin:0 auto;padding:32px 24px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px;font-size:14px;color:#6B7488}
.foot-links{display:flex;flex-wrap:wrap;gap:24px}
.foot-links a{color:#6B7488}
@media (max-width:860px){.navlinks{display:none !important}.mnav{display:block}}
@media (max-width:760px){.hide-sm{display:none !important}}
.brand-name,.btn-dark{white-space:nowrap}
.mnav-panel a.mnav-cta{background:#2B4BFF;color:#FFF;font-weight:600;margin-top:4px;text-align:center}
.mnav-panel a.mnav-cta:hover{background:#1A33C9;color:#FFF}
@media (min-width:481px){.mnav-cta{display:none}}
@media (max-width:480px){.actions .btn-dark{display:none}}

/* language switch */
.lang{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:#9AA2B4}
.lang a{color:#6B7488;padding:6px 2px}
.lang a:hover{color:#0B1220}
.lang a.on{color:#0B1220;font-weight:500}
.mnav-panel a.mnav-lang{color:#6B7488;border-top:1px solid #EEF0F4;border-radius:0 0 10px 10px;margin-top:4px}

/* ---------- Motion (subtle, respects reduced-motion) ---------- */
@media (prefers-reduced-motion: no-preference) {
  .motion:not(.motion-ready) main{visibility:hidden}
  .motion .rv:not(.in){opacity:0}
  .motion .rv.in{animation:reveal .75s cubic-bezier(.2,.7,.2,1) var(--d,0ms) both}
  @keyframes reveal{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
  h1.split .wd{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.08em;margin-bottom:-.08em}
  h1.split .wd>span{display:inline-block;transform:translateY(105%);animation:wordUp .8s cubic-bezier(.2,.7,.2,1) forwards}
  @keyframes wordUp{to{transform:none}}
  .lift{transition:transform .3s cubic-bezier(.2,.7,.2,1),box-shadow .3s ease,border-color .3s ease}
  .motion .lift.in.done{animation:none}
  .lift.in:hover,.lift:not(.rv):hover{transform:translateY(-4px);box-shadow:0 18px 40px -22px rgba(11,18,32,.35);border-color:#C9D1F5 !important}
  svg.arrow{transition:transform .25s ease}
  a:hover svg.arrow{transform:translateX(4px)}
  @keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
  .scene .sc-pill i,.st.wait i{animation:pulse 2.2s ease-in-out infinite}
  .st.run i{animation:pulse 1s ease-in-out infinite}
  .pulse{font-style:normal;display:inline-block;animation:pulse 2.2s ease-in-out infinite}
  @keyframes pulse{0%,100%{opacity:1}50%{opacity:.35}}
  [role=tablist]+div>div>div{animation:fadeUp .4s cubic-bezier(.2,.7,.2,1) both}
  [role=tablist]+div>div>div:nth-child(2){animation-delay:.05s}
  [role=tablist]+div>div>div:nth-child(3){animation-delay:.1s}
  [role=tablist]+div>div>div:nth-child(4){animation-delay:.15s}
  @keyframes fadeUp{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
  .topbar{transition:box-shadow .3s ease}
  .topbar.scrolled{box-shadow:0 8px 24px -18px rgba(11,18,32,.4)}
}

/* ---------- Hero scenes (static by default; scenes.js animates them) ---------- */
.scene .sc-pill{font-size:12px;color:#B9F3D0;background:rgba(110,231,160,.12);padding:6px 10px;border-radius:999px;white-space:nowrap;transition:color .3s,background .3s}
.scene .sc-pill b,.scene .st b{font-weight:400}
.scene .sc-pill i,.scene .st i{font-style:normal;display:inline-block}
.sc-pill.blue{color:#C9D3FF;background:rgba(143,163,255,.14)}
.sc-pill.amber{color:#FCD9A8;background:rgba(251,191,119,.14)}
.sc-list{display:flex;flex-direction:column;gap:16px}
.sc-row{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 16px;background:#18223A;border-radius:12px;box-sizing:border-box;max-height:120px;overflow:hidden;transition:opacity .45s ease,transform .45s ease,max-height .55s ease,padding .55s ease,margin .55s ease,background .4s ease}
.sc-row.gone{opacity:0;max-height:0;padding-top:0;padding-bottom:0;margin-top:-16px;transform:translateY(-6px)}
.sc-row.new{opacity:0;max-height:0;padding-top:0;padding-bottom:0;margin-bottom:-16px;transform:translateY(8px)}
.sc-row.active{background:#1C2846}
.sc-txt{display:flex;flex-direction:column;gap:4px;min-width:0}
.sc-t{font-size:15px}
.sc-s{font-size:13px;color:#8C96AB;transition:opacity .25s}
.sc-prog{display:block;height:3px;width:150px;max-width:100%;background:#24304D;border-radius:2px;overflow:hidden;margin-top:4px}
.sc-prog b{display:block;height:100%;width:0;background:#8FA3FF;border-radius:2px}
.st{font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:11px;white-space:nowrap;transition:color .3s}
.st.done{color:#6EE7A0}.st.run{color:#8FA3FF}.st.wait{color:#FBBF77}.st.queued{color:#6B7488}
.sc-approve{transition:box-shadow .3s,background .3s,transform .15s}
.sc-approve.ping{box-shadow:0 0 0 6px rgba(43,75,255,.28)}
.sc-approve.press{transform:scale(.97);background:#1A33C9 !important}
.sc-approve.ok{background:#16A36A !important}
/* computer use */
.sc-win{background:#F5F7FA;border-radius:12px;overflow:hidden;color:#0B1220}
.sc-bar{display:flex;gap:6px;padding:10px 12px;background:#E2E6EE;align-items:center}
.sc-bar>span:not(.sc-url){width:10px;height:10px;border-radius:50%;background:#C4CBDA}
.sc-url{font-size:11px;color:#6B7488;margin-left:8px;transition:opacity .3s}
.sc-screen{position:relative;overflow:hidden}
.sc-track{display:flex;width:200%;transition:transform .7s cubic-bezier(.65,0,.35,1)}
.sc-track.slid{transform:translateX(-50%)}
.sc-page{width:50%;box-sizing:border-box;padding:18px;position:relative}
.sc-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;align-content:start}
.sc-f{display:flex;flex-direction:column;gap:4px;font-size:11px;color:#6B7488}
.sc-in{display:block;height:30px;border:1px solid #D6DBE5;border-radius:6px;background:#FFF;font-size:13px;color:#0B1220;padding:6px 8px;box-sizing:border-box;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:border-color .2s,box-shadow .2s}
.sc-in em{font-style:normal}
.sc-in.focus{border:2px solid #2B4BFF;padding:5px 7px;box-shadow:0 0 0 3px rgba(43,75,255,.12)}
.sc-in.focus em::after{content:'';display:inline-block;width:1px;height:14px;background:#0B1220;margin-left:1px;vertical-align:-2px;animation:caret 1s steps(1) infinite}
@keyframes caret{50%{opacity:0}}
.sc-submit{grid-column:1/-1;height:32px;border-radius:7px;background:#0B1220;color:#FFF;font-size:13px;font-weight:600;display:flex;align-items:center;justify-content:center;transition:background .2s,transform .15s}
.sc-submit.press{background:#2B4BFF;transform:scale(.98)}
.sc-menu{position:absolute;left:18px;width:calc(50% - 23px);background:#FFF;border:1px solid #D6DBE5;border-radius:8px;box-shadow:0 12px 24px -12px rgba(11,18,32,.35);padding:3px;display:flex;flex-direction:column;z-index:2;font-size:12px}
.sc-menu[hidden]{display:none}
.sc-menu span{padding:5px 8px;border-radius:5px;transition:background .15s;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:11.5px}
.sc-menu span.hl{background:#EEF1FF;color:#1A33C9}
.sc-done{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;text-align:center}
.sc-check{width:40px;height:40px;border-radius:50%;background:#16A36A;display:flex;align-items:center;justify-content:center;margin-bottom:4px;transform:scale(.6);opacity:0;transition:transform .45s cubic-bezier(.3,1.6,.5,1),opacity .3s}
.sc-track.slid .sc-check{transform:none;opacity:1;transition-delay:.45s}
.sc-done strong{font-size:16px}
.sc-qid{font-size:12px;color:#3A4458}
.sc-saved{font-size:12px;color:#6B7488}
.sc-cursor{position:absolute;left:0;top:0;z-index:3;pointer-events:none;opacity:0;transition:transform .8s cubic-bezier(.45,.05,.25,1),opacity .3s;filter:drop-shadow(0 2px 3px rgba(0,0,0,.25))}
.sc-click{position:absolute;left:0;top:0;width:26px;height:26px;margin:-13px 0 0 -13px;border-radius:50%;background:rgba(43,75,255,.35);transform:scale(0);opacity:0;pointer-events:none;z-index:2}
.sc-click.go{animation:clickRing .45s ease-out}
@keyframes clickRing{0%{transform:scale(.2);opacity:1}100%{transform:scale(1.4);opacity:0}}
/* chatbots */
.sc-chat{display:flex;flex-direction:column;gap:10px;justify-content:flex-end;overflow:hidden}
.sc-msg{display:flex}
.sc-msg>div{max-width:80%;padding:12px 14px;border-radius:14px;font-size:14px;line-height:1.45;box-sizing:border-box}
.sc-msg.me{justify-content:flex-end}.sc-msg.me>div{background:#2B4BFF;color:#FFF;border-bottom-right-radius:4px}
.sc-msg.bot>div{background:#18223A;color:#FFF;border-bottom-left-radius:4px}
.sc-msg.pop{animation:msgIn .4s cubic-bezier(.2,.8,.2,1) both}
@keyframes msgIn{from{opacity:0;transform:translateY(10px) scale(.96)}to{opacity:1;transform:none}}
.sc-msg.card>div{background:#FFF;color:#0B1220;display:flex;flex-direction:column;gap:6px;min-width:220px}
.sc-msg.card small{font-family:'IBM Plex Mono',monospace;font-size:11px;color:#6B7488}
.sc-msg.card strong{font-family:'Sora',sans-serif;font-size:18px}
.sc-msg.card span.pay{margin-top:4px;background:#2B4BFF;color:#FFF;border-radius:8px;text-align:center;padding:8px;font-weight:600;font-size:13px}
.sc-dots{display:inline-flex;gap:4px;padding:2px 0}
.sc-dots i{width:6px;height:6px;border-radius:50%;background:#8C96AB;animation:dot 1s infinite ease-in-out}
.sc-dots i:nth-child(2){animation-delay:.15s}.sc-dots i:nth-child(3){animation-delay:.3s}
@keyframes dot{0%,60%,100%{transform:none;opacity:.5}30%{transform:translateY(-4px);opacity:1}}
.sc-chips{display:flex;gap:8px;flex-wrap:wrap;transition:opacity .35s,transform .35s}
.sc-chips.hide{opacity:0;transform:translateY(6px)}
.sc-chips span{font-size:12px;padding:8px 12px;border:1px solid #2A3654;border-radius:999px;color:#C4CBDA;transition:background .2s,border-color .2s,color .2s}
.sc-chips span.tap{background:#2B4BFF;border-color:#2B4BFF;color:#FFF}
.sc-input{display:flex;align-items:center;gap:10px;background:#111A2E;border:1px solid #2A3654;border-radius:12px;padding:6px 6px 6px 14px;min-height:44px;box-sizing:border-box}
.sc-typed{flex:1;font-size:14px;color:#FFF;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sc-typed em{font-style:normal}
.sc-typed .sc-ph{font-style:normal;color:#6B7488}
.sc-typed em:not(:empty)+.sc-ph{display:none}
.sc-send{width:32px;height:32px;border-radius:9px;background:#2B4BFF;color:#FFF;display:flex;align-items:center;justify-content:center;transition:transform .15s,background .2s}
.sc-send.press{transform:scale(.88);background:#1A33C9}
/* web development */
.sc-app{background:#F5F7FA;border-radius:12px;padding:16px;color:#0B1220;display:flex;flex-direction:column;gap:12px;position:relative}
.sc-app-head{display:flex;justify-content:space-between;align-items:center;gap:8px}
.sc-hi{font-weight:600;font-size:15px}
.sc-ai{font-size:12px;padding:6px 10px;background:#EEF1FF;color:#1A33C9;border-radius:999px;font-weight:600;white-space:nowrap}
.sc-kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.sc-kpi{background:#FFF;border:1px solid #E2E6EE;border-radius:10px;padding:12px;display:flex;flex-direction:column;transition:border-color .4s,box-shadow .4s}
.sc-kpi span{font-size:11px;color:#6B7488}
.sc-kpi b{font-size:20px;font-weight:600;font-variant-numeric:tabular-nums;transition:color .4s}
.sc-kpi.bump{border-color:#9FE3BE;box-shadow:0 0 0 3px rgba(22,163,106,.12)}
.sc-kpi.bump b{color:#16A36A}
.sc-tip{background:#FFF;border:1px solid #E2E6EE;border-radius:10px;padding:12px;font-size:13px;line-height:1.45;color:#3A4458;min-height:64px;box-sizing:border-box}
.sc-app .bld{transition:opacity .45s ease,transform .45s ease}
.sc-app.building .bld{opacity:0;transform:translateY(8px)}
.sc-app.building::after{content:'';position:absolute;inset:16px;border-radius:10px;background:linear-gradient(90deg,#E9EDF3 0%,#F6F8FB 50%,#E9EDF3 100%);background-size:200% 100%;animation:shimmer 1.2s linear infinite;opacity:.9}
@keyframes shimmer{from{background-position:200% 0}to{background-position:-200% 0}}
.sc-stack{font-size:12px;color:#8C96AB;display:flex;gap:16px;flex-wrap:wrap}
.sc-stack span{transition:color .3s}
.sc-stack span::before{content:'○ ';color:#3A4458;transition:color .3s}
.sc-stack span.ok{color:#FFFFFF}
.sc-stack span.ok::before{content:'✓ ';color:#6EE7A0}
.sc-stack span.now{color:#C9D3FF}
.sc-stack span.now::before{content:'◌ ';color:#8FA3FF}
/* home timeline */
.tl-step{transition:background .5s ease,box-shadow .5s ease,color .5s ease,border-color .5s ease}
.tl-when{transition:color .5s}
.tl-on .tl-when{color:#FFFFFF !important}