/* ================================================
   VELUMCODE — style.css
   💡 Para mudar as cores principais, edite as
   variáveis abaixo em :root
   ================================================ */

:root {
  --bg:      #080a0f;
  --bg2:     #0d1017;
  --bg3:     #111520;
  --accent:  #00e5ff;   /* 💡 Cor principal (ciano) */
  --accent2: #7c3aed;   /* 💡 Cor secundária (roxo) */
  --text:    #e8eaf0;
  --muted:   #5a6070;
  --border:  rgba(255,255,255,0.06);
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'Syne',sans-serif;background:var(--bg);color:var(--text);overflow-x:hidden;cursor:none}

/* CURSOR */
.cursor{width:10px;height:10px;background:var(--accent);border-radius:50%;position:fixed;pointer-events:none;z-index:9999;transition:transform 0.1s ease;mix-blend-mode:difference}
.cursor-ring{width:36px;height:36px;border:1px solid rgba(0,229,255,0.4);border-radius:50%;position:fixed;pointer-events:none;z-index:9998}

/* NAV */
nav{position:fixed;top:0;left:0;right:0;z-index:100;padding:0 5%;height:70px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--border);background:rgba(8,10,15,0.9);backdrop-filter:blur(20px)}
.logo{font-size:1.25rem;font-weight:800;letter-spacing:-0.02em;color:var(--text);text-decoration:none}
.logo span{color:var(--accent)}
.nav-links{display:flex;gap:2.5rem;list-style:none}
.nav-links a{color:var(--muted);text-decoration:none;font-size:0.85rem;font-family:'JetBrains Mono',monospace;letter-spacing:0.05em;transition:color 0.2s}
.nav-links a:hover{color:var(--accent)}
.nav-cta{background:var(--accent)!important;color:var(--bg)!important;padding:0.5rem 1.2rem;border-radius:3px;font-weight:700!important}
.nav-cta:hover{background:#fff!important;color:var(--bg)!important}

/* HERO */
.hero{min-height:100vh;display:flex;align-items:center;padding:0 5%;position:relative;overflow:hidden}
.hero-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(0,229,255,0.03) 1px,transparent 1px),linear-gradient(90deg,rgba(0,229,255,0.03) 1px,transparent 1px);background-size:60px 60px;mask-image:radial-gradient(ellipse 70% 70% at 50% 50%,black 0%,transparent 100%)}
.hero-glow{position:absolute;width:600px;height:600px;background:radial-gradient(circle,rgba(0,229,255,0.08) 0%,transparent 70%);top:50%;left:50%;transform:translate(-50%,-50%);pointer-events:none}
.hero-glow2{position:absolute;width:400px;height:400px;background:radial-gradient(circle,rgba(124,58,237,0.1) 0%,transparent 70%);top:20%;right:10%;pointer-events:none}
.hero-content{position:relative;z-index:2;max-width:800px}
.hero-tag{display:inline-flex;align-items:center;gap:0.5rem;background:rgba(0,229,255,0.08);border:1px solid rgba(0,229,255,0.2);color:var(--accent);font-family:'JetBrains Mono',monospace;font-size:0.75rem;padding:0.4rem 0.9rem;border-radius:2px;margin-bottom:2rem;animation:fadeUp 0.8s ease forwards;opacity:0;letter-spacing:0.1em}
.hero-tag::before{content:'';width:6px;height:6px;background:var(--accent);border-radius:50%;animation:pulse 2s infinite}
h1{font-size:clamp(3rem,7vw,6rem);font-weight:800;line-height:0.95;letter-spacing:-0.04em;margin-bottom:1.5rem;animation:fadeUp 0.8s 0.15s ease forwards;opacity:0}
h1 .line2{color:transparent;-webkit-text-stroke:1px rgba(255,255,255,0.2);display:block}
h1 .accent-word{color:var(--accent)}
.hero-sub{font-family:'JetBrains Mono',monospace;font-size:0.95rem;color:var(--muted);line-height:1.7;max-width:500px;margin-bottom:2.5rem;animation:fadeUp 0.8s 0.3s ease forwards;opacity:0}
.hero-actions{display:flex;gap:1rem;align-items:center;animation:fadeUp 0.8s 0.45s ease forwards;opacity:0}
.btn-primary{background:var(--accent);color:var(--bg);border:none;padding:0.9rem 2rem;font-family:'Syne',sans-serif;font-weight:700;font-size:0.85rem;letter-spacing:0.1em;cursor:pointer;text-decoration:none;border-radius:3px;transition:all 0.25s;text-transform:uppercase;display:inline-block}
.btn-primary:hover{background:#fff;transform:translateY(-2px);box-shadow:0 10px 40px rgba(0,229,255,0.3)}
.btn-ghost{background:transparent;color:var(--text);border:1px solid var(--border);padding:0.9rem 2rem;font-family:'Syne',sans-serif;font-weight:600;font-size:0.85rem;letter-spacing:0.1em;cursor:pointer;text-decoration:none;border-radius:3px;transition:all 0.25s;text-transform:uppercase;display:inline-block}
.btn-ghost:hover{border-color:var(--accent);color:var(--accent);transform:translateY(-2px)}
.hero-stats{position:absolute;right:5%;bottom:12%;display:flex;flex-direction:column;gap:1.5rem;animation:fadeUp 0.8s 0.6s ease forwards;opacity:0;z-index:2}
.stat{text-align:right;border-right:2px solid var(--accent);padding-right:1rem}
.stat-num{font-size:2.2rem;font-weight:800;line-height:1;letter-spacing:-0.04em}
.stat-label{font-family:'JetBrains Mono',monospace;font-size:0.7rem;color:var(--muted);letter-spacing:0.1em;text-transform:uppercase;margin-top:0.2rem}
.scroll-indicator{position:absolute;bottom:2rem;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:0.5rem;z-index:2;animation:fadeUp 1s 1s ease forwards;opacity:0}
.scroll-indicator span{font-family:'JetBrains Mono',monospace;font-size:0.65rem;color:var(--muted);letter-spacing:0.2em;text-transform:uppercase}
.scroll-line{width:1px;height:50px;background:linear-gradient(to bottom,var(--accent),transparent);animation:scrollDown 2s ease infinite}

/* ANIMAÇÕES */
@keyframes fadeUp{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}
@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:0.4;transform:scale(0.7)}}
@keyframes scrollDown{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform:scaleY(1);transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}
@keyframes blink{0%,100%{opacity:1}50%{opacity:0}}

/* SEÇÕES BASE */
section{padding:8rem 5%;position:relative}
.section-label{font-family:'JetBrains Mono',monospace;font-size:0.75rem;color:var(--accent);letter-spacing:0.2em;text-transform:uppercase;margin-bottom:1rem;display:flex;align-items:center;gap:0.8rem}
.section-label::before{content:'';width:30px;height:1px;background:var(--accent)}
h2{font-size:clamp(2rem,4vw,3.5rem);font-weight:800;letter-spacing:-0.03em;line-height:1.05;margin-bottom:1rem}
.section-sub{font-family:'JetBrains Mono',monospace;font-size:0.9rem;color:var(--muted);max-width:500px;line-height:1.7;margin-bottom:4rem}

/* SERVIÇOS */
.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--border);border:1px solid var(--border)}
.service-card{background:var(--bg);padding:3rem 2.5rem;position:relative;overflow:hidden;transition:all 0.3s}
.service-card::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(0,229,255,0.05),transparent);opacity:0;transition:opacity 0.3s}
.service-card:hover::before{opacity:1}
.service-card:hover{background:var(--bg3)}
.service-num{font-family:'JetBrains Mono',monospace;font-size:0.7rem;color:var(--accent);letter-spacing:0.1em;margin-bottom:2rem}
.service-icon{font-size:2.5rem;margin-bottom:1.5rem;display:block}
.service-card h3{font-size:1.3rem;font-weight:700;letter-spacing:-0.02em;margin-bottom:0.8rem}
.service-card p{font-size:0.85rem;color:var(--muted);line-height:1.7;font-family:'JetBrains Mono',monospace}
.service-tags{display:flex;flex-wrap:wrap;gap:0.4rem;margin-top:1.5rem}
.tag{font-family:'JetBrains Mono',monospace;font-size:0.65rem;color:var(--muted);border:1px solid var(--border);padding:0.2rem 0.6rem;border-radius:2px;letter-spacing:0.05em;transition:all 0.2s}
.service-card:hover .tag{border-color:rgba(0,229,255,0.2);color:var(--accent)}

/* PREÇOS */
#pricing{background:var(--bg2);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.pricing-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}
.price-card{background:var(--bg);border:1px solid var(--border);padding:2.5rem;border-radius:4px;position:relative;transition:all 0.3s;overflow:hidden}
.price-card::after{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:transparent;transition:background 0.3s}
.price-card:hover{transform:translateY(-5px);border-color:rgba(0,229,255,0.2);box-shadow:0 20px 60px rgba(0,0,0,0.4)}
.price-card:hover::after{background:linear-gradient(90deg,var(--accent),var(--accent2))}
.price-card.featured{border-color:rgba(0,229,255,0.3);background:var(--bg3)}
.price-card.featured::after{background:linear-gradient(90deg,var(--accent),var(--accent2))}
.featured-badge{position:absolute;top:1.2rem;right:1.2rem;background:var(--accent);color:var(--bg);font-family:'JetBrains Mono',monospace;font-size:0.65rem;font-weight:700;padding:0.25rem 0.7rem;border-radius:2px;letter-spacing:0.1em;text-transform:uppercase}
.price-tier{font-family:'JetBrains Mono',monospace;font-size:0.7rem;color:var(--accent);letter-spacing:0.2em;text-transform:uppercase;margin-bottom:1.5rem}
.price-value{font-size:3rem;font-weight:800;letter-spacing:-0.04em;line-height:1;margin-bottom:0.3rem}
.price-value sup{font-size:1.2rem;vertical-align:super;margin-right:0.1em}
.price-note{font-family:'JetBrains Mono',monospace;font-size:0.75rem;color:var(--muted);margin-bottom:2rem}
.price-divider{height:1px;background:var(--border);margin:1.5rem 0}
.price-features{list-style:none;display:flex;flex-direction:column;gap:0.8rem;margin-bottom:2rem}
.price-features li{font-family:'JetBrains Mono',monospace;font-size:0.78rem;color:var(--muted);display:flex;align-items:flex-start;gap:0.7rem;line-height:1.5}
.price-features li::before{content:'→';color:var(--accent);flex-shrink:0}
.price-features li.hi{color:var(--text)}
.btn-price{width:100%;padding:0.85rem;border-radius:3px;font-family:'Syne',sans-serif;font-weight:700;font-size:0.82rem;letter-spacing:0.1em;text-transform:uppercase;cursor:pointer;text-decoration:none;display:block;text-align:center;transition:all 0.25s}
.btn-out{border:1px solid var(--border);background:transparent;color:var(--text)}
.btn-out:hover{border-color:var(--accent);color:var(--accent)}
.btn-fill{border:none;background:var(--accent);color:var(--bg)}
.btn-fill:hover{background:#fff;box-shadow:0 8px 30px rgba(0,229,255,0.3);transform:translateY(-1px)}

/* HQ */
#hq{position:relative;overflow:hidden}
.hq-inner{display:grid;grid-template-columns:1fr 1fr;gap:6rem;align-items:center}
.hq-visual{position:relative;height:500px}
.hq-terminal{background:var(--bg2);border:1px solid var(--border);border-radius:6px;overflow:hidden;position:absolute;width:100%;top:0;box-shadow:0 40px 80px rgba(0,0,0,0.5)}
.tbar{background:var(--bg3);padding:0.75rem 1rem;display:flex;align-items:center;gap:0.5rem;border-bottom:1px solid var(--border)}
.dot{width:10px;height:10px;border-radius:50%}
.dr{background:#ff5f57}.dy{background:#ffbd2e}.dg{background:#28c840}
.ttitle{font-family:'JetBrains Mono',monospace;font-size:0.7rem;color:var(--muted);margin:0 auto}
.tbody{padding:1.5rem;font-family:'JetBrains Mono',monospace;font-size:0.8rem;line-height:2}
.tl{display:block}
.tc{color:var(--accent)}.tg{color:#28c840}.ty{color:#f0ff00}.tm{color:var(--muted)}.tw{color:var(--text)}.tp{color:#a78bfa}
.cblink{display:inline-block;width:8px;height:14px;background:var(--accent);animation:blink 1s step-end infinite;vertical-align:middle}
.hq-float{position:absolute;bottom:0;right:-2rem;background:var(--bg3);border:1px solid rgba(0,229,255,0.15);padding:1.2rem 1.5rem;border-radius:4px;width:220px;box-shadow:0 20px 40px rgba(0,0,0,0.4)}
.hfl{font-family:'JetBrains Mono',monospace;font-size:0.65rem;color:var(--accent);letter-spacing:0.1em;text-transform:uppercase;margin-bottom:0.5rem}
.hfv{font-size:1.6rem;font-weight:800;letter-spacing:-0.03em;color:var(--accent)}
.hfs{font-family:'JetBrains Mono',monospace;font-size:0.7rem;color:var(--muted);margin-top:0.2rem}
.hq-body{font-family:'JetBrains Mono',monospace;font-size:0.85rem;color:var(--muted);line-height:1.9;margin-bottom:2.5rem}
.hq-skills{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-bottom:2.5rem}
.ski{display:flex;flex-direction:column;gap:0.4rem}
.skn{font-family:'JetBrains Mono',monospace;font-size:0.72rem;color:var(--text);display:flex;justify-content:space-between}
.skn span{color:var(--accent)}
.skb{height:3px;background:var(--border);border-radius:2px;overflow:hidden}
.skf{height:100%;background:linear-gradient(90deg,var(--accent),var(--accent2));border-radius:2px;transition:width 1.5s cubic-bezier(0.25,0.46,0.45,0.94);width:0}

/* CONTATO */
#contato{border-top:1px solid var(--border)}
.contact-inner{display:grid;grid-template-columns:1fr 1fr;gap:6rem;align-items:start}
.cdesc{font-family:'JetBrains Mono',monospace;font-size:0.85rem;color:var(--muted);line-height:1.8;margin-bottom:2.5rem;margin-top:1.5rem}
.cchannels{display:flex;flex-direction:column;gap:1rem}
.ch{display:flex;align-items:center;gap:1rem;padding:1rem 1.2rem;border:1px solid var(--border);border-radius:3px;transition:all 0.25s;text-decoration:none;color:var(--text)}
.ch:hover{border-color:rgba(0,229,255,0.3);background:var(--bg3);transform:translateX(5px)}
.chi{font-size:1.2rem;width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:var(--bg3);border-radius:3px;flex-shrink:0}
.chinfo label{display:block;font-family:'JetBrains Mono',monospace;font-size:0.65rem;color:var(--muted);letter-spacing:0.1em;text-transform:uppercase;margin-bottom:0.1rem}
.chinfo span{font-size:0.9rem;font-weight:600}
.cform{display:flex;flex-direction:column;gap:1rem}
.fg{display:flex;flex-direction:column;gap:0.4rem}
.fg label{font-family:'JetBrains Mono',monospace;font-size:0.7rem;color:var(--muted);letter-spacing:0.1em;text-transform:uppercase}
.fg input,.fg textarea,.fg select{background:var(--bg2);border:1px solid var(--border);color:var(--text);padding:0.85rem 1rem;font-family:'JetBrains Mono',monospace;font-size:0.85rem;border-radius:3px;outline:none;transition:border-color 0.2s;-webkit-appearance:none;appearance:none}
.fg input:focus,.fg textarea:focus,.fg select:focus{border-color:rgba(0,229,255,0.4);box-shadow:0 0 0 3px rgba(0,229,255,0.06)}
.fg textarea{resize:vertical;min-height:120px}
.frow{display:grid;grid-template-columns:1fr 1fr;gap:1rem}

/* RODAPÉ */
footer{padding:2rem 5%;border-top:1px solid var(--border);display:flex;align-items:center;justify-content:space-between}
.fl{font-size:1.1rem;font-weight:800;text-decoration:none;color:var(--text);letter-spacing:-0.02em}
.fl span{color:var(--accent)}
.ft{font-family:'JetBrains Mono',monospace;font-size:0.72rem;color:var(--muted)}
.ft strong{color:var(--accent)}

/* RESPONSIVO */
@media(max-width:900px){
  .services-grid,.pricing-grid,.hq-inner,.contact-inner{grid-template-columns:1fr}
  .hq-visual,.hero-stats{display:none}
  nav .nav-links{display:none}
  .frow{grid-template-columns:1fr}
  footer{flex-direction:column;gap:1rem;text-align:center}
}