/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Apr 10 2026 | 17:55:38 */
/* ═══════════════════════════════════════════════════════════
   CP PAGES — ONBOARDING
   Páginas de boas-vindas por plano (Formação, Performance,
   Estratégia). Guias de início rápido para novos assinantes.
   Prefixo: cp-onb-
   ═══════════════════════════════════════════════════════════ */


/* ───── design tokens (onboarding) ───── */
:root {
  --cp-onb-gold:          #F7D44A;
  --cp-onb-gold-dark:     #d89818;
  --cp-onb-gold-bg:       #fef9ea;
  --cp-onb-gold-border:   #f0dda0;
  --cp-onb-green:         #4A996A;
  --cp-onb-green-light:   #85CCA3;
  --cp-onb-green-bg:      #f0faf4;
  --cp-onb-green-border:  #c8e6d5;
  --cp-onb-blue:          #56769D;
  --cp-onb-blue-light:    #99B7DD;
  --cp-onb-blue-bg:       #f0f4fa;
  --cp-onb-blue-border:   #c8d6e8;
  --cp-onb-salmon:        #E57159;
  --cp-onb-navy:          #02023F;
  --cp-onb-navy-mid:      #0a0a5e;
  --cp-onb-max:           880px;
}


/* ───── scroll reveal ───── */
.cp-onb-reveal {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity .65s cubic-bezier(.16,1,.3,1), transform .65s cubic-bezier(.16,1,.3,1);
}
.cp-onb-reveal.visible { opacity: 1; transform: translateY(0); }
.cp-onb-d1 { transition-delay: .08s; }
.cp-onb-d2 { transition-delay: .16s; }
.cp-onb-d3 { transition-delay: .24s; }
.cp-onb-d4 { transition-delay: .32s; }


/* ───── layout ───── */
.cp-onb-section {
  padding: 72px 24px !important;
  width: 100vw;
  margin-left: calc(-50vw + 50%);
}
.cp-onb-inner {
  max-width: var(--cp-onb-max);
  margin: 0 auto !important;
}
.cp-onb-section-tag {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  letter-spacing: .18em;
  text-transform: uppercase;
  font-weight: 700 !important;
  margin-bottom: 14px !important;
}
.cp-onb-section-title {
  font-size: 26px;
  font-weight: 800 !important;
  letter-spacing: -.5px;
  line-height: 1.2 !important;
  margin-bottom: 10px !important;
  color: var(--cp-text) !important;
}
.cp-onb-section-desc {
  font-size: 15px;
  color: var(--cp-text-body) !important;
  line-height: 1.65 !important;
  margin: 0 !important;
  padding: 0 !important;
  max-width: 600px;
}


/* ═══════════════════════════════════════════════════════════
   BUTTONS
   ═══════════════════════════════════════════════════════════ */
a.cp-onb-btn-gold,
a.cp-onb-btn-gold:visited {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: linear-gradient(135deg, var(--cp-onb-gold), var(--cp-onb-gold-dark));
  color: var(--cp-preto) !important;
  font-size: 15px;
  font-weight: 700 !important;
  padding: 16px 44px !important;
  border-radius: 10px;
  text-decoration: none !important;
  transition: all .3s;
  box-shadow: 0 4px 20px rgba(247,212,74,.25);
}
a.cp-onb-btn-gold:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 32px rgba(247,212,74,.35);
}

a.cp-onb-btn-outline,
a.cp-onb-btn-outline:visited {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: transparent;
  font-size: 14px;
  font-weight: 600 !important;
  padding: 12px 28px !important;
  border-radius: 8px;
  text-decoration: none !important;
  transition: all .25s;
  border: 1.5px solid var(--cp-border-dark);
  color: var(--cp-text-secondary) !important;
}
a.cp-onb-btn-outline:hover {
  border-color: var(--cp-text-secondary);
  background: var(--cp-bg-subtle);
}

a.cp-onb-btn-dark,
a.cp-onb-btn-dark:visited {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: var(--cp-preto);
  color: #fff !important;
  font-size: 14px;
  font-weight: 600 !important;
  padding: 12px 28px !important;
  border-radius: 8px;
  text-decoration: none !important;
  transition: all .25s;
}
a.cp-onb-btn-dark:hover { background: #333; }


/* ═══════════════════════════════════════════════════════════
   HERO — 3 variantes por plano
   ═══════════════════════════════════════════════════════════ */
.cp-onb-hero {
  color: #fff !important;
  padding: 80px 24px 72px !important;
  text-align: center;
  position: relative;
  overflow: hidden;
  width: 100vw;
  margin-left: calc(-50vw + 50%);
}
.cp-onb-hero::before {
  content: '';
  position: absolute;
  top: -30%;
  right: -15%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(247,212,74,.07) 0%, transparent 60%);
  pointer-events: none;
}
.cp-onb-hero-inner {
  max-width: 700px;
  margin: 0 auto !important;
  position: relative;
  z-index: 1;
}
.cp-onb-hero-plan {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 11px;
  font-weight: 700 !important;
  text-transform: uppercase;
  letter-spacing: 2px;
  color: var(--cp-onb-gold) !important;
  line-height: 1.4 !important;
  margin-bottom: 24px !important;
  opacity: .85;
}
.cp-onb-hero h1 {
  font-size: 42px;
  font-weight: 800 !important;
  letter-spacing: -1.5px;
  line-height: 1.1 !important;
  margin-bottom: 16px !important;
  color: #fff !important;
}
.cp-onb-hero-sub {
  font-size: 18px;
  color: rgba(255,255,255,.65) !important;
  line-height: 1.6 !important;
  margin-bottom: 36px !important;
}

/* Formação — verde */
.cp-onb-hero--formacao {
  background: linear-gradient(165deg, #1a3a2a 0%, #2e7d5e 50%, #4A996A 100%);
}

/* Performance — azul */
.cp-onb-hero--performance {
  background: linear-gradient(165deg, #1a2a3d 0%, #2d4a6d 40%, #56769D 100%);
}

/* Estratégia — navy premium */
.cp-onb-hero--estrategia {
  background: linear-gradient(165deg, #000010 0%, var(--cp-onb-navy) 40%, #060660 100%);
}
.cp-onb-hero--estrategia::after {
  content: '';
  position: absolute;
  bottom: -20%;
  left: -10%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(4,4,158,.12) 0%, transparent 50%);
  pointer-events: none;
  animation: cp-onb-glow 10s ease-in-out infinite alternate-reverse;
}
@keyframes cp-onb-glow {
  0% { opacity: .5; transform: scale(.9); }
  100% { opacity: 1; transform: scale(1.1); }
}
.cp-onb-hero-grid {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(255,255,255,.01) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.01) 1px, transparent 1px);
  background-size: 60px 60px;
  pointer-events: none;
}
.cp-onb-hero--estrategia h1 {
  background: linear-gradient(180deg, #fff 30%, rgba(255,255,255,.6) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.cp-onb-gold-line {
  width: 64px;
  height: 2px;
  margin: 0 auto 24px !important;
  background: linear-gradient(90deg, var(--cp-onb-gold), transparent);
}


/* ═══════════════════════════════════════════════════════════
   PRIMEIROS PASSOS — step by step
   ═══════════════════════════════════════════════════════════ */
.cp-onb-steps-section {
  background: var(--cp-white);
  padding: 72px 24px !important;
  border-bottom: 1px solid var(--cp-border);
  width: 100vw;
  margin-left: calc(-50vw + 50%);
}
.cp-onb-steps-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  margin-top: 36px !important;
}
.cp-onb-step {
  background: var(--cp-bg);
  border-radius: var(--cp-radius-lg);
  padding: 28px 22px !important;
  text-align: center;
  position: relative;
  border: 1.5px solid transparent;
  transition: border-color .3s, box-shadow .3s;
}
.cp-onb-step:hover {
  border-color: var(--cp-border-dark);
  box-shadow: 0 4px 20px rgba(0,0,0,.04);
}
.cp-onb-step-num {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  color: #fff !important;
  font-size: 15px;
  font-weight: 800 !important;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 16px !important;
}
.cp-onb-step-num--green  { background: linear-gradient(135deg, var(--cp-onb-green), var(--cp-onb-green-light)); }
.cp-onb-step-num--blue   { background: linear-gradient(135deg, var(--cp-onb-blue), var(--cp-onb-blue-light)); }
.cp-onb-step-num--gold   { background: linear-gradient(135deg, var(--cp-onb-gold-dark), var(--cp-onb-gold)); color: var(--cp-preto) !important; }

.cp-onb-step-icon {
  font-size: 28px;
  margin-bottom: 12px !important;
}
.cp-onb-step-icon--green { color: var(--cp-onb-green) !important; }
.cp-onb-step-icon--blue  { color: var(--cp-onb-blue) !important; }
.cp-onb-step-icon--gold  { color: var(--cp-onb-gold-dark) !important; }

.cp-onb-step h3 {
  font-size: 14px;
  font-weight: 700 !important;
  margin-bottom: 6px !important;
  line-height: 1.3 !important;
  color: var(--cp-text) !important;
}
.cp-onb-step p {
  font-size: 12.5px;
  color: var(--cp-text-muted) !important;
  line-height: 1.5 !important;
  margin: 0 !important;
  padding: 0 !important;
}
/* connector entre steps */
.cp-onb-step::after {
  content: '';
  position: absolute;
  top: 46px;
  right: -12px;
  width: 20px;
  height: 2px;
  background: linear-gradient(90deg, var(--cp-border-dark), transparent);
}
.cp-onb-step:last-child::after { display: none; }


/* ═══════════════════════════════════════════════════════════
   FEATURE CARDS — "o que está incluído"
   ═══════════════════════════════════════════════════════════ */
.cp-onb-features {
  padding: 72px 24px !important;
  width: 100vw;
  margin-left: calc(-50vw + 50%);
}
.cp-onb-features-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin-top: 32px !important;
}
a.cp-onb-feature-card,
a.cp-onb-feature-card:visited {
  background: var(--cp-white);
  border-radius: var(--cp-radius-lg);
  padding: 28px 22px !important;
  display: flex;
  flex-direction: column;
  gap: 10px;
  border: 1px solid var(--cp-border);
  transition: border-color .3s, box-shadow .3s;
  text-decoration: none !important;
  color: inherit !important;
}
a.cp-onb-feature-card:hover {
  border-color: var(--cp-border-dark);
  box-shadow: 0 4px 16px rgba(0,0,0,.04);
}
.cp-onb-feature-icon {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
}
a.cp-onb-feature-card h3 {
  font-size: 15px;
  font-weight: 700 !important;
  color: var(--cp-text) !important;
  margin: 0 !important;
  padding: 0 !important;
}
a.cp-onb-feature-card p {
  font-size: 13px;
  color: var(--cp-text-body) !important;
  line-height: 1.55 !important;
  margin: 0 !important;
  padding: 0 !important;
}
.cp-onb-feature-link {
  font-size: 12px;
  font-weight: 600 !important;
  display: flex;
  align-items: center;
  gap: 4px;
  margin-top: auto !important;
}
.cp-onb-feature-link--green { color: var(--cp-onb-green) !important; }
.cp-onb-feature-link--blue  { color: var(--cp-onb-blue) !important; }
.cp-onb-feature-link--gold  { color: var(--cp-onb-gold-dark) !important; }


/* ═══════════════════════════════════════════════════════════
   HIGHLIGHT ROW — blocos alternados (agenda, trilhas, etc.)
   ═══════════════════════════════════════════════════════════ */
.cp-onb-highlight {
  background: var(--cp-white);
  padding: 64px 24px !important;
  border-bottom: 1px solid var(--cp-border);
  width: 100vw;
  margin-left: calc(-50vw + 50%);
}
.cp-onb-highlight--alt {
  background: var(--cp-bg);
}
.cp-onb-highlight-row {
  max-width: var(--cp-onb-max);
  margin: 0 auto !important;
  display: flex;
  align-items: center;
  gap: 48px;
}
.cp-onb-highlight-row--reverse {
  flex-direction: row-reverse;
}
.cp-onb-highlight-content {
  flex: 1;
}
.cp-onb-highlight-visual {
  flex: 0 0 240px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.cp-onb-highlight-icon-big {
  width: 120px;
  height: 120px;
  border-radius: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 48px;
}
.cp-onb-highlight h2 {
  font-size: 24px;
  font-weight: 800 !important;
  margin-bottom: 10px !important;
  letter-spacing: -.3px;
  line-height: 1.2 !important;
  color: var(--cp-text) !important;
}
.cp-onb-highlight p {
  font-size: 15px;
  color: var(--cp-text-body) !important;
  line-height: 1.65 !important;
  margin-bottom: 20px !important;
  max-width: 480px;
  padding: 0 !important;
}
.cp-onb-highlight-list {
  list-style: none;
  padding: 0 !important;
  margin: 0 0 20px !important;
}
.cp-onb-highlight-list li {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px 0 !important;
  font-size: 14px;
  color: var(--cp-text-body) !important;
  line-height: 1.4 !important;
}
.cp-onb-microtip {
  font-size: 12px;
  color: var(--cp-text-muted) !important;
  line-height: 1.4 !important;
  margin-top: 10px !important;
  padding: 0 !important;
  display: flex;
  align-items: center;
  gap: 6px;
}


/* ═══════════════════════════════════════════════════════════
   POSICIONAMENTO — bloco destaque com fundo
   ═══════════════════════════════════════════════════════════ */
.cp-onb-position {
  color: #fff !important;
  padding: 64px 24px !important;
  text-align: center;
  width: 100vw;
  margin-left: calc(-50vw + 50%);
}
.cp-onb-position--blue {
  background: linear-gradient(135deg, #1a2a3d, #2d4a6d);
}
.cp-onb-position--navy {
  background: linear-gradient(135deg, var(--cp-onb-navy), var(--cp-onb-navy-mid));
}
.cp-onb-position h2 {
  font-size: 26px;
  font-weight: 800 !important;
  margin-bottom: 12px !important;
  letter-spacing: -.5px;
  color: #fff !important;
}
.cp-onb-position p {
  font-size: 16px;
  color: rgba(255,255,255,.6) !important;
  line-height: 1.65 !important;
  max-width: 600px;
  margin: 0 auto !important;
  padding: 0 !important;
}
.cp-onb-position-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(247,212,74,.1);
  border: 1px solid rgba(247,212,74,.2);
  border-radius: 8px;
  padding: 10px 20px !important;
  margin-top: 24px !important;
  line-height: 1.4 !important;
  font-size: 13px;
  font-weight: 600 !important;
  color: var(--cp-onb-gold) !important;
}


/* ═══════════════════════════════════════════════════════════
   COMO USAR AS IAS — 3 colunas
   ═══════════════════════════════════════════════════════════ */
.cp-onb-ia-section {
  background: var(--cp-white);
  padding: 72px 24px !important;
  border-bottom: 1px solid var(--cp-border);
  width: 100vw;
  margin-left: calc(-50vw + 50%);
}
.cp-onb-ia-cols {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-top: 36px !important;
}
.cp-onb-ia-col {
  background: var(--cp-bg);
  border-radius: var(--cp-radius-lg);
  padding: 28px 22px !important;
}
.cp-onb-ia-col h3 {
  font-size: 14px;
  font-weight: 700 !important;
  margin-bottom: 14px !important;
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--cp-text) !important;
}
.cp-onb-ia-col-icon {
  width: 28px;
  height: 28px;
  border-radius: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  color: #fff !important;
}
.cp-onb-ia-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 10px 0 !important;
  border-bottom: 1px solid var(--cp-border);
  font-size: 13px;
  color: var(--cp-text-body) !important;
  line-height: 1.5 !important;
  margin: 0 !important;
}
.cp-onb-ia-item:last-child { border-bottom: none; }
.cp-onb-ia-guide {
  margin-top: 28px !important;
  padding: 0 !important;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  flex-wrap: wrap;
}


/* ═══════════════════════════════════════════════════════════
   IAS DISPONÍVEIS — cards maiores
   ═══════════════════════════════════════════════════════════ */
.cp-onb-ias {
  padding: 72px 24px !important;
  width: 100vw;
  margin-left: calc(-50vw + 50%);
}
.cp-onb-ias-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-top: 32px !important;
}
.cp-onb-ia-card {
  background: var(--cp-white);
  border-radius: var(--cp-radius-lg);
  padding: 32px 24px !important;
  text-align: center;
  border: 1px solid var(--cp-border);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  transition: border-color .3s, box-shadow .3s;
}
.cp-onb-ia-card:hover {
  border-color: var(--cp-border-dark);
  box-shadow: 0 4px 16px rgba(0,0,0,.04);
}
.cp-onb-ia-card-icon {
  width: 56px;
  height: 56px;
  border-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
}
.cp-onb-ia-card h3 {
  font-size: 16px;
  font-weight: 700 !important;
  color: var(--cp-text) !important;
  margin: 0 !important;
}
.cp-onb-ia-card p {
  font-size: 13px;
  color: var(--cp-text-body) !important;
  line-height: 1.55 !important;
  margin: 0 !important;
  padding: 0 !important;
  flex: 1;
}
.cp-onb-ia-card > .cp-onb-btn-outline {
  margin-top: auto !important;
}


/* ═══════════════════════════════════════════════════════════
   ROTINA — checklist visual (Formação)
   ═══════════════════════════════════════════════════════════ */
.cp-onb-routine-section {
  background: var(--cp-onb-green-bg);
  padding: 72px 24px !important;
  width: 100vw;
  margin-left: calc(-50vw + 50%);
}
.cp-onb-routine-section--gold {
  background: var(--cp-onb-gold-bg);
}
.cp-onb-routine-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-top: 32px !important;
}
.cp-onb-routine-card {
  background: var(--cp-white);
  border-radius: var(--cp-radius-lg);
  padding: 32px 24px !important;
  text-align: center;
  border: 1.5px solid var(--cp-onb-green-border);
}
.cp-onb-routine-icon {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--cp-onb-green), var(--cp-onb-green-light));
  color: #fff !important;
  font-size: 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 16px !important;
}
.cp-onb-routine-card h3 {
  font-size: 22px;
  font-weight: 800 !important;
  color: var(--cp-onb-green) !important;
  margin-bottom: 4px !important;
}
.cp-onb-routine-card p {
  font-size: 13px;
  color: var(--cp-text-body) !important;
  margin: 0 !important;
  padding: 0 !important;
}
.cp-onb-routine-footer {
  text-align: center;
  margin-top: 28px !important;
  padding: 0 !important;
  line-height: 1.4 !important;
  font-size: 15px;
  font-weight: 600 !important;
  color: var(--cp-onb-green) !important;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}


/* ═══════════════════════════════════════════════════════════
   ROTINA — checklist vertical (Estratégia)
   ═══════════════════════════════════════════════════════════ */
.cp-onb-routine-list {
  max-width: 560px;
  margin: 32px auto 0 !important;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.cp-onb-routine-item {
  display: flex;
  align-items: center;
  gap: 14px;
  background: var(--cp-white);
  border-radius: 12px;
  padding: 18px 20px !important;
  border: 1px solid var(--cp-onb-gold-border);
  font-size: 15px;
  font-weight: 500 !important;
  color: var(--cp-text) !important;
  margin: 0 !important;
}
.cp-onb-routine-check {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  flex-shrink: 0;
  background: linear-gradient(135deg, var(--cp-onb-gold-dark), var(--cp-onb-gold));
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  color: var(--cp-preto) !important;
}


/* ═══════════════════════════════════════════════════════════
   CONSULTORIA — bloco premium (Estratégia)
   ═══════════════════════════════════════════════════════════ */
.cp-onb-consultoria {
  background: linear-gradient(135deg, var(--cp-onb-navy), var(--cp-onb-navy-mid));
  color: #fff !important;
  padding: 80px 24px !important;
  text-align: center;
  position: relative;
  overflow: hidden;
  width: 100vw;
  margin-left: calc(-50vw + 50%);
}
.cp-onb-consultoria::before {
  content: '';
  position: absolute;
  top: -30%;
  right: -10%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(247,212,74,.06) 0%, transparent 50%);
  pointer-events: none;
}
.cp-onb-consultoria-inner {
  max-width: 600px;
  margin: 0 auto !important;
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.cp-onb-consultoria-icon {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--cp-onb-gold-dark), var(--cp-onb-gold));
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 28px;
  color: var(--cp-preto) !important;
  margin: 0 auto 24px !important;
  box-shadow: 0 4px 32px rgba(247,212,74,.2);
}
.cp-onb-consultoria h2 {
  font-size: 30px;
  font-weight: 800 !important;
  margin-bottom: 14px !important;
  letter-spacing: -.5px;
  color: #fff !important;
}
.cp-onb-consultoria p {
  font-size: 16px;
  color: rgba(255,255,255,.55) !important;
  line-height: 1.65 !important;
  margin-bottom: 32px !important;
  padding: 0 !important;
}
.cp-onb-consultoria-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(247,212,74,.08);
  border: 1px solid rgba(247,212,74,.15);
  border-radius: 8px;
  padding: 10px 18px !important;
  margin-top: 20px !important;
  line-height: 1.4 !important;
  font-size: 12px;
  font-weight: 600 !important;
  color: rgba(255,255,255,.5) !important;
}


/* ═══════════════════════════════════════════════════════════
   SUPORTE
   ═══════════════════════════════════════════════════════════ */
.cp-onb-support {
  background: var(--cp-white);
  padding: 56px 24px !important;
  border-bottom: 1px solid var(--cp-border);
  width: 100vw;
  margin-left: calc(-50vw + 50%);
}
.cp-onb-support-inner {
  max-width: var(--cp-onb-max);
  margin: 0 auto !important;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}
.cp-onb-support-text h2 {
  font-size: 22px;
  font-weight: 800 !important;
  margin-bottom: 6px !important;
  color: var(--cp-text) !important;
}
.cp-onb-support-text p {
  font-size: 14px;
  color: var(--cp-text-body) !important;
  margin: 0 !important;
  padding: 0 !important;
}


/* ═══════════════════════════════════════════════════════════
   RODAPÉ — resumo final
   ═══════════════════════════════════════════════════════════ */
.cp-onb-footer {
  color: #fff !important;
  padding: 72px 24px !important;
  text-align: center;
  position: relative;
  overflow: hidden;
  width: 100vw;
  margin-left: calc(-50vw + 50%);
}
.cp-onb-footer--green {
  background: linear-gradient(165deg, #1a3a2a 0%, #2e7d5e 50%, #4A996A 100%);
}
.cp-onb-footer--blue {
  background: linear-gradient(165deg, #1a2a3d 0%, #2d4a6d 40%, #56769D 100%);
}
.cp-onb-footer--navy {
  background: linear-gradient(165deg, #000010 0%, var(--cp-onb-navy) 40%, #060660 100%);
}
.cp-onb-footer--navy::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(255,255,255,.01) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.01) 1px, transparent 1px);
  background-size: 60px 60px;
  pointer-events: none;
}
.cp-onb-footer h2 {
  font-size: 28px;
  font-weight: 800 !important;
  margin-bottom: 36px !important;
  letter-spacing: -.5px;
  color: #fff !important;
  position: relative;
  z-index: 1;
}
.cp-onb-footer-actions {
  display: flex;
  justify-content: center;
  gap: 14px;
  flex-wrap: wrap;
  max-width: 750px;
  margin: 0 auto !important;
  position: relative;
  z-index: 1;
}
.cp-onb-footer-action {
  display: flex;
  align-items: center;
  gap: 10px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 10px;
  padding: 16px 22px !important;
  color: #fff !important;
  text-decoration: none !important;
  font-size: 14px;
  font-weight: 600 !important;
  transition: all .25s;
  flex: 1;
  min-width: 180px;
  justify-content: center;
}
.cp-onb-footer-action i {
  font-size: 16px;
  color: var(--cp-onb-gold) !important;
}
.cp-onb-footer-motto {
  margin-top: 32px !important;
  padding: 0 !important;
  line-height: 1.5 !important;
  font-size: 14px;
  font-weight: 400 !important;
  color: rgba(255,255,255,.45) !important;
  position: relative;
  z-index: 1;
}


/* ───── login status (abaixo dos steps) ───── */
.cp-onb-login-status {
  width: 100vw;
  margin-left: calc(-50vw + 50%);
  padding: 0 24px !important;
  margin-top: -32px !important;
  margin-bottom: 16px !important;
}
.cp-onb-login-status-inner {
  max-width: var(--cp-onb-max);
  margin: 0 auto !important;
  border-radius: 10px;
  padding: 18px 24px !important;
  display: flex;
  align-items: center;
  gap: 12px;
}
.cp-onb-login-status--ok .cp-onb-login-status-inner {
  background: var(--cp-onb-green-bg);
  border: 1.5px solid var(--cp-onb-green-border);
  justify-content: center;
  max-width: 480px;
  margin: 0 auto !important;
  padding: 14px 24px !important;
}
.cp-onb-login-status--ok .cp-onb-login-status-inner > i {
  color: var(--cp-onb-green) !important;
  font-size: 16px;
  flex-shrink: 0;
}
.cp-onb-login-status--ok .cp-onb-login-status-inner > span {
  font-size: 13px;
  color: #2e6b47 !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
}
.cp-onb-login-status--action .cp-onb-login-status-inner {
  background: var(--cp-onb-gold-bg);
  border: 1.5px solid var(--cp-onb-gold-border);
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 10px;
  padding: 20px 24px !important;
  max-width: 520px;
  margin: 0 auto !important;
}
.cp-onb-login-status-icon {
  display: none;
}
.cp-onb-login-status-msg {
  font-size: 14px;
  color: var(--cp-preto) !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
}
a.cp-onb-login-status-help,
a.cp-onb-login-status-help:visited {
  font-size: 13px;
  color: #8a7030 !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  line-height: 1.5 !important;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
a.cp-onb-login-status-help:hover {
  color: var(--cp-onb-gold-dark) !important;
  text-decoration: underline !important;
}


/* ═══════════════════════════════════════════════════════════
   RESPONSIVO
   ═══════════════════════════════════════════════════════════ */
@media (max-width: 900px) {
  .cp-onb-steps-grid { grid-template-columns: repeat(2, 1fr); }
  .cp-onb-step::after { display: none; }
  .cp-onb-features-grid,
  .cp-onb-ia-cols,
  .cp-onb-ias-grid { grid-template-columns: repeat(2, 1fr); }
  .cp-onb-highlight-row,
  .cp-onb-highlight-row--reverse { flex-direction: column; text-align: center; }
  .cp-onb-highlight-visual { flex: none; }
  .cp-onb-highlight p { max-width: 100%; }
  .cp-onb-highlight-list { display: inline-block; text-align: left; }
  .cp-onb-microtip { justify-content: center; }
}

@media (max-width: 600px) {
  .cp-onb-hero { padding: 60px 20px 52px !important; }
  .cp-onb-hero h1 { font-size: 30px !important; }
  .cp-onb-hero-sub { font-size: 16px; }
  .cp-onb-steps-grid,
  .cp-onb-features-grid,
  .cp-onb-ia-cols,
  .cp-onb-ias-grid,
  .cp-onb-routine-grid { grid-template-columns: 1fr; }
  .cp-onb-support-inner { flex-direction: column; text-align: center; }
  .cp-onb-footer-actions { flex-direction: column; }
  .cp-onb-section-title { font-size: 22px !important; }
  .cp-onb-consultoria h2 { font-size: 24px !important; }
  .cp-onb-login-status { padding: 0 16px !important; }
  .cp-onb-login-status-inner { padding: 16px !important; }
  .cp-onb-login-status-actions { flex-direction: column; align-items: flex-start; }
}
