/* ZAKZVISION - Software page */
:root { --sw-bg:#07070a; --sw-card:#101014; --sw-line:rgba(255,255,255,.09); --sw-grad:#FF5500; }
body.sw-body { background:var(--sw-bg); background-image:none; }
.sw-page { padding-top:74px; overflow:hidden; }
.sw-page h1,.sw-page h2,.sw-page h3 { font-family:'Montserrat',var(--font-main); }

/* Hero */
.sw-hero { position:relative; padding:90px 0 110px; }
.sw-bg { position:absolute; inset:0; overflow:hidden; pointer-events:none; }
.sw-blob { position:absolute; border-radius:50%; filter:blur(90px); opacity:.55; animation:swfloat 14s ease-in-out infinite alternate; }
.sw-blob.b1 { width:520px; height:520px; background:#FF5500; top:-160px; left:-120px; }
.sw-blob.b2 { width:460px; height:460px; background:#FF5500; right:-120px; top:80px; opacity:.4; animation-delay:-6s; }
.sw-grid-bg { position:absolute; inset:0;
  background-image:linear-gradient(var(--sw-line) 1px,transparent 1px),linear-gradient(90deg,var(--sw-line) 1px,transparent 1px);
  background-size:56px 56px; -webkit-mask-image:radial-gradient(ellipse at 50% 30%,#000 20%,transparent 75%); mask-image:radial-gradient(ellipse at 50% 30%,#000 20%,transparent 75%); }
@keyframes swfloat { to { transform:translate(50px,40px) scale(1.12); } }

.sw-hero-inner { position:relative; display:grid; grid-template-columns:1.05fr 1fr; gap:50px; align-items:center; }
.sw-eyebrow { display:inline-flex; align-items:center; gap:10px; padding:8px 16px; border:1px solid var(--sw-line); border-radius:999px; background:rgba(255,255,255,.04); font-size:13px; font-weight:600; letter-spacing:3px; color:#c9c9c9; margin-bottom:26px; }
.sw-dot { width:8px; height:8px; border-radius:50%; background:#FF5500; box-shadow:0 0 12px #FF5500; animation:swpulse 2s infinite; }
@keyframes swpulse { 50% { opacity:.3; } }
.sw-title { font-size:clamp(40px,6.4vw,84px); font-weight:800; line-height:1.03; letter-spacing:-1px; margin-bottom:26px; }
.sw-title em, .sw-cta-box em { font-style:normal; color:#FF5500; }
.sw-lead { max-width:540px; font-size:19px; color:#b8b8bf; margin-bottom:36px; }
.sw-cta { display:flex; gap:14px; flex-wrap:wrap; }
.sw-btn { display:inline-flex; align-items:center; gap:10px; padding:15px 28px; border-radius:999px; font-weight:600; text-decoration:none; transition:var(--transition); border:1px solid transparent; }
.sw-btn-primary { background:var(--sw-grad); color:#fff; box-shadow:0 10px 40px -10px rgba(255,85,0,.7); }
.sw-btn-primary:hover { transform:translateY(-3px); box-shadow:0 16px 50px -10px rgba(255,85,0,.8); }
.sw-btn-ghost { border-color:var(--sw-line); color:#fff; background:rgba(255,255,255,.03); }
.sw-btn-ghost:hover { background:rgba(255,255,255,.09); }

/* Code window */
.sw-hero-art { position:relative; }
.sw-window { background:rgba(16,16,20,.85); border:1px solid var(--sw-line); border-radius:16px; box-shadow:0 40px 80px -30px rgba(0,0,0,.9),0 0 0 1px rgba(255,85,0,.15),0 0 80px -20px rgba(255,85,0,.35); backdrop-filter:blur(8px); transform:perspective(1200px) rotateY(-8deg) rotateX(3deg); }
.sw-window-bar { display:flex; align-items:center; gap:7px; padding:14px 16px; border-bottom:1px solid var(--sw-line); }
.sw-window-bar i { width:11px; height:11px; border-radius:50%; background:#3a3a42; }
.sw-window-bar i:nth-child(1){background:#ff5f57}.sw-window-bar i:nth-child(2){background:#febc2e}.sw-window-bar i:nth-child(3){background:#28c840}
.sw-window-bar span { margin-left:10px; font-size:12px; color:#777; }
.sw-code { padding:22px 24px 26px; font:14px/1.75 'SFMono-Regular',Consolas,Menlo,monospace; color:#d6d6dc; white-space:pre-wrap; }
.sw-code .c{color:#5f6270}.sw-code .k{color:#FF5500}.sw-code .f{color:#FF9a5c}.sw-code .p{color:#e6c9b8}.sw-code .s{color:#7ee0a3}.sw-code .n{color:#ffd166}
.cursor { display:inline-block; width:8px; height:16px; background:#FF5500; margin-left:4px; vertical-align:-3px; animation:swblink 1s steps(1) infinite; }
@keyframes swblink { 50% { opacity:0; } }
.sw-chip { position:absolute; display:flex; align-items:center; gap:8px; padding:10px 16px; border-radius:999px; background:rgba(20,20,26,.92); border:1px solid var(--sw-line); font-size:13px; font-weight:600; box-shadow:0 12px 30px -10px #000; animation:swbob 6s ease-in-out infinite; }
.sw-chip i { color:#FF5500; }
.chip1{top:-22px;right:8%}.chip2{bottom:34px;left:-26px;animation-delay:-2s}.chip3{bottom:-24px;right:12%;animation-delay:-4s}
@keyframes swbob { 50% { transform:translateY(-10px); } }

/* Marquee */
.sw-marquee { border-block:1px solid var(--sw-line); background:rgba(255,255,255,.02); overflow:hidden; padding:18px 0; }
.sw-marquee-track { display:flex; gap:48px; width:max-content; animation:swmarq 34s linear infinite; }
.sw-marquee-track span { font-family:'Montserrat',sans-serif; font-weight:700; font-size:20px; letter-spacing:3px; text-transform:uppercase; color:#4a4a54; white-space:nowrap; }
.sw-marquee-track span::after { content:'\2726'; margin-left:48px; color:#FF5500; }
@keyframes swmarq { to { transform:translateX(-50%); } }

/* Sections */
.sw-section { padding:100px 0; position:relative; }
.sw-kicker { text-align:center; color:#FF5500; font-weight:700; letter-spacing:4px; text-transform:uppercase; font-size:13px; margin-bottom:12px; }
.sw-heading { text-align:center; font-size:clamp(28px,4.2vw,46px); font-weight:800; letter-spacing:-.5px; margin-bottom:56px; }

.sw-bento { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.sw-card { grid-column:span 1; background:var(--sw-card); border:1px solid var(--sw-line); border-radius:22px; padding:30px 26px; position:relative; overflow:hidden; transition:var(--transition); }
.sw-card.wide { grid-column:span 2; }
.sw-card.full { grid-column:span 4; }
.sw-card::before { content:''; position:absolute; inset:0; background:rgba(255,85,0,.06); opacity:0; transition:opacity .4s; }
.sw-card:hover { transform:translateY(-5px); border-color:rgba(255,85,0,.5); }
.sw-card:hover::before { opacity:1; }
.sw-card.accent { background:#1a0d08; border-color:rgba(255,85,0,.35); }
.sw-icon { position:relative; width:56px; height:56px; padding:12px; border-radius:16px; background:rgba(255,85,0,.1); color:#FF6a1f; margin-bottom:22px; }
.sw-icon svg { width:100%; height:100%; }
.sw-card h3 { position:relative; font-size:21px; margin-bottom:8px; }
.sw-card p { position:relative; color:#a4a4ad; }

.sw-center { margin-left:auto; margin-right:auto; text-align:center; }
.sw-intro { margin-top:-28px; margin-bottom:48px; max-width:760px; }
.sw-cta-box .sw-lead { margin-bottom:30px; }

/* Steps */
.sw-steps { list-style:none; display:grid; grid-template-columns:repeat(4,1fr); gap:24px; counter-reset:x; }
.sw-steps li { padding-top:22px; border-top:1px solid var(--sw-line); position:relative; }
.sw-steps li::before { content:''; position:absolute; top:-1px; left:0; width:48px; height:2px; background:var(--sw-grad); }
.sw-steps span { font-family:'Montserrat',sans-serif; font-size:44px; font-weight:800; color:#FF5500; }
.sw-steps h3 { font-size:21px; margin:4px 0 8px; }
.sw-steps p { color:#a4a4ad; }

/* CTA */
.sw-cta-box { text-align:center; padding:80px 30px; border-radius:32px; border:1px solid rgba(255,85,0,.3);
  background:#0d0d12; }
.sw-cta-box h2 { font-size:clamp(32px,5vw,58px); font-weight:800; line-height:1.1; margin-bottom:34px; }

/* Reveal */
.reveal { opacity:0; transform:translateY(28px); transition:opacity .7s ease,transform .7s ease; }
.reveal.in { opacity:1; transform:none; }
.sw-bento .reveal:nth-child(2n){transition-delay:.08s}.sw-bento .reveal:nth-child(3n){transition-delay:.16s}

@media (prefers-reduced-motion:reduce) { *{animation:none!important} .reveal{opacity:1;transform:none;transition:none} }
@media (max-width:1024px) {
  .sw-hero-inner{grid-template-columns:1fr}
  .sw-window{transform:none}
  .sw-bento{grid-template-columns:repeat(2,1fr)}
  .sw-card.full{grid-column:span 2}
  .sw-steps{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:640px) {
  .sw-hero{padding:56px 0 80px}
  .sw-lead{font-size:17px}
  .sw-section{padding:70px 0}
  .sw-bento,.sw-steps{grid-template-columns:1fr}
  .sw-card.wide,.sw-card.full{grid-column:span 1}
  .sw-code{font-size:12px;padding:16px}
  .chip2{left:-6px}
  }
