/* ===========================================================
   Maesttro : Orquestrador RPA para Robôs Python
   Desenvolvido pela Vokta Solutions
   =========================================================== */

:root{
  --bg: #05010b;
  --bg-2: #090414;
  --surface: #0e091b;
  --surface-2: #150f25;
  --surface-3: #1d1533;
  --line: #291f42;
  --line-soft: #1c1530;
  --text: #f5f4f8;
  --text-dim: #b4abc4;
  --text-faint: #8880a0;

  --violet: #a53bff;
  --violet-2: #7c2ac7;
  --violet-glow: rgba(165,59,255,.36);

  --cyan: #63f5ff;
  --cyan-2: #33c6d6;
  --cyan-glow: rgba(99,245,255,.26);

  --ok: #4ade9a;
  --warn: #ffb454;
  --err: #ff6b6b;
  --info: #7c9cff;

  --radius-s: 6px;
  --radius-m: 12px;
  --radius-l: 20px;

  --font-display: "Space Grotesk", "Segoe UI", system-ui, sans-serif;
  --font-body: "Manrope", -apple-system, "Segoe UI", sans-serif;
  --font-mono: "JetBrains Mono", "SFMono-Regular", Consolas, monospace;

  color-scheme: dark;
}

*{box-sizing:border-box;}
html{background:var(--bg);scroll-behavior:smooth;}
body{
  margin:0;
  background:transparent;
  color:var(--text);
  font-family:var(--font-body);
  font-size:16px;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  position:relative;
  overflow-x:hidden;
}

/* ================= 3D AMBIENT BACKGROUND SCENE ================= */
.bg-3d-scene {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  z-index: -1;
  pointer-events: none;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  perspective: 1000px;
}

.bg-3d-gradient {
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 90% 70% at 50% 45%, #180d33 0%, #0d071b 50%, #05010b 95%);
  z-index: 1;
}

.bg-3d-glow {
  position: absolute;
  width: clamp(420px, 50vw, 750px);
  height: clamp(420px, 50vw, 750px);
  border-radius: 50%;
  background: radial-gradient(circle, rgba(165, 59, 255, 0.18) 0%, rgba(99, 245, 255, 0.08) 45%, transparent 70%);
  filter: blur(80px);
  z-index: 2;
  pointer-events: none;
}

.bg-3d-tilt-container {
  position: relative;
  z-index: 3;
  display: flex;
  align-items: center;
  justify-content: center;
  transform-style: preserve-3d;
  will-change: transform;
  transition: transform 0.18s cubic-bezier(0.2, 0.8, 0.3, 1);
}

.bg-3d-logo {
  width: clamp(280px, 40vw, 540px);
  height: auto;
  opacity: 0.15;
  filter: drop-shadow(0 0 50px rgba(165, 59, 255, 0.35));
  will-change: transform;
  transform-style: preserve-3d;
  user-select: none;
  pointer-events: none;
}

/* Modo flutuante automático para dispositivos touch ou sem cursor de precisão */
@media (hover: none), (pointer: coarse) {
  .bg-3d-tilt-container {
    animation: bg3dFloat 8s ease-in-out infinite;
  }
}

@keyframes bg3dFloat {
  0%, 100% {
    transform: perspective(1000px) rotateX(0deg) rotateY(0deg) translateY(0);
  }
  25% {
    transform: perspective(1000px) rotateX(4deg) rotateY(-4deg) translateY(-8px);
  }
  50% {
    transform: perspective(1000px) rotateX(0deg) rotateY(4deg) translateY(-14px);
  }
  75% {
    transform: perspective(1000px) rotateX(-4deg) rotateY(-2deg) translateY(-6px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .bg-3d-tilt-container {
    animation: none !important;
    transform: none !important;
  }
}

/* Textura sutil procedural */
body::before{
  content:"";
  position:fixed;inset:0;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='140' height='140'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix type='saturate' values='0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)' opacity='0.5'/></svg>");
  opacity:.028;
  mix-blend-mode:overlay;
  pointer-events:none;
  z-index:1000;
}
img{max-width:100%;display:block;}
a{color:inherit;}
::selection{background:var(--cyan-glow);color:var(--text);}

/* ================= ANIMAÇÕES DE MOVIMENTO VIVO ================= */
@keyframes ambient-pulse{
  0%,100%{
    transform:scale(1) translate(0, 0);
    opacity:.35;
  }
  50%{
    transform:scale(1.14) translate(15px, -10px);
    opacity:.55;
  }
}

@keyframes staff-flow{
  0%{transform:translateX(0);}
  50%{transform:translateX(18px);}
  100%{transform:translateX(0);}
}

@keyframes radar-ping{
  0%{transform:scale(.95);box-shadow:0 0 0 0 rgba(74,222,154,.7);}
  70%{transform:scale(1);box-shadow:0 0 0 8px rgba(74,222,154,0);}
  100%{transform:scale(.95);box-shadow:0 0 0 0 rgba(74,222,154,0);}
}

@keyframes pop-glow{
  0%,100%{text-shadow:none;}
  45%{text-shadow:0 0 20px var(--cyan-glow);}
}

/* Scroll reveal classes */
.js .reveal{opacity:0;transform:translateY(20px);transition:opacity .7s cubic-bezier(.2,.7,.3,1), transform .7s cubic-bezier(.2,.7,.3,1);}
.js .reveal.in-view{opacity:1;transform:none;}

.js .stagger > *{opacity:0;transform:translateY(14px);transition:opacity .5s ease,transform .5s ease;}
.js .stagger.in-view > *{opacity:1;transform:none;}
.stagger.in-view > *:nth-child(1){transition-delay:.02s;}
.stagger.in-view > *:nth-child(2){transition-delay:.07s;}
.stagger.in-view > *:nth-child(3){transition-delay:.12s;}
.stagger.in-view > *:nth-child(4){transition-delay:.17s;}
.stagger.in-view > *:nth-child(5){transition-delay:.22s;}
.stagger.in-view > *:nth-child(6){transition-delay:.27s;}

@media (prefers-reduced-motion: reduce){
  .js .reveal, .js .stagger > *{opacity:1;transform:none;transition:none !important;}
  .animated-staff, .hero-ambient-glow, .pulse-indicator, .pulse-dot-mini{animation:none !important;}
  html{scroll-behavior:auto;}
}

/* Tipografia Base */
h1,h2,h3,h4{
  font-family:var(--font-display);
  font-weight:600;
  line-height:1.1;
  margin:0;
  text-wrap:balance;
  letter-spacing:-0.015em;
}
p{margin:0;}
code{font-family:var(--font-mono);}

.container{
  max-width:1260px;
  margin:0 auto;
  padding:0 32px;
}
@media (max-width:720px){ .container{padding:0 20px;} }

.text-center{text-align:center;}
.mx-auto{margin-left:auto;margin-right:auto;}

.eyebrow{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--cyan);
}
.eyebrow::before{
  content:"";
  width:16px;height:1px;
  background:var(--cyan-2);
  display:inline-block;
}

/* Botões */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  font-family:var(--font-body);
  font-weight:700;
  font-size:14.5px;
  padding:12px 24px;
  border-radius:999px;
  border:1px solid transparent;
  cursor:pointer;
  text-decoration:none;
  transition:transform .15s ease, box-shadow .15s ease, background .15s ease, border-color .15s ease;
  white-space:nowrap;
}
.btn:focus-visible{outline:2px solid var(--cyan);outline-offset:2px;}
.btn-primary{
  background:linear-gradient(180deg,#8ff9ff,var(--cyan-2));
  color:#04141a;
  box-shadow:0 1px 0 rgba(255,255,255,.35) inset, 0 8px 20px -8px rgba(99,245,255,.5);
}
.btn-primary:hover{
  transform:translateY(-1px);
  box-shadow:0 1px 0 rgba(255,255,255,.45) inset, 0 12px 26px -8px rgba(99,245,255,.65);
}
.btn-ghost{
  background:transparent;
  border-color:var(--line);
  color:var(--text);
}
.btn-ghost:hover{
  border-color:var(--cyan-2);
  background:rgba(99,245,255,.08);
}
.btn-block{width:100%;}

/* ================= HEADER / NAVEGAÇÃO ================= */
header.nav{
  position:sticky;top:0;z-index:90;
  backdrop-filter:blur(14px) saturate(140%);
  background:rgba(8,3,16,.82);
  border-bottom:1px solid var(--line-soft);
}
.nav-inner{
  display:flex;align-items:center;justify-content:space-between;
  height:74px;
}
.brand{
  display:flex;align-items:center;gap:12px;
  text-decoration:none;
  transition:opacity .15s ease;
}
.brand:hover{opacity:.92;}
.brand:focus-visible{outline:2px solid var(--cyan);outline-offset:4px;border-radius:4px;}
.brand-logo{
  width:36px;height:36px;border-radius:50%;
  object-fit:cover;
  border:1px solid rgba(165,59,255,.4);
  box-shadow:0 0 14px rgba(165,59,255,.3);
}
.brand-text{display:flex;flex-direction:column;line-height:1.15;}
.brand-word{
  font-family:var(--font-display);
  font-size:20px;font-weight:700;
  color:var(--text);letter-spacing:.01em;
  text-shadow:0 0 16px rgba(99,245,255,.3);
}
.brand-sub{
  font-family:var(--font-mono);
  font-size:10px;
  color:#c77dff;
  letter-spacing:.06em;
}

.nav-links{display:flex;align-items:center;gap:28px;font-size:14px;color:var(--text-dim);}
.nav-links a{text-decoration:none;transition:color .15s ease;}
.nav-links a:hover{color:var(--text);}
.nav-links a:focus-visible{outline:2px solid var(--cyan);outline-offset:4px;border-radius:4px;}
@media (min-width:921px){
  .nav-links a{position:relative;padding-bottom:4px;}
  .nav-links a::after{
    content:"";position:absolute;left:0;right:100%;bottom:0;height:2px;
    background:var(--cyan);transition:right .25s cubic-bezier(.2,.7,.3,1);
  }
  .nav-links a:hover::after,.nav-links a:focus-visible::after{right:0;}
  .nav-drawer-footer{display:none;}
}
.nav-cta{display:flex;align-items:center;gap:12px;}
.nav-toggle{
  display:none;
  width:42px;height:42px;border-radius:10px;
  background:var(--surface);border:1px solid var(--line);
  color:var(--text);cursor:pointer;
  align-items:center;justify-content:center;
}
.nav-toggle:focus-visible{outline:2px solid var(--cyan);outline-offset:2px;}
.nav-toggle .icon-close{display:none;}
.nav-toggle[aria-expanded="true"] .icon-open{display:none;}
.nav-toggle[aria-expanded="true"] .icon-close{display:block;}

@media (max-width:920px){
  .nav-links{
    position:absolute;top:74px;left:0;right:0;
    background:var(--bg-2);border-bottom:1px solid var(--line);
    flex-direction:column;align-items:stretch;gap:0;
    padding:12px 20px 24px;
    display:none;
    box-shadow:0 24px 40px rgba(0,0,0,.6);
  }
  .nav-links.open{display:flex;}
  .nav-links a{padding:14px 12px;border-bottom:1px solid var(--line-soft);font-size:15px;}
  .nav-drawer-footer{padding-top:16px;}
  .nav-toggle{display:flex;}
  .btn-cta-desktop{display:none;}
  .nav-cta .btn-ghost{display:none;}
}

@media (max-width:480px){
  .brand-sub{display:none;}
}

/* ================= HERO ================= */
.hero{
  position:relative;
  overflow:hidden;
  padding:56px 0 84px;
  background:transparent;
}
.hero-ambient-glow{
  position:absolute;
  top:-120px;
  right:-100px;
  width:750px;
  height:650px;
  border-radius:50%;
  background:radial-gradient(circle, var(--violet-glow) 0%, rgba(99,245,255,.14) 45%, transparent 70%);
  filter:blur(60px);
  pointer-events:none;
  animation:ambient-pulse 9s ease-in-out infinite;
}
.hero-ring{
  position:absolute; right:-180px; top:-180px;
  width:620px;height:620px;border-radius:50%;
  border:1px solid var(--line);
  opacity:.5;
  pointer-events:none;
}
.hero-ring::before{
  content:"";position:absolute;inset:70px;border-radius:50%;
  border:1px solid var(--line-soft);
}
.staff{
  position:absolute; left:0; right:44%; top:100px; height:200px;
  opacity:.15; pointer-events:none;
}
.animated-staff{animation:staff-flow 12s ease-in-out infinite;}

.hero-grid{
  position:relative;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:44px;
  align-items:center;
}
@media (max-width:980px){
  .hero-grid{grid-template-columns:1fr;}
}

.hero h1{
  font-size:clamp(32px,4vw,50px);
  margin:16px 0 18px;
  max-width:20ch;
}
.hero h1 em{
  font-style:normal;
  color:var(--cyan);
  text-shadow:0 0 24px var(--cyan-glow);
}
.hero-sub{
  font-size:17px;
  color:var(--text-dim);
  max-width:48ch;
  margin-bottom:28px;
}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:34px;}

.hero-chips{
  display:flex;flex-wrap:wrap;gap:1px;
  background:var(--line-soft);border:1px solid var(--line-soft);
  border-radius:14px;overflow:hidden;
}
.hero-chip{flex:1 1 140px;background:var(--surface);padding:16px 18px;}
.hero-chip .n{font-family:var(--font-display);font-size:22px;font-variant-numeric:tabular-nums;color:var(--text);}
.hero-chip .n span{color:var(--cyan);text-shadow:0 0 18px var(--cyan-glow);}
.hero-chip .l{font-size:11.5px;color:var(--text-faint);margin-top:3px;}

/* ================= PAINEL DEMONSTRATIVO (HERO VISUAL) ================= */
.hero-visual{position:relative;padding-top:4px;}
.stage-badge-wrap{margin-bottom:12px;}
.stage-badge{
  display:inline-flex;align-items:center;gap:8px;
  font-family:var(--font-mono);font-size:11.5px;color:var(--text-faint);
  background:rgba(165,59,255,.1);
  padding:4px 12px;
  border-radius:999px;
  border:1px solid rgba(165,59,255,.3);
}
.pulse-indicator{
  width:7px;height:7px;border-radius:50%;
  background:var(--ok);
  display:inline-block;
  animation:radar-ping 2.2s infinite;
}
.pulse-dot-mini{
  width:6px;height:6px;border-radius:50%;
  background:var(--ok);
  display:inline-block;
  box-shadow:0 0 6px var(--ok);
}

.stage{
  position:relative;
  border-radius:var(--radius-l);
  padding:12px;
  background:linear-gradient(160deg,#1b1130,#0b0714 60%);
  border:1px solid var(--line);
  box-shadow:0 36px 70px -25px rgba(0,0,0,.75), 0 0 0 1px rgba(255,255,255,.03) inset;
}
.app-browser-frame{
  background:#0e091b;
  border-radius:14px;
  overflow:hidden;
  border:1px solid var(--line-soft);
}
.app-bar{
  display:flex;align-items:center;gap:8px;
  padding:10px 14px;
  background:#130b24;
  border-bottom:1px solid var(--line-soft);
}
.dot{width:9px;height:9px;border-radius:50%;}
.dot.r{background:#ff6b6b;} .dot.y{background:#ffb454;} .dot.g{background:#4ade9a;}
.app-url{margin-left:8px;font-family:var(--font-mono);font-size:11px;color:var(--text-faint);}

.demo-screenshot-container{
  width:100%;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
}
.demo-screenshot{
  width:100%;
  height:auto;
  display:block;
  aspect-ratio:1715/915;
  object-fit:cover;
}

.float-card{
  position:absolute; left:-20px; bottom:-24px;
  width:240px;
  background:var(--surface-2);
  border:1px solid var(--line);
  border-radius:12px;
  padding:14px 16px;
  box-shadow:0 24px 40px -18px rgba(0,0,0,.7);
  z-index:3;
}
.float-card .t{display:flex;align-items:center;gap:7px;font-family:var(--font-mono);font-size:10.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--ok);margin-bottom:6px;}
.float-card .m{font-size:13px;color:var(--text);font-weight:700;}
.float-card .s{font-size:11.5px;color:var(--text-faint);margin-top:3px;}
@media (max-width:980px){ .float-card{display:none;} }

/* ================= TRUST BAR ================= */
.trust{padding:36px 0;border-top:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft);background:var(--bg-2);}
.trust-label{font-family:var(--font-mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-faint);text-align:center;margin-bottom:18px;}
.client-showcase{display:flex;flex-direction:column;align-items:center;gap:10px;}
.client-logo{
  height:44px;width:auto;
  filter:grayscale(1) opacity(.65) brightness(1.5);
  transition:filter .3s ease, transform .3s ease;
}
.client-showcase:hover .client-logo{filter:grayscale(0) opacity(1) brightness(1);transform:scale(1.03);}
.client-caption{font-family:var(--font-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--text-faint);font-weight:500;}

/* ================= SECTIONS SHELL ================= */
section{padding:92px 0;}
.section-head{max-width:680px;margin-bottom:52px;}
.section-head h2{font-size:clamp(26px,3.2vw,38px);margin-top:14px;}
.section-head p{margin-top:14px;color:var(--text-dim);font-size:16px;}

/* ================= RESULTADOS (CASE) ================= */
.case{
  background:linear-gradient(180deg,var(--surface),var(--surface-2));
  border:1px solid var(--line-soft);border-radius:var(--radius-l);
  padding:44px;
}
@media (max-width:720px){ .case{padding:26px;} }
.case-top{display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:18px;margin-bottom:34px;}
.case-client{font-family:var(--font-display);font-size:26px;font-weight:600;}
.case-client small{display:block;font-family:var(--font-body);font-size:13.5px;font-weight:500;color:var(--text-faint);margin-top:4px;}
.case-badge{
  font-family:var(--font-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;
  color:var(--violet);border:1px solid rgba(165,59,255,.4);background:rgba(165,59,255,.1);
  padding:6px 14px;border-radius:999px;
}
.case-mini-stats{
  display:flex;flex-wrap:wrap;gap:1px;margin-bottom:28px;
  background:var(--line-soft);border:1px solid var(--line-soft);border-radius:var(--radius-m);overflow:hidden;
}
.mini-stat{flex:1 1 160px;background:var(--surface);padding:18px 22px;transition:background .2s ease;}
.mini-stat:hover{background:var(--surface-2);}
.mini-stat .mini-num{
  font-family:var(--font-display);font-size:25px;font-weight:600;
  font-variant-numeric:tabular-nums;color:var(--cyan);text-shadow:0 0 16px var(--cyan-glow);
}
.mini-stat .mini-lbl{display:block;margin-top:4px;font-size:12px;color:var(--text-faint);}

.case-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line-soft);border:1px solid var(--line-soft);border-radius:var(--radius-m);overflow:hidden;}
@media (max-width:800px){ .case-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:480px){ .case-grid{grid-template-columns:1fr;} }
.case-stat{background:var(--surface);padding:24px 20px;}
.case-stat .num{font-family:var(--font-display);font-size:clamp(22px,2.8vw,30px);color:var(--cyan);}
.js .case.reveal.in-view .case-stat .num{animation:pop-glow 1.3s ease .25s;}
.case-stat .lbl{margin-top:6px;font-size:13px;color:var(--text-dim);}
.case-note{margin-top:28px;font-size:14.5px;color:var(--text-faint);max-width:70ch;}

/* ================= CALCULADORA DE ROI / OTIMIZAÇÃO ================= */
.roi-calc{
  background:linear-gradient(170deg, rgba(21,15,37,.85), rgba(14,9,27,.92));
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  border:1px solid var(--line);
  border-radius:var(--radius-l);
  padding:44px;
  margin-top:36px;
  box-shadow:0 24px 50px -15px rgba(0,0,0,.6);
  position:relative;
}
@media (max-width:720px){ .roi-calc{padding:26px 20px;} }

.roi-calc-head{max-width:680px;margin-bottom:34px;}
.roi-calc-head h3{font-size:clamp(22px,2.6vw,30px);margin:10px 0 10px;}
.roi-calc-head p{font-size:15px;color:var(--text-dim);}

.roi-calc-body{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:36px;
  align-items:stretch;
}
@media (max-width:920px){ .roi-calc-body{grid-template-columns:1fr;gap:28px;} }

.roi-controls{display:flex;flex-direction:column;gap:20px;}
.roi-field{
  background:var(--surface-2);
  border:1px solid var(--line-soft);
  border-radius:14px;
  padding:20px 22px;
  transition:border-color .2s ease;
}
.roi-field:hover, .roi-field:focus-within{border-color:var(--line);}

.roi-label-row{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:14px;
  gap:12px;
}
.roi-label-row label{
  font-size:14px;
  font-weight:600;
  color:var(--text);
}
.roi-val{
  font-family:var(--font-display);
  font-size:18px;
  font-weight:700;
  color:var(--cyan);
  text-shadow:0 0 16px var(--cyan-glow);
  white-space:nowrap;
}

.roi-slider{
  width:100%;
  height:6px;
  border-radius:3px;
  background:var(--line);
  outline:none;
  appearance:none;
  -webkit-appearance:none;
  cursor:pointer;
  transition:background .2s;
}
.roi-slider::-webkit-slider-thumb{
  appearance:none;
  -webkit-appearance:none;
  width:22px;
  height:22px;
  border-radius:50%;
  background:var(--cyan);
  cursor:pointer;
  box-shadow:0 0 14px var(--cyan-glow);
  border:2px solid #fff;
  transition:transform .15s ease;
}
.roi-slider::-webkit-slider-thumb:hover{transform:scale(1.18);}
.roi-slider::-moz-range-thumb{
  width:22px;
  height:22px;
  border-radius:50%;
  background:var(--cyan);
  cursor:pointer;
  box-shadow:0 0 14px var(--cyan-glow);
  border:2px solid #fff;
  transition:transform .15s ease;
}
.roi-slider::-moz-range-thumb:hover{transform:scale(1.18);}

.roi-scale{
  display:flex;
  justify-content:space-between;
  font-family:var(--font-mono);
  font-size:11px;
  color:var(--text-faint);
  margin-top:10px;
}

.roi-info-pill{
  display:flex;
  align-items:center;
  gap:10px;
  font-size:12.5px;
  color:var(--text-dim);
  background:rgba(165,59,255,.1);
  border:1px solid rgba(165,59,255,.3);
  border-radius:12px;
  padding:12px 16px;
  line-height:1.45;
}

.roi-results{
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  gap:20px;
}
.roi-kpi-grid{display:flex;flex-direction:column;gap:12px;}
.roi-kpi{
  background:var(--surface-2);
  border:1px solid var(--line-soft);
  border-radius:14px;
  padding:18px 22px;
  transition:border-color .2s ease, transform .2s ease;
}
.roi-kpi:hover{border-color:var(--line);transform:translateY(-1px);}
.roi-kpi.highlight{
  background:linear-gradient(150deg, rgba(165,59,255,.18), rgba(99,245,255,.07));
  border-color:rgba(165,59,255,.5);
}
.roi-kpi-lbl{
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--text-faint);
  margin-bottom:6px;
}
.roi-kpi-num{
  font-family:var(--font-display);
  font-size:clamp(24px, 2.8vw, 32px);
  font-weight:700;
  color:var(--cyan);
  font-variant-numeric:tabular-nums;
}
.roi-kpi.highlight .roi-kpi-num{
  color:#fff;
  text-shadow:0 0 20px var(--violet-glow);
}
.roi-kpi-sub{
  font-size:12px;
  color:var(--text-dim);
  margin-top:4px;
}
.roi-action{margin-top:4px;}

/* ================= COMO FUNCIONA ================= */
.steps-layout{display:grid;grid-template-columns:.92fr 1.08fr;gap:52px;align-items:start;}
@media (max-width:920px){ .steps-layout{grid-template-columns:1fr;gap:36px;} }
.steps-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:28px;}
.step{display:flex;gap:18px;align-items:flex-start;}
.step-n{
  flex:none;width:38px;height:38px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-family:var(--font-display);font-weight:700;font-size:15px;
  background:rgba(99,245,255,.12);color:var(--cyan);
  border:1px solid rgba(99,245,255,.28);
}
.step-copy h3{font-size:17.5px;margin-bottom:6px;}
.step-copy p{color:var(--text-dim);font-size:14.5px;}
.steps-visual{position:relative;}
@media (min-width:921px){ .steps-visual{position:sticky;top:105px;} }

.app{
  background:#0d0817;border-radius:14px;overflow:hidden;
  border:1px solid var(--line-soft);
}
.kpi-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
@media (max-width:480px){ .kpi-grid{grid-template-columns:1fr;} }
.kpi-card{background:var(--surface-2);border:1px solid var(--line-soft);border-radius:12px;padding:14px 16px;}
.kpi-top{display:flex;justify-content:space-between;align-items:flex-start;gap:8px;}
.kpi-label{font-size:12px;font-weight:700;color:var(--text);}
.kpi-icon{width:28px;height:28px;border-radius:8px;display:flex;align-items:center;justify-content:center;background:rgba(99,245,255,.12);color:var(--cyan);flex:none;}
.kpi-sub{font-size:11px;color:var(--text-faint);margin-top:3px;}
.kpi-num{font-family:var(--font-display);font-size:18px;font-weight:700;margin-top:10px;}

/* ================= RECURSOS (FEATURE GRID) ================= */
.feat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line-soft);border:1px solid var(--line-soft);border-radius:var(--radius-l);overflow:hidden;}
@media (max-width:900px){ .feat-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:600px){ .feat-grid{grid-template-columns:1fr;} }
.feat{background:var(--surface);padding:32px 28px;transition:background .2s ease, transform .2s ease;position:relative;}
.feat:hover{background:var(--surface-2);}
.feat .ic{
  width:42px;height:42px;border-radius:10px;
  display:flex;align-items:center;justify-content:center;
  background:rgba(99,245,255,.12);color:var(--cyan);margin-bottom:18px;
  border:1px solid rgba(99,245,255,.2);
  transition:transform .2s ease, background .2s ease;
}
.feat:hover .ic{transform:scale(1.08);background:rgba(99,245,255,.22);}
.feat h4{font-size:16.5px;font-weight:700;font-family:var(--font-body);margin-bottom:9px;}
.feat p{font-size:14px;color:var(--text-dim);}
.feat-proof{
  display:flex;align-items:center;gap:8px;margin-top:14px;padding-top:14px;
  border-top:1px solid var(--line-soft);
  font-family:var(--font-mono);font-size:11px;color:var(--text-faint);
}
.feat-proof::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--cyan);box-shadow:0 0 8px var(--cyan-glow);}

/* ================= SEGURANÇA E GOVERNANÇA ================= */
.security-section{background:var(--bg-2);border-top:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft);}
.security-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
@media (max-width:1024px){ .security-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:600px){ .security-grid{grid-template-columns:1fr;} }
.security-card{
  background:var(--surface);
  border:1px solid var(--line-soft);
  border-radius:var(--radius-m);
  padding:26px 22px;
  transition:border-color .2s ease, transform .2s ease;
}
.security-card:hover{border-color:var(--violet);transform:translateY(-2px);}
.sec-icon{
  width:40px;height:40px;border-radius:10px;
  background:rgba(165,59,255,.14);color:#c77dff;
  display:flex;align-items:center;justify-content:center;
  margin-bottom:16px;
  border:1px solid rgba(165,59,255,.25);
}
.security-card h4{font-size:16px;font-weight:700;margin-bottom:8px;}
.security-card p{font-size:13.5px;color:var(--text-dim);}

/* ================= DEPOIMENTOS ================= */
.testimonials-section{padding:92px 0;}
.quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
@media (max-width:900px){ .quotes{grid-template-columns:1fr;} }
.quote{
  background:var(--surface);border:1px solid var(--line-soft);border-radius:var(--radius-l);
  padding:30px 26px;display:flex;flex-direction:column;
  transition:transform .25s ease, border-color .25s ease;
}
.quote:hover{transform:translateY(-4px);border-color:var(--cyan-2);}
.quote .mark{font-family:var(--font-display);font-size:42px;color:var(--cyan);line-height:1;margin-bottom:6px;}
.quote p.body{font-size:15px;color:var(--text);margin-bottom:22px;flex:1;}
.quote .who{font-size:13.5px;color:var(--text-dim);border-top:1px solid var(--line-soft);padding-top:14px;}
.quote .who b{color:var(--text);display:block;font-size:14px;margin-bottom:2px;}

/* ================= PREÇOS ================= */
.price-toggle{
  display:inline-flex;align-items:center;gap:12px;background:var(--surface);
  border:1px solid var(--line);border-radius:999px;padding:5px;margin-bottom:44px;
}
.price-toggle button{
  font-family:var(--font-body);font-weight:700;font-size:13.5px;padding:9px 20px;
  border-radius:999px;border:none;background:transparent;color:var(--text-dim);cursor:pointer;
  transition:background .2s, color .2s;
}
.price-toggle button.on{background:var(--violet);color:#fff;}
.price-toggle button:focus-visible{outline:2px solid var(--cyan);outline-offset:2px;}
.price-toggle .save{font-family:var(--font-mono);font-size:11px;color:var(--cyan);margin-right:6px;}

.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;align-items:stretch;}
@media (max-width:900px){ .plans{grid-template-columns:1fr;} }
.plan{
  background:var(--surface);border:1px solid var(--line-soft);border-radius:var(--radius-l);
  padding:30px 26px;display:flex;flex-direction:column;
  transition:transform .25s ease, border-color .25s ease;
}
.plan:hover{transform:translateY(-4px);border-color:var(--cyan-2);}
.plan.featured:hover{transform:translateY(-8px);}
.plan.featured{
  border-color:var(--violet);
  background:linear-gradient(180deg,rgba(165,59,255,.14),var(--surface) 40%);
  position:relative;
  transform:translateY(-6px);
}
.plan.featured .badge{
  position:absolute;top:-13px;left:26px;
  background:var(--violet);color:#fff;font-family:var(--font-mono);
  font-size:10.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;
  padding:5px 12px;border-radius:999px;
}
.plan .pname{font-size:14px;font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.08em;color:var(--text-faint);margin-bottom:14px;}
.plan .pprice{font-family:var(--font-display);font-size:38px;margin-bottom:4px;}
.plan .pprice span{font-family:var(--font-body);font-size:14px;color:var(--text-faint);font-weight:600;}
.plan .pdesc{font-size:13.5px;color:var(--text-dim);margin-bottom:22px;min-height:40px;}
.plan ul{list-style:none;margin:0 0 26px;padding:0;display:flex;flex-direction:column;gap:11px;flex:1;}
.plan li{display:flex;gap:9px;font-size:13.5px;color:var(--text-dim);align-items:flex-start;}
.plan li svg{flex:none;margin-top:3px;color:var(--ok);}
.monthly-only{display:inline;}
.annual-only{display:none;}
.price-annual .monthly-only{display:none;}
.price-annual .annual-only{display:inline;}

/* ================= FAQ ================= */
.faq-section{background:var(--bg-2);border-top:1px solid var(--line-soft);}
.faq-list{max-width:820px;margin:0 auto;display:flex;flex-direction:column;gap:14px;}
.faq-item{
  background:var(--surface);
  border:1px solid var(--line-soft);
  border-radius:14px;
  overflow:hidden;
  transition:border-color .25s ease, background .25s ease, box-shadow .25s ease;
}
.faq-item:hover{
  border-color:var(--line);
}
.faq-item[open]{
  border-color:rgba(165,59,255,.45);
  box-shadow:0 8px 25px -10px rgba(165,59,255,.15);
}
.faq-question{
  padding:20px 24px;
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  font-family:var(--font-display);font-size:17px;font-weight:600;
  color:var(--text);cursor:pointer;list-style:none;user-select:none;
}
.faq-question::-webkit-details-marker{display:none;}
.faq-question:focus-visible{outline:2px solid var(--cyan);outline-offset:-2px;border-radius:12px;}
.faq-icon{
  width:24px;height:24px;border-radius:50%;
  background:rgba(99,245,255,.1);border:1px solid rgba(99,245,255,.2);
  display:flex;align-items:center;justify-content:center;
  flex-shrink:0;position:relative;
  transition:transform .25s ease, background .2s ease;
}
.faq-question:hover .faq-icon{
  background:rgba(99,245,255,.2);
}
.faq-icon::before, .faq-icon::after{
  content:"";position:absolute;background:var(--cyan);
}
.faq-icon::before{width:10px;height:2px;}
.faq-icon::after{width:2px;height:10px;transition:opacity .2s;}
.faq-item[open] .faq-icon{transform:rotate(90deg);background:rgba(165,59,255,.25);border-color:rgba(165,59,255,.5);}
.faq-item[open] .faq-icon::before{background:var(--violet);}
.faq-item[open] .faq-icon::after{opacity:0;}

.faq-answer{
  display:grid;
  grid-template-rows:0fr;
  padding:0 24px;
  color:var(--text-dim);
  font-size:15px;line-height:1.65;
  opacity:0;
  transition:grid-template-rows .3s cubic-bezier(.2,.8,.2,1), opacity .25s ease, padding .3s ease;
}
.faq-item[open] .faq-answer{
  grid-template-rows:1fr;
  padding:0 24px 22px;
  opacity:1;
}
.faq-answer > p{
  overflow:hidden;
  margin:0;
}

/* ================= SEÇÃO DE CONTATO / LEAD GEN ================= */
.contact-section{padding:96px 0;background:radial-gradient(700px 340px at 50% 120%, var(--violet-glow), transparent 70%), var(--bg);}
.contact-card{
  background:linear-gradient(160deg,var(--surface-2),var(--surface));
  border:1px solid var(--line);
  border-radius:var(--radius-l);
  display:grid;grid-template-columns:1fr 1.15fr;
  gap:44px;
  padding:48px;
  box-shadow:0 30px 60px rgba(0,0,0,.6);
}
@media (max-width:920px){
  .contact-card{grid-template-columns:1fr;padding:30px 22px;gap:36px;}
}
.contact-info h2{font-size:clamp(26px,3vw,36px);margin:14px 0 16px;}
.contact-info p{color:var(--text-dim);font-size:16px;line-height:1.6;margin-bottom:28px;}
.contact-features{display:flex;flex-direction:column;gap:14px;}
.c-feat{display:flex;align-items:center;gap:12px;font-size:14.5px;color:var(--text);}
.c-dot{width:8px;height:8px;border-radius:50%;background:var(--cyan);box-shadow:0 0 8px var(--cyan-glow);flex-shrink:0;}

.contact-form{display:flex;flex-direction:column;gap:16px;}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
@media (max-width:640px){.form-row{grid-template-columns:1fr;}}
.form-group{display:flex;flex-direction:column;gap:6px;}
.form-group label{font-size:13px;font-weight:600;color:var(--text);font-family:var(--font-body);}
.form-group .req{color:var(--cyan);}
.form-group .opt{color:var(--text-faint);font-weight:400;font-size:12px;}
.form-group input, .form-group textarea{
  background:#120c22;
  border:1px solid var(--line);
  border-radius:10px;
  padding:12px 14px;
  color:#fff;
  font-family:var(--font-body);
  font-size:14px;
  transition:border-color .15s, box-shadow .15s;
  width:100%;
}
.form-group input:focus, .form-group textarea:focus{
  outline:none;
  border-color:var(--cyan);
  box-shadow:0 0 0 3px rgba(99,245,255,.18);
}
.form-group input.has-error, .form-group textarea.has-error{
  border-color:var(--err);
  box-shadow:0 0 0 2px rgba(255,107,107,.2);
}
.field-error{font-size:11.5px;color:var(--err);min-height:16px;font-family:var(--font-body);}
.form-submit{margin-top:6px;}
.form-status{
  font-size:13.5px;padding:10px 14px;border-radius:8px;display:none;margin-top:8px;
  font-family:var(--font-body);
}
.form-status.success{display:block;background:rgba(74,222,154,.15);color:var(--ok);border:1px solid rgba(74,222,154,.3);}
.form-status.error{display:block;background:rgba(255,107,107,.15);color:var(--err);border:1px solid rgba(255,107,107,.3);}

.lgpd-notice{
  display:flex;
  align-items:flex-start;
  gap:8px;
  font-size:11.5px;
  color:var(--text-faint);
  margin-top:12px;
  line-height:1.45;
}
.lgpd-notice svg{flex:none;color:var(--ok);margin-top:2px;}

.contact-direct-wa{
  display:flex;flex-direction:column;gap:6px;margin-top:14px;padding-top:14px;
  border-top:1px solid var(--line-soft);text-align:center;align-items:center;
}
.contact-direct-wa .wa-label{font-size:12px;color:var(--text-faint);font-family:var(--font-mono);}
.link-wa{
  display:inline-flex;align-items:center;gap:8px;
  font-size:13.5px;font-weight:700;color:#25d366;text-decoration:none;
  padding:8px 16px;border-radius:999px;background:rgba(37,211,102,.1);
  border:1px solid rgba(37,211,102,.3);transition:background .2s, transform .2s;
}
.link-wa:hover{background:rgba(37,211,102,.2);transform:translateY(-1px);}
.link-wa:focus-visible{outline:2px solid #25d366;outline-offset:2px;}

/* ================= FOOTER ================= */
footer{background:var(--bg-2);border-top:1px solid var(--line-soft);padding:64px 0 32px;}
.foot-grid{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:40px;padding-bottom:36px;}
@media (max-width:800px){ .foot-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:500px){ .foot-grid{grid-template-columns:1fr;} }
.foot-brand p{color:var(--text-faint);font-size:13.5px;margin-top:14px;max-width:32ch;}
.foot-col h5{font-family:var(--font-mono);font-size:11.5px;text-transform:uppercase;letter-spacing:.08em;color:var(--text-faint);margin-bottom:16px;}
.foot-col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:11px;}
.foot-col a{font-size:13.5px;color:var(--text-dim);text-decoration:none;transition:color .15s;}
.foot-col a:hover{color:var(--text);}
.foot-col a:focus-visible{outline:2px solid var(--cyan);outline-offset:3px;border-radius:2px;}

.foot-used-by{
  display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  padding:20px 0;border-top:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft);
  margin-bottom:24px;
}
.foot-used-by .lbl{font-family:var(--font-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--text-faint);}
.foot-used-by .client-word{font-family:var(--font-display);font-size:18px;font-weight:600;color:var(--text-dim);}
.foot-used-by .client-badge-sub{font-size:12px;color:var(--text-faint);font-family:var(--font-mono);}

.foot-bottom{
  display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px;
  font-size:12.5px;color:var(--text-faint);font-family:var(--font-mono);
}
.foot-lgpd{
  display:inline-flex;
  align-items:center;
  color:var(--text-faint);
  font-size:12px;
  font-family:var(--font-mono);
}
.foot-lgpd svg{color:var(--ok);}

/* ================= SPOTLIGHT CURSOR & GLASSMORPHISM ENHANCEMENT ================= */
.spotlight-card {
  position: relative;
  background: rgba(14, 9, 27, 0.75);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border: 1px solid rgba(41, 31, 66, 0.75);
  box-shadow: 0 10px 30px -10px rgba(0, 0, 0, 0.45);
  transition: transform 0.28s cubic-bezier(0.2, 0.8, 0.2, 1),
              border-color 0.28s ease,
              box-shadow 0.28s ease,
              background 0.28s ease;
}

/* Camada interna de brilho radial sutil que segue o cursor */
.spotlight-card::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: radial-gradient(
    400px circle at var(--mouse-x, -999px) var(--mouse-y, -999px),
    rgba(165, 59, 255, 0.14),
    rgba(99, 245, 255, 0.04) 40%,
    transparent 70%
  );
  opacity: 0;
  transition: opacity 0.35s ease;
  pointer-events: none;
  z-index: 1;
}

/* Borda iluminada com gradiente que segue o cursor (border spotlight) */
.spotlight-card::after {
  content: "";
  position: absolute;
  inset: -1px;
  border-radius: inherit;
  padding: 1px;
  background: radial-gradient(
    320px circle at var(--mouse-x, -999px) var(--mouse-y, -999px),
    rgba(99, 245, 255, 0.6),
    rgba(165, 59, 255, 0.4) 35%,
    transparent 65%
  );
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  opacity: 0;
  transition: opacity 0.3s ease;
  pointer-events: none;
  z-index: 2;
}

.spotlight-card:hover::before,
.spotlight-card:hover::after {
  opacity: 1;
}

.spotlight-card > * {
  position: relative;
  z-index: 3;
}

.spotlight-card:hover {
  box-shadow: 0 20px 40px -15px rgba(0, 0, 0, 0.65), 0 0 25px -6px rgba(165, 59, 255, 0.2);
}

.plan.featured.spotlight-card {
  background: linear-gradient(180deg, rgba(165, 59, 255, 0.18), rgba(14, 9, 27, 0.85) 45%);
  border-color: rgba(165, 59, 255, 0.7);
}

@media (prefers-reduced-motion: reduce) {
  .spotlight-card::before,
  .spotlight-card::after {
    display: none !important;
  }
}