/*  CSS FEITO POR GABRIEL R DIAS 23/10/2025   */

/*  FONTES DO GOOGLE  */
.lora-<uniquifier> {
  font-family: "Lora", serif;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: italic;
}
.playwrite-de-sas-<uniquifier> {
  font-family: "Playwrite DE SAS", cursive;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}

/*   ALTERAÇÕES NO BOOTSTRAP    */
.card {
  width: 35%;
  margin: 0 auto;
}

.card-img-top {
  margin: 0 auto !important;
  width: 50% !important;
}

/* === Layout geral com footer fixo no final === */
html, body {
  height: 100%;
}
body {
  min-height: 100vh !important;
  background-image: url("../img/fundo.png");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  background-attachment: fixed;
  display: flex;
  flex-direction: column;
}
/* Landing lojistas tem layout próprio — anula o body global */
body.page-landing-lojistas {
  background-image: none !important;
  background-attachment: unset !important;
  display: block !important;
  flex-direction: unset !important;
}
main {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
}

.centralizado-flex { 
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  min-height: calc(100vh - 80px) !important; /* altura total - footer */
  padding: 20px 0 !important;
}

/* === FOOTERS TEMÁTICOS === */
footer.footer-dinamico-verde-organico {
  margin-top: auto;
  background: radial-gradient(circle at center,
    rgba(40,167,69,0.80) 0%,
    rgba(229,255,229,0.95) 80%);
  border-top: 1px solid rgba(0,0,0,0.1);
  text-align: center;
  padding: 16px 0 14px 0;
  width: 100%;
  font-family: "Lora", serif;
  color: #1e3a1e;
  backdrop-filter: blur(3px);
  box-shadow: 0 -2px 10px rgba(0,0,0,0.1);
}
footer.footer-dinamico-terra-folha {
  margin-top: auto;
  background: radial-gradient(circle at center,
    rgba(101,67,33,0.65) 0%,
    rgba(195,233,180,0.95) 80%);
  border-top: 1px solid rgba(0,0,0,0.1);
  text-align: center;
  padding: 16px 0 14px 0;
  width: 100%;
  font-family: "Lora", serif;
  color: #2b2b2b;
  backdrop-filter: blur(3px);
  box-shadow: 0 -2px 10px rgba(0,0,0,0.15);
}
footer.footer-dinamico-verde-premium {
  margin-top: auto;
  background: radial-gradient(circle at center,
    rgba(60,179,113,0.9) 0%,
    rgba(255,255,230,0.95) 75%);
  border-top: 1px solid rgba(0,0,0,0.1);
  width: 100%;
  font-family: "Lora", serif;
  color: #184d28;
  backdrop-filter: blur(2px);
  box-shadow: 0 -2px 12px rgba(0,0,0,0.15);
  /* padding e text-align controlados pelo layout interno */
  padding: 0;
}

/* ===========================
   TEMAS VEIG (card + footer)
   =========================== */
.text-bg-veig { color: #fff; }

.text-bg-veig-light { --veig-bg: #ffffff; --veig-fg: #212529; --veig-accent: rgba(0,0,0,0.06); }
.text-bg-veig-green { --veig-bg: #073d1b; --veig-fg: #ffffff; --veig-accent: rgba(46,125,50,0.12); }
.text-bg-veig-gold  { --veig-bg: #d4a017; --veig-fg: #ffffff; --veig-accent: rgba(212,160,23,0.12); }
.text-bg-veig-earth { --veig-bg: #af5129; --veig-fg: #ffffff; --veig-accent: rgba(93,64,55,0.12); }
.text-bg-veig-blue  { --veig-bg: #49a5a9; --veig-fg: #ffffff ; --veig-accent: rgba(21,101,192,0.12); }

#meuCard {
  background-color: var(--veig-bg) !important;
  color: var(--veig-fg) !important;
  border: 1px solid rgba(0,0,0,0.05);
  transition: background-color .25s ease, color .25s ease, box-shadow .25s ease;
  box-shadow: 0 6px 24px var(--veig-accent);
}
/* Na landing o #meuCard tem estilo próprio — anula o tema dinâmico */
body.page-landing-lojistas #meuCard {
  background: rgba(255,255,255,.97) !important;
  color: #212529 !important;
  border-radius: 16px !important;
  box-shadow: 0 8px 32px rgba(0,0,0,.2) !important;
  padding: 32px 28px;
  border: none !important;
}

/* ======= SELECT DO TEMA (melhor visual e contraste) ======= */

#seletorCor {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background-color: rgba(255,255,255,0.12);
  color: #fff;
  border: 1px solid rgba(255,255,255,0.25);
  border-radius: 8px;
  padding: 6px 28px 6px 10px;
  font-family: "Lora", serif;
  font-size: 0.95rem;
  font-weight: 500;
  cursor: pointer;
  outline: none;
  transition: all 0.25s ease;
  backdrop-filter: blur(4px);
  box-shadow: 0 0 6px rgba(0,0,0,0.25);
  position: relative;
}

/* Ícone de seta customizado */
#seletorCor::after {
  content: '▼';
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 0.65rem;
  pointer-events: none;
}

/* Hover e foco */
#seletorCor:hover,
#seletorCor:focus {
  background-color: rgba(255,255,255,0.18);
  border-color: rgba(255,255,255,0.4);
}

/* Opções do dropdown (corrige fundo preto e melhora leitura) */
#seletorCor option {
  background-color: #f8f9fa !important;
  color: #212529 !important;
  font-weight: 500;
  padding: 6px;
  border-radius: 4px;
}

/* === Adaptação visual por tema === */

/* Tema Green */
.text-bg-veig-green #seletorCor {
  background-color: rgba(11, 83, 36, 0.8);
  border-color: rgba(255,255,255,0.3);
}
.text-bg-veig-green #seletorCor:hover {
  background-color: rgba(11, 83, 36, 0.95);
}

/* Tema Gold */
.text-bg-veig-gold #seletorCor {
  background-color: rgba(212,160,23,0.9);
  color: #2b2b2b;
}
.text-bg-veig-gold #seletorCor:hover {
  background-color: rgba(212,160,23,1);
}

/* Tema Earth */
.text-bg-veig-earth #seletorCor {
  background-color: rgba(175,81,41,0.85);
}
.text-bg-veig-earth #seletorCor:hover {
  background-color: rgba(175,81,41,1);
}

/* Tema Blue */
.text-bg-veig-blue #seletorCor {
  background-color: rgba(73,165,169,0.85);
}
.text-bg-veig-blue #seletorCor:hover {
  background-color: rgba(73,165,169,1);
}

/* Tema Light */
.text-bg-veig-light #seletorCor {
  background-color: rgba(255,255,255,0.8);
  color: #212529;
  border-color: rgba(0,0,0,0.15);
}
.text-bg-veig-light #seletorCor:hover {
  background-color: rgba(255,255,255,0.9);
}


/* ===========================
   FOOTERS DINÂMICOS ATUALIZADOS
   padding e text-align: gerenciados pelo layout interno (grid Bootstrap)
   =========================== */
footer.footer-dinamico-light-premium {
  margin-top: auto;
  background: radial-gradient(circle at center, rgba(255, 255, 255, 0.9) 0%, rgb(240 240 240 / 50%) 80%);
  border-top: 1px solid rgba(0,0,0,0.08);
  width: 100%; padding: 0;
  color: #212529;
  font-family: "Lora", serif;
  backdrop-filter: blur(3px);
  box-shadow: 0 -2px 10px rgba(0,0,0,0.08);
}

footer.footer-dinamico-green-premium {
  margin-top: auto;
  background: radial-gradient(circle at center, rgba(60, 179, 113, 0.9) 0%, rgb(230 255 230 / 50%) 80%);
  border-top: 1px solid rgba(0,0,0,0.08);
  width: 100%; padding: 0;
  color: #184d28;
  font-family: "Lora", serif;
  backdrop-filter: blur(3px);
  box-shadow: 0 -2px 10px rgba(0,0,0,0.12);
}

footer.footer-dinamico-gold-premium {
  margin-top: auto;
  background: radial-gradient(circle at center, rgba(255, 215, 0, 0.9) 0%, rgb(255 249 217 / 50%) 80%);
  border-top: 1px solid rgba(0,0,0,0.08);
  width: 100%; padding: 0;
  color: #5c4300;
  font-family: "Lora", serif;
  backdrop-filter: blur(3px);
  box-shadow: 0 -2px 10px rgba(0,0,0,0.12);
}

footer.footer-dinamico-earth-premium {
  margin-top: auto;
  background: radial-gradient(circle at center, rgba(139, 69, 19, 0.85) 0%, rgb(222 184 135 / 50%) 80%);
  width: 100%; padding: 0;
  color: #3b2a14;
  font-family: "Lora", serif;
  backdrop-filter: blur(3px);
  box-shadow: 0 -2px 10px rgba(0,0,0,0.12);
}

footer.footer-dinamico-blue-premium {
  margin-top: auto;
  background: radial-gradient(circle at center, rgba(73, 165, 169, 0.9) 0%, rgb(168 230 245 / 50%) 80%);
  width: 100%; padding: 0;
  color: #073944;
  font-family: "Lora", serif;
  backdrop-filter: blur(3px);
  box-shadow: 0 -2px 10px rgba(0,0,0,0.12);
}

/* ===========================
   FOOTER RESPONSIVO — layout em colunas
   Breakpoints para o novo grid do footer (4 col → 2 col → 1 col)
   =========================== */

/* Tablet: 2 colunas — marca ocupa largura toda, links em 2 por linha */
@media (max-width: 767px) {
  footer#mainFooter .row,
  footer.footer-veig .row {
    row-gap: 1.25rem;
  }
  /* Coluna da marca: largura total */
  footer#mainFooter .col-md-5,
  footer.footer-veig .col-md-5 {
    flex: 0 0 100%;
    max-width: 100%;
  }
  /* 3 colunas de links: lado a lado em pares */
  footer#mainFooter .col-md-2,
  footer.footer-veig .col-md-2 {
    flex: 0 0 33.33%;
    max-width: 33.33%;
  }
  footer#mainFooter .offset-lg-1,
  footer.footer-veig .offset-lg-1 {
    margin-left: 0;
  }
  /* Linha inferior: empilha verticalmente */
  footer#mainFooter .d-flex.justify-content-between,
  footer.footer-veig .d-flex.justify-content-between {
    flex-direction: column;
    align-items: flex-start;
    gap: .5rem;
  }
}

/* Mobile pequeno: tudo em coluna única */
@media (max-width: 480px) {
  footer#mainFooter .col-md-2,
  footer.footer-veig .col-md-2 {
    flex: 0 0 50%;
    max-width: 50%;
  }
  footer#mainFooter .container-fluid,
  footer.footer-veig .container-fluid {
    padding-left: 1rem;
    padding-right: 1rem;
  }
  footer#mainFooter .row.g-4,
  footer.footer-veig .row.g-4 {
    padding-top: 1.25rem;
    padding-bottom: .5rem;
  }
}

/* ===========================
   ISOLAMENTO DAS PÁGINAS
   =========================== */

/* ---- LOGIN (index.php) ---- */
body.page-login main {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: calc(100vh - 100px);
}
body.page-login .card {
  width: 420px !important;
  background: #fff !important;
  border-radius: 12px;
  box-shadow: 0 8px 24px rgba(0,0,0,0.15);
  border: none !important;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
body.page-login .card:hover {
  transform: translateY(-3px);
  box-shadow: 0 12px 28px rgba(0,0,0,0.2);
}
body.page-login .form-control { border-radius: 8px; }
body.page-login .btn {
  border-radius: 8px;
  font-weight: 600;
  letter-spacing: 0.3px;
}
body.page-login #seletorCor {
  position: absolute;
  top: 1rem;
  right: 1rem;
  width: auto !important;
}

/* ── CARD LOGIN — borda degradê no topo + logo/marca + tema dinâmico ────────── */

/* Borda colorida no topo — igual ao card de cadastro */
body.page-login #meuCard {
  position: relative;
  overflow: hidden;
  border-radius: 16px !important;
}
body.page-login #meuCard::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 5px;
  background: linear-gradient(90deg, #1b5e20, #4caf50, #f9a825);
  z-index: 1;
}

/* Bloco da marca — pirâmide centralizada: logo > título > subtítulo */
body.page-login .card-login-marca {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 1.75rem 1.25rem .6rem;
  gap: 0;
}
body.page-login .card-login-logo {
  width: 150px;
  height: 150px;
  object-fit: contain;
  flex-shrink: 0;
  margin-bottom: .55rem;
  display: block;
}
body.page-login .card-login-texto {
  display: contents;
}
body.page-login .card-login-titulo {
  font-family: 'Lora', serif;
  font-size: 1.35rem;
  font-weight: 700;
  margin:-50px 0 .1rem;
  letter-spacing: .2px;
  line-height: 1.2;
  background: linear-gradient(90deg, #1b5e20, #4caf50, #f9a825);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  transition: background .25s;
}
body.page-login .card-login-sub {
  font-size: .73rem;
  color: var(--veig-fg, #212529);
  opacity: .55;
  margin: 0;
  letter-spacing: .4px;
  line-height: 1.3;
}

/* Seletor de tema — canto superior direito, dentro do card */
body.page-login .card-login-tema-wrap {
  position: absolute;
  top: .85rem;
  right: .85rem;
  z-index: 2;
}
body.page-login .card-login-tema-wrap #seletorCor {
  position: static !important;
  width: auto !important;
  font-size: .72rem;
  padding: 3px 22px 3px 8px;
}

/* Temas — cor do título e subtítulo acompanha o tema */
/* Título muda degradê conforme o tema */
/* Título — degradê vibrante, sempre com contraste suficiente no fundo do card */
.text-bg-veig-light  .card-login-titulo { background: linear-gradient(90deg, #1b5e20 0%, #2e9e50 50%, #c8860a 100%) !important; -webkit-background-clip: text !important; -webkit-text-fill-color: transparent !important; background-clip: text !important; }
.text-bg-veig-green  .card-login-titulo { background: linear-gradient(90deg, #a8e6b8 0%, #56d98a 50%, #f9e04b 100%) !important; -webkit-background-clip: text !important; -webkit-text-fill-color: transparent !important; background-clip: text !important; }
.text-bg-veig-gold   .card-login-titulo { background: linear-gradient(90deg, #3b1a00 0%, #7a3800 55%, #b85c00 100%) !important; -webkit-background-clip: text !important; -webkit-text-fill-color: transparent !important; background-clip: text !important; }
.text-bg-veig-earth  .card-login-titulo { background: linear-gradient(90deg, #f5cba0 0%, #e87c3e 50%, #c0392b 100%) !important; -webkit-background-clip: text !important; -webkit-text-fill-color: transparent !important; background-clip: text !important; }
.text-bg-veig-blue   .card-login-titulo { background: linear-gradient(90deg, #001a1f 0%, #01454f 55%, #026370 100%) !important; -webkit-background-clip: text !important; -webkit-text-fill-color: transparent !important; background-clip: text !important; }

.text-bg-veig-green  .card-login-sub,
.text-bg-veig-gold   .card-login-sub,
.text-bg-veig-earth  .card-login-sub,
.text-bg-veig-blue   .card-login-sub   { color: var(--veig-fg); opacity: .65; }

/* Borda degradê muda de cor por tema */
.text-bg-veig-green  #meuCard::before { background: linear-gradient(90deg, #081c09, #1b5e20, #4caf50); }
.text-bg-veig-gold   #meuCard::before { background: linear-gradient(90deg, #7a5800, #d4a017, #ffe066); }
.text-bg-veig-earth  #meuCard::before { background: linear-gradient(90deg, #5d2c0f, #af5129, #e07b45); }
.text-bg-veig-blue   #meuCard::before { background: linear-gradient(90deg, #073944, #49a5a9, #87d4d7); }
.text-bg-veig-light  #meuCard::before { background: linear-gradient(90deg, #1b5e20, #4caf50, #f9a825); }

/* ── MOBILE — page-login e page-auth ── */
@media (max-width: 576px) {

  /* Login — card com margem lateral visível */
  body.page-login .card {
    width: calc(100% - 40px) !important;
    max-width: 360px !important;
    margin: 0 auto;
  }
  body.page-login .centralizado-flex {
    padding: 16px 20px;
  }
  body.page-login .card-login-marca {
    padding: 1.25rem .9rem .35rem;
  }
  body.page-login .card-login-logo  { width: 150px; height: 150px; margin-bottom: -15px }
  body.page-login .card-login-titulo { font-size: 1rem; margin: -25px 0 .1rem; }
  body.page-login .card-login-sub   { font-size: .68rem; }
  body.page-login .card-body        { padding: .75rem 1rem 1rem !important; }
  body.page-login .form-label       { font-size: .82rem; }
  body.page-login .form-control     { font-size: .85rem; padding: .35rem .6rem; }
  body.page-login .btn-success      { font-size: .85rem; padding: .35rem .9rem; }

  /* Auth (recuperar/nova senha) — card com margem lateral visível */
  body.page-auth .centralizado-flex {
    padding: 1rem 20px 2rem;
    align-items: flex-start;
  }
  body.page-auth .centralizado-flex .card {
    width: calc(100% - 40px) !important;
    max-width: 380px !important;
    padding: 1.25rem 1rem 1.1rem !important;
    border-radius: 12px !important;
    margin: 0 auto;
  }
  body.page-auth .centralizado-flex h4 { font-size: 1rem; }
  body.page-auth .centralizado-flex p.text-muted { font-size: .78rem; }
  body.page-auth .centralizado-flex .form-label  { font-size: .82rem; }
  body.page-auth .centralizado-flex .form-control { font-size: .85rem; padding: .35rem .6rem; }
  body.page-auth .centralizado-flex .btn {
    font-size: .85rem;
    padding: .45rem .9rem;
  }
}


/* ---- LANDING LOJISTAS ---- */
body.page-landing-lojistas #formLojista .etapa {
  display: none;
  opacity: 0;
  transform: translateY(10px);
  transition: opacity .4s ease, transform .4s ease;
}
body.page-landing-lojistas #formLojista .etapa-ativa {
  display: block;
  opacity: 1;
  transform: translateY(0);
}
body.page-landing-lojistas #formLojista .form-control,
body.page-landing-lojistas #formLojista .form-select {
  border-radius: 10px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.08);
}
body.page-landing-lojistas #formLojista .btn {
  border-radius: 10px;
  font-weight: 500;
}

/* ---- TEMA DINÂMICO EM AMBAS ---- */
body.page-login #meuCard {
  background-color: var(--veig-bg, #fff) !important;
  color: var(--veig-fg, #212529) !important;
  transition: background-color 0.25s ease, color 0.25s ease, box-shadow 0.25s ease;
}

/* ===============  FORMULÁRIO DE CAPTAÇÃO (antigo bloco adaptado) =============== */
#formLojista .row.g-3 .form-label {
  font-family: "Lora", serif;
  font-size: 0.95rem;
}
label { font-family: "Lora", serif; }
#seletorCor { width: 15% !important; }

/* RESPONSIVIDADE */
@media (max-width: 768px) {
  #formLojista .col-md-6,
  #formLojista .col-md-4,
  #formLojista .col-md-8 {
    flex: 0 0 100%;
    max-width: 100%;
  }
}

/* === Modal estilo toast (no topo direito) === */
#dbStatusModal {
  pointer-events: none; /* não bloqueia clique no fundo */
}

#dbStatusModal .modal-dialog {
  position: fixed;
  top: 20px;
  right: 20px;
  margin: 0;
  max-width: 350px;
  width: auto;
  transform: translateY(-120%);
  opacity: 0;
  transition: transform 0.4s ease, opacity 0.3s ease;
  z-index: 2050;
}

/* Quando visível */
#dbStatusModal.show .modal-dialog {
  transform: translateY(0);
  opacity: 1;
  pointer-events: auto;
}

/* Cores temáticas */
#dbStatusModal .modal-content.success {
  background: #e6f4ea;
  color: #1e7d32;
  border-left: 5px solid #1e7d32;
}

#dbStatusModal .modal-content.danger {
  background: #fdecea;
  color: #c62828;
  border-left: 5px solid #c62828;
}

#dbStatusModal .modal-content.warning {
  background: #fff8e1;
  color: #b28704;
  border-left: 5px solid #b28704;
}

#dbStatusModal .modal-content.info {
  background: #e3f2fd;
  color: #1565c0;
  border-left: 5px solid #1565c0;
}

/* Header pequeno e elegante */
#dbStatusModal .modal-header {
  background: transparent;
  color: inherit;
  padding-bottom: 0;
}

#dbStatusModal .btn-close {
  filter: invert(0.4);
  opacity: 0.7;
}

#dbStatusModal .btn-close:hover {
  opacity: 1;
}

/* Animação de entrada */
@keyframes bounceInDown {
  0% {
    transform: translateY(-200%);
    opacity: 0;
  }
  60% {
    transform: translateY(25%);
    opacity: 1;
  }
  100% {
    transform: translateY(0);
  }
}

#dbStatusModal.show .modal-dialog.animate-toast {
  animation: bounceInDown 0.5s ease-out;
}


/* TELAS ADAPTADAS */
@media only screen and (min-width: 328px) and (max-width: 600px) {
  body {
    background-size: auto !important;
    background-position: top !important;
  }
  body:not(.page-auth):not(.page-login) .card { width: 65% !important; }
}
@media only screen and (min-width: 601px) and (max-width: 1024px) {
  body:not(.page-auth):not(.page-login) .card { width: 35% !important; }
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) {
  body:not(.page-auth):not(.page-login) .card { width: 35% !important; }
}

/* ===========================
   LANDING LOJISTAS — /cadastro (landing_lojistas.php)
   Isolamento total: sobrescreve body global, .card global,
   #meuCard global e qualquer regra genérica do sistema.
   =========================== */

/* Anula .card global (width: 35%) */
body.page-landing-lojistas .card {
  width: auto !important;
}

/* Reset e base */
body.page-landing-lojistas *,
body.page-landing-lojistas *::before,
body.page-landing-lojistas *::after {
  box-sizing: border-box;
}
body.page-landing-lojistas {
  font-family: 'Segoe UI', sans-serif;
  min-height: 100vh;
  overflow-x: hidden;
  margin: 0;
  padding: 0;
}

/* ── SLIDER FULLSCREEN PARALLAX ── */
body.page-landing-lojistas .bg-slider {
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none; /* nunca intercepta cliques */
}
body.page-landing-lojistas .bg-slide {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  opacity: 0;
  transition: opacity 1.6s ease;
  animation: kenburns 14s ease-in-out infinite alternate;
  will-change: transform, opacity;
}
body.page-landing-lojistas .bg-slide.ativo { opacity: 1; }

/* Slides */
body.page-landing-lojistas .bg-s1 { background-image: url('https://images.unsplash.com/photo-1530836369250-ef72a3f5cda8?w=1920&q=85'); }
body.page-landing-lojistas .bg-s2 { background-image: url('https://images.unsplash.com/photo-1464226184884-fa280b87c399?w=1920&q=85'); }
body.page-landing-lojistas .bg-s3 { background-image: url('https://images.unsplash.com/photo-1500651230702-0e2d8a49d4ad?w=1920&q=85'); }
body.page-landing-lojistas .bg-s4 { background-image: url('https://images.unsplash.com/photo-1416879595882-3373a0480b5b?w=1920&q=85'); }
body.page-landing-lojistas .bg-s5 { background-image: url('https://images.unsplash.com/photo-1611735341450-74d61e660ad2?w=1920&q=85'); }

/* Overlay gradiente */
body.page-landing-lojistas .bg-overlay {
  position: fixed;
  inset: 0;
  z-index: 1;
  pointer-events: none; /* deixa cliques passarem para o footer e demais elementos */
  background:
    linear-gradient(to bottom, rgba(5,25,5,.55) 0%, rgba(0,0,0,.2) 50%, rgba(5,25,5,.65) 100%),
    linear-gradient(to right,  rgba(5,25,5,.4)  0%, transparent 65%);
}

/* Setas de navegação */
body.page-landing-lojistas .slide-arrow {
  position: fixed;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
  background: rgba(255,255,255,.14);
  border: 1px solid rgba(255,255,255,.25);
  color: #fff;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  font-size: 1rem;
  cursor: pointer;
  backdrop-filter: blur(6px);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background .2s, transform .2s;
}
body.page-landing-lojistas .slide-arrow:hover {
  background: rgba(255,255,255,.28);
  transform: translateY(-50%) scale(1.08);
}
body.page-landing-lojistas .slide-arrow.prev { left: 14px; }
body.page-landing-lojistas .slide-arrow.next { right: 14px; }
@media (max-width: 576px) {
  body.page-landing-lojistas .slide-arrow { display: none; }
}

/* Dots */
body.page-landing-lojistas .slide-dots-card {
  display: flex;
  justify-content: center;
  gap: 8px;
}
body.page-landing-lojistas .slide-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #ccc;
  cursor: pointer;
  border: none;
  padding: 0;
  transition: background .3s, transform .3s;
}
body.page-landing-lojistas .slide-dot.ativo {
  background: #28a745;
  transform: scale(1.45);
}

/* Caption inline */
body.page-landing-lojistas .slide-caption-inline {
  font-size: .8rem;
  color: rgba(255,255,255,.6);
  transition: opacity .4s ease;
}
body.page-landing-lojistas .slide-caption-inline #capTitle {
  color: #7dffb0;
  font-weight: 600;
}

/* ── CONTEÚDO SOBRE O SLIDER ── */
body.page-landing-lojistas .cadastro-wrapper {
  position: relative;
  z-index: 5;
  padding: 48px 16px 80px;
  min-height: 100vh;
}

/* Segmentos glass */
body.page-landing-lojistas .segmento-card {
  width: 130px;
  background: rgba(255,255,255,.15);
  backdrop-filter: blur(8px);
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 14px;
  padding: 14px 8px;
  text-align: center;
  transition: transform .2s, background .2s;
}
body.page-landing-lojistas .segmento-card:hover {
  transform: translateY(-5px);
  background: rgba(255,255,255,.25);
}
body.page-landing-lojistas .segmento-card i { font-size: 2rem; color: #7dffb0; }
body.page-landing-lojistas .segmento-card p { color: #fff; margin-bottom: 0; }

/* Etapas */
body.page-landing-lojistas .etapa             { display: none; }
body.page-landing-lojistas .etapa.etapa-ativa  { display: block; }

/* Títulos e labels do formulário — Nunito: suave e redonda (todas as etapas) */
body.page-landing-lojistas h4,
body.page-landing-lojistas h5,
body.page-landing-lojistas h6 {
  font-family: 'Nunito', sans-serif;
  font-weight: 700;
  letter-spacing: -0.2px;
}
body.page-landing-lojistas .form-label,
body.page-landing-lojistas label {
  font-family: 'Nunito', sans-serif;
  font-weight: 500;
  font-size: 0.9rem;
  color: #3a3a3a;
  letter-spacing: 0.1px;
}

/* Indicador de progresso */
body.page-landing-lojistas .step-indicators {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  margin-bottom: 24px;
}
body.page-landing-lojistas .step-dot {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  border: 2px solid #28a745;
  background: #fff;
  color: #28a745;
  font-weight: 700;
  font-size: .85rem;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: background .25s, color .25s;
}
body.page-landing-lojistas .step-dot.ativo     { background: #28a745; color: #fff; }
body.page-landing-lojistas .step-dot.concluido { background: #28a745; color: #fff; opacity: .55; }
body.page-landing-lojistas .step-line {
  flex: 1;
  max-width: 64px;
  height: 2px;
  background: #28a745;
  opacity: .25;
  transition: opacity .25s;
}
body.page-landing-lojistas .step-line.ativo { opacity: 1; }

/* Validação inline */
body.page-landing-lojistas .mb-3:has(.is-invalid) > .invalid-feedback,
body.page-landing-lojistas .col-md-6:has(.is-invalid) > .invalid-feedback,
body.page-landing-lojistas .col-md-4:has(.is-invalid) > .invalid-feedback,
body.page-landing-lojistas .col-md-5:has(.is-invalid) > .invalid-feedback,
body.page-landing-lojistas .col-md-8:has(.is-invalid) > .invalid-feedback,
body.page-landing-lojistas .col-md-2:has(.is-invalid) > .invalid-feedback,
body.page-landing-lojistas .col-md-3:has(.is-invalid) > .invalid-feedback,
body.page-landing-lojistas .col-md-9:has(.is-invalid) > .invalid-feedback,
body.page-landing-lojistas .col-12:has(.is-invalid) > .invalid-feedback {
  display: block !important;
}
/* Contorno de erro só no input dentro do input-group, nunca no grupo todo */
body.page-landing-lojistas .input-group .form-control.is-invalid,
body.page-landing-lojistas .input-group .form-select.is-invalid {
  border-color: #dc3545;
  box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25);
  z-index: 1;
}
body.page-landing-lojistas .input-group:has(.is-invalid) {
  outline: none;
}

/* Footer próprio */
body.page-landing-lojistas .veig-footer {
  background: #2d5a27;
  color: #d4edda;
  text-align: center;
  padding: 24px 16px;
  position: relative;
  z-index: 10; /* acima do overlay (z-index 1) e do slider (z-index 0) */
}
body.page-landing-lojistas .veig-footer small { color: #a8d5a2; }


/* ============================================================
   VEIG FOOTER COMPACTO — .veig-footer-inner
   Funciona dentro ou fora do .main-content.
   Em dashboard: footer fica DENTRO do .main-content,
   herdando o margin-left:220px da sidebar automaticamente.
   ============================================================ */

/* Reset de padding/text-align dos temas dinâmicos */
footer#mainFooter,
footer.footer-veig {
  padding: 0 !important;
  text-align: left !important;
  width: 100% !important;
  position: relative;
  z-index: 10; /* garante que fica acima do bg-overlay (z-index 1) na landing */
}

/* ── Cores de texto sólidas por tema ──
   Os gradientes de fundo são claros (pastel),
   então o texto precisa ser escuro e sólido, sem opacity.       */
footer.footer-dinamico-verde-premium  { color: #184d28 !important; }
footer.footer-dinamico-green-premium  { color: #184d28 !important; }
footer.footer-dinamico-light-premium  { color: #212529 !important; }
footer.footer-dinamico-gold-premium   { color: #5c4300 !important; }
footer.footer-dinamico-earth-premium  { color: #3b2a14 !important; }
footer.footer-dinamico-blue-premium   { color: #073944 !important; }

/* Grid interno: marca à esquerda + links à direita */
.veig-footer-inner {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 1rem 2rem;
  padding: 1.1rem 2rem .9rem;
  max-width: 1200px;
  margin: 0 auto;
}

/* Bloco da marca */
.veig-footer-brand {
  display: flex;
  flex-direction: column;
  gap: .55rem;
  min-width: 180px;
}

.veig-footer-logo {
  display: flex;
  align-items: center;
  gap: 8px;
}
.veig-footer-leaf { font-size: 1.2rem; line-height: 1; }

.veig-footer-logo strong {
  font-size: .88rem;
  font-weight: 700;
  display: block;
  color: inherit;
}
.veig-footer-logo small {
  font-size: .67rem;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  display: block;
  opacity: .55;
}

.veig-footer-contacts {
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.veig-footer-contacts a {
  font-size: .78rem;
  font-weight: 500;
  color: inherit !important;
  text-decoration: none !important;
  display: flex;
  align-items: center;
  gap: 5px;
  transition: opacity .15s;
}
.veig-footer-contacts a:hover { opacity: .75; }
.veig-footer-contacts a i { font-size: .8rem; }
.veig-footer-contacts a[href*="wa.me"] i { color: #2e7d32; }

/* Links em colunas */
.veig-footer-links {
  display: flex;
  gap: 2rem;
  flex-wrap: wrap;
}

.veig-footer-col {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 90px;
}

.veig-footer-col-title {
  font-size: .67rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  display: block;
  margin-bottom: 5px;
  opacity: .5;
}

.veig-footer-col a {
  font-size: .78rem;
  font-weight: 500;
  color: inherit !important;
  text-decoration: none !important;
  transition: opacity .15s;
  white-space: nowrap;
}
.veig-footer-col a:hover { opacity: .65; }

/* Barra inferior */
.veig-footer-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: .4rem;
  padding: .45rem 2rem .55rem;
  border-top: 1px solid rgba(0,0,0,.12);
  font-size: .7rem;
  font-weight: 500;
  opacity: .6;
  max-width: 1200px;
  margin: 0 auto;
  width: 100%;
}

.veig-footer-bottom-right {
  display: flex;
  align-items: center;
  gap: 1rem;
}

/* Botão CNPJ */
.veig-cnpj-btn {
  background: rgba(0,0,0,.06);
  border: 1px solid rgba(0,0,0,.15);
  color: inherit;
  border-radius: 20px;
  padding: 1px 10px;
  font-size: .67rem;
  font-weight: 600;
  font-family: inherit;
  cursor: pointer;
  transition: background .15s;
  white-space: nowrap;
}
.veig-cnpj-btn:hover { background: rgba(0,0,0,.12); }

/* Indicador online */
.veig-footer-status {
  display: flex;
  align-items: center;
  gap: 4px;
  white-space: nowrap;
}
.veig-status-dot {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #2e7d32;
  display: inline-block;
  flex-shrink: 0;
}

/* ── RESPONSIVE ── */
@media (max-width: 767px) {
  .veig-footer-inner {
    flex-direction: column;
    padding: 1rem 1.25rem .75rem;
    gap: .85rem;
  }
  .veig-footer-links { gap: 1.25rem; }
  .veig-footer-bottom { padding: .45rem 1.25rem .55rem; }
}

@media (max-width: 480px) {
  .veig-footer-links { gap: .75rem; }
  .veig-footer-col { min-width: 75px; }
  .veig-footer-bottom {
    flex-direction: column;
    align-items: flex-start;
    gap: .3rem;
  }
  .veig-footer-bottom-right { gap: .6rem; }
}


/* ============================================================
   PÁGINAS LEGAIS — Termos, Privacidade, LGPD
   Usa a imagem de fundo e temas já definidos acima.
   ============================================================ */

body.page-legal {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  /* herda background-image: fundo.png do body geral */
}

/* Wrapper que centraliza o card */
.veig-legal-page {
  flex: 1;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: 40px 16px 48px;
}

/* Card do documento — herda as variáveis de tema do body */
.veig-legal-container {
  width: 100%;
  max-width: 860px;
  background-color: var(--veig-bg, #ffffff);
  color: var(--veig-fg, #212529);
  border-radius: 16px;
  box-shadow: 0 8px 40px rgba(0, 0, 0, 0.22);
  padding: 48px 56px 52px;
  border: 1px solid rgba(0, 0, 0, 0.06);
  transition: background-color .25s ease, color .25s ease, box-shadow .25s ease;
}

/* ── Topbar: logo + seletor de tema ─────────────────────── */
.veig-legal-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 28px;
  flex-wrap: wrap;
  gap: 12px;
}

.veig-legal-logo-area {
  display: flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
}

.veig-legal-logo-area img {
  height: 38px;
  width: auto;
  object-fit: contain;
}

.veig-legal-logo-name {
  font-family: "Lora", serif;
  font-size: 0.97rem;
  font-weight: 600;
  color: var(--veig-fg, #212529);
  line-height: 1.2;
}

.veig-legal-logo-name small {
  display: block;
  font-size: 0.67rem;
  font-weight: 500;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  opacity: 0.5;
}

/* Seletor de tema — mesmo estilo do #seletorCor do login */
#seletorCorLegal {
  appearance: none;
  -webkit-appearance: none;
  background-color: rgba(128,128,128,0.12);
  color: var(--veig-fg, #212529);
  border: 1px solid rgba(128,128,128,0.25);
  border-radius: 8px;
  padding: 5px 28px 5px 10px;
  font-family: "Lora", serif;
  font-size: 0.85rem;
  font-weight: 500;
  cursor: pointer;
  outline: none;
  transition: all 0.2s ease;
  backdrop-filter: blur(4px);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23888'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 10px center;
}
#seletorCorLegal:hover { opacity: 0.85; }
#seletorCorLegal option {
  background-color: #f8f9fa !important;
  color: #212529 !important;
  font-weight: 500;
}

/* ── Cabeçalho do documento ─────────────────────────────── */
.veig-legal-header {
  display: flex;
  align-items: flex-start;
  gap: 18px;
  margin-bottom: 8px;
}

.veig-legal-leaf {
  font-size: 2.4rem;
  line-height: 1;
  margin-top: 4px;
  flex-shrink: 0;
}

.veig-legal-title {
  font-size: 1.75rem;
  font-weight: 700;
  color: #1a5c2a;
  margin: 0 0 4px;
  line-height: 1.2;
}

body.text-bg-veig-green .veig-legal-title,
body.text-bg-veig-earth .veig-legal-title,
body.text-bg-veig-blue  .veig-legal-title { color: #7dffb0; }

.veig-legal-subtitle {
  font-size: 0.97rem;
  color: var(--veig-fg, #555);
  opacity: 0.7;
  margin: 0 0 6px;
  font-style: italic;
}

.veig-legal-meta {
  font-size: 0.76rem;
  opacity: 0.5;
  margin: 0;
}

/* ── Divisor ─────────────────────────────────────────────── */
.veig-legal-divider {
  border: none;
  border-top: 2px solid #2e7d3a;
  margin: 20px 0 28px;
  opacity: 0.3;
}

/* ── Seções ──────────────────────────────────────────────── */
.veig-legal-section { margin-bottom: 32px; }

.veig-legal-section h2 {
  font-size: 1.1rem;
  font-weight: 700;
  color: #1a5c2a;
  border-left: 4px solid #2e7d3a;
  padding-left: 12px;
  margin: 0 0 12px;
}

body.text-bg-veig-green .veig-legal-section h2,
body.text-bg-veig-earth .veig-legal-section h2,
body.text-bg-veig-blue  .veig-legal-section h2 { color: #7dffb0; border-color: #7dffb0; }

.veig-legal-section h3 {
  font-size: 0.95rem;
  font-weight: 600;
  color: #2e7d3a;
  margin: 18px 0 8px;
}

body.text-bg-veig-green .veig-legal-section h3,
body.text-bg-veig-earth .veig-legal-section h3,
body.text-bg-veig-blue  .veig-legal-section h3 { color: #a8ffcc; }

.veig-legal-section p,
.veig-legal-section ul li {
  font-size: 0.91rem;
  color: var(--veig-fg, #333);
  line-height: 1.78;
  margin-bottom: 6px;
  text-align: justify;
}

.veig-legal-section ul { padding-left: 20px; margin: 8px 0 12px; }

.veig-legal-section a { color: #1a5c2a; text-decoration: underline; text-underline-offset: 3px; }

body.text-bg-veig-green .veig-legal-section a,
body.text-bg-veig-earth .veig-legal-section a,
body.text-bg-veig-blue  .veig-legal-section a { color: #7dffb0; }

.veig-legal-section a:hover { opacity: 0.75; }

/* ── Base legal ──────────────────────────────────────────── */
.veig-legal-base-legal {
  font-size: 0.8rem !important;
  background: rgba(46,125,58,0.08);
  border-left: 3px solid #a3cba9;
  padding: 6px 10px;
  border-radius: 4px;
  margin-top: 6px !important;
  font-style: italic;
  opacity: 0.8;
}

/* ── Alerta de prazo ─────────────────────────────────────── */
.veig-legal-alert {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  background: rgba(46,125,58,0.1);
  border: 2px solid #2e7d3a;
  border-left-width: 6px;
  border-radius: 8px;
  padding: 16px 20px;
  margin: 20px 0;
}

.veig-legal-alert-icon {
  font-size: 1.4rem;
  line-height: 1;
  flex-shrink: 0;
  margin-top: 2px;
}

.veig-legal-alert div {
  font-size: 0.91rem;
  color: var(--veig-fg, #1a3d20);
  line-height: 1.7;
}

/* ── Rodapé do documento ─────────────────────────────────── */
.veig-legal-footer-text {
  text-align: center;
  font-size: 0.8rem;
  opacity: 0.5;
  margin: 0 0 24px;
}

/* ── Navegação entre documentos ─────────────────────────── */
.veig-legal-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: center;
  margin-top: 8px;
}

.veig-legal-nav-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: rgba(46,125,58,0.08);
  color: var(--veig-fg, #1a5c2a);
  border: 1px solid rgba(46,125,58,0.3);
  border-radius: 20px;
  padding: 7px 16px;
  font-size: 0.83rem;
  font-weight: 500;
  text-decoration: none;
  transition: background 0.2s, border-color 0.2s, opacity 0.2s;
}

.veig-legal-nav-link:hover {
  background: rgba(46,125,58,0.16);
  border-color: #2e7d3a;
  text-decoration: none;
  color: var(--veig-fg, #0f3d1c);
}

/* ── Responsivo ──────────────────────────────────────────── */
@media (max-width: 680px) {
  .veig-legal-container { padding: 28px 20px 36px; }
  .veig-legal-title     { font-size: 1.35rem; }
  .veig-legal-header    { flex-direction: column; gap: 8px; }
  .veig-legal-leaf      { font-size: 2rem; }
  .veig-legal-topbar    { flex-direction: column; align-items: flex-start; }
}

/* ============================================================
   LANDING LOJISTAS B2B — Seções de conteúdo (hero, jornada,
   produtos, diferenciais, prova social)
   Adicionado junto ao bloco existente page-landing-lojistas
   ============================================================ */

/* ── Wrapper geral das seções ── */
body.page-landing-lojistas .landing-wrapper {
  position: relative;
  z-index: 5;
  padding: 0 0 48px;
}

/* ── HERO ── */
body.page-landing-lojistas .hero-section {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 60px 16px 32px;
  text-align: center;
}
body.page-landing-lojistas .hero-logo {
  height: 150px;
  filter: drop-shadow(0 2px 12px rgba(0,0,0,.4));
}
body.page-landing-lojistas .hero-tagline {
  font-family: 'Playwrite DE SAS', 'Lora', serif;
  font-size: clamp(1.6rem, 4vw, 2.8rem);
  font-weight: 300;
  color: #fff;
  text-shadow: 0 2px 16px rgba(0,0,0,.5);
  margin: 16px 0 8px;
  line-height: 1.25;
}
body.page-landing-lojistas .hero-sub {
  color: rgba(255,255,255,.8);
  font-size: clamp(.9rem, 2vw, 1.1rem);
  margin-bottom: 12px;
}
body.page-landing-lojistas .hero-caption {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(255,255,255,.12);
  backdrop-filter: blur(8px);
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 50px;
  padding: 6px 18px;
  color: rgba(255,255,255,.9);
  font-size: .82rem;
  margin-bottom: 32px;
}
body.page-landing-lojistas .hero-caption .dot {
  width: 7px;
  height: 7px;
  background: #4caf50;
  border-radius: 50%;
  animation: ldg-pulse 2s infinite;
}
@keyframes ldg-pulse {
  0%,100% { opacity:1; transform:scale(1);   }
  50%      { opacity:.5; transform:scale(1.4); }
}

/* Segmentos glass — hero */
body.page-landing-lojistas .segmentos-row {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
  margin-bottom: 40px;
}

/* Scroll-down cue */
body.page-landing-lojistas .scroll-down {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  color: rgba(255,255,255,.6);
  font-size: .72rem;
  letter-spacing: 1px;
  text-transform: uppercase;
  cursor: pointer;
  margin-top: 8px;
  animation: ldg-bobbing 2s ease-in-out infinite;
}
body.page-landing-lojistas .scroll-down i { font-size: 1.4rem; }
@keyframes ldg-bobbing {
  0%,100% { transform: translateY(0);  }
  50%      { transform: translateY(6px); }
}

/* ── SEÇÃO COMO TRABALHAMOS ── */
body.page-landing-lojistas .como-section {
  background: rgba(0,0,0,.6);
  backdrop-filter: blur(2px);
  padding: 64px 0;
}
body.page-landing-lojistas .como-title {
  font-family: 'Lora', serif;
  font-size: clamp(1.4rem, 3vw, 2rem);
  color: #fff;
  font-weight: 600;
  margin-bottom: 8px;
}
body.page-landing-lojistas .como-title span { color: #4caf50; }
body.page-landing-lojistas .como-subtitle {
  color: rgba(255,255,255,.65);
  font-size: .95rem;
  margin-bottom: 40px;
}

/* Timeline horizontal */
body.page-landing-lojistas .jornada-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 0;
  position: relative;
}
body.page-landing-lojistas .jornada-grid::before {
  content: '';
  position: absolute;
  top: 48px; left: 10%; right: 10%; height: 2px;
  background: linear-gradient(90deg, transparent, #4caf50 20%, #4caf50 80%, transparent);
  z-index: 0;
}
body.page-landing-lojistas .jornada-step {
  position: relative;
  z-index: 1;
  text-align: center;
  padding: 0 12px 32px;
}
body.page-landing-lojistas .jornada-icon-wrap {
  width: 96px; height: 96px; border-radius: 50%;
  background: linear-gradient(135deg, #1b5e20, #2e7d32);
  border: 3px solid #4caf50;
  display: flex; align-items: center; justify-content: center;
  margin: 0 auto 16px;
  box-shadow: 0 4px 20px rgba(76,175,80,.4);
  transition: transform .3s;
}
body.page-landing-lojistas .jornada-step:hover .jornada-icon-wrap {
  transform: scale(1.08);
}
body.page-landing-lojistas .jornada-icon-wrap i { font-size: 2.2rem; color: #fff; }
body.page-landing-lojistas .jornada-step-num {
  position: absolute; top: -6px; right: calc(50% - 56px);
  width: 24px; height: 24px; border-radius: 50%;
  background: #f9a825; color: #000;
  font-size: .7rem; font-weight: 800;
  display: flex; align-items: center; justify-content: center;
}
body.page-landing-lojistas .jornada-step h6 { color: #fff; font-weight: 700; font-size: .9rem; margin-bottom: 4px; }
body.page-landing-lojistas .jornada-step p  { color: rgba(255,255,255,.6); font-size: .78rem; line-height: 1.5; margin: 0; }

/* ── SEÇÃO PRODUTOS ── */
body.page-landing-lojistas .produtos-section {
  background: rgba(0,0,0,.5);
  backdrop-filter: blur(2px);
  padding: 56px 0;
  border-top: 1px solid rgba(76,175,80,.2);
  border-bottom: 1px solid rgba(76,175,80,.2);
}
body.page-landing-lojistas .produtos-grid {
  display: flex; flex-wrap: wrap; justify-content: center; gap: 16px;
}
body.page-landing-lojistas .produto-badge {
  display: flex; align-items: center; gap: 10px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(76,175,80,.35);
  border-radius: 50px; padding: 10px 20px;
  color: #fff; font-size: .88rem; font-weight: 600;
  transition: background .2s, transform .2s;
}
body.page-landing-lojistas .produto-badge:hover {
  background: rgba(76,175,80,.25);
  transform: translateY(-2px);
}
body.page-landing-lojistas .produto-badge .emoji { font-size: 1.3rem; }

/* ── SEÇÃO DIFERENCIAIS ── */
body.page-landing-lojistas .diferenciais-section {
  padding: 56px 0;
  background: rgba(0,0,0,.45);
}
body.page-landing-lojistas .diferencial-card {
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 20px; padding: 28px 24px; text-align: center;
  transition: transform .3s, background .3s;
  height: 100%;
}
body.page-landing-lojistas .diferencial-card:hover {
  transform: translateY(-4px);
  background: rgba(255,255,255,.12);
}
body.page-landing-lojistas .diferencial-card .icon-circle {
  width: 64px; height: 64px; border-radius: 50%;
  background: linear-gradient(135deg,#1b5e20,#4caf50);
  display: flex; align-items: center; justify-content: center;
  margin: 0 auto 16px;
  box-shadow: 0 4px 16px rgba(76,175,80,.35);
}
body.page-landing-lojistas .diferencial-card .icon-circle i { font-size: 1.6rem; color: #fff; }
body.page-landing-lojistas .diferencial-card h6 { color: #fff; font-weight: 700; margin-bottom: 6px; }
body.page-landing-lojistas .diferencial-card p  { color: rgba(255,255,255,.6); font-size: .82rem; margin: 0; line-height: 1.5; }

/* ── SEÇÃO PROVA SOCIAL ── */
body.page-landing-lojistas .prova-section {
  padding: 40px 0;
  background: rgba(76,175,80,.12);
  border-top: 1px solid rgba(76,175,80,.2);
}
body.page-landing-lojistas .prova-stat { text-align: center; padding: 8px; }
body.page-landing-lojistas .prova-stat .num {
  font-family: 'Lora', serif;
  font-size: clamp(2rem,5vw,3.2rem);
  font-weight: 700; color: #4caf50; line-height: 1;
}
body.page-landing-lojistas .prova-stat .label {
  color: rgba(255,255,255,.65); font-size: .82rem; margin-top: 4px;
}

/* ── SEÇÃO FORMULÁRIO ── */
body.page-landing-lojistas .form-section { padding: 56px 0 24px; }

/* Card formulário — override do existente body.page-landing-lojistas #meuCard */
body.page-landing-lojistas #meuCard {
  border-radius: 24px !important;
  padding: 40px 36px !important;
  position: relative;
  overflow: hidden;
}
body.page-landing-lojistas #meuCard::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0; height: 5px;
  background: linear-gradient(90deg, #1b5e20, #4caf50, #f9a825);
}

/* Strength bar da senha */
body.page-landing-lojistas .senha-strength {
  display: flex; gap: 4px; margin-top: 6px;
}
body.page-landing-lojistas .senha-strength span {
  flex: 1; height: 4px; border-radius: 2px;
  background: #e0e0e0; transition: background .3s;
}

/* Caixa de termos */
body.page-landing-lojistas .termos-box {
  background: #e8f5e9;
  border: 1px solid #a5d6a7;
  border-radius: 12px; padding: 14px 16px; margin-bottom: 16px;
}

/* Asterisco obrigatório */
body.page-landing-lojistas .req { color: #c62828; margin-left: 2px; font-size: .8rem; }

/* Responsivo */
@media (max-width: 576px) {
  body.page-landing-lojistas #meuCard { padding: 28px 20px !important; }
  body.page-landing-lojistas .jornada-grid::before { display: none; }
  body.page-landing-lojistas .jornada-step { padding-bottom: 24px; }
  body.page-landing-lojistas .hero-tagline { font-size: 1.5rem; }
}