  :root {
    --ink: #06080f;
    --surface: #0b0e1a;
    --panel: #111528;
    --border: rgba(99,120,255,0.18);
    --accent: #4f6ef7;
    --accent2: #a259ff;
    --cyan: #00d4ff;
    --glow: rgba(79,110,247,0.35);
    --text: #e8eaf6;
    --muted: #8891b4;
    --white: #ffffff;
    --grad: linear-gradient(135deg, var(--accent) 0%, var(--accent2) 100%);
    --grad2: linear-gradient(135deg, #00d4ff 0%, #4f6ef7 100%);
  }
  *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
  html { scroll-behavior: smooth; }
  body {
    background: var(--ink);
    color: var(--text);
    font-family: 'DM Sans', sans-serif;
    font-size: 16px;
    line-height: 1.6;
    overflow-x: hidden;
    cursor: none;
  }
  h1,h2,h3,h4 { font-family: 'Syne', sans-serif; }

  /* CUSTOM CURSOR */
  #cursor { position: fixed; width:12px; height:12px; background:var(--accent); border-radius:50%; pointer-events:none; z-index:9999; transform:translate(-50%,-50%); transition:transform .1s; mix-blend-mode:screen; }
  #cursor-glow { position:fixed; width:60px; height:60px; background:radial-gradient(circle, rgba(79,110,247,0.25) 0%, transparent 70%); border-radius:50%; pointer-events:none; z-index:9998; transform:translate(-50%,-50%); transition:transform .18s ease; }

  /* CANVAS PARTICLES */
  #particles-canvas { position:fixed; top:0; left:0; width:100%; height:100%; z-index:0; pointer-events:none; opacity:.55; }

  /* NAV */
  nav {
    position: fixed; top:0; left:0; right:0; z-index:1000;
    display:flex; align-items:center; justify-content:space-between;
    padding: 1rem 6%;
    background: rgba(6,8,15,0.7);
    backdrop-filter: blur(20px);
    border-bottom: 1px solid var(--border);
    transition: all .3s;
  }
  .nav-logo { font-family:'Syne',sans-serif; font-size:1.5rem; font-weight:800; background:var(--grad); -webkit-background-clip:text; -webkit-text-fill-color:transparent; letter-spacing:-.02em; }
  .nav-links { display:flex; gap:2rem; list-style:none; }
  .nav-links a { color:var(--muted); text-decoration:none; font-size:.9rem; font-weight:500; transition:color .2s; cursor:none; }
  .nav-links a:hover { color:var(--white); }
  .nav-cta { background:var(--grad); color:#fff; border:none; padding:.6rem 1.4rem; border-radius:40px; font-family:'Syne',sans-serif; font-weight:700; font-size:.85rem; cursor:none; transition:all .3s; box-shadow:0 0 20px var(--glow); }
  .nav-cta:hover { transform:scale(1.05); box-shadow:0 0 30px var(--glow); }
  .hamburger { display:none; flex-direction:column; gap:5px; cursor:none; }
  .hamburger span { width:24px; height:2px; background:var(--text); border-radius:2px; }

  /* HERO */
  #hero {
    position:relative; min-height:100vh;
    display:flex; align-items:center; justify-content:center;
    padding: 8rem 6% 4rem;
    z-index:1;
    overflow:hidden;
  }
  .hero-bg {
    position:absolute; inset:0; z-index:0;
    background: radial-gradient(ellipse 80% 60% at 50% 0%, rgba(79,110,247,0.15) 0%, transparent 70%),
                radial-gradient(ellipse 60% 50% at 80% 80%, rgba(162,89,255,0.12) 0%, transparent 70%),
                radial-gradient(ellipse 50% 40% at 10% 60%, rgba(0,212,255,0.08) 0%, transparent 60%);
  }
  .hero-grid {
    position:absolute; inset:0;
    background-image: linear-gradient(rgba(79,110,247,0.06) 1px, transparent 1px), linear-gradient(90deg, rgba(79,110,247,0.06) 1px, transparent 1px);
    background-size: 60px 60px;
    mask-image: radial-gradient(ellipse 80% 80% at 50% 20%, black 30%, transparent 100%);
  }
  .hero-content { position:relative; z-index:2; max-width:760px; text-align:center; }
  .hero-badge {
    display:inline-flex; align-items:center; gap:.5rem;
    background:rgba(79,110,247,0.12); border:1px solid var(--border);
    color:var(--accent); font-size:.8rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase;
    padding:.4rem 1rem; border-radius:40px; margin-bottom:2rem;
    animation: fadeUp .8s .2s both;
  }
  .hero-badge::before { content:''; width:6px; height:6px; background:var(--cyan); border-radius:50%; animation:pulse 1.5s infinite; }
  @keyframes pulse { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:.5;transform:scale(1.5)} }

  h1 { font-size: clamp(2.2rem, 5vw, 4rem); font-weight:800; line-height:1.12; letter-spacing:-.03em; margin-bottom:1.2rem; animation: fadeUp .8s .4s both; }
  .gradient-text { background:var(--grad); -webkit-background-clip:text; -webkit-text-fill-color:transparent; }
  .gradient-text2 { background:var(--grad2); -webkit-background-clip:text; -webkit-text-fill-color:transparent; }
  .hero-sub { color:var(--muted); font-size:1.15rem; max-width:580px; margin:0 auto 2.5rem; animation: fadeUp .8s .6s both; }
  .hero-btns { display:flex; gap:1rem; justify-content:center; flex-wrap:wrap; animation: fadeUp .8s .8s both; }
  .btn-primary {
    display:inline-flex; align-items:center; gap:.6rem;
    background:var(--grad); color:#fff; border:none;
    padding:.9rem 2rem; border-radius:40px;
    font-family:'Syne',sans-serif; font-weight:700; font-size:.95rem;
    cursor:none; transition:all .3s;
    box-shadow: 0 0 30px rgba(79,110,247,.5), 0 4px 20px rgba(0,0,0,.3);
  }
  .btn-primary:hover { transform:translateY(-3px) scale(1.03); box-shadow:0 0 50px rgba(79,110,247,.7), 0 8px 30px rgba(0,0,0,.4); }
  .btn-secondary {
    display:inline-flex; align-items:center; gap:.6rem;
    background:rgba(255,255,255,.05); color:var(--white); 
    border:1px solid var(--border);
    padding:.9rem 2rem; border-radius:40px;
    font-family:'Syne',sans-serif; font-weight:700; font-size:.95rem;
    cursor:none; transition:all .3s; backdrop-filter:blur(10px);
  }
  .btn-secondary:hover { background:rgba(255,255,255,.1); border-color:var(--accent); transform:translateY(-3px); }
  .btn-whatsapp { background: linear-gradient(135deg, #25d366 0%, #128c7e 100%); box-shadow:0 0 30px rgba(37,211,102,.4); }
  .btn-whatsapp:hover { box-shadow:0 0 50px rgba(37,211,102,.6); }

  .hero-stats { display:flex; gap:3rem; justify-content:center; margin-top:4rem; flex-wrap:wrap; animation:fadeUp .8s 1s both; }
  .stat { text-align:center; }
  .stat-num { font-family:'Syne',sans-serif; font-size:2rem; font-weight:800; background:var(--grad); -webkit-background-clip:text; -webkit-text-fill-color:transparent; }
  .stat-label { color:var(--muted); font-size:.8rem; text-transform:uppercase; letter-spacing:.06em; }

  /* SCROLL INDICATOR */
  .scroll-hint { position:absolute; bottom:2rem; left:50%; transform:translateX(-50%); display:flex; flex-direction:column; align-items:center; gap:.5rem; color:var(--muted); font-size:.75rem; animation:bounce 2s infinite; }
  .scroll-dot { width:6px; height:6px; background:var(--accent); border-radius:50%; }
  @keyframes bounce { 0%,100%{transform:translateX(-50%) translateY(0)} 50%{transform:translateX(-50%) translateY(-8px)} }

  /* SECTIONS */
  section { position:relative; z-index:1; }
  .section-label { display:inline-block; font-size:.75rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--accent); margin-bottom:1rem; }
  .section-title { font-size: clamp(1.8rem, 3vw, 2.8rem); font-weight:800; letter-spacing:-.03em; margin-bottom:1rem; }
  .section-sub { color:var(--muted); max-width:560px; }

  /* SERVICES */
  #servicos { padding: 6rem 6%; }
  .services-header { text-align:center; margin-bottom:4rem; }
  .services-header .section-sub { margin:0 auto; }
  .cards-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap:1.5rem; }
  .card {
    background: var(--panel);
    border:1px solid var(--border);
    border-radius:20px; padding:2rem;
    transition: all .35s cubic-bezier(.22,.68,0,1.2);
    position:relative; overflow:hidden;
    cursor:none;
  }
  .card::before {
    content:''; position:absolute; inset:0; border-radius:20px;
    background: var(--grad); opacity:0; transition:opacity .3s;
    z-index:0;
  }
  .card:hover { transform:translateY(-8px) scale(1.02); border-color:var(--accent); box-shadow:0 20px 60px rgba(79,110,247,.2); }
  .card:hover::before { opacity:.05; }
  .card > * { position:relative; z-index:1; }
  .card-icon { width:54px; height:54px; border-radius:14px; background:rgba(79,110,247,.15); display:flex; align-items:center; justify-content:center; margin-bottom:1.3rem; font-size:1.5rem; border:1px solid rgba(79,110,247,.3); }
  .card h3 { font-size:1.2rem; font-weight:700; margin-bottom:.8rem; }
  .card p { color:var(--muted); font-size:.9rem; line-height:1.7; margin-bottom:1.2rem; }
  .card ul { list-style:none; margin-bottom:1.5rem; }
  .card ul li { color:var(--muted); font-size:.875rem; padding:.3rem 0; display:flex; align-items:center; gap:.5rem; }
  .card ul li::before { content:'→'; color:var(--accent); font-size:.75rem; }
  .card-price { font-family:'Syne',sans-serif; font-size:1rem; font-weight:700; }
  .card-price.highlight { background:var(--grad); -webkit-background-clip:text; -webkit-text-fill-color:transparent; font-size:1.1rem; }
  .card-badge { position:absolute; top:1.2rem; right:1.2rem; background:rgba(0,212,255,.1); border:1px solid rgba(0,212,255,.3); color:var(--cyan); font-size:.7rem; font-weight:700; letter-spacing:.08em; padding:.25rem .7rem; border-radius:20px; text-transform:uppercase; }

  /* WHY */
  #diferenciais { padding:6rem 6%; background: linear-gradient(180deg, transparent 0%, rgba(79,110,247,.04) 50%, transparent 100%); }
  .why-layout { display:grid; grid-template-columns:1fr 1fr; gap:4rem; align-items:center; }
  .why-visual { position:relative; }
  .why-circle {
    width:380px; height:380px; border-radius:50%;
    background: conic-gradient(from 0deg, var(--accent) 0deg, var(--accent2) 120deg, var(--cyan) 240deg, var(--accent) 360deg);
    display:flex; align-items:center; justify-content:center;
    position:relative; margin:0 auto;
    animation: rotateSlow 20s linear infinite;
  }
  @keyframes rotateSlow { from{transform:rotate(0deg)} to{transform:rotate(360deg)} }
  .why-circle-inner { width:340px; height:340px; background:var(--panel); border-radius:50%; display:flex; align-items:center; justify-content:center; flex-direction:column; text-align:center; animation: rotateSlow 20s linear infinite reverse; }
  .why-circle-num { font-family:'Syne',sans-serif; font-size:3.5rem; font-weight:800; background:var(--grad); -webkit-background-clip:text; -webkit-text-fill-color:transparent; }
  .why-circle-label { color:var(--muted); font-size:.9rem; }
  .features-list { display:grid; grid-template-columns:1fr 1fr; gap:1rem; margin-top:2rem; }
  .feature-item { background:var(--panel); border:1px solid var(--border); border-radius:14px; padding:1rem 1.2rem; display:flex; align-items:center; gap:.8rem; transition:all .3s; cursor:none; }
  .feature-item:hover { border-color:var(--accent); transform:translateX(4px); }
  .feature-icon { font-size:1.3rem; flex-shrink:0; }
  .feature-text { font-size:.85rem; font-weight:500; color:var(--text); }

  /* HOW */
  #como-funciona { padding:6rem 6%; }
  .steps-wrap { display:flex; flex-direction:column; gap:0; max-width:680px; margin:3rem auto 0; }
  .step {
    display:flex; gap:2rem; align-items:flex-start; position:relative;
    padding-bottom:2.5rem; opacity:0; transform:translateX(-30px);
    transition: all .6s ease;
  }
  .step.visible { opacity:1; transform:translateX(0); }
  .step:last-child { padding-bottom:0; }
  .step-line { position:absolute; left:22px; top:50px; bottom:0; width:2px; background:linear-gradient(180deg, var(--accent) 0%, transparent 100%); }
  .step:last-child .step-line { display:none; }
  .step-dot { width:46px; height:46px; border-radius:50%; background:var(--grad); display:flex; align-items:center; justify-content:center; font-family:'Syne',sans-serif; font-weight:800; font-size:1.1rem; color:#fff; flex-shrink:0; box-shadow:0 0 20px var(--glow); }
  .step-body h4 { font-size:1.1rem; font-weight:700; margin-bottom:.4rem; }
  .step-body p { color:var(--muted); font-size:.9rem; }

  /* TESTIMONIALS */
  #depoimentos { padding:6rem 6%; background: linear-gradient(180deg, transparent 0%, rgba(162,89,255,.04) 50%, transparent 100%); }
  .testimonials-header { text-align:center; margin-bottom:3.5rem; }
  .testimonials-header .section-sub { margin:0 auto; }
  .testi-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap:1.5rem; }
  .testi-card {
    background:var(--panel); border:1px solid var(--border); border-radius:20px; padding:1.8rem;
    transition:all .35s; position:relative; overflow:hidden; cursor:none;
  }
  .testi-card::after { content:'"'; position:absolute; top:-1rem; right:1.5rem; font-size:8rem; font-family:'Syne',sans-serif; color:var(--accent); opacity:.07; line-height:1; }
  .testi-card:hover { border-color:var(--accent2); transform:translateY(-5px); box-shadow:0 15px 40px rgba(162,89,255,.15); }
  .stars { color:#f5c842; font-size:1rem; margin-bottom:1rem; letter-spacing:.1em; }
  .testi-text { color:var(--text); font-size:.925rem; line-height:1.7; margin-bottom:1.5rem; }
  .testi-author { display:flex; align-items:center; gap:.8rem; }
  .testi-avatar { width:42px; height:42px; border-radius:50%; background:var(--grad); display:flex; align-items:center; justify-content:center; font-family:'Syne',sans-serif; font-weight:800; color:#fff; font-size:.9rem; }
  .testi-name { font-weight:600; font-size:.9rem; }
  .testi-role { color:var(--muted); font-size:.8rem; }

  /* METRICS */
  #numeros { padding:4rem 6%; }
  .metrics-strip { display:flex; gap:2rem; justify-content:space-around; flex-wrap:wrap; background:var(--panel); border:1px solid var(--border); border-radius:24px; padding:3rem 2rem; }
  .metric { text-align:center; }
  .metric-num { font-family:'Syne',sans-serif; font-size:2.5rem; font-weight:800; display:block; }
  .metric-label { color:var(--muted); font-size:.85rem; margin-top:.3rem; }

  /* CTA FINAL */
  #cta-final { padding:8rem 6%; text-align:center; position:relative; overflow:hidden; }
  .cta-bg { position:absolute; inset:0; background: radial-gradient(ellipse 70% 70% at 50% 50%, rgba(79,110,247,.12) 0%, transparent 70%); }
  .cta-border { position:absolute; inset:2rem; border:1px solid var(--border); border-radius:32px; pointer-events:none; }
  .cta-content { position:relative; z-index:2; max-width:680px; margin:0 auto; }
  .cta-content h2 { font-size:clamp(2rem,4vw,3.2rem); font-weight:800; letter-spacing:-.03em; margin-bottom:1.2rem; }
  .cta-content p { color:var(--muted); font-size:1.1rem; margin-bottom:2.5rem; }
  .cta-btns { display:flex; gap:1rem; justify-content:center; flex-wrap:wrap; }

  /* FORM */
  #formulario { padding:6rem 6%; }
  .form-layout { display:grid; grid-template-columns:1fr 1fr; gap:4rem; align-items:start; }
  .form-info h2 { margin-bottom:1rem; }
  .form-info p { color:var(--muted); margin-bottom:2rem; }
  form { background:var(--panel); border:1px solid var(--border); border-radius:24px; padding:2.5rem; }
  .form-group { margin-bottom:1.3rem; }
  label { display:block; font-size:.85rem; font-weight:600; color:var(--muted); margin-bottom:.5rem; }
  input, select, textarea {
    width:100%; background:rgba(255,255,255,.04); border:1px solid var(--border); border-radius:10px;
    color:var(--text); font-family:'DM Sans',sans-serif; font-size:.95rem; padding:.8rem 1rem;
    outline:none; transition:border-color .3s; cursor:none;
  }
  input:focus, select:focus, textarea:focus { border-color:var(--accent); box-shadow:0 0 0 3px rgba(79,110,247,.1); }
  select option { background:var(--panel); }
  textarea { resize:vertical; min-height:110px; }
  .btn-submit { width:100%; background:var(--grad); color:#fff; border:none; padding:1rem; border-radius:40px; font-family:'Syne',sans-serif; font-weight:700; font-size:1rem; cursor:none; transition:all .3s; box-shadow:0 0 25px var(--glow); margin-top:.5rem; }
  .btn-submit:hover { transform:translateY(-2px); box-shadow:0 0 40px var(--glow); }

  /* FOOTER */
  footer { background:var(--surface); border-top:1px solid var(--border); padding:4rem 6% 2rem; }
  .footer-grid { display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:3rem; margin-bottom:3rem; }
  .footer-brand .nav-logo { font-size:1.6rem; display:block; margin-bottom:.8rem; }
  .footer-brand p { color:var(--muted); font-size:.9rem; line-height:1.7; }
  .footer-col h5 { font-family:'Syne',sans-serif; font-weight:700; margin-bottom:1rem; font-size:.9rem; }
  .footer-links { list-style:none; }
  .footer-links li { margin-bottom:.6rem; }
  .footer-links a { color:var(--muted); text-decoration:none; font-size:.875rem; transition:color .2s; cursor:none; }
  .footer-links a:hover { color:var(--white); }
  .footer-contact-item { display:flex; align-items:center; gap:.6rem; color:var(--muted); font-size:.875rem; margin-bottom:.7rem; }
  .footer-contact-item svg { color:var(--accent); flex-shrink:0; }
  .footer-bottom { border-top:1px solid var(--border); padding-top:1.5rem; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:1rem; }
  .footer-bottom p { color:var(--muted); font-size:.8rem; }
  .social-links { display:flex; gap:.8rem; }
  .social-link { width:36px; height:36px; border-radius:50%; background:var(--panel); border:1px solid var(--border); display:flex; align-items:center; justify-content:center; color:var(--muted); text-decoration:none; font-size:.9rem; transition:all .3s; cursor:none; }
  .social-link:hover { background:var(--accent); border-color:var(--accent); color:#fff; }

  /* ANIMATIONS */
  @keyframes fadeUp { from{opacity:0;transform:translateY(30px)} to{opacity:1;transform:translateY(0)} }
  .fade-in { opacity:0; transform:translateY(25px); transition:all .7s ease; }
  .fade-in.visible { opacity:1; transform:translateY(0); }

  /* MOBILE NAV */
  .mobile-menu { display:none; position:fixed; top:0; left:0; right:0; bottom:0; background:var(--ink); z-index:999; flex-direction:column; align-items:center; justify-content:center; gap:2rem; }
  .mobile-menu.open { display:flex; }
  .mobile-menu a { color:var(--text); text-decoration:none; font-family:'Syne',sans-serif; font-size:1.5rem; font-weight:700; cursor:none; }
  .close-menu { position:absolute; top:1.5rem; right:6%; font-size:2rem; color:var(--muted); cursor:none; background:none; border:none; }

  /* RESPONSIVE */
  @media(max-width:900px) {
    .why-layout { grid-template-columns:1fr; }
    .why-circle { width:260px; height:260px; }
    .why-circle-inner { width:228px; height:228px; }
    .why-circle-num { font-size:2.5rem; }
    .form-layout { grid-template-columns:1fr; }
    .footer-grid { grid-template-columns:1fr 1fr; }
  }
  @media(max-width:680px) {
    nav { padding:1rem 5%; }
    .nav-links { display:none; }
    .nav-cta { display:none; }
    .hamburger { display:flex; }
    .features-list { grid-template-columns:1fr; }
    .footer-grid { grid-template-columns:1fr; }
    .footer-bottom { flex-direction:column; text-align:center; }
    .hero-stats { gap:1.5rem; }
    #cta-final { padding:5rem 5%; }
    .cta-border { inset:.5rem; }
  }

  /* FLOATING WA */
  .wa-float {
    position:fixed; bottom:2rem; right:2rem; z-index:500;
    width:58px; height:58px; border-radius:50%;
    background: linear-gradient(135deg,#25d366,#128c7e);
    display:flex; align-items:center; justify-content:center;
    box-shadow:0 4px 20px rgba(37,211,102,.5);
    cursor:none; transition:all .3s; text-decoration:none; font-size:1.6rem;
    animation: waPulse 2s infinite;
  }
  @keyframes waPulse { 0%,100%{box-shadow:0 4px 20px rgba(37,211,102,.5)} 50%{box-shadow:0 4px 35px rgba(37,211,102,.8)} }
  .wa-float:hover { transform:scale(1.1); }
