/* =========================================
   LANDING PREMIUM v4 — Page ID 578
   Fonte de verdade: /wp-content/mu-plugins/rafa-lp-premium.css
========================================= */

body.page-id-578{
  --bg0:#05070b;
  --bg1:#0b1020;

  --card: rgba(255,255,255,.06);
  --stroke: rgba(255,255,255,.12);

  --text: rgba(255,255,255,.88);
  --muted: rgba(255,255,255,.68);

  --gold:#d4af37;
  --aqua:#2dd4bf;

  --shadow: 0 30px 90px rgba(0,0,0,.65);
  --padx: 32px;


  background:
    radial-gradient(1200px 800px at 15% 10%, rgba(45,212,191,.10), transparent 60%),
    radial-gradient(1000px 700px at 85% 12%, rgba(212,175,55,.14), transparent 60%),
    radial-gradient(900px 650px at 30% 90%, rgba(255,255,255,.06), transparent 65%),
    linear-gradient(180deg, var(--bg1) 0%, var(--bg0) 100%) !important;

  color: var(--text);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* remove cabeçalho/rodapé do tema só na landing (admin bar continua para logado) */
body.page-id-578 header#masthead,
body.page-id-578 header.site-header,
body.page-id-578 .site-header,
body.page-id-578 .ast-primary-header-bar,
body.page-id-578 .ast-desktop-header,
body.page-id-578 .ast-mobile-header{
  display:none !important;
}
body.page-id-578 footer#colophon,
body.page-id-578 footer.site-footer,
body.page-id-578 .site-footer{
  display:none !important;
}

/* força fundo premium nos wrappers do Astra */
body.page-id-578 #page,
body.page-id-578 .site,
body.page-id-578 .site-content,
body.page-id-578 #content,
body.page-id-578 .ast-container,
body.page-id-578 .content-area,
body.page-id-578 main,
body.page-id-578 article#post-578{
  background: transparent !important;
}

/* remove título padrão do tema */
body.page-id-578 .entry-header{ display:none !important; }

/* container */
body.page-id-578 .rafa-lp{ width:100%; }
body.page-id-578 .rafa-lp-container{
  width:100%;
  max-width: 1180px;
  margin: 0 auto;
  padding: 24px 0 110px !important; /* sem lateral aqui */
}




/* top nav */
body.page-id-578 .rafa-lp-topnav{
  position: sticky;
  top: 0;
  z-index: 50;
  margin: 0 auto 16px;
  padding: 10px 12px;
  border-radius: 16px;
  background: rgba(10,12,18,.62);
  border: 1px solid rgba(255,255,255,.10);
  backdrop-filter: blur(10px);
}
body.page-id-578 .rafa-lp-topnav .row{
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 12px;
}
body.page-id-578 .rafa-lp-topnav .links{
  display:flex;
  gap: 10px 14px;
  flex-wrap: nowrap;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
body.page-id-578 .rafa-lp-topnav .links::-webkit-scrollbar{ display:none; }
body.page-id-578 .rafa-lp-topnav a{
  color: rgba(255,255,255,.82) !important;
  text-decoration: none !important;
  font-weight: 950;
  font-size: 13px;
  white-space: nowrap;
}
body.page-id-578 .rafa-lp-topnav a:hover{
  color: var(--gold) !important;
  text-decoration: underline !important;
}
body.page-id-578 .rafa-lp-topnav .cta{
  display:flex;
  align-items:center;
  gap: 10px;
  flex: 0 0 auto;
}

/* badge */
body.page-id-578 .rafa-lp-badge{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding: 9px 14px;
  border-radius: 999px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12);
  color: rgba(255,255,255,.90);
  font-weight: 950;
  font-size: 13px;
}

/* hero */
body.page-id-578 .rafa-lp-hero{
  position: relative;
  padding: 30px var(--padx) 22px;
  overflow: hidden;
}

body.page-id-578 .rafa-lp-hero::after{
  content:"";
  position:absolute; inset:-60px -80px;
  background:
    radial-gradient(900px 560px at 22% 20%, rgba(45,212,191,.16), transparent 60%),
    radial-gradient(900px 600px at 82% 12%, rgba(212,175,55,.14), transparent 60%);
  pointer-events:none;
  opacity: .95;
}
body.page-id-578 .rafa-lp-hero > *{ position:relative; z-index:1; }

body.page-id-578 .rafa-lp-hero-grid{
  margin-top: 16px;
  display:grid;
  grid-template-columns: 1.05fr .95fr;
  gap: 22px;
  align-items: center;
}

body.page-id-578 .rafa-lp-hero-copy h1{
  margin: 0 0 10px 0;
  font-size: clamp(36px, 4.6vw, 60px);
  line-height: 1.02;
  font-weight: 1000;
  letter-spacing: -0.03em;
  color: rgba(255,255,255,.96);
  text-wrap: balance;
}

body.page-id-578 .rafa-lp-sub{
  margin: 0 0 14px 0;
  font-size: 17px;
  line-height: 1.65;
  color: rgba(255,255,255,.82);
  max-width: 62ch;
}

/* botões */
body.page-id-578 .rafa-lp-cta-row{
  display:flex;
  gap: 12px 14px;
  align-items:center;
  flex-wrap: wrap;
  margin: 14px 0 10px;
}

body.page-id-578 .rafa-lp-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  background: rgba(0,0,0,.60);
  color:#fff !important;
  border: 1px solid rgba(212,175,55,.55);
  border-radius: 14px;
  padding: 14px 18px;
  font-weight: 950;
  text-decoration:none !important;
  box-shadow: 0 22px 70px rgba(0,0,0,.55);
  transition: transform .15s ease, background .15s ease, color .15s ease, border-color .15s ease, box-shadow .15s ease;
}
body.page-id-578 .rafa-lp-btn:hover{
  background: rgba(212,175,55,.92);
  color:#0b0b0b !important;
  border-color: rgba(212,175,55,.98);
  transform: translateY(-1px);
  box-shadow: 0 28px 90px rgba(0,0,0,.68);
}
body.page-id-578 .rafa-lp-btn--ghost{
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.16);
}
body.page-id-578 .rafa-lp-btn--ghost:hover{
  background: rgba(255,255,255,.12);
  border-color: rgba(255,255,255,.26);
  color:#fff !important;
}

/* Botão claro (corrige “texto invisível” do Testar grátis) */
body.page-id-578 .rafa-lp-btn--light{
  background: rgba(255,255,255,.92);
  color: #0b0b0b !important;
  border: 1px solid rgba(255,255,255,.30);
  box-shadow: 0 22px 70px rgba(0,0,0,.40);
}
body.page-id-578 .rafa-lp-btn--light:hover{
  background: rgba(45,212,191,.92);
  color: #071017 !important;
  border-color: rgba(45,212,191,.95);
}

/* tamanhos */
body.page-id-578 .rafa-lp-btn--sm{
  padding: 12px 14px;
  border-radius: 12px;
  font-size: 13px;
}

body.page-id-578 .rafa-lp-proof{
  display:flex;
  flex-wrap: wrap;
  gap: 10px 16px;
  margin-top: 10px;
  color: rgba(255,255,255,.78);
  font-size: 13px;
}
body.page-id-578 .rafa-lp-proof b{ color:#fff; }

/* stats */
body.page-id-578 .rafa-lp-stats{
  display:grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 12px;
  margin-top: 18px;
}
body.page-id-578 .rafa-lp-stat{
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.04));
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 16px;
  padding: 14px 14px 12px;
  box-shadow: 0 18px 60px rgba(0,0,0,.30);
}
body.page-id-578 .rafa-lp-stat .k{
  font-weight: 1000;
  font-size: 18px;
  color: rgba(255,255,255,.95);
}
body.page-id-578 .rafa-lp-stat .t{
  margin-top: 4px;
  font-size: 12px;
  color: rgba(255,255,255,.74);
  line-height: 1.35;
}

/* bloco vídeo */
body.page-id-578 .rafa-lp-media{
  background: rgba(10,12,18,.70);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 22px;
  padding: 14px;
  box-shadow: var(--shadow);
  backdrop-filter: blur(10px);
}
body.page-id-578 .rafa-lp-media .shot{
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.10);
  overflow: hidden;
  background:
    radial-gradient(700px 300px at 30% 10%, rgba(212,175,55,.14), transparent 60%),
    radial-gradient(700px 340px at 80% 20%, rgba(45,212,191,.14), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
  width: 100%;
  aspect-ratio: 16 / 10;
}
body.page-id-578 .rafa-lp-hero-video{
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  border-radius: 16px;
  background: rgba(0,0,0,.15);
}
body.page-id-578 .rafa-lp-hero-video:focus{ outline:none; }

body.page-id-578 .rafa-lp-media .cap{
  margin-top: 10px;
  color: rgba(255,255,255,.72);
  font-size: 13px;
  line-height: 1.5;
}

/* seções */
body.page-id-578 .rafa-lp-section{
  padding: 56px var(--padx);
  border-top: 1px solid rgba(255,255,255,.08);
  position: relative;
  box-sizing: border-box;
}

body.page-id-578 .rafa-lp-section::before{
  content:"";
  position:absolute;
  inset: 0;
  pointer-events:none;
  background:
    radial-gradient(900px 520px at 10% 10%, rgba(45,212,191,.06), transparent 60%),
    radial-gradient(900px 520px at 90% 15%, rgba(212,175,55,.06), transparent 60%);
  opacity: .8;
}
body.page-id-578 .rafa-lp-section > *{ position:relative; z-index:1; }

body.page-id-578 .rafa-lp-section h2{
  margin: 0 0 10px 0;
  color: rgba(255,255,255,.96);
  font-size: 30px;
  font-weight: 1000;
  letter-spacing: -0.01em;
}
body.page-id-578 .rafa-lp-section .lead{
  margin: 0 0 18px 0;
  color: rgba(255,255,255,.74);
  line-height: 1.6;
  max-width: 80ch;
}

body.page-id-578 .rafa-lp-cta-inline{ margin-top:18px; }

/* grids e cards */
body.page-id-578 .rafa-lp-grid-3{
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 14px;
  margin-top: 14px;
}
body.page-id-578 .rafa-lp-feature{
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.04));
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 18px;
  padding: 18px;
  box-shadow: 0 20px 70px rgba(0,0,0,.32);
  transition: transform .15s ease, border-color .15s ease, background .15s ease;
}
body.page-id-578 .rafa-lp-feature:hover{
  transform: translateY(-2px);
  background: linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.05));
  border-color: rgba(45,212,191,.18);
}
body.page-id-578 .rafa-lp-feature--contrast:hover{
  border-color: rgba(212,175,55,.22);
}
body.page-id-578 .rafa-lp-feature h3{
  margin: 0 0 6px 0;
  font-size: 16px;
  font-weight: 1000;
  color: rgba(255,255,255,.96);
}
body.page-id-578 .rafa-lp-feature p{
  margin: 0;
  color: rgba(255,255,255,.76);
  line-height: 1.55;
  font-size: 14px;
}

/* timeline */
body.page-id-578 .rafa-lp-timeline{
  display:flex;
  flex-direction:column;
  gap: 12px;
  margin-top: 14px;
}
body.page-id-578 .rafa-lp-timeline .it{
  display:flex;
  gap: 12px;
  align-items:flex-start;
  padding: 16px;
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.04));
  border: 1px solid rgba(255,255,255,.10);
}
body.page-id-578 .rafa-lp-timeline .yr{
  min-width: 84px;
  font-weight: 1000;
  color: rgba(212,175,55,.95);
}
body.page-id-578 .rafa-lp-timeline .tx{
  color: rgba(255,255,255,.78);
  line-height: 1.55;
  font-size: 14px;
}

/* FAQ */
body.page-id-578 .rafa-lp-faq{
  display:flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 14px;
}
body.page-id-578 .rafa-lp-faq details{
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.04));
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 16px;
  padding: 14px 16px;
}
body.page-id-578 .rafa-lp-faq summary{
  cursor:pointer;
  font-weight: 1000;
  color: rgba(255,255,255,.95);
}
body.page-id-578 .rafa-lp-faq details p{
  margin: 10px 0 0 0;
  color: rgba(255,255,255,.76);
  line-height: 1.6;
  font-size: 14px;
}

/* “marquee” carrossel automático */
body.page-id-578 .rafa-lp-marquee{
  margin-top: 16px;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(10,12,18,.55);
  overflow: hidden;
  position: relative;
}
body.page-id-578 .rafa-lp-marquee::before,
body.page-id-578 .rafa-lp-marquee::after{
  content:"";
  position:absolute; top:0; bottom:0;
  width: 70px;
  z-index: 2;
  pointer-events:none;
}
body.page-id-578 .rafa-lp-marquee::before{
  left:0;
  background: linear-gradient(90deg, rgba(5,7,11,.95), transparent);
}
body.page-id-578 .rafa-lp-marquee::after{
  right:0;
  background: linear-gradient(270deg, rgba(5,7,11,.95), transparent);
}
body.page-id-578 .rafa-lp-marquee .track{
  display:flex;
  gap: 12px;
  padding: 14px;
  width: max-content;
  animation: rafaMarquee 28s linear infinite;
}
body.page-id-578 .rafa-lp-marquee:hover .track{
  animation-play-state: paused;
}
body.page-id-578 .rafa-lp-marquee .card{
  white-space: nowrap;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.10);
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.04));
  color: rgba(255,255,255,.86);
  font-weight: 900;
  font-size: 13px;
}
@keyframes rafaMarquee{
  from{ transform: translateX(0); }
  to{ transform: translateX(-50%); }
}

/* âncoras */
body.page-id-578 #como-funciona,
body.page-id-578 #diferente,
body.page-id-578 #demo,
body.page-id-578 #na-pratica,
body.page-id-578 #historia,
body.page-id-578 #vantagens,
body.page-id-578 #faq{
  scroll-margin-top: 92px;
}

/* CTA fixo no mobile */
body.page-id-578 .rafa-lp-sticky{ display:none; }

/* responsivo */
@media (max-width: 980px){
      body.page-id-578{ --padx: 18px; }

  body.page-id-578 .rafa-lp-container{
  padding-top: 18px !important;
  padding-bottom: 110px !important;
  padding-left: clamp(18px, 5vw, 28px) !important;
  padding-right: clamp(18px, 5vw, 28px) !important;
}



  body.page-id-578 .rafa-lp-hero-grid{ grid-template-columns: 1fr; }
  body.page-id-578 .rafa-lp-stats{ grid-template-columns: repeat(2, minmax(0,1fr)); }
  body.page-id-578 .rafa-lp-grid-3{ grid-template-columns: 1fr; }

  /* NO CELULAR: não corta verticalmente, mostra o vídeo inteiro */
  body.page-id-578 .rafa-lp-media .shot{
    aspect-ratio: 16 / 9;
    background: rgba(0,0,0,.35);
  }
  body.page-id-578 .rafa-lp-hero-video{
    object-fit: contain;
    background: rgba(0,0,0,.55);
  }

  body.page-id-578 .rafa-lp-sticky{
    display:flex;
    position: fixed;
    left: 12px;
    right: 12px;
    bottom: 12px;
    z-index: 9999;
    padding: 10px;
    border-radius: 16px;
    background: rgba(10,12,18,.72);
    border: 1px solid rgba(255,255,255,.12);
    backdrop-filter: blur(10px);
    box-shadow: 0 20px 80px rgba(0,0,0,.60);
  }
  body.page-id-578 .rafa-lp-sticky a{
    width:100%;
    text-align:center;
  }
}

/* =========================
   VITALIDADE + RELATOS (patch v4.1)
   Cole no FINAL do CSS
========================= */

/* mais vida no background geral */
body.page-id-578{
  background:
    radial-gradient(1100px 700px at 18% 12%, rgba(45,212,191,.14), transparent 62%),
    radial-gradient(900px 650px at 84% 10%, rgba(212,175,55,.16), transparent 62%),
    radial-gradient(900px 700px at 35% 92%, rgba(99,102,241,.08), transparent 60%),
    linear-gradient(180deg, var(--bg1) 0%, var(--bg0) 100%) !important;
}

/* títulos com “vida” sem virar carnaval */
body.page-id-578 .rafa-lp-hero-copy h1{
  text-shadow: 0 18px 70px rgba(0,0,0,.55);
}
body.page-id-578 .rafa-lp-section h2{
  position: relative;
}
body.page-id-578 .rafa-lp-section h2::after{
  content:"";
  display:block;
  width: 64px;
  height: 3px;
  margin-top: 10px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(45,212,191,.95), rgba(212,175,55,.95));
  opacity: .9;
}

/* cards com borda “premium” (mais cor e profundidade) */
body.page-id-578 .rafa-lp-feature,
body.page-id-578 .rafa-lp-stat,
body.page-id-578 .rafa-lp-timeline .it,
body.page-id-578 .rafa-lp-faq details,
body.page-id-578 .rafa-lp-media{
  background: linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,.035)) !important;
  border-color: rgba(255,255,255,.12) !important;
}

body.page-id-578 .rafa-lp-feature{
  position: relative;
}
body.page-id-578 .rafa-lp-feature::before{
  content:"";
  position:absolute;
  inset:-1px;
  border-radius: 18px;
  padding: 1px;
  background: linear-gradient(135deg, rgba(45,212,191,.22), rgba(212,175,55,.18), rgba(255,255,255,.08));
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  pointer-events:none;
  opacity: .9;
}

/* stats com acento */
body.page-id-578 .rafa-lp-stat .k{
  color: rgba(255,255,255,.96) !important;
}
body.page-id-578 .rafa-lp-stat{
  box-shadow: 0 22px 85px rgba(0,0,0,.35) !important;
}

/* botões: mais vivos */
body.page-id-578 .rafa-lp-btn{
  box-shadow: 0 24px 90px rgba(0,0,0,.55) !important;
}
body.page-id-578 .rafa-lp-btn:hover{
  box-shadow: 0 30px 110px rgba(0,0,0,.65) !important;
}

/* ========= RELATOS: carrossel bonito e coerente ========= */
body.page-id-578 .rafa-lp-testimonials{
  margin-top: 18px;
  border-radius: 20px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(10,12,18,.45);
  overflow: hidden;
  position: relative;
}
body.page-id-578 .rafa-lp-testimonials::before,
body.page-id-578 .rafa-lp-testimonials::after{
  content:"";
  position:absolute; top:0; bottom:0;
  width: 90px;
  z-index: 2;
  pointer-events:none;
}
body.page-id-578 .rafa-lp-testimonials::before{
  left:0;
  background: linear-gradient(90deg, rgba(5,7,11,.95), transparent);
}
body.page-id-578 .rafa-lp-testimonials::after{
  right:0;
  background: linear-gradient(270deg, rgba(5,7,11,.95), transparent);
}

body.page-id-578 .rafa-lp-testimonials .track{
  display:flex;
  gap: 14px;
  padding: 16px;
  width: max-content;
  animation: rafaTestimonials 36s linear infinite;
  will-change: transform;
}
body.page-id-578 .rafa-lp-testimonials:hover .track{
  animation-play-state: paused;
}

/* card de relato (menos “retângulo seco”) */
body.page-id-578 .rafa-lp-testimonials .tcard{
  width: 360px;
  max-width: 82vw;
  border-radius: 18px;
  padding: 16px 16px 14px;
  border: 1px solid rgba(255,255,255,.12);
  background:
    radial-gradient(600px 220px at 20% 10%, rgba(45,212,191,.16), transparent 60%),
    radial-gradient(600px 240px at 80% 20%, rgba(212,175,55,.14), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.035));
  box-shadow: 0 26px 95px rgba(0,0,0,.40);
  position: relative;
}
body.page-id-578 .rafa-lp-testimonials .tcard::after{
  content:"“”";
  position:absolute;
  right: 14px;
  top: 10px;
  font-size: 34px;
  opacity: .18;
  color: rgba(255,255,255,.9);
  letter-spacing: -6px;
}

body.page-id-578 .rafa-lp-testimonials .top{
  display:flex;
  align-items:center;
  gap: 10px;
}
body.page-id-578 .rafa-lp-testimonials .avatar{
  width: 38px;
  height: 38px;
  border-radius: 12px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight: 1000;
  color: rgba(0,0,0,.92);
  background: linear-gradient(135deg, rgba(45,212,191,.95), rgba(212,175,55,.92));
}
body.page-id-578 .rafa-lp-testimonials .meta{
  display:flex;
  flex-direction:column;
  line-height: 1.1;
}
body.page-id-578 .rafa-lp-testimonials .name{
  font-weight: 1000;
  color: rgba(255,255,255,.94);
  font-size: 13px;
}
body.page-id-578 .rafa-lp-testimonials .sub{
  margin-top: 2px;
  font-weight: 850;
  color: rgba(255,255,255,.70);
  font-size: 12px;
}
body.page-id-578 .rafa-lp-testimonials .stars{
  margin-left:auto;
  font-weight: 1000;
  font-size: 12px;
  letter-spacing: .08em;
  color: rgba(212,175,55,.95);
}

body.page-id-578 .rafa-lp-testimonials .quote{
  margin: 12px 0 0 0;
  color: rgba(255,255,255,.82);
  line-height: 1.55;
  font-size: 14px;
}

/* placeholders NÃO aparecem no site */
body.page-id-578 .rafa-lp-testimonials .tcard.is-placeholder{
  display:none !important;
}

/* animação */
@keyframes rafaTestimonials{
  from{ transform: translateX(0); }
  to{ transform: translateX(-50%); }
}

/* reduz movimento */
@media (prefers-reduced-motion: reduce){
  body.page-id-578 .rafa-lp-testimonials .track{ animation: none !important; }
}

/* mobile: mantém usável e bonito */
@media (max-width: 980px){
  body.page-id-578 .rafa-lp-testimonials::before,
  body.page-id-578 .rafa-lp-testimonials::after{
    width: 56px;
  }
}
/* =========================
   TOP NAV v2 (LP 578)
   Menu 1 linha + CTA bonito
========================= */

body.page-id-578 .rafa-lp-topnav{
  position: sticky;
  top: 12px;
  z-index: 80;
  margin: 0 auto 18px;
  padding: 10px 12px;
  border-radius: 18px;
  background: rgba(10,12,18,.62);
  border: 1px solid rgba(255,255,255,.12);
  backdrop-filter: blur(12px);
  box-shadow: 0 22px 80px rgba(0,0,0,.45);
}

body.page-id-578 .rafa-lp-topnav .row{
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: nowrap; /* impede quebrar linha */
}

/* LINKS SEM QUEBRAR: no mobile vira “arrastável” horizontal */
body.page-id-578 .rafa-lp-topnav .links{
  display:flex;
  align-items:center;
  gap: 8px;
  flex: 1;
  min-width: 0;              /* essencial p/ overflow funcionar */
  overflow-x: auto;
  white-space: nowrap;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  padding: 2px 2px;
}
body.page-id-578 .rafa-lp-topnav .links::-webkit-scrollbar{ display:none; }

body.page-id-578 .rafa-lp-topnav .links a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 9px 12px;
  border-radius: 999px;
  text-decoration:none !important;
  font-weight: 950;
  font-size: 13px;
  color: rgba(255,255,255,.82) !important;
  border: 1px solid transparent;
  background: transparent;
  transition: background .15s ease, border-color .15s ease, color .15s ease;
}
body.page-id-578 .rafa-lp-topnav .links a:hover{
  background: rgba(255,255,255,.08);
  border-color: rgba(255,255,255,.14);
  color: rgba(255,255,255,.95) !important;
}

/* CTAs: mais “premium” e sem texto invisível */
body.page-id-578 .rafa-lp-topnav .ctas{
  display:flex;
  align-items:center;
  gap: 10px;
  flex: 0 0 auto;
}

body.page-id-578 .rafa-lp-btn--mini{
  padding: 10px 14px !important;
  border-radius: 14px !important;
  font-size: 13px !important;
  line-height: 1 !important;
}

/* CTA principal: com vida, mas sem virar carnaval */
body.page-id-578 .rafa-lp-btn--primary{
  background: linear-gradient(135deg, rgba(45,212,191,.95), rgba(212,175,55,.35)) !important;
  border: 1px solid rgba(45,212,191,.55) !important;
  color: rgba(6,16,20,.98) !important; /* garante texto visível */
  box-shadow: 0 18px 70px rgba(0,0,0,.45) !important;
}
body.page-id-578 .rafa-lp-btn--primary:hover{
  background: linear-gradient(135deg, rgba(45,212,191,1), rgba(212,175,55,.55)) !important;
  border-color: rgba(45,212,191,.75) !important;
  color: rgba(0,0,0,.92) !important;
}

/* Botão ghost do topo mais refinado */
body.page-id-578 .rafa-lp-topnav .rafa-lp-btn--ghost{
  background: rgba(255,255,255,.06) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  color: rgba(255,255,255,.88) !important;
}
body.page-id-578 .rafa-lp-topnav .rafa-lp-btn--ghost:hover{
  background: rgba(255,255,255,.10) !important;
  border-color: rgba(255,255,255,.22) !important;
}

/* mobile: dá mais espaço pros botões e evita esmagar */
@media (max-width: 520px){
  body.page-id-578 .rafa-lp-topnav{ padding: 10px 10px; }
  body.page-id-578 .rafa-lp-topnav .ctas{ gap: 8px; }
  body.page-id-578 .rafa-lp-btn--mini{ padding: 10px 12px !important; }
}
/* =========================================
   PATCH v4 — TOP NAV MOBILE + CTA COLOR (LP 578)
   - menu em 2 linhas no celular (não some)
   - CTA "Testar grátis" sai do verde e vai pro dourado
========================================= */

/* CTA primário (Testar grátis) com vida e alinhado ao dourado */
body.page-id-578 .rafa-lp-btn--primary{
  background: linear-gradient(135deg, rgba(212,175,55,.95), rgba(212,175,55,.40)) !important;
  border: 1px solid rgba(212,175,55,.65) !important;
  color: rgba(10,10,10,.98) !important; /* texto sempre visível */
  box-shadow: 0 18px 70px rgba(0,0,0,.45) !important;
}
body.page-id-578 .rafa-lp-btn--primary:hover{
  background: linear-gradient(135deg, rgba(212,175,55,1), rgba(255,255,255,.18)) !important;
  border-color: rgba(212,175,55,.90) !important;
  color: rgba(0,0,0,.95) !important;
}

/* MOBILE: menu não fica “escondido”, vira 2 linhas */
@media (max-width: 720px){
  body.page-id-578 .rafa-lp-topnav{
    top: 10px !important;
    padding: 10px 10px !important;
  }

  body.page-id-578 .rafa-lp-topnav .row{
    flex-wrap: wrap !important;
    gap: 10px !important;
  }

  /* primeira linha: botões (Entrar / Testar grátis) */
  body.page-id-578 .rafa-lp-topnav .ctas{
    order: 1 !important;
    width: 100% !important;
    justify-content: flex-end !important;
  }

  /* segunda linha: links (scroll horizontal bem claro) */
  body.page-id-578 .rafa-lp-topnav .links{
    order: 2 !important;
    width: 100% !important;
    padding: 2px 2px !important;
  }

  /* “dica visual” de que o menu arrasta pro lado */
  body.page-id-578 .rafa-lp-topnav .links{
    position: relative !important;
  }
  body.page-id-578 .rafa-lp-topnav .links::before,
  body.page-id-578 .rafa-lp-topnav .links::after{
    content: "";
    position: absolute;
    top: 0; bottom: 0;
    width: 18px;
    pointer-events: none;
    z-index: 2;
  }
  body.page-id-578 .rafa-lp-topnav .links::before{
    left: 0;
    background: linear-gradient(90deg, rgba(10,12,18,.90), rgba(10,12,18,0));
  }
  body.page-id-578 .rafa-lp-topnav .links::after{
    right: 0;
    background: linear-gradient(270deg, rgba(10,12,18,.90), rgba(10,12,18,0));
  }
}
/* =========================================
   PATCH — REMOVER TOP NAV NO MOBILE (LP 578)
   Motivo: no mobile a maioria rola, melhor só CTA fixo
========================================= */

@media (max-width: 860px){
  body.page-id-578 .rafa-lp-topnav{
    display: none !important;
  }

  /* opcional: dá um respiro no topo quando o menu some */
  body.page-id-578 .rafa-lp-hero{
    padding-top: 18px !important;
  }
}
/* =========================================
   PATCH v5 — MAIS VIDA (sem carnaval) + CTA FIXO MOBILE
   LP 578
========================================= */

body.page-id-578{
  /* acentos com vida */
  --aqua: #2dd4bf;     /* vida controlada */
  --blue: #1b2a4a;     /* azul petróleo */
  --gold: #d4af37;     /* já existe, reafirmando */

  /* fundo com mais profundidade e cor */
  background:
    radial-gradient(1200px 650px at 18% 12%, rgba(45,212,191,.18), transparent 55%),
    radial-gradient(1100px 700px at 82% 18%, rgba(212,175,55,.16), transparent 58%),
    radial-gradient(900px 520px at 55% 0%, rgba(27,42,74,.55), transparent 62%),
    linear-gradient(180deg, #0a0d14 0%, #050608 100%) !important;
}

/* títulos com “vida” sutil */
body.page-id-578 .rafa-lp-hero-copy h1{
  text-shadow:
    0 18px 50px rgba(0,0,0,.55),
    0 0 0 rgba(0,0,0,0);
}
body.page-id-578 .rafa-lp-section h2{
  position: relative;
}
body.page-id-578 .rafa-lp-section h2::after{
  content:"";
  display:block;
  width: 92px;
  height: 4px;
  margin-top: 10px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(45,212,191,.95), rgba(212,175,55,.95));
  box-shadow: 0 10px 30px rgba(0,0,0,.35);
  opacity: .95;
}

/* seções com camadas de cor muito leves (tira o chapado) */
body.page-id-578 .rafa-lp-section{
  position: relative;
  overflow: hidden;
}
body.page-id-578 .rafa-lp-section::before{
  content:"";
  position:absolute;
  inset: -40px -60px;
  pointer-events:none;
  background:
    radial-gradient(620px 260px at 12% 20%, rgba(45,212,191,.10), transparent 60%),
    radial-gradient(700px 320px at 90% 30%, rgba(212,175,55,.08), transparent 60%);
  opacity: .85;
  z-index: 0;
}
body.page-id-578 .rafa-lp-section > *{
  position: relative;
  z-index: 1;
}

/* cards mais “premium” (menos preto e branco) */
body.page-id-578 .rafa-lp-feature,
body.page-id-578 .rafa-lp-quote,
body.page-id-578 .rafa-lp-faq details,
body.page-id-578 .rafa-lp-timeline .it,
body.page-id-578 .rafa-lp-media{
  background:
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03)),
    radial-gradient(700px 240px at 18% 0%, rgba(45,212,191,.10), transparent 60%),
    radial-gradient(700px 240px at 85% 0%, rgba(212,175,55,.08), transparent 60%) !important;
  border-color: rgba(255,255,255,.14) !important;
}

/* hover com vida, mas discreto */
body.page-id-578 .rafa-lp-feature:hover{
  border-color: rgba(45,212,191,.28) !important;
  box-shadow:
    0 26px 90px rgba(0,0,0,.40),
    0 0 0 1px rgba(45,212,191,.08) inset;
}

/* botões: reforço visual geral */
body.page-id-578 .rafa-lp-btn{
  box-shadow:
    0 22px 80px rgba(0,0,0,.55),
    0 0 0 1px rgba(255,255,255,.06) inset;
}

/* CTA FIXO NO MOBILE: mais chamativo e com “vida” */
@media (max-width: 860px){
  body.page-id-578 .rafa-lp-sticky{
    background:
      linear-gradient(180deg, rgba(10,10,10,.62), rgba(10,10,10,.78)) !important;
    border-color: rgba(255,255,255,.16) !important;
  }

  /* independente do texto do botão, ele vira CTA forte */
  body.page-id-578 .rafa-lp-sticky .rafa-lp-btn{
    background: linear-gradient(135deg, rgba(45,212,191,.95), rgba(212,175,55,.55)) !important;
    border: 1px solid rgba(45,212,191,.55) !important;
    color: rgba(10,10,10,.98) !important;
    font-weight: 1000 !important;
    padding: 16px 18px !important;
    border-radius: 16px !important;
    box-shadow:
      0 20px 80px rgba(0,0,0,.55),
      0 0 0 1px rgba(255,255,255,.10) inset,
      0 12px 45px rgba(45,212,191,.18);
  }

  /* animação bem suave só para chamar atenção */
  body.page-id-578 .rafa-lp-sticky .rafa-lp-btn{
    animation: rafaCtaBreathe 2.4s ease-in-out infinite;
  }
  @keyframes rafaCtaBreathe{
    0%,100%{ transform: translateY(0); filter: saturate(1); }
    50%{ transform: translateY(-1px); filter: saturate(1.08); }
  }

  /* respeita acessibilidade */
  @media (prefers-reduced-motion: reduce){
    body.page-id-578 .rafa-lp-sticky .rafa-lp-btn{ animation: none !important; }
  }
}
/* =========================================
   PATCH v6 — BOTÕES MAIS CHAMATIVOS NO MOBILE (LP 578)
========================================= */

@media (max-width: 860px){

  /* Botão principal do HERO no mobile (primeiro CTA) */
  body.page-id-578 .rafa-lp-cta-row .rafa-lp-btn:not(.rafa-lp-btn--ghost){
    background: linear-gradient(135deg, rgba(45,212,191,.95), rgba(212,175,55,.70)) !important;
    border: 1px solid rgba(45,212,191,.60) !important;
    color: rgba(10,10,10,.98) !important;
    box-shadow:
      0 20px 70px rgba(0,0,0,.55),
      0 0 0 1px rgba(255,255,255,.12) inset,
      0 18px 55px rgba(45,212,191,.20) !important;
    transform: translateY(0);
  }

  /* “glow” sutil atrás do botão pra chamar atenção */
  body.page-id-578 .rafa-lp-cta-row .rafa-lp-btn:not(.rafa-lp-btn--ghost){
    position: relative;
    overflow: hidden;
  }
  body.page-id-578 .rafa-lp-cta-row .rafa-lp-btn:not(.rafa-lp-btn--ghost)::after{
    content:"";
    position:absolute;
    inset:-40%;
    background: radial-gradient(circle at 30% 40%, rgba(255,255,255,.22), transparent 55%);
    opacity: .55;
    transform: translateX(-18%);
    pointer-events:none;
  }

  /* CTA fixo do rodapé no mobile ainda mais “botão de verdade” */
  body.page-id-578 .rafa-lp-sticky .rafa-lp-btn{
    font-size: 16px !important;
    letter-spacing: .2px !important;
    box-shadow:
      0 22px 85px rgba(0,0,0,.60),
      0 0 0 1px rgba(255,255,255,.14) inset,
      0 18px 60px rgba(212,175,55,.16),
      0 18px 60px rgba(45,212,191,.18) !important;
  }

  /* seta no fim do texto (não depende de mudar HTML) */
  body.page-id-578 .rafa-lp-sticky .rafa-lp-btn::before{
    content:"👉";
    margin-right: 10px;
    filter: saturate(1.1);
  }

  /* pulse leve pra chamar atenção (mais forte que o anterior, mas discreto) */
  body.page-id-578 .rafa-lp-sticky .rafa-lp-btn{
    animation: rafaCtaPulse 1.9s ease-in-out infinite !important;
  }
  @keyframes rafaCtaPulse{
    0%,100%{ transform: translateY(0) scale(1); filter: saturate(1); }
    50%{ transform: translateY(-1px) scale(1.015); filter: saturate(1.08); }
  }

  @media (prefers-reduced-motion: reduce){
    body.page-id-578 .rafa-lp-sticky .rafa-lp-btn{ animation: none !important; }
  }
}
/* =========================================
   PATCH v7 — BOTÕES MAIS CHAMATIVOS (PC + MOBILE) — LP 578
   Objetivo: premium + vida, sem "pintar tudo" no hover
========================================= */

body.page-id-578{
  --ctaA: rgba(45,212,191,.95);   /* teal */
  --ctaB: rgba(212,175,55,.95);   /* gold */
  --btnBg: #0b0f14;
}

/* Base: todos os botões */
body.page-id-578 .rafa-lp-btn{
  position: relative;
  isolation: isolate;
  border-radius: 16px !important;
  font-weight: 1000 !important;
  letter-spacing: .2px;
  transform: translateZ(0);
  transition: transform .15s ease, box-shadow .15s ease, filter .15s ease, color .15s ease !important;
}

/* =========================
   BOTÃO PRINCIPAL (tudo que NÃO é ghost)
   Borda em degradê + fundo escuro com vida
========================= */
body.page-id-578 .rafa-lp-btn:not(.rafa-lp-btn--ghost){
  /* anula o hover antigo que pintava tudo de dourado */
  background: none !important;
  color: rgba(255,255,255,.92) !important;

  border: 1px solid transparent !important;

  /* técnica premium: fundo + borda em degradê */
  background-image:
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02)),
    linear-gradient(135deg, rgba(45,212,191,.75), rgba(212,175,55,.55)) !important;
  background-origin: border-box !important;
  background-clip: padding-box, border-box !important;

  box-shadow:
    0 20px 70px rgba(0,0,0,.55),
    0 0 0 1px rgba(255,255,255,.10) inset !important;
}

/* brilho sutil "vivo" por cima do botão (sempre, mas discreto) */
body.page-id-578 .rafa-lp-btn:not(.rafa-lp-btn--ghost)::before{
  content:"";
  position:absolute;
  inset: 1px;
  border-radius: 15px;
  background: radial-gradient(circle at 20% 20%, rgba(45,212,191,.20), transparent 55%),
              radial-gradient(circle at 80% 30%, rgba(212,175,55,.18), transparent 60%);
  opacity: .65;
  pointer-events:none;
  z-index: -1;
}

/* Hover no PC: muda "detalhe" (glow + leve lift). NÃO pinta o botão inteiro */
body.page-id-578 .rafa-lp-btn:not(.rafa-lp-btn--ghost):hover{
  transform: translateY(-1px);
  filter: saturate(1.06);
  box-shadow:
    0 26px 90px rgba(0,0,0,.62),
    0 0 0 1px rgba(255,255,255,.12) inset,
    0 18px 60px rgba(45,212,191,.16),
    0 18px 60px rgba(212,175,55,.14) !important;
}

/* Clique (mobile/pc) */
body.page-id-578 .rafa-lp-btn:not(.rafa-lp-btn--ghost):active{
  transform: translateY(0) scale(.99);
}

/* =========================
   BOTÃO GHOST (secundário)
   Mais vivo, mas sem competir com o principal
========================= */
body.page-id-578 .rafa-lp-btn--ghost{
  background: rgba(255,255,255,.06) !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  color: rgba(255,255,255,.86) !important;
  box-shadow: 0 18px 60px rgba(0,0,0,.35) !important;
}

body.page-id-578 .rafa-lp-btn--ghost:hover{
  background: rgba(255,255,255,.09) !important;
  border-color: rgba(45,212,191,.30) !important;
  box-shadow:
    0 22px 80px rgba(0,0,0,.45),
    0 16px 50px rgba(45,212,191,.10) !important;
}

/* =========================
   CTA FIXO DO MOBILE: mais chamativo SEM depender de hover
========================= */
body.page-id-578 .rafa-lp-sticky .rafa-lp-btn{
  /* reforça um pouco (também aparece no desktop se você estiver simulando) */
  box-shadow:
    0 26px 95px rgba(0,0,0,.65),
    0 0 0 1px rgba(255,255,255,.12) inset,
    0 20px 70px rgba(45,212,191,.18),
    0 20px 70px rgba(212,175,55,.16) !important;
}

/* "pulse" bem discreto no CTA fixo (chamada no celular) */
@media (max-width: 860px){
  body.page-id-578 .rafa-lp-sticky .rafa-lp-btn{
    animation: rafaCtaPulse2 2.2s ease-in-out infinite !important;
  }
  @keyframes rafaCtaPulse2{
    0%,100%{ transform: translateY(0) scale(1); filter:saturate(1.02); }
    50%{ transform: translateY(-1px) scale(1.02); filter:saturate(1.08); }
  }
}

@media (prefers-reduced-motion: reduce){
  body.page-id-578 .rafa-lp-sticky .rafa-lp-btn{ animation: none !important; }
}

/* acessibilidade: foco visível */
body.page-id-578 .rafa-lp-btn:focus-visible{
  outline: none !important;
  box-shadow:
    0 0 0 3px rgba(45,212,191,.25),
    0 0 0 6px rgba(212,175,55,.18),
    0 26px 90px rgba(0,0,0,.60) !important;
}
/* =========================================
   PATCH — FUNDO OPÇÃO 4 (LP 578)
   Mais vida no meio e no fim, sem ficar chapado
========================================= */

body.page-id-578{
  background:
    radial-gradient(1200px 720px at 18% 12%, rgba(45,212,191,.16), transparent 58%),
    radial-gradient(1100px 760px at 82% 16%, rgba(212,175,55,.14), transparent 60%),

    radial-gradient(1100px 720px at 22% 55%, rgba(45,212,191,.12), transparent 62%),
    radial-gradient(1100px 720px at 84% 58%, rgba(212,175,55,.10), transparent 64%),

    radial-gradient(1200px 820px at 28% 92%, rgba(45,212,191,.10), transparent 64%),
    radial-gradient(1200px 820px at 78% 88%, rgba(212,175,55,.10), transparent 66%),

    linear-gradient(180deg, #0d1322 0%, #070a10 100%) !important;

  background-attachment: fixed !important;
}
/* =========================================
   PREÇO EM DESTAQUE — LP Premium (578)
========================================= */

body.page-id-578 .rafa-lp-price-badge{
  display: inline-flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;

  margin: 14px 0 8px;
  padding: 12px 14px;

  border-radius: 14px;
  border: 1px solid rgba(212,175,55,.45);
  background: linear-gradient(90deg, rgba(212,175,55,.16), rgba(45,212,191,.14));
  box-shadow: 0 18px 60px rgba(0,0,0,.45);

  color: rgba(255,255,255,.94);
}

body.page-id-578 .rafa-lp-price-badge .label{
  font-weight: 950;
  font-size: 12px;
  letter-spacing: .3px;
  text-transform: uppercase;
  color: rgba(255,255,255,.80);
}

body.page-id-578 .rafa-lp-price-badge strong{
  font-weight: 1000;
  font-size: 18px;
  letter-spacing: .2px;
  color: #fff;
}

body.page-id-578 .rafa-lp-price-badge .sub{
  font-size: 13px;
  color: rgba(255,255,255,.80);
}

/* no final, um pouco mais “chamativo” */
body.page-id-578 .rafa-lp-price-badge--end{
  margin-top: 10px;
  border-color: rgba(45,212,191,.45);
  background: linear-gradient(90deg, rgba(45,212,191,.16), rgba(212,175,55,.14));
}

/* mobile: centraliza e quebra bonito */
@media (max-width: 980px){
  body.page-id-578 .rafa-lp-price-badge{
    justify-content: center;
    text-align: center;
  }
}
