/* NashineX — premium refinement layer. Loads after styles.css: calmer palette, flatter surfaces, no gimmicks. */
[data-theme=dark]{--bg:#070d1a;--bg2:#0a1324;--surface:#0d1729;--surface2:#131f36;--line:rgba(255,255,255,.08);--muted:#98a7c1;--nav:rgba(7,13,26,.85);--shadow:0 20px 50px rgba(0,0,0,.35)}
[data-theme=light]{--bg:#fff;--bg2:#f5f8fa;--surface:#fff;--surface2:#f1f5f8;--line:#e2e8ee;--muted:#5a6b82;--nav:rgba(255,255,255,.88);--shadow:0 18px 44px rgba(16,32,61,.09)}
body{font-size:16.5px}
h1,h2,h3,h4{letter-spacing:-.025em}
/* navigation */
.topbar{font-size:12.5px}.navin{min-height:70px}.nav.scrolled{box-shadow:none}
.links a{border-radius:8px;padding:8px 12px}
.links a.active{background:none;box-shadow:none;color:var(--text);position:relative}
.links a.active:after{content:"";position:absolute;left:12px;right:12px;bottom:1px;height:2px;border-radius:2px;background:var(--primary)}
.icon-btn:hover{transform:none}
/* buttons */
.btn{border-radius:12px;padding:12px 22px;font-weight:600}.btn:hover{transform:none}
.btn.primary{background:var(--primary);color:var(--on-primary);box-shadow:none}
.btn.primary:hover{box-shadow:0 10px 26px rgba(var(--primary-rgb),.28);filter:brightness(1.06)}
.btn.sm{padding:9px 16px}
/* hero: quiet and confident */
.hero{padding:96px 0 104px;background:var(--bg)}.hero:before{opacity:.22}
.pulse,.chip,#fx{display:none!important}
.badge:before{animation:none;box-shadow:none}
.hero h1{font-size:clamp(38px,5.4vw,66px);font-weight:700;letter-spacing:-.04em;margin:20px 0 14px}
.hero .sub{font-size:clamp(18px,2vw,22px)}.hero p.lead{font-size:17.5px}
.frame{padding:0;background:none;border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow);transform:none!important}
.frame:after{display:none}.frame img{border-radius:19px}
/* sections */
.section{padding:96px 0}
.s-head{margin-bottom:44px}.s-head h2{font-size:clamp(28px,3.6vw,42px);font-weight:700}.s-head p{font-size:17px}
.card{border-radius:16px;padding:28px;box-shadow:none}.card:before{display:none}
.card:hover{transform:none;border-color:rgba(var(--primary-rgb),.45);box-shadow:var(--shadow)}
.ico{width:48px;height:48px;border-radius:12px;background:rgba(var(--primary-rgb),.1);border-color:rgba(var(--primary-rgb),.22)}
.p-media .ic{filter:none}.p-media img{transition:transform .5s var(--ease)}
.stat strong{background:none;-webkit-text-fill-color:currentColor;color:var(--text);font-weight:700}
.page-head{background:var(--bg2);padding:56px 0 34px}.page-head h1{font-weight:700;font-size:clamp(32px,4.4vw,50px)}
.cta{border-radius:24px;padding:56px;background:var(--secondary)}.cta:before{display:none}.cta h2{font-weight:700}
.footer{background:#060b16}
/* live demos */
.demo-grid{display:grid;gap:24px;grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.demo{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:16px;background:var(--surface);overflow:hidden;transition:border-color .3s,box-shadow .3s}
.demo:hover{border-color:rgba(var(--primary-rgb),.45);box-shadow:var(--shadow)}
.demo-bar{display:flex;align-items:center;gap:6px;padding:10px 14px;background:var(--surface2);border-bottom:1px solid var(--line);font-size:12px;color:var(--muted)}
.demo-bar i{width:8px;height:8px;border-radius:50%;background:var(--line);flex:none}
.demo-bar span{margin-left:8px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.demo-shot{position:relative;display:block;aspect-ratio:16/10;background:var(--bg2);overflow:hidden}
.demo-shot img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top;transition:transform .6s var(--ease)}
.demo:hover .demo-shot img{transform:scale(1.03)}
.demo-ph{position:absolute;inset:0;display:grid;place-items:center;color:var(--muted);opacity:.5}
.demo-body{display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding:20px 22px 22px;flex:1}
.demo-body .cat{color:var(--pt);font-weight:600;font-size:13.5px}.demo-body h3{font-size:19px}
.demo-body p{margin:0;color:var(--muted);font-size:15px}.demo-body .btn{margin-top:auto}.demo-body p+.btn,.demo-body h3+.btn{margin-top:14px}
@media(max-width:640px){.section{padding:72px 0}.cta{padding:36px 26px}.demo-grid{grid-template-columns:1fr}}

/* ===== Hero v2: dark circuit backdrop, circuit illustration, glass process strip ===== */
.hero{padding:88px 0 72px;background:radial-gradient(720px 480px at 78% 28%,rgba(var(--primary-rgb),.2),transparent 65%),radial-gradient(620px 440px at 6% 96%,rgba(106,166,255,.15),transparent 65%),var(--bg)}
[data-theme=light] .hero{background:radial-gradient(720px 480px at 78% 28%,rgba(var(--primary-rgb),.14),transparent 65%),radial-gradient(620px 440px at 6% 96%,rgba(106,166,255,.1),transparent 65%),var(--bg)}
.hero:before{opacity:.3}
.hero-bg{position:absolute;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none;-webkit-mask-image:linear-gradient(90deg,#000,rgba(0,0,0,.25) 34%,rgba(0,0,0,.25) 66%,#000);mask-image:linear-gradient(90deg,#000,rgba(0,0,0,.25) 34%,rgba(0,0,0,.25) 66%,#000)}
.hero-bg .tr{stroke:rgba(var(--primary-rgb),.3);stroke-width:1.5}
.hero-bg .nd{fill:var(--bg);stroke:rgba(var(--primary-rgb),.55);stroke-width:1.5}
.hero-bg .fl{stroke:var(--primary);stroke-width:2;stroke-dasharray:36 520;stroke-dashoffset:556;opacity:.85;filter:drop-shadow(0 0 5px var(--primary));animation:trflow 6s linear infinite}
.hero-bg .f2{animation-delay:-2s}.hero-bg .f3{animation-delay:-4s}
@keyframes trflow{to{stroke-dashoffset:0}}
/* headline block */
.hero .sub{display:flex;flex-wrap:wrap;gap:0 .35em;align-items:baseline}
.hero .sub em{border:0;padding:0;animation:none;display:inline-block}
.hero .sub em.in{animation:wordin .55s var(--ease)}
@keyframes wordin{from{opacity:0;transform:translateY(.45em)}to{opacity:1;transform:none}}
.hero-meta{gap:10px 22px;margin-top:30px;font-size:13px;line-height:1}
.hero-meta span{display:inline-flex;align-items:center;gap:8px;height:20px}
.hero-meta .ic{width:16px;height:16px;flex:none;display:block}
/* illustration */
.hero-visual{display:flex;align-items:center;justify-content:center}
.hero-art{width:100%;max-width:540px;height:auto;overflow:visible}
.hero-art .ha-shadow{fill:rgba(var(--primary-rgb),.35)}
.hero-art .ha-traces>path:not(.ha-flow){stroke:rgba(var(--primary-rgb),.4);stroke-width:1.6}
.hero-art .ha-flow{stroke:var(--primary);stroke-width:2.2;stroke-dasharray:22 150;stroke-dashoffset:172;filter:drop-shadow(0 0 4px var(--primary));animation:trflow 3.4s linear infinite}
.hero-art .d2{animation-delay:-.8s}.hero-art .d3{animation-delay:-1.7s}.hero-art .d4{animation-delay:-2.5s}
.hero-art .ha-nodes circle{fill:var(--bg);stroke:var(--primary);stroke-width:1.6}
.hero-art .ha-chip{animation:chipfloat 6s ease-in-out infinite}
@keyframes chipfloat{50%{transform:translateY(-7px)}}
.hero-art .ha-top{stroke:rgba(var(--primary-rgb),.75);stroke-width:1.4;filter:drop-shadow(0 0 14px rgba(var(--primary-rgb),.35))}
.hero-art .ha-edge{stroke:rgba(var(--primary-rgb),.45);stroke-width:1.2}
.hero-art .ha-pins path{stroke:#8fb3d9;stroke-width:2.2;opacity:.8}
.hero-art .ha-die{fill:rgba(var(--primary-rgb),.14);stroke:var(--primary);stroke-width:1.4}
.hero-art .ha-x{stroke:var(--primary);stroke-width:3.6;stroke-linecap:round;filter:drop-shadow(0 0 6px var(--primary))}
.hero-art .tag rect{fill:rgba(10,20,40,.72);stroke:rgba(var(--primary-rgb),.4)}
.hero-art .tag circle{fill:var(--primary)}
.hero-art .tag text{fill:#e6eefb;font:600 12.5px var(--bf);letter-spacing:.01em}
.hero-art .tag{animation:tagfloat 5s ease-in-out infinite}.hero-art .t2{animation-delay:-1.6s}.hero-art .t3{animation-delay:-3.2s}
@keyframes tagfloat{50%{transform:translateY(-5px)}}
/* glass process strip */
.hero-flow{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:64px}
.fstep{position:relative;padding:22px 22px 20px;border-radius:18px;background:linear-gradient(160deg,rgba(255,255,255,.08),rgba(255,255,255,.025));border:1px solid rgba(255,255,255,.1);-webkit-backdrop-filter:blur(16px) saturate(140%);backdrop-filter:blur(16px) saturate(140%);box-shadow:0 14px 40px rgba(0,0,0,.25),inset 0 1px 0 rgba(255,255,255,.08);transition:border-color .3s,transform .3s var(--ease)}
.fstep:hover{border-color:rgba(var(--primary-rgb),.5);transform:translateY(-3px)}
.fstep:not(:last-child):after{content:"";position:absolute;right:-18px;top:50%;width:18px;height:2px;background:linear-gradient(90deg,rgba(var(--primary-rgb),.6),rgba(var(--primary-rgb),.1))}
.fn{position:absolute;top:18px;right:20px;font:700 12px var(--hf);letter-spacing:.08em;color:var(--pt);opacity:.8}
.fic{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;color:var(--pt);background:rgba(var(--primary-rgb),.12);border:1px solid rgba(var(--primary-rgb),.28);margin-bottom:14px}
.fstep b{display:block;font:700 17px var(--hf);letter-spacing:-.02em;margin-bottom:6px}
.fstep p{margin:0;color:var(--muted);font-size:13.5px;line-height:1.55;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
[data-theme=light] .fstep{background:rgba(255,255,255,.7);border-color:var(--line);box-shadow:0 12px 32px rgba(16,32,61,.07)}
@media(max-width:1000px){.hero-flow{grid-template-columns:1fr 1fr}.fstep:after{display:none}.hero-art{max-width:460px}.hero-visual{margin-top:8px}}
@media(max-width:560px){.hero{padding:48px 0 56px}.hero-flow{gap:12px;margin-top:44px}.fstep{padding:16px 14px}.fstep p{display:none}.fn{top:14px;right:14px}.hero-art{max-width:360px}}
@media(prefers-reduced-motion:reduce){.hero-bg .fl,.hero-art .ha-flow,.hero-art .ha-chip,.hero-art .tag{animation:none}.hero-bg .fl,.hero-art .ha-flow{display:none}}

/* ===== Light scroll animations (calm, staggered, motion-safe) ===== */
@keyframes rise{from{opacity:0;transform:translateY(18px)}}
.rv{transform:translateY(20px)}
.card.rv{transform:translateY(22px) scale(.985)}.card.rv.in{transform:none}
/* hero: lines arrive one after another on load */
.hero-grid>.rv,.hero-visual.rv{opacity:1;transform:none;transition:none}
.hero-grid>.rv:not(.in)>*{opacity:0}
.hero-grid>.rv.in>*{animation:rise .7s var(--ease) backwards}
.hero-grid>.rv.in>:nth-child(1){animation-delay:.05s}.hero-grid>.rv.in>:nth-child(2){animation-delay:.15s}
.hero-grid>.rv.in>:nth-child(4){animation-delay:.3s}.hero-grid>.rv.in>:nth-child(5){animation-delay:.42s}
.hero-grid>.rv.in>:nth-child(6){animation-delay:.54s}.hero-grid>.rv.in>:nth-child(7){animation-delay:.66s}
.hero-visual.rv:not(.in)>*{opacity:0}
.hero-visual.rv.in>*{animation:artin 1s var(--ease) .25s backwards}
@keyframes artin{from{opacity:0;transform:translateY(20px) scale(.96)}}
/* process cards: cascade */
.hero-flow.rv{opacity:1;transform:none;transition:none}
.hero-flow.rv:not(.in) .fstep{opacity:0}
.hero-flow.rv.in .fstep{animation:rise .65s var(--ease) backwards}
.hero-flow.rv.in .fstep:nth-child(1){animation-delay:.1s}.hero-flow.rv.in .fstep:nth-child(2){animation-delay:.22s}
.hero-flow.rv.in .fstep:nth-child(3){animation-delay:.34s}.hero-flow.rv.in .fstep:nth-child(4){animation-delay:.46s}
/* section headings: title, then text */
.s-head.rv,.page-head .rv{opacity:1;transform:none;transition:none}
.s-head.rv:not(.in)>*,.page-head .rv:not(.in)>*{opacity:0}
.s-head.rv.in>*,.page-head .rv.in>*{animation:rise .65s var(--ease) backwards}
.s-head.rv.in>:nth-child(2),.page-head .rv.in>:nth-child(2){animation-delay:.1s}
.s-head.rv.in>:nth-child(3),.page-head .rv.in>:nth-child(3){animation-delay:.2s}
.page-head .rv.in>:nth-child(4){animation-delay:.3s}
.ico{transition:transform .35s var(--ease)}.card:hover .ico{transform:translateY(-3px)}
@media(max-width:640px){.rv,.card.rv{transform:translateY(14px)}}
@media(prefers-reduced-motion:reduce){.rv,.rv *{opacity:1!important;transform:none!important;animation:none!important}}