/* ===== Lumivio Soft — design system ===== */
:root{--navy:#070D1C;--surface:#111B32;--blue:#386BFF;--violet:#8055F7;--cyan:#16C9F5;--white:#F5F7FC;--muted:#A4B0C7;--border:#1B2944;--wrap:1180px;--gutter:32px;--radius:16px}
*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}
body{font-family:Inter,system-ui,sans-serif;color:var(--white);background:var(--navy);-webkit-font-smoothing:antialiased;line-height:1.5;overflow-x:hidden}
a{text-decoration:none;color:inherit}svg{display:block}
.bg{position:fixed;inset:0;z-index:-1;background:radial-gradient(900px 600px at 90% -10%,rgba(128,85,247,.22),transparent 60%),radial-gradient(800px 600px at 0% 20%,rgba(56,107,255,.18),transparent 60%),var(--navy)}
.wrap{width:min(var(--wrap),100% - var(--gutter)*2);margin-inline:auto}.wrap.narrow{max-width:800px}
.eyebrow{font-size:11px;letter-spacing:.24em;font-weight:800;color:var(--cyan);text-transform:uppercase}
h2{font-size:clamp(28px,3vw,36px);font-weight:800;letter-spacing:-.02em;line-height:1.15;margin-top:10px;color:var(--white)}
.sec-head{text-align:center;max-width:720px;margin:0 auto 40px}.sub{color:var(--muted);font-size:15px;margin-top:12px}
.section{padding:80px 0}.section.alt{background:rgba(17,27,50,.35);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.grid{display:grid;gap:20px}.cols3{grid-template-columns:repeat(3,1fr)}.cols4{grid-template-columns:repeat(4,1fr)}
.btn{display:inline-flex;align-items:center;gap:10px;padding:12px 22px;border-radius:999px;font-weight:700;font-size:14px;transition:.25s;cursor:pointer;border:1px solid transparent;white-space:nowrap;font-family:inherit}
.btn.primary{background:linear-gradient(90deg,var(--blue),var(--violet));color:#fff;box-shadow:0 10px 26px rgba(56,107,255,.35)}.btn.primary:hover{transform:translateY(-2px);box-shadow:0 16px 34px rgba(56,107,255,.5)}
.btn.ghost{background:rgba(255,255,255,.04);border-color:var(--border);color:var(--white)}.btn.ghost:hover{border-color:var(--blue)}.btn.white{background:#fff;color:#2547c9}.btn.white:hover{transform:translateY(-2px)}.btn.lg{padding:15px 28px;font-size:15px}
.play{width:22px;height:22px;border:1.5px solid var(--muted);border-radius:50%;display:inline-grid;place-items:center;font-size:8px}
/* NAV */
.nav{position:sticky;top:0;z-index:50;background:rgba(7,13,28,.85);backdrop-filter:blur(14px);border-bottom:1px solid var(--border)}
.nav-in{display:flex;align-items:center;gap:34px;height:72px}
.logo{display:flex;align-items:center;gap:10px;font-size:19px;font-weight:700}.logo b{color:#7ea2ff;font-weight:700}.mark svg{width:32px;height:32px}.mark.sm svg{width:22px;height:22px}
.links{display:flex;gap:28px;margin:0 auto;font-size:14px;font-weight:600;color:#dbe4f5}.links>a,.links .has-drop>a{display:inline-flex;align-items:center;gap:4px;padding:8px 0}.links i{font-style:normal;color:#7c8aa8;font-size:11px}.links a:hover{color:var(--cyan)}
.has-drop{position:relative}.drop{position:absolute;top:100%;left:-14px;padding-top:8px;display:none}.has-drop:hover .drop{display:block}
.drop a{display:block;background:var(--surface);padding:10px 16px;font-weight:500;font-size:13.5px;min-width:250px;border-left:1px solid var(--border);border-right:1px solid var(--border)}.drop a:first-child{border-top:1px solid var(--border);border-radius:12px 12px 0 0;padding-top:14px}.drop a:last-child{border-bottom:1px solid var(--border);border-radius:0 0 12px 12px;padding-bottom:14px;box-shadow:0 22px 44px rgba(0,0,0,.5)}.drop a:hover{background:#182748}
.burger{display:none;background:none;border:0;color:#fff;font-size:22px;cursor:pointer}
/* HERO */
.hero{overflow:hidden;border-bottom:1px solid var(--border)}.hero-in{display:grid;grid-template-columns:1fr 1.1fr;align-items:center;gap:40px;padding:80px 0 88px}
.pill{display:inline-flex;gap:10px;align-items:center;font-size:12px;color:var(--muted);font-weight:600;background:rgba(17,27,50,.8);border:1px solid var(--border);border-radius:999px;padding:7px 14px}.pill i{font-style:normal;color:var(--blue)}
.hero h1{font-size:clamp(42px,4.8vw,66px);line-height:1.03;font-weight:900;letter-spacing:-.03em;margin:22px 0 20px}.hero h1 em{font-style:normal;background:linear-gradient(90deg,var(--blue),var(--cyan),var(--violet));-webkit-background-clip:text;background-clip:text;color:transparent}
.lead{color:var(--muted);font-size:17px;line-height:1.6;max-width:480px}.cta-row{display:flex;gap:14px;margin-top:32px;flex-wrap:wrap}
.hero-visual{position:relative;height:420px}
.rings{position:absolute;left:50%;top:56%;transform:translate(-50%,-50%) rotateX(64deg);width:520px;height:520px}.rings span{position:absolute;inset:0;border:1.5px solid rgba(56,107,255,.5);border-radius:50%;box-shadow:0 0 30px rgba(56,107,255,.2) inset}.rings span:nth-child(2){inset:60px;border-color:rgba(22,201,245,.45)}.rings span:nth-child(3){inset:120px;border-color:rgba(128,85,247,.5)}
.ai-core{position:absolute;left:50%;top:44%;width:140px;height:140px;display:flex;flex-direction:column;align-items:center;justify-content:center;background:linear-gradient(145deg,#2b5cff,var(--violet));clip-path:polygon(50% 0,93% 25%,93% 75%,50% 100%,7% 75%,7% 25%);filter:drop-shadow(0 0 36px rgba(86,110,255,.75));animation:floatCore 5s ease-in-out infinite}.ai-core strong{font-size:40px;font-weight:900}.ai-core small{color:#bfe9ff}
.panel{position:absolute;display:grid;place-items:center;background:linear-gradient(160deg,rgba(56,107,255,.3),rgba(17,27,50,.92));border:1px solid rgba(110,150,255,.5);border-radius:14px;box-shadow:0 18px 40px rgba(0,0,0,.45),0 0 22px rgba(56,107,255,.2);backdrop-filter:blur(6px);animation:float 6s ease-in-out infinite;color:#cfe2ff}
.p-code{left:10%;top:4%;width:96px;height:80px;font-size:26px;font-weight:800}.p-chart{right:6%;top:0;width:100px;height:82px;display:flex;align-items:flex-end;gap:6px;padding:16px;animation-delay:-2s}.p-chart i{flex:1;height:var(--h);background:linear-gradient(180deg,var(--cyan),var(--blue));border-radius:3px 3px 0 0}
.p-cloud{right:2%;top:44%;width:78px;height:64px;font-size:28px;color:#9fd8ff;animation-delay:-1s}.p-gear{left:2%;top:46%;width:62px;height:56px;font-size:22px;animation-delay:-3s}.p-shield{left:30%;bottom:2%;width:56px;height:52px;color:#b7a6ff;animation-delay:-1.5s}.p-db{right:26%;bottom:0;width:56px;height:50px;color:#8be9ff;animation-delay:-4s}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes floatCore{0%,100%{transform:translate(-50%,-50%)}50%{transform:translate(-50%,-58%)}}
/* CARDS */
.card{background:linear-gradient(180deg,rgba(27,41,68,.5),rgba(17,27,50,.7));border:1px solid var(--border);border-radius:var(--radius);padding:32px 26px;text-align:center;transition:.25s}.card:hover{transform:translateY(-5px);border-color:rgba(56,107,255,.6);box-shadow:0 20px 40px rgba(0,0,0,.35)}
.icon{width:52px;height:52px;margin:0 auto 16px;display:grid;place-items:center}.icon svg{width:42px;height:42px}.icon.blue,.w-ic.blue{color:var(--blue)}.icon.violet,.w-ic.violet{color:#a586ff}.icon.cyan,.w-ic.cyan{color:var(--cyan)}
.card h3{font-size:17px;margin-bottom:10px}.card p{font-size:14px;color:var(--muted);line-height:1.6}
/* SHOWCASE */
.showcase{padding:80px 0;background:linear-gradient(180deg,rgba(56,107,255,.08),transparent 70%);border-top:1px solid var(--border)}
.show-grid{display:grid;grid-template-columns:1fr 1.4fr;gap:48px;align-items:center}
.show-copy p:not(.eyebrow){color:var(--muted);font-size:15px;line-height:1.65;margin:14px 0 24px}
.dash-wrap{position:relative;padding-bottom:40px}
.dashboard{display:flex;background:#0D1730;border:1px solid #24365e;border-radius:var(--radius);overflow:hidden;box-shadow:0 34px 70px rgba(0,0,0,.5)}
.dashboard aside{width:150px;flex:none;background:#0A1328;padding:16px 12px;display:flex;flex-direction:column;gap:6px;border-right:1px solid var(--border)}.d-logo{display:flex;gap:7px;align-items:center;font-size:11px;font-weight:700;margin-bottom:14px}.dashboard aside a{font-size:11.5px;color:#8fa1c2;padding:7px 9px;border-radius:8px}.dashboard aside a.active{background:linear-gradient(90deg,var(--blue),var(--violet));color:#fff}.support{margin-top:auto}
.dashboard main{flex:1;padding:18px;min-width:0}.d-head{display:flex;justify-content:space-between;font-size:12px;color:var(--muted)}.d-head b{color:#fff;font-size:13px}
.kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:14px 0}.kpis div{background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:11px}.kpis span{display:block;font-size:9px;color:#8fa1c2;margin-bottom:2px}.kpis b{font-size:16px;color:#fff}
.d-chart{width:100%;height:90px;background:#0A1328;border:1px solid var(--border);border-radius:10px}
.ai-chat{position:absolute;right:0;bottom:0;width:250px;background:linear-gradient(160deg,#1a2c57,var(--surface));border:1px solid rgba(110,150,255,.55);border-radius:14px;padding:14px;box-shadow:0 22px 44px rgba(0,0,0,.5)}.ai-chat-head{display:flex;gap:10px;align-items:center}.spark{width:30px;height:30px;border-radius:9px;background:linear-gradient(135deg,var(--blue),var(--violet));display:grid;place-items:center;flex:none}.ai-chat b{font-size:12.5px;display:block}.ai-chat small{color:var(--muted);font-size:10.5px}.ask{margin-top:12px;background:#0A1328;border:1px solid var(--border);border-radius:999px;padding:9px 12px;font-size:11px;color:#7c8aa8;display:flex;justify-content:space-between}.ask span{color:var(--cyan)}
.results-note{text-align:center;color:#6f84ad;font-size:12.5px;margin-top:40px;padding-top:24px;border-top:1px solid var(--border)}
/* STACK */
.stack-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:20px}.stack-grid>div{background:rgba(17,27,50,.72);border:1px solid var(--border);border-radius:var(--radius);padding:22px;display:flex;flex-wrap:wrap;gap:8px;align-content:flex-start}.stack-grid h4{width:100%;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--cyan);margin-bottom:6px}.stack-grid span{font-size:12.5px;padding:6px 10px;border-radius:8px;background:rgba(56,107,255,.12);border:1px solid #24365e;color:#dbe4f5}
/* PROCESS / WHY */
.step,.why-item{background:rgba(17,27,50,.72);border:1px solid var(--border);border-radius:var(--radius);padding:28px}.step b{font-size:28px;background:linear-gradient(90deg,var(--blue),var(--cyan));-webkit-background-clip:text;background-clip:text;color:transparent}.step h3,.why-item h3{margin:12px 0 8px;font-size:17px}.step p,.why-item p{color:var(--muted);font-size:14px;line-height:1.6}
.w-ic{font-size:24px;display:block}
/* CASES */
.case{background:rgba(17,27,50,.72);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column}
.case-img{height:150px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;color:#fff}.case-img i{font-style:normal;font-size:30px;font-weight:900}.case-img span{font-size:9.5px;letter-spacing:.24em;font-weight:700;color:#dbe4f5}.ci1{background:linear-gradient(135deg,var(--blue),#0A1328)}.ci2{background:linear-gradient(135deg,var(--violet),var(--blue))}.ci3{background:linear-gradient(135deg,#0e7ea8,var(--blue))}
.case-body{padding:24px;display:flex;flex-direction:column;flex:1}.case-body small{color:var(--cyan);font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase}.case-body h3{margin:8px 0 14px;font-size:17px;line-height:1.3}
.case dl{display:grid;gap:10px}.case dt{font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--white)}.case dd{font-size:13px;color:var(--muted);line-height:1.6;margin-top:2px}
.case-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:20px 0 14px}.case-stats span{background:rgba(56,107,255,.12);border:1px solid #24365e;border-radius:10px;padding:10px 6px;text-align:center;font-size:10px;color:var(--muted);line-height:1.35}.case-stats b{display:block;font-size:15px;color:#fff;margin-bottom:2px}
.case-result{margin-top:auto;color:var(--cyan);font-size:14px}
/* TESTIMONIALS */
.t-card{background:linear-gradient(180deg,#131F3B,#0E1830);border:1px solid #24365e;border-radius:var(--radius);padding:28px;display:flex;flex-direction:column}.t-card blockquote{font-size:15px;line-height:1.65;color:#dbe4f5;flex:1}.t-card figcaption{display:flex;gap:12px;align-items:center;margin-top:20px;padding-top:20px;border-top:1px solid var(--border)}
.avatar{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;font-weight:800;font-size:11px;letter-spacing:.02em;color:#fff;flex:none}.av1{background:linear-gradient(135deg,var(--violet),var(--blue))}.av2{background:linear-gradient(135deg,var(--blue),var(--cyan))}.av3{background:linear-gradient(135deg,#f59e0b,var(--violet))}
.t-card b{display:block;font-size:14px}.t-card small{color:var(--muted);font-size:12px}
/* FAQ */
.faq-list{display:flex;flex-direction:column;gap:10px}.faq-list details{background:rgba(17,27,50,.72);border:1px solid var(--border);border-radius:12px;padding:18px 22px}.faq-list summary{font-weight:700;font-size:15.5px;cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center}.faq-list summary::after{content:"+";color:var(--cyan);font-size:20px;font-weight:400}.faq-list details[open] summary::after{content:"–"}.faq-list details p{color:var(--muted);font-size:14.5px;line-height:1.7;margin-top:12px}
/* CTA */
.cta{padding:80px 0}
.cta-box{display:flex;align-items:center;justify-content:space-between;gap:32px;flex-wrap:wrap;background:linear-gradient(90deg,var(--blue),var(--violet));border-radius:20px;padding:40px 44px;box-shadow:0 24px 50px rgba(56,107,255,.3);margin-bottom:24px}.cta-box h2{margin:0;font-size:30px}.cta-box p{color:#dbe7ff;font-size:15px;margin-top:8px;max-width:560px;line-height:1.6}
.cta-grid{display:grid;grid-template-columns:1fr 2fr;gap:24px;align-items:start}
.contact-col{display:grid;gap:12px}.c-item{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:18px 20px}.c-item span{display:block;font-size:11px;color:#7c8aa8;letter-spacing:.08em;text-transform:uppercase;margin-bottom:6px}.c-item a,.c-item b{color:var(--white);font-size:15px;line-height:1.45}.c-item a:hover{color:var(--cyan)}
.book{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:28px;display:grid;gap:16px}.book h3{font-size:18px;margin-bottom:4px}.f-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.book label{display:grid;gap:7px;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#7c8aa8}.book input,.book select,.book textarea{width:100%;padding:12px 14px;border-radius:10px;border:1px solid #24365e;background:#0A1328;color:var(--white);font:inherit;font-size:14px;text-transform:none;letter-spacing:0}.book input:focus,.book select:focus,.book textarea:focus{outline:none;border-color:var(--blue)}.book textarea{resize:vertical}.book .btn{justify-self:start}.form-ok{color:var(--cyan);font-size:14px}
/* FOOTER */
footer{border-top:1px solid var(--border);padding:56px 0 24px;background:rgba(7,13,28,.6)}
.f-top{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:40px;padding-bottom:32px;border-bottom:1px solid var(--border)}.f-desc{color:var(--muted);font-size:13.5px;max-width:480px;line-height:1.6}
.social{display:flex;gap:10px}.social a{width:34px;height:34px;border:1px solid #24365e;border-radius:8px;display:grid;place-items:center;font-size:12px;font-weight:800}.social a:hover{border-color:var(--blue);color:var(--cyan)}
.f-cols{display:grid;grid-template-columns:repeat(4,1fr);gap:32px;padding:36px 0}.f-cols h4{font-size:13px;margin-bottom:14px;letter-spacing:.04em}.f-cols a{display:block;color:var(--muted);font-size:13.5px;margin-bottom:10px}.f-cols a:hover{color:var(--cyan)}.f-cols p{color:var(--muted);font-size:13.5px;line-height:1.6}
.f-bot{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-top:22px;border-top:1px solid var(--border);font-size:12.5px;color:#7c8aa8}.f-bot span a{margin-left:20px}.f-bot a:hover{color:#fff}.tag{color:#5f7fd9}
.reveal{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s ease}.reveal.in{opacity:1;transform:none}
/* RESPONSIVE */
@media(max-width:1100px){.stack-grid{grid-template-columns:repeat(3,1fr)}.cols4{grid-template-columns:1fr 1fr}}
@media(max-width:900px){.hero-in{grid-template-columns:1fr;gap:32px;padding:56px 0 64px}.hero-visual{height:380px}.rings{width:400px;height:400px}.show-grid{grid-template-columns:1fr;gap:40px}.ai-chat{position:static;margin-top:14px;width:100%}.dash-wrap{padding-bottom:0}.cols3{grid-template-columns:1fr 1fr}.cta-grid{grid-template-columns:1fr}.f-cols{grid-template-columns:1fr 1fr}.f-top{grid-template-columns:1fr;gap:20px}}
@media(max-width:640px){:root{--gutter:20px}.nav-cta{display:none}.links{display:none;position:absolute;top:72px;left:0;right:0;background:#0A1328;flex-direction:column;gap:4px;padding:16px 20px 20px;border-bottom:1px solid var(--border)}.links.open{display:flex}.burger{display:block;margin-left:auto}.drop{position:static;display:block;padding:0 0 0 14px}.drop a{border:0;box-shadow:none;padding:6px 0;background:none}
.section,.showcase,.cta{padding:56px 0}.cols3,.cols4,.stack-grid{grid-template-columns:1fr}.hero-visual{height:320px}.rings{width:320px;height:320px}.dashboard aside{display:none}.f-row{grid-template-columns:1fr}.cta-box{padding:28px}}
