:root{
  --bg:#060B14; --bg-2:#0A1220; --panel:#0D1728; --panel-2:#101d33;
  --line:rgba(140,170,220,0.12); --line-strong:rgba(140,170,220,0.22);
  --blue:#3B7BFF; --blue-deep:#1E4FCC; --cyan:#49E0FF;
  --violet:#8B6BFF;
  --text:#EAF0F9; --muted:#8695AC; --muted-2:#5C6B85; --radius:16px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{ margin:0; background:var(--bg); color:var(--text); font-family:'Inter', sans-serif; -webkit-font-smoothing:antialiased; overflow-x:hidden; }
html[lang="fa"] body{ font-family:'Vazirmatn', sans-serif; }
.mono{font-family:'JetBrains Mono', monospace;}
a{color:inherit; text-decoration:none;}
::selection{background:var(--blue); color:#fff;}
img{max-width:100%;}
:focus-visible{ outline:2px solid var(--cyan); outline-offset:3px; }

/* scroll progress */
.scroll-progress{ position:fixed; top:0; inset-inline:0; height:2px; z-index:80; background:transparent; }
.scroll-progress i{ display:block; height:100%; width:0%; background:linear-gradient(90deg, var(--cyan), var(--blue)); transition:width .1s linear; }

.bg-grid{ position:fixed; inset:0; z-index:0; pointer-events:none;
  background-image:linear-gradient(var(--line) 1px, transparent 1px), linear-gradient(90deg, var(--line) 1px, transparent 1px);
  background-size:64px 64px;
  -webkit-mask-image: radial-gradient(ellipse 80% 60% at 50% 0%, #000 10%, transparent 70%);
          mask-image: radial-gradient(ellipse 80% 60% at 50% 0%, #000 10%, transparent 70%);
  opacity:0.5; }
.bg-glow{ position:fixed; z-index:0; pointer-events:none; filter:blur(90px); opacity:0.35; border-radius:50%; will-change:transform; }
.glow-1{ width:640px; height:640px; top:-220px; inset-inline-end:-160px; background:radial-gradient(circle, var(--blue) 0%, transparent 70%); }
.glow-2{ width:520px; height:520px; bottom:10%; inset-inline-start:-200px; background:radial-gradient(circle, var(--cyan) 0%, transparent 70%); opacity:0.18;}

.wrap{max-width:1180px; margin:0 auto; padding:0 28px; position:relative; z-index:2;}

header{ position:fixed; inset-inline:0; top:0; z-index:50; backdrop-filter:blur(14px);
  background:rgba(6,11,20,0.55); border-bottom:1px solid transparent; transition:border-color .3s ease, background .3s ease; }
header.scrolled{ border-color:var(--line); background:rgba(6,11,20,0.88); }
nav{display:flex; align-items:center; justify-content:space-between; height:76px;}
.brand{display:flex; align-items:center; gap:12px;}
.brand img{height:36px; width:36px; display:block;}
.brand-name{font-weight:800; font-size:1.18rem; letter-spacing:.2px;}
.brand-name span{color:var(--cyan);}
.nav-links{display:flex; align-items:center; gap:26px;}
.nav-links a{font-size:.94rem; color:var(--muted); transition:color .2s; position:relative;}
.nav-links a:not(.nav-cta)::after{ content:''; position:absolute; left:0; right:0; bottom:-6px; height:2px; background:var(--cyan); transform:scaleX(0); transition:transform .25s; }
.nav-links a:not(.nav-cta):hover::after{transform:scaleX(1);}
.nav-links a:hover{color:var(--text);}
.nav-cta{ padding:10px 22px; border-radius:999px; background:linear-gradient(135deg, var(--blue), var(--blue-deep));
  font-weight:600; font-size:.9rem; box-shadow:0 8px 24px -8px rgba(59,123,255,0.6); border:1px solid rgba(255,255,255,0.08); }
.burger{display:none; flex-direction:column; gap:5px; cursor:pointer; background:none; border:none;}
.burger span{width:24px; height:2px; background:var(--text); display:block;}

.lang-switch{ position:relative; display:inline-flex; }
.lang-switch select{
  appearance:none; -webkit-appearance:none; background:rgba(255,255,255,0.04); color:var(--text);
  border:1px solid var(--line-strong); border-radius:999px; padding:8px 30px 8px 14px; font-size:.82rem;
  font-family:'JetBrains Mono', monospace; cursor:pointer;
}
html[dir="rtl"] .lang-switch select{ padding:8px 14px 8px 30px; }
.lang-switch::after{ content:'▾'; position:absolute; inset-inline-end:12px; top:50%; transform:translateY(-50%); font-size:.7rem; color:var(--muted); pointer-events:none; }

.hero{position:relative; padding:180px 0 120px; overflow:hidden;}
.hero .wrap, .product-hero .wrap{ will-change:transform, opacity; }
.eyebrow{ display:inline-flex; align-items:center; gap:10px; font-family:'JetBrains Mono', monospace; font-size:.76rem; letter-spacing:.18em;
  color:var(--cyan); border:1px solid var(--line-strong); padding:7px 16px; border-radius:999px; background:rgba(73,224,255,0.05); }
.eyebrow::before{content:''; width:6px; height:6px; border-radius:50%; background:var(--cyan); box-shadow:0 0 12px 2px var(--cyan);}
.hero-grid{display:grid; grid-template-columns:1.15fr 0.85fr; gap:60px; align-items:center;}
h1.headline{ font-size:clamp(2.1rem, 4.4vw, 3.5rem); line-height:1.28; font-weight:800; margin:22px 0 22px; letter-spacing:-.5px; }
h1.headline .grad{ background:linear-gradient(100deg, var(--cyan), var(--blue) 60%); -webkit-background-clip:text; background-clip:text; color:transparent; }
.lead{font-size:1.08rem; line-height:1.9; color:var(--muted); max-width:560px; margin-bottom:36px;}
.hero-ctas{display:flex; gap:16px; flex-wrap:wrap;}

.btn{ position:relative; padding:15px 30px; border-radius:12px; font-weight:700; font-size:.96rem; cursor:pointer;
  display:inline-flex; align-items:center; gap:10px; transition:transform .2s ease, box-shadow .2s ease; border:none; overflow:hidden; }
.btn-primary{ background:linear-gradient(135deg, var(--blue), var(--blue-deep)); color:#fff;
  box-shadow:0 14px 34px -12px rgba(59,123,255,0.7); border:1px solid rgba(255,255,255,0.1); }
.btn-primary::before{ content:''; position:absolute; inset:0; background:linear-gradient(120deg, transparent 30%, rgba(255,255,255,0.35) 50%, transparent 70%);
  transform:translateX(-120%); transition:transform .6s ease; }
.btn-primary:hover::before{ transform:translateX(120%); }
.btn-primary:hover{transform:translateY(-2px);}
.btn-ghost{ border:1px solid var(--line-strong); color:var(--text); background:rgba(255,255,255,0.02);}
.btn-ghost:hover{ border-color:var(--cyan); color:var(--cyan); transform:translateY(-2px);}

.hero-visual{position:relative; height:420px; display:flex; align-items:center; justify-content:center; will-change:transform;}
.hero-visual svg{width:100%; height:100%; max-width:460px; overflow:visible;}
.node{ animation:pulse 2s ease-in-out infinite; transform-origin:center; }
.node.d1{animation-delay:.2s;} .node.d2{animation-delay:.7s;} .node.d3{animation-delay:1.1s;} .node.d4{animation-delay:1.5s;} .node.d5{animation-delay:0.4s;}
@keyframes pulse{ 0%,100%{opacity:.4; r:3;} 50%{opacity:1; r:6.5;} }
.flow{ stroke-dasharray:8 14; animation:flow 1.8s linear infinite; opacity:0.95; }
@keyframes flow{ to{ stroke-dashoffset:-176; } }
.orbit-a, .orbit-b, .orbit-c{ transform-origin:220px 220px; }
.orbit-a{ animation:orbitSpin 26s linear infinite; }
.orbit-b{ animation:orbitSpin 19s linear infinite reverse; }
.orbit-c{ animation:orbitSpin 34s linear infinite; }
@keyframes orbitSpin{ to{ transform:rotate(360deg); } }
.ring-spin{ animation:orbitSpin 7s linear infinite; }
@media (prefers-reduced-motion: reduce){ .ring-spin{ animation:none; } }
.core-breathe{ animation:coreBreathe 3s ease-in-out infinite; transform-origin:220px 220px; }
.core-breathe-slow{ animation:coreBreathe 5s ease-in-out infinite; transform-origin:220px 220px; }
@keyframes coreBreathe{ 0%,100%{ transform:scale(1); opacity:0.75; } 50%{ transform:scale(1.12); opacity:1; } }
@media (prefers-reduced-motion: reduce){ .core-breathe, .core-breathe-slow, .orbit-a, .orbit-b, .orbit-c{ animation:none; } }

section{position:relative; z-index:2; padding:110px 0;}
.section-head{max-width:640px; margin-bottom:56px;}
.kicker{font-family:'JetBrains Mono', monospace; font-size:.76rem; letter-spacing:.16em; color:var(--cyan); text-transform:uppercase;}
h2.title{font-size:clamp(1.6rem, 3vw, 2.3rem); font-weight:800; margin:14px 0 16px; letter-spacing:-.3px;}
.section-desc{color:var(--muted); line-height:1.9; font-size:1rem;}

.about-strip{ border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:60px 0;}
.about-grid{display:grid; grid-template-columns:1.3fr 1fr; gap:60px; align-items:center;}
.about-grid p{color:var(--muted); line-height:2; font-size:1.03rem;}
.tag-row{display:flex; flex-wrap:wrap; gap:10px; margin-top:22px;}
.tag{ font-size:.82rem; padding:8px 16px; border-radius:999px; border:1px solid var(--line-strong); color:var(--muted); font-family:'JetBrains Mono', monospace; }
.mini-stats{display:grid; grid-template-columns:1fr 1fr; gap:18px;}
.mini-stat{ border:1px solid var(--line); border-radius:var(--radius); padding:22px; background:linear-gradient(180deg, rgba(59,123,255,0.05), transparent); transition:transform .25s, border-color .25s;}
.mini-stat:hover{ transform:translateY(-3px); border-color:var(--line-strong); }
.mini-stat b{display:block; font-size:1.7rem; font-weight:800; color:var(--cyan); font-family:'JetBrains Mono', monospace;}
.mini-stat span{color:var(--muted); font-size:.86rem;}

.services-grid{display:grid; grid-template-columns:repeat(3, 1fr); gap:20px;}
.card{ --rx:0deg; --ry:0deg; border:1px solid var(--line); border-radius:var(--radius); padding:30px 26px; background:linear-gradient(160deg, var(--panel), var(--bg-2));
  transition:transform .2s ease, border-color .25s ease; position:relative; overflow:hidden;
  transform:perspective(800px) rotateX(var(--rx)) rotateY(var(--ry)); }
.card:hover{ border-color:var(--line-strong);}
.card::after{ content:''; position:absolute; inset:0; opacity:0; transition:opacity .3s;
  background:radial-gradient(320px circle at var(--mx,50%) var(--my,0%), rgba(73,224,255,0.1), transparent 60%); }
.card:hover::after{opacity:1;}
.icon-box{ width:46px; height:46px; border-radius:12px; display:flex; align-items:center; justify-content:center;
  background:rgba(59,123,255,0.12); border:1px solid var(--line-strong); margin-bottom:20px; color:var(--cyan); }
.card h3{font-size:1.08rem; margin:0 0 10px; font-weight:700;}
.card p{color:var(--muted); font-size:.92rem; line-height:1.85; margin:0;}

.products-grid{display:grid; grid-template-columns:1fr 1fr; gap:24px;}
.product-card{ --rx:0deg; --ry:0deg; border:1px solid var(--line); border-radius:20px; padding:38px; position:relative; overflow:hidden;
  background:linear-gradient(160deg, var(--panel), var(--bg-2)); transition:transform .2s ease, border-color .25s ease;
  transform:perspective(900px) rotateX(var(--rx)) rotateY(var(--ry)); display:flex; flex-direction:column; }
.product-card:hover{border-color:var(--line-strong);}
.product-card .glow{position:absolute; width:280px; height:280px; border-radius:50%; filter:blur(80px); opacity:.25; top:-90px; inset-inline-start:-90px; pointer-events:none;}
.product-card.gp .glow{background:var(--blue);}
.product-card.mv .glow{background:var(--cyan);}
.product-top{display:flex; align-items:center; justify-content:space-between; margin-bottom:22px; position:relative;}
.product-name{font-family:'JetBrains Mono', monospace; font-size:1.4rem; font-weight:700; letter-spacing:.3px;}
.status-pill{font-size:.72rem; font-family:'JetBrains Mono', monospace; padding:5px 12px; border-radius:999px; border:1px solid var(--line-strong); color:var(--cyan); background:rgba(73,224,255,0.06);}
.product-card p{color:var(--muted); line-height:1.9; font-size:.98rem; position:relative;}
.feat-list{list-style:none; padding:0; margin:22px 0 0; display:flex; flex-direction:column; gap:10px; position:relative;}
.feat-list li{display:flex; align-items:center; gap:10px; color:var(--text); font-size:.9rem;}
.feat-list li::before{content:''; width:6px; height:6px; border-radius:50%; background:var(--cyan); flex:none;}
.product-more{ margin-top:24px; font-size:.86rem; font-weight:700; color:var(--cyan); display:inline-flex; align-items:center; gap:6px; }
.product-more svg{transition:transform .2s;}
.product-card:hover .product-more svg{ transform:translateX(4px); }
html[dir="rtl"] .product-card:hover .product-more svg{ transform:translateX(-4px); }

.process-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:0; position:relative;}
.p-step{position:relative; padding-inline-end:20px;}
.p-num{ width:52px; height:52px; border-radius:50%; border:1px solid var(--line-strong); background:var(--bg-2);
  display:flex; align-items:center; justify-content:center; font-family:'JetBrains Mono', monospace; font-weight:700;
  color:var(--cyan); margin-bottom:20px; position:relative; z-index:2; }
.p-step h4{font-size:1rem; margin:0 0 8px; font-weight:700;}
.p-step p{color:var(--muted); font-size:.88rem; line-height:1.8; margin:0;}

.why-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:18px;}
.why-card{ text-align:center; padding:30px 18px; border:1px solid var(--line); border-radius:var(--radius); transition:transform .2s, border-color .2s;}
.why-card:hover{ transform:translateY(-3px); border-color:var(--line-strong);}
.why-card .icon-box{margin:0 auto 18px;}
.why-card h4{font-size:.98rem; margin:0 0 8px;}
.why-card p{color:var(--muted); font-size:.85rem; line-height:1.7; margin:0;}

.contact-panel{ border:1px solid var(--line); border-radius:24px; padding:56px; position:relative; overflow:hidden;
  background:linear-gradient(150deg, var(--panel), var(--bg-2)); }
.contact-grid{display:grid; grid-template-columns:1fr 1fr; gap:50px; position:relative; z-index:2;}
.contact-list{display:flex; flex-direction:column; gap:18px; margin-top:26px;}
.contact-item{display:flex; align-items:center; gap:14px; padding:16px 18px; border:1px solid var(--line); border-radius:12px; background:rgba(255,255,255,0.015);}
.contact-item .icon-box{margin:0; width:38px; height:38px; flex:none;}
.contact-item .label{font-size:.76rem; color:var(--muted-2); margin-bottom:2px;}
.contact-item .value{font-family:'JetBrains Mono', monospace; font-size:.9rem; color:var(--text);}
.placeholder-note{ margin-top:20px; font-size:.82rem; color:var(--muted-2); border:1px dashed var(--line-strong); padding:12px 16px; border-radius:10px; }
.form-field{display:flex; flex-direction:column; gap:8px; margin-bottom:18px;}
.form-field label{font-size:.84rem; color:var(--muted);}
.form-field input, .form-field textarea{ background:rgba(255,255,255,0.03); border:1px solid var(--line); border-radius:10px; padding:13px 16px;
  color:var(--text); font-family:inherit; font-size:.94rem; resize:none; width:100%; }
.form-field input:focus, .form-field textarea:focus{outline:2px solid var(--blue); border-color:transparent;}
.form-status{ min-height:1.2em; margin:14px 0 0; font-size:.86rem; text-align:center; transition:opacity .3s ease; }
.form-status[data-state="success"]{ color:var(--cyan); }
.form-status[data-state="error"]{ color:#FF7A7A; }
.form-status[data-state="sending"]{ color:var(--muted); }
.btn[disabled]{ opacity:.6; cursor:not-allowed; transform:none !important; }

/* ---------- FAQ ---------- */
.faq-list{ display:flex; flex-direction:column; gap:12px; max-width:760px; }
.faq-item{ border:1px solid var(--line); border-radius:14px; background:linear-gradient(160deg, var(--panel), var(--bg-2)); overflow:hidden; transition:border-color .25s ease; }
.faq-item:has(.faq-q[aria-expanded="true"]){ border-color:var(--line-strong); }
.faq-q{ width:100%; display:flex; align-items:center; justify-content:space-between; gap:16px; padding:20px 24px; background:none; border:none; color:var(--text); font-family:inherit; font-size:1rem; font-weight:600; text-align:start; cursor:pointer; }
.faq-chevron{ flex:none; color:var(--cyan); transition:transform .3s ease; }
.faq-q[aria-expanded="true"] .faq-chevron{ transform:rotate(180deg); }
.faq-a{ padding:0 24px 20px; }
.faq-a p{ margin:0; color:var(--muted); line-height:1.85; font-size:.94rem; }
.faq-a[data-animating]{ animation:faqOpen .35s ease; }
@keyframes faqOpen{ from{ opacity:0; transform:translateY(-6px);} to{ opacity:1; transform:translateY(0);} }

footer{border-top:1px solid var(--line); padding:50px 0 30px; position:relative; z-index:2;}
.footer-top{display:flex; justify-content:space-between; align-items:flex-start; flex-wrap:wrap; gap:30px; padding-bottom:34px;}
.footer-tagline{color:var(--muted-2); font-size:.86rem; max-width:280px; line-height:1.8; margin-top:12px;}
.footer-cols{display:flex; gap:60px; flex-wrap:wrap;}
.footer-col h5{font-size:.82rem; color:var(--muted-2); margin:0 0 16px; font-family:'JetBrains Mono', monospace; letter-spacing:.08em;}
.footer-col a{display:block; color:var(--muted); font-size:.9rem; margin-bottom:12px; transition:color .2s;}
.footer-col a:hover{color:var(--cyan);}
.footer-bottom{display:flex; justify-content:space-between; align-items:center; padding-top:26px; border-top:1px solid var(--line); flex-wrap:wrap; gap:14px;}
.footer-bottom span{color:var(--muted-2); font-size:.82rem;}
.socials{display:flex; gap:12px;}
.socials a{ width:36px; height:36px; border:1px solid var(--line-strong); border-radius:10px; display:flex; align-items:center; justify-content:center; color:var(--muted); transition:color .2s, border-color .2s; }
.socials a:hover{color:var(--cyan); border-color:var(--cyan);}

.reveal{opacity:0; transform:translateY(28px) scale(.97); filter:blur(6px); transition:opacity .8s cubic-bezier(.16,.8,.24,1), transform .8s cubic-bezier(.16,.8,.24,1), filter .8s ease;}
.reveal.in{opacity:1; transform:translateY(0) scale(1); filter:blur(0);}

/* process connector line draws in when the section enters view */
.process-line{ position:absolute; top:26px; inset-inline:6%; height:1px; transform-origin:left center; transform:scaleX(0); transition:transform 1.1s cubic-bezier(.16,.8,.24,1) .2s;
  background:repeating-linear-gradient(90deg, var(--line-strong) 0 8px, transparent 8px 16px); }
html[dir="rtl"] .process-line{ transform-origin:right center; }
.process-grid.in .process-line, .steps-row.in .process-line{ transform:scaleX(1); }
.steps-row{ position:relative; }

@media (prefers-reduced-motion: reduce){ .reveal{ filter:none; } }

/* ---------- Product page specific ---------- */
.breadcrumb{ font-family:'JetBrains Mono', monospace; font-size:.78rem; color:var(--muted-2); display:flex; align-items:center; gap:8px; margin-bottom:20px;}
.breadcrumb a{color:var(--muted); } .breadcrumb a:hover{color:var(--cyan);}
.product-hero{padding:170px 0 90px; position:relative;}
.product-hero-grid{display:grid; grid-template-columns:1.1fr .9fr; gap:56px; align-items:center;}
.product-badge{display:inline-flex; align-items:center; gap:8px; font-family:'JetBrains Mono',monospace; font-size:.78rem; letter-spacing:.1em; padding:7px 16px; border-radius:999px; border:1px solid var(--line-strong); margin-bottom:18px;}
.product-hero h1{font-size:clamp(2rem,4vw,3rem); font-weight:800; line-height:1.25; letter-spacing:-.4px; margin:0 0 20px;}
.product-hero .lead{margin-bottom:30px;}

.hero-glow-decor{ position:absolute; inset:-18%; z-index:0; pointer-events:none; }
.mockup-window{ position:relative; z-index:1; border-radius:16px; border:1px solid var(--line-strong); background:linear-gradient(160deg, var(--panel), var(--bg-2)); overflow:hidden; box-shadow:0 40px 80px -30px rgba(0,0,0,.6), 0 0 60px -10px rgba(73,224,255,.25);}
.mockup-bar{display:flex; align-items:center; gap:8px; padding:12px 16px; border-bottom:1px solid var(--line);}
.mockup-bar i{width:9px; height:9px; border-radius:50%; background:var(--muted-2); display:block;}
.mockup-bar i:first-child{ background:var(--cyan); animation:liveDot 2s ease-in-out infinite; }
@keyframes liveDot{ 0%,100%{opacity:.4; box-shadow:0 0 0 0 rgba(73,224,255,.5);} 50%{opacity:1; box-shadow:0 0 6px 2px rgba(73,224,255,.5);} }
.mockup-bar span{margin-inline-start:10px; font-family:'JetBrains Mono',monospace; font-size:.72rem; color:var(--muted-2);}
.mockup-body{padding:22px; display:grid; gap:14px;}
.mockup-row{display:flex; gap:14px;}
.mockup-card{flex:1; border:1px solid var(--line); border-radius:10px; padding:14px; background:rgba(255,255,255,0.02);}
.mockup-card .mock-label{font-family:'JetBrains Mono',monospace; font-size:.66rem; color:var(--muted-2); margin-bottom:8px; display:block;}
.mockup-bars{display:flex; align-items:flex-end; gap:6px; height:60px;}
.mockup-bars i{ flex:1; background:linear-gradient(180deg, var(--cyan), var(--blue)); border-radius:3px 3px 0 0; opacity:.85; transform-origin:bottom; animation:barGrow 1s cubic-bezier(.16,.8,.24,1) backwards; }
.mockup-bars i:nth-child(1){animation-delay:.05s;} .mockup-bars i:nth-child(2){animation-delay:.12s;} .mockup-bars i:nth-child(3){animation-delay:.19s;}
.mockup-bars i:nth-child(4){animation-delay:.26s;} .mockup-bars i:nth-child(5){animation-delay:.33s;} .mockup-bars i:nth-child(6){animation-delay:.4s;} .mockup-bars i:nth-child(7){animation-delay:.47s;}
@keyframes barGrow{ from{ transform:scaleY(0); opacity:0; } to{ transform:scaleY(1); opacity:.85; } }
.mockup-line{height:8px; border-radius:4px; background:var(--line-strong); margin-bottom:8px; position:relative; overflow:hidden;}
.mockup-line.w60{width:60%;} .mockup-line.w80{width:80%;} .mockup-line.w40{width:40%;}
.mockup-line::after{ content:''; position:absolute; inset:0; background:linear-gradient(90deg, transparent, rgba(73,224,255,.35), transparent); transform:translateX(-100%); animation:lineShimmer 2.6s ease-in-out infinite; }
@keyframes lineShimmer{ to{ transform:translateX(100%); } }
.mockup-avatar-row{display:flex; align-items:center; gap:10px;}
.mockup-avatar{width:28px; height:28px; border-radius:50%; background:linear-gradient(135deg, var(--cyan), var(--violet));}
.mockup-ring{ width:70px; height:70px; border-radius:50%; margin:0 auto; background:conic-gradient(var(--cyan) 0 70%, var(--line) 70% 100%); display:flex; align-items:center; justify-content:center; position:relative; animation:ringGlowPulse 3s ease-in-out infinite; }
.mockup-ring::before{content:''; position:absolute; inset:8px; border-radius:50%; background:var(--panel);}
@keyframes ringGlowPulse{ 0%,100%{ filter:drop-shadow(0 0 0 rgba(73,224,255,0)); } 50%{ filter:drop-shadow(0 0 10px rgba(73,224,255,.5)); } }
@media (prefers-reduced-motion: reduce){
  .mockup-bar i:first-child, .mockup-bars i, .mockup-line::after, .mockup-ring{ animation:none; }
}

.feature-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
.steps-row{display:grid; grid-template-columns:repeat(4,1fr); gap:20px;}
.mini-diagram{ border:1px solid var(--line); border-radius:var(--radius); padding:26px; background:linear-gradient(160deg, var(--panel), var(--bg-2)); text-align:center;}
.mini-diagram .icon-box{margin:0 auto 16px;}

.cta-band{ border:1px solid var(--line); border-radius:24px; padding:54px; text-align:center;
  background:linear-gradient(140deg, rgba(59,123,255,0.1), rgba(73,224,255,0.05)); }
.cta-band h2{margin-bottom:14px;}
.cta-band p{color:var(--muted); max-width:520px; margin:0 auto 30px;}
.cta-band .hero-ctas{justify-content:center;}

.related-products{display:grid; grid-template-columns:1fr 1fr; gap:20px;}
.related-card{ display:flex; align-items:center; justify-content:space-between; padding:22px 26px; border:1px solid var(--line); border-radius:var(--radius); background:linear-gradient(160deg, var(--panel), var(--bg-2)); transition:transform .2s, border-color .2s;}
.related-card:hover{ transform:translateY(-3px); border-color:var(--line-strong); }
.related-card .rc-name{font-family:'JetBrains Mono',monospace; font-weight:700; font-size:1.1rem;}
.related-card .rc-desc{color:var(--muted); font-size:.85rem; margin-top:4px;}
.related-card svg{ flex:none; color:var(--cyan); }

@media(max-width:900px){
  .nav-links{display:none;}
  .burger{display:flex;}
  .hero-grid, .product-hero-grid{grid-template-columns:1fr;}
  .hero-visual{height:280px; order:-1;}
  .about-grid{grid-template-columns:1fr;}
  .services-grid, .feature-grid{grid-template-columns:1fr 1fr;}
  .products-grid, .related-products{grid-template-columns:1fr;}
  .process-grid, .steps-row{grid-template-columns:1fr 1fr; gap:30px;}
  .process-line{display:none;}
  .why-grid{grid-template-columns:1fr 1fr;}
  .contact-grid{grid-template-columns:1fr;}
  .contact-panel{padding:32px 22px;}
  .cta-band{padding:34px 22px;}
}
@media(max-width:560px){
  .services-grid, .why-grid, .feature-grid, .steps-row{grid-template-columns:1fr;}
  .footer-cols{gap:34px;}
}
@media (prefers-reduced-motion: reduce){ *{animation:none !important; transition:none !important;} html{scroll-behavior:auto;} .card, .product-card{transform:none !important;} }