/* ========================================
   CPS Affiliation Landing Page — Premium
   Scoped: .cps-container .cps-affiliation
   Tokens: CPS Design System v3
   Invariant: !important on all visual props
   Uses DS: .cps-hero, .cps-pattern-dots,
   .cps-pattern-gradient, .cps-glass, .cps-stat-card,
   .cps-card--hero, .cps-divider
   ======================================== */

/* --- Tier 3: Component Tokens (Affiliation) --- */
.cps-affiliation {
  --cps-aff-hero-min-h: 460px;
  --cps-aff-content-max-w: 560px;
  --cps-aff-subtitle-max-w: 640px;
  --cps-aff-section-max-w: 1100px;
  --cps-aff-plans-max-w: 1500px;
  --cps-aff-text-soft: color-mix(in srgb, var(--cps-text-on-dark) 90%, transparent);
  --cps-aff-text-softer: color-mix(in srgb, var(--cps-text-on-dark) 80%, transparent);
  --cps-aff-leading-body: 1.6;
}

/* --- Base Layout --- */
/*
 * .cps-affiliation is intentionally NOT wrapped in .cps-container
 * so full-width sections can expand edge-to-edge without any vw tricks.
 * Contained sections manage their own max-width centering via .cps-aff-section.
 */
.cps-affiliation {
  width: 100% !important;
  display: block !important;
}

/* Dividers contained */
.cps-affiliation > .cps-divider {
  max-width: var(--cps-aff-section-max-w) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: var(--cps-space-lg) !important;
  padding-right: var(--cps-space-lg) !important;
}

/* Full-width sections: naturally 100% of the page column */
.cps-aff-section--fullwidth {
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Inner wrapper to center content inside full-width sections */
.cps-aff-section__inner {
  max-width: var(--cps-aff-section-max-w) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: var(--cps-space-lg) !important;
  padding-right: var(--cps-space-lg) !important;
}

/* Contained sections: centered column */
.cps-aff-section {
  padding: var(--cps-space-3xl) var(--cps-space-lg) !important;
  max-width: var(--cps-aff-section-max-w) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Plans section is wider to accommodate 5 cards */
.cps-aff-section#planos {
  max-width: var(--cps-aff-plans-max-w) !important;
}

/* Full-width sections reset horizontal padding (inner handles it) */
.cps-aff-section.cps-aff-section--fullwidth {
  max-width: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.cps-aff-section--alt {
  background: var(--cps-surface-chrome) !important;
  border-radius: var(--cps-radius-lg) !important;
}

.cps-aff-section--tinted {
  background: var(--cps-surface-tinted) !important;
  border-radius: var(--cps-radius-lg) !important;
}


.cps-aff-section__heading {
  text-align: center !important;
  margin-bottom: var(--cps-space-sm) !important;
}

.cps-aff-section__subtitle {
  text-align: center !important;
  max-width: var(--cps-aff-subtitle-max-w) !important;
  margin: 0 auto var(--cps-space-xl) !important;
}

/* --- Hero (extends DS .cps-hero) --- */
@keyframes cps-aff-fade-up {
  from { opacity: 0; transform: translateY(24px); }
  to   { opacity: 1; transform: translateY(0); }
}

.cps-aff-hero {
  position: relative !important;
  min-height: var(--cps-aff-hero-min-h) !important;
  display: flex !important;
  align-items: center !important;
  margin-bottom: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background-size: cover !important;
  background-position: center top !important;
  background-repeat: no-repeat !important;
}

/* Hero entrance animation — staggered children */
.cps-aff-hero__content > * {
  animation: cps-aff-fade-up 0.65s cubic-bezier(.22,1,.36,1) both !important;
}
.cps-aff-hero__content > :nth-child(1) { animation-delay: 0.05s !important; }
.cps-aff-hero__content > :nth-child(2) { animation-delay: 0.15s !important; }
.cps-aff-hero__content > :nth-child(3) { animation-delay: 0.25s !important; }
.cps-aff-hero__content > :nth-child(4) { animation-delay: 0.35s !important; }

.cps-aff-hero__overlay {
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  background:
    linear-gradient(
      120deg,
      color-mix(in srgb, var(--cps-navy-500) 96%, var(--cps-black)) 0%,
      color-mix(in srgb, var(--cps-navy-500) 88%, var(--cps-black)) 30%,
      color-mix(in srgb, var(--cps-navy-500) 65%, transparent) 58%,
      color-mix(in srgb, var(--cps-navy-500) 30%, transparent) 78%,
      transparent 100%
    ),
    linear-gradient(
      to bottom,
      transparent 40%,
      color-mix(in srgb, var(--cps-navy-500) 55%, transparent) 100%
    ) !important;
  pointer-events: none !important;
}

/* Inner centering wrapper — mirrors cps-aff-section__inner */
.cps-aff-hero__inner {
  position: relative !important;
  z-index: 2 !important;
  width: 100% !important;
  max-width: var(--cps-aff-section-max-w) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: var(--cps-space-lg) !important;
  padding-right: var(--cps-space-lg) !important;
  box-sizing: border-box !important;
}

.cps-aff-hero__content {
  position: relative !important;
  width: 100% !important;
  max-width: var(--cps-aff-content-max-w) !important;
  padding: var(--cps-space-3xl) 0 !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  gap: var(--cps-space-md) !important;
  box-sizing: border-box !important;
}

/* Hero tag — solid teal, white text, visível no dark bg */
.cps-aff-hero .cps-tag {
  background: var(--cps-teal-500) !important;
  color: var(--cps-white) !important;
  border-color: transparent !important;
  align-self: flex-start !important;
  display: inline-flex !important;
  width: auto !important;
  max-width: fit-content !important;
}

.cps-aff-hero__title {
  font-size: var(--cps-text-4xl) !important;
  font-weight: 300 !important;
  color: var(--cps-text-on-dark) !important;
  margin-bottom: 0 !important;
}

.cps-aff-hero__subtitle {
  font-size: var(--cps-text-lg) !important;
  color: var(--cps-aff-text-soft) !important;
  line-height: var(--cps-aff-leading-body) !important;
  margin-bottom: 0 !important;
}

.cps-aff-hero__actions {
  display: flex !important;
  gap: var(--cps-space-sm) !important;
  align-items: center !important;
  margin-top: var(--cps-space-sm) !important;
}

.cps-aff-hero__cta {
  display: inline-flex !important;
  align-items: center !important;
  gap: var(--cps-space-xs) !important;
}

.cps-aff-hero__cta-secondary {
  color: var(--cps-text-on-dark) !important;
  border-color: color-mix(in srgb, var(--cps-text-on-dark) 40%, transparent) !important;
}

.cps-aff-hero__cta-secondary:hover {
  background: color-mix(in srgb, var(--cps-text-on-dark) 10%, transparent) !important;
  border-color: var(--cps-text-on-dark) !important;
}


/* --- Stats Bar --- */
.cps-aff-stats {
  position: relative !important;
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  padding: var(--cps-space-3xl) var(--cps-space-lg) !important;
  margin-top: 0 !important;
  border-radius: 0 !important;
  overflow: hidden !important;
}

.cps-aff-stats__overlay {
  position: absolute !important;
  inset: 0 !important;
  background: linear-gradient(135deg,
    color-mix(in srgb, var(--cps-navy-500) 88%, transparent),
    color-mix(in srgb, var(--cps-navy-500) 75%, var(--cps-accent))) !important;
  z-index: 0 !important;
}

.cps-aff-stats__content {
  position: relative !important;
  z-index: 1 !important;
}

.cps-aff-stat {
  border-top-style: none !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: var(--cps-space-xs) !important;
  background: transparent !important;
  box-shadow: none !important;
  border-style: none !important;
  padding: var(--cps-space-md) !important;
}

.cps-aff-stat .cps-stat-card__value {
  color: var(--cps-text-on-dark) !important;
  font-size: var(--cps-text-3xl) !important;
}

.cps-aff-stat .cps-stat-card__label {
  color: var(--cps-aff-text-soft) !important;
}

.cps-aff-stat__icon {
  color: var(--cps-white) !important;
  margin-bottom: var(--cps-space-sm) !important;
  background: color-mix(in srgb, var(--cps-white) 15%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--cps-white) 30%, transparent) !important;
  border-radius: 50% !important;
  padding: var(--cps-space-sm) !important;
  width: 48px !important;
  height: 48px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: var(--cps-radius-full) !important;
}

/* --- Meaning Section (image + text) --- */
.cps-aff-meaning {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: var(--cps-space-2xl) !important;
  align-items: center !important;
}

.cps-aff-meaning__media {
  border-radius: var(--cps-radius-lg) !important;
  overflow: hidden !important;
}

.cps-aff-meaning__image {
  width: 100% !important;
  height: auto !important;
  display: block !important;
  border-radius: var(--cps-radius-lg) !important;
}

.cps-aff-meaning__label {
  display: flex !important;
  align-items: center !important;
  gap: var(--cps-space-xs) !important;
  color: var(--cps-accent) !important;
  margin-bottom: var(--cps-space-sm) !important;
}

.cps-aff-meaning__content .cps-t-lead {
  color: var(--cps-text-heading) !important;
  margin-bottom: var(--cps-space-md) !important;
}

/* Microcopy de garantia (meaning_hint) é um PARÁGRAFO, não uma legenda: a classe
   base .cps-t-hint (--cps-text-xs, 10px) é pequena demais para leitura corrida.
   Sobe para --cps-text-sm (13px) com respiro de linha, sem tocar no markup
   (compartilhado com afiliacao-v2 → paridade byte-idêntica preservada). */
.cps-aff-meaning__content .cps-t-hint {
  font-size: var(--cps-text-sm) !important;
  line-height: 1.6 !important;
  margin-top: var(--cps-space-sm) !important;
}

/* --- Flow Section (full-width photo background) --- */
.cps-aff-flow-section {
  position: relative !important;
  overflow: hidden !important;
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  border-radius: 0 !important;
  padding: var(--cps-space-3xl) 0 !important;
}

.cps-aff-flow-section__overlay {
  position: absolute !important;
  inset: 0 !important;
  background: linear-gradient(180deg,
    color-mix(in srgb, var(--cps-navy-500) 80%, transparent),
    color-mix(in srgb, var(--cps-navy-500) 70%, transparent) 40%,
    color-mix(in srgb, var(--cps-navy-500) 85%, transparent)) !important;
  z-index: 0 !important;
}

.cps-aff-flow-section .cps-aff-section__heading {
  color: var(--cps-text-on-dark) !important;
}

.cps-aff-flow-section .cps-aff-section__subtitle {
  color: var(--cps-aff-text-soft) !important;
}

.cps-aff-flow-section__content {
  position: relative !important;
  z-index: 1 !important;
}

.cps-aff-flow {
  display: flex !important;
  /* stretch → todos os passos ficam com a altura do maior (normaliza os cards). */
  align-items: stretch !important;
  justify-content: center !important;
  gap: 0 !important;
  position: relative !important;
  z-index: 1 !important;
}

.cps-aff-step {
  text-align: left !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: var(--cps-space-sm) !important;
  flex: 1 !important;
  transition: transform var(--cps-transition-normal) !important;
  background: var(--cps-surface-frosted) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
}

.cps-aff-flow-section .cps-aff-step__connector {
  color: var(--cps-text-on-dark) !important;
}

.cps-aff-step:hover {
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--cps-accent) 30%, transparent),
              0 6px 20px color-mix(in srgb, var(--cps-navy-500) 20%, transparent) !important;
  border-color: color-mix(in srgb, var(--cps-accent) 35%, transparent) !important;
}

/* Step top row: number badge left, icon right */
.cps-aff-step__top {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: 100% !important;
  margin-bottom: var(--cps-space-sm) !important;
}

.cps-aff-step__number {
  font-size: var(--cps-text-lg) !important;
  width: var(--cps-space-xl) !important;
  height: var(--cps-space-xl) !important;
  flex-shrink: 0 !important;
}

.cps-aff-step__icon {
  color: var(--cps-accent) !important;
  margin-top: 0 !important;
}

.cps-aff-step__connector {
  display: flex !important;
  align-items: center !important;
  color: var(--cps-accent) !important;
  padding-top: var(--cps-space-3xl) !important;
  flex-shrink: 0 !important;
  padding-left: var(--cps-space-sm) !important;
  padding-right: var(--cps-space-sm) !important;
}

/* --- Profile Filter Tabs (plans section) --- */
.cps-aff-type-tabs {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  gap: var(--cps-space-xs) !important;
  margin-bottom: var(--cps-space-xl) !important;
}

.cps-aff-type-tabs .cps-btn {
  font-size: var(--cps-text-sm) !important;
  white-space: nowrap !important;
}

/* --- Plan Cards --- */
/* Plans grid — fixed-width columns, centered; hidden wrappers collapse */
.cps-aff-plans {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 260px)) !important;
  justify-content: center !important;
  gap: var(--cps-space-md) !important;
  /* Normaliza a altura dos cards de plano: itens da grade esticam à altura da linha
     e o card (flex column, height:100%) alinha preço/benefícios/ações no rodapé. */
  align-items: stretch !important;
  margin-top: var(--cps-space-lg) !important;
  max-width: var(--cps-aff-plans-max-w) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  width: 100% !important;
}

/* Plan wrap — proper grid item */
.cps-aff-plan-wrap {
  display: block !important;
  min-width: 0 !important;
  height: 100% !important;
}

.cps-aff-plan-wrap .cps-aff-plan-card {
  width: 100% !important;
  box-sizing: border-box !important;
}

.cps-aff-plan-card {
  font-family: var(--cps-font-body, 'Outfit', sans-serif) !important;
  text-align: left !important;
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  padding: var(--cps-space-lg) var(--cps-space-md) !important;
  height: 100% !important;
  transition: transform var(--cps-transition-normal),
              box-shadow var(--cps-transition-normal) !important;
}

.cps-aff-plan-card:hover {
  border-color: var(--cps-teal-500) !important;
}

/* Badge sits inline next to the icon — no absolute positioning */
.cps-aff-plan-card__badge {
  flex-shrink: 0 !important;
}

/* Force Outfit across all affiliation text — override Elementor Poppins */
.cps-affiliation,
.cps-affiliation h1,
.cps-affiliation h2,
.cps-affiliation h3,
.cps-affiliation h4,
.cps-affiliation h5,
.cps-affiliation p,
.cps-affiliation span,
.cps-affiliation li,
.cps-affiliation a,
.cps-affiliation button {
  font-family: var(--cps-font-body, 'Outfit', sans-serif) !important;
}

/* Icon row: icon + badge side by side */
.cps-aff-plan-card__icon-row {
  display: flex !important;
  align-items: center !important;
  gap: var(--cps-space-sm) !important;
  margin-bottom: var(--cps-space-sm) !important;
  width: 100% !important;
}

/* All plan icons → teal */
.cps-aff-plan-card__icon {
  color: var(--cps-accent) !important;
  flex-shrink: 0 !important;
}

.cps-aff-plan-card__title {
  font-family: var(--cps-font-body, 'Outfit', sans-serif) !important;
  margin-bottom: var(--cps-space-xs) !important;
}

/* Price block — horizontal: R$ 190 /ano */
.cps-aff-plan-card__price {
  display: flex !important;
  flex-direction: row !important;
  align-items: baseline !important;
  gap: var(--cps-space-2xs) !important;
  margin: var(--cps-space-md) 0 !important;
  padding: var(--cps-space-sm) 0 !important;
  background: none !important;
  border-radius: 0 !important;
  border-bottom-style: solid !important;
  border-bottom-width: var(--cps-border-thin) !important;
  border-bottom-color: var(--cps-line-subtle) !important;
  width: 100% !important;
  line-height: 1 !important;
}

.cps-aff-plan-card__currency {
  font-size: var(--cps-text-sm) !important;
  color: var(--cps-accent) !important;
  align-self: flex-start !important;
  padding-top: 4px !important;
}

.cps-aff-plan-card__amount {
  font-weight: 400 !important;
  color: var(--cps-accent) !important;
  line-height: 1 !important;
  margin: 0 !important;
}

.cps-aff-plan-card__period {
  color: var(--cps-text-muted) !important;
  align-self: flex-end !important;
  padding-bottom: 4px !important;
  letter-spacing: 0.08em !important;
}

.cps-aff-plan-card__price-free {
  color: var(--cps-text-muted) !important;
  letter-spacing: 0.08em !important;
}

.cps-aff-plan-card__price--centered {
  justify-content: center !important;
  min-height: 2.4em !important;
  align-items: center !important;
}

/* Plan card action buttons */
.cps-aff-plan-card__actions {
  display: flex !important;
  flex-direction: column !important;
  gap: var(--cps-space-xs) !important;
  width: 100% !important;
  margin-top: auto !important;
  align-items: flex-start !important;
}

.cps-aff-plan-card__actions .cps-btn--primary,
.cps-aff-plan-card__actions .cps-btn--secondary {
  width: 100% !important;
  justify-content: center !important;
}

.cps-aff-plan-card__profile {
  font-family: var(--cps-font-body, 'Outfit', sans-serif) !important;
  font-weight: 300 !important;
  font-size: var(--cps-text-sm) !important;
  line-height: 1.6 !important;
  color: var(--cps-text-secondary) !important;
  text-align: left !important;
  hyphens: auto !important;
  -webkit-hyphens: auto !important;
  hyphenate-limit-chars: 6 3 3 !important;
  overflow-wrap: break-word !important;
  word-break: normal !important;
  /* NÃO esticar a descrição: o preço fica logo abaixo do texto (sem vão morto).
     A normalização de altura vem da grade (align-items:stretch) + botões no rodapé
     via .cps-aff-plan-card__actions { margin-top:auto }. */
  flex-grow: 0 !important;
  margin-bottom: var(--cps-space-sm) !important;
}

/* Plan card benefits checklist */
.cps-aff-plan-card__benefits {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 0 var(--cps-space-md) !important;
  text-align: left !important;
  width: 100% !important;
}

.cps-aff-plan-card__benefits li {
  display: flex !important;
  align-items: center !important;
  gap: var(--cps-space-xs) !important;
  padding: var(--cps-space-2xs) 0 !important;
  font-size: var(--cps-text-sm) !important;
  color: var(--cps-text-body) !important;
  border-bottom-style: solid !important;
  border-bottom-width: var(--cps-border-thin) !important;
  border-bottom-color: var(--cps-line-subtle) !important;
}

.cps-aff-plan-card__benefits li:last-child {
  border-bottom: none !important;
}

.cps-aff-plan-card__benefits .cps-icon {
  color: var(--cps-accent) !important;
  flex-shrink: 0 !important;
}

/* All plan card icons use teal — see .cps-aff-plan-card__icon above */

/* --- Featured Benefit (image + text alternating rows) --- */
.cps-aff-benefit-featured {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: var(--cps-space-2xl) !important;
  align-items: center !important;
  margin-bottom: var(--cps-space-2xl) !important;
}

.cps-aff-benefit-featured--reverse {
  direction: rtl !important;
}

.cps-aff-benefit-featured--reverse > * {
  direction: ltr !important;
}

.cps-aff-benefit-featured__image {
  border-radius: var(--cps-radius-lg) !important;
  overflow: hidden !important;
  box-shadow: var(--cps-shadow-lg) !important;
  max-height: 360px !important;
}

.cps-aff-benefit-featured__content {
  display: flex !important;
  flex-direction: column !important;
  gap: var(--cps-space-md) !important;
  padding: var(--cps-space-xl) var(--cps-space-lg) !important;
}

.cps-aff-benefit-compact-grid {
  margin-top: var(--cps-space-xl) !important;
}

/* Benefits section — navy gradient background with SVG network overlay */
#beneficios.cps-aff-section {
  background:
    url('../img/aff-hero-network.svg') center / 900px auto no-repeat,
    linear-gradient(160deg,
      color-mix(in srgb, var(--cps-navy-500) 95%, var(--cps-black)),
      color-mix(in srgb, var(--cps-navy-500) 78%, var(--cps-accent))) !important;
  border-radius: 0 !important;
  padding-top: var(--cps-space-3xl) !important;
  padding-bottom: var(--cps-space-3xl) !important;
  max-width: none !important;
  padding-left: var(--cps-space-2xl) !important;
  padding-right: var(--cps-space-2xl) !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  width: 100% !important;
}

#beneficios.cps-aff-section .cps-aff-section__heading {
  color: var(--cps-text-on-dark) !important;
}

#beneficios.cps-aff-section .cps-aff-section__subtitle {
  color: var(--cps-aff-text-soft) !important;
}

/* Benefits grid */
.cps-aff-benefits-grid {
  max-width: var(--cps-aff-section-max-w) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  margin-top: var(--cps-space-2xl) !important;
}

/* --- Benefit Cards — premium redesign --- */
.cps-aff-benefit-card {
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
  position: relative !important;
  background: color-mix(in srgb, var(--cps-black) 22%, color-mix(in srgb, var(--cps-navy-500) 60%, transparent)) !important;
  border-style: solid !important;
  border-width: var(--cps-border-thin) !important;
  border-color: color-mix(in srgb, var(--cps-text-on-dark) 18%, transparent) !important;
  border-radius: var(--cps-radius-lg) !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  transition: border-color var(--cps-transition-normal),
              box-shadow var(--cps-transition-normal),
              background var(--cps-transition-normal) !important;
}

.cps-aff-benefit-card:hover {
  background: color-mix(in srgb, var(--cps-black) 16%, color-mix(in srgb, var(--cps-navy-500) 55%, transparent)) !important;
  border-color: color-mix(in srgb, var(--cps-teal-500) 55%, transparent) !important;
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--cps-teal-500) 20%, transparent),
              0 8px 32px color-mix(in srgb, var(--cps-teal-500) 12%, transparent) !important;
}

/* Teal top accent bar */
.cps-aff-benefit-card::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 3px !important;
  background: var(--cps-teal-500) !important;
  border-radius: var(--cps-radius-lg) var(--cps-radius-lg) 0 0 !important;
  opacity: 0.6 !important;
  transition: opacity var(--cps-transition-normal) !important;
}

.cps-aff-benefit-card:hover::before {
  opacity: 1 !important;
}

/* Header: icon + title + tagline inline */
.cps-aff-benefit-card__header {
  display: flex !important;
  align-items: flex-start !important;
  gap: var(--cps-space-sm) !important;
  margin-bottom: var(--cps-space-md) !important;
}

.cps-aff-benefit-card__header-text {
  flex: 1 !important;
  min-width: 0 !important;
}

/* Icon wrap — translucent teal border, teal icon */
.cps-aff-benefit-card__icon-wrap {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 44px !important;
  height: 44px !important;
  border-radius: var(--cps-radius-md) !important;
  flex-shrink: 0 !important;
  background: color-mix(in srgb, var(--cps-teal-500) 18%, transparent) !important;
  border-style: solid !important;
  border-width: 1px !important;
  border-color: color-mix(in srgb, var(--cps-teal-500) 45%, transparent) !important;
  color: var(--cps-teal-500) !important;
}

/* Benefit sequence number */
.cps-aff-benefit-card__num {
  font-size: var(--cps-text-xs) !important;
  font-weight: 400 !important;
  color: color-mix(in srgb, var(--cps-text-on-dark) 35%, transparent) !important;
  letter-spacing: 0.05em !important;
  font-variant-numeric: tabular-nums !important;
  align-self: flex-start !important;
}

.cps-aff-benefit-card__title {
  font-size: var(--cps-text-md) !important;
  font-weight: 400 !important;
  color: var(--cps-text-on-dark) !important;
  margin: 0 0 2px !important;
  line-height: 1.3 !important;
}

.cps-aff-benefit-card__tagline {
  font-size: var(--cps-text-xs) !important;
  font-weight: 300 !important;
  color: var(--cps-teal-500) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.07em !important;
  opacity: 0.8 !important;
  display: block !important;
}

.cps-aff-benefit-card__badge {
  flex-shrink: 0 !important;
  align-self: flex-start !important;
}

/* Override tag colors inside benefit cards for legibility on dark bg */
.cps-aff-benefit-card .cps-tag--teal {
  background: var(--cps-teal-500) !important;
  color: var(--cps-white) !important;
  border-color: var(--cps-teal-500) !important;
  font-weight: 400 !important;
  opacity: 1 !important;
}

.cps-aff-benefit-card__desc {
  font-size: var(--cps-text-sm) !important;
  font-weight: 300 !important;
  color: var(--cps-aff-text-soft) !important;
  flex-grow: 1 !important;
  line-height: 1.55 !important;
}

/* Decorative accent line — hidden, replaced by ::before bar */
.cps-aff-benefit-card__accent-line {
  display: none !important;
}

.cps-aff-benefit-card__note {
  margin-top: var(--cps-space-sm) !important;
  padding-top: var(--cps-space-xs) !important;
  border-top-style: solid !important;
  border-top-width: var(--cps-border-thin) !important;
  border-top-color: color-mix(in srgb, var(--cps-text-on-dark) 15%, transparent) !important;
  color: var(--cps-aff-text-softer) !important;
  font-size: var(--cps-text-xs) !important;
}

/* --- Nota "Uso do nome" ao pé da grade de benefícios (revisão 2026-07-14) --- */
.cps-aff-benefits__note {
  margin-top: var(--cps-space-lg) !important;
  margin-right: auto !important;
  margin-left: auto !important;
  max-width: 62ch !important;
  text-align: center !important;
  color: var(--cps-aff-text-softer) !important;
  font-size: var(--cps-text-sm) !important;
  line-height: 1.6 !important;
}
.cps-aff-benefits__note .cps-link {
  color: inherit !important;
  text-decoration: underline !important;
}

/* --- Benefit card — no padding, overflow hidden (like tool cards) --- */
.cps-aff-benefit-card {
  padding: 0 !important;
  overflow: hidden !important;
}

/* --- Benefit card illustration --- */
.cps-aff-benefit-card__illustration {
  width: 100% !important;
  display: block !important;
  overflow: hidden !important;
  line-height: 0 !important;
}
.cps-aff-benefit-card__illustration img {
  width: 100% !important;
  height: auto !important;
  display: block !important;
}

/* --- Benefit card body (padded content area) --- */
.cps-aff-benefit-card__body {
  display: flex !important;
  flex-direction: column !important;
  gap: var(--cps-space-md) !important;
  padding: var(--cps-space-xl) var(--cps-space-lg) !important;
  flex: 1 !important;
}

/* --- Benefit plan chips --- */
.cps-aff-benefit-card__plans {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 6px !important;
  margin-top: auto !important;
  padding-top: var(--cps-space-md) !important;
  border-top-style: solid !important;
  border-top-width: 1px !important;
  border-top-color: color-mix(in srgb, var(--cps-text-on-dark) 12%, transparent) !important;
}
.cps-aff-benefit-plan-chip {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 28px !important;
  height: 28px !important;
  border-radius: 50% !important;
  background: color-mix(in srgb, var(--cps-teal-500) 18%, transparent) !important;
  border-style: solid !important;
  border-width: 1px !important;
  border-color: color-mix(in srgb, var(--cps-teal-500) 35%, transparent) !important;
  color: var(--cps-teal-500) !important;
  cursor: default !important;
  flex-shrink: 0 !important;
}
.cps-aff-benefit-plan-chip svg {
  width: 14px !important;
  height: 14px !important;
  flex-shrink: 0 !important;
}

/* --- Tool Cards (with illustration) --- */
.cps-aff-tool-card {
  border-left-style: solid !important;
  border-left-width: var(--cps-border-accent) !important;
  border-left-color: var(--cps-accent) !important;
  padding: 0 !important;
  overflow: hidden !important;
}

.cps-aff-tool-card__illustration {
  width: 100% !important;
  overflow: hidden !important;
}

.cps-aff-tool-card__illustration img {
  width: 100% !important;
  height: auto !important;
  display: block !important;
}

.cps-aff-tool-card__body {
  padding: var(--cps-space-lg) !important;
}

.cps-aff-tool-card__header {
  display: flex !important;
  align-items: center !important;
  gap: var(--cps-space-md) !important;
  margin-bottom: var(--cps-space-sm) !important;
}

.cps-aff-tool-card__icon {
  color: var(--cps-accent) !important;
  flex-shrink: 0 !important;
  padding: var(--cps-space-sm) !important;
  background: var(--cps-accent-bg) !important;
  border-radius: var(--cps-radius-sm) !important;
}

/* --- Policy Card --- */
.cps-aff-policy-card {
  border-left-style: solid !important;
  border-left-width: var(--cps-border-accent) !important;
  border-left-color: var(--cps-accent) !important;
  background: var(--cps-surface-tinted) !important;
  display: flex !important;
  gap: var(--cps-space-lg) !important;
  align-items: flex-start !important;
}

.cps-aff-policy-card__icon {
  color: var(--cps-accent) !important;
  flex-shrink: 0 !important;
  padding: var(--cps-space-sm) !important;
  background: var(--cps-accent-bg) !important;
  border-radius: var(--cps-radius-sm) !important;
}

/* --- Pleno Card --- */
.cps-aff-pleno-card {
  display: flex !important;
  flex-direction: column !important;
  gap: var(--cps-space-md) !important;
}

.cps-aff-pleno-card__header {
  display: flex !important;
  align-items: center !important;
  gap: var(--cps-space-md) !important;
  color: var(--cps-accent) !important;
}

.cps-aff-pleno-card__header .cps-t-h3 {
  margin-bottom: 0 !important;
  color: var(--cps-text-heading) !important;
}

.cps-aff-pleno-card__details {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: var(--cps-space-md) !important;
  padding-top: var(--cps-space-sm) !important;
  border-top-style: solid !important;
  border-top-width: var(--cps-border-thin) !important;
  border-top-color: var(--cps-line-subtle) !important;
}

/* --- Guidance Section (white background) --- */
.cps-aff-guidance-section {
  position: relative !important;
  background: var(--cps-surface-base) !important;
  border-radius: 0 !important;
  padding: var(--cps-space-3xl) var(--cps-space-lg) !important;
}

.cps-aff-guidance-section__overlay {
  display: none !important;
}

.cps-aff-guidance-section__content {
  position: relative !important;
  z-index: 1 !important;
}

/* Seção "Qual é o seu perfil?" / "Qual o perfil da sua instituição?" usa a MESMA
   largura da seção de planos (o inner do DS limita a 1100px; os planos vão a 1500px). */
.cps-aff-guidance-section .cps-aff-section__inner {
  max-width: var(--cps-aff-plans-max-w) !important;
}

.cps-aff-guidance-section .cps-aff-section__heading {
  color: var(--cps-text-heading) !important;
}

.cps-aff-guidance-section .cps-aff-section__subtitle {
  color: var(--cps-text-body) !important;
}

.cps-aff-guidance__cards {
  width: 100% !important;
  /* Mesma grade dos planos: as 5 categorias numa única linha, largura ampliada e
     centralizada (mesma margem lateral) — em vez de 4+1 com um card órfão embaixo. */
  max-width: var(--cps-aff-plans-max-w) !important;
  grid-template-columns: repeat(5, minmax(0, 260px)) !important;
  justify-content: center !important;
  align-items: stretch !important;
  margin: var(--cps-space-xl) auto 0 !important;
}

.cps-aff-guidance__card {
  display: flex !important;
  flex-direction: column !important;
  gap: var(--cps-space-sm) !important;
  padding: var(--cps-space-lg) !important;
  text-align: center !important;
  align-items: center !important;
  /* Normaliza a altura pelo maior card da linha. */
  height: 100% !important;
  background: var(--cps-surface-card) !important;
  border-color: var(--cps-line-subtle) !important;
  transition: border-color var(--cps-transition-fast) !important;
}

/* Link "Ver categoria" ancorado no rodapé: os cards ficam do mesmo tamanho sem o vão
   vazio entre o texto e o link (o espaço extra distribui-se acima do link, não abaixo). */
.cps-aff-guidance__card .cps-link {
  margin-top: auto !important;
}

.cps-aff-guidance__card:hover {
  border-color: var(--cps-teal-500) !important;
}

.cps-aff-guidance__card .cps-t-body {
  color: var(--cps-text-body) !important;
}

.cps-aff-guidance__card .cps-t-h5 {
  color: var(--cps-text-heading) !important;
}

.cps-aff-guidance__card .cps-link {
  color: var(--cps-accent) !important;
}

.cps-aff-guidance__card-icon {
  color: var(--cps-accent) !important;
  padding: var(--cps-space-sm) !important;
  background: var(--cps-accent-bg) !important;
  border-radius: var(--cps-radius-full) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* --- Pleno Body Layout --- */
.cps-aff-pleno-card__body {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: var(--cps-space-lg) !important;
  align-items: center !important;
}

.cps-aff-pleno-card__illustration {
  max-width: 320px !important;
  justify-self: center !important;
}

.cps-aff-pleno-card__illustration img {
  width: 100% !important;
  height: auto !important;
  display: block !important;
}

/* --- CTA Final (extends DS .cps-hero) --- */
.cps-aff-cta-final {
  text-align: center !important;
  margin-top: var(--cps-space-xl) !important;
  border-radius: 0 !important;
  /* Fundo navy FORÇADO (R11): o .cps-hero/.cps-pattern-gradient do DS não têm !important,
     então o tema/Elementor conseguia zerar o fundo e deixar a foto da página vazar por trás
     do texto. Forçar aqui garante a faixa escura e o contraste do texto. */
  background-color: var(--cps-navy-500) !important;
  background-image: linear-gradient(135deg,
    var(--cps-navy-600) 0%,
    var(--cps-navy-500) 50%,
    var(--cps-navy-700) 100%) !important;
  overflow: hidden !important;
}

/* Overlay = scrim de cor sobre o fundo (dots do DS + véu navy p/ legibilidade garantida). */
.cps-aff-cta-final__overlay {
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  background:
    radial-gradient(circle, color-mix(in srgb, var(--cps-white) 8%, transparent) 1px, transparent 1px) 0 0 / 20px 20px,
    linear-gradient(135deg,
      color-mix(in srgb, var(--cps-navy-700) 60%, transparent),
      color-mix(in srgb, var(--cps-navy-500) 40%, transparent)) !important;
}

.cps-aff-cta-final__content {
  position: relative !important;
  z-index: 1 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: var(--cps-space-lg) !important;
}

.cps-aff-cta-final__heading {
  color: var(--cps-text-on-dark) !important;
  margin-bottom: 0 !important;
}

.cps-aff-cta-final__note {
  color: var(--cps-aff-text-softer) !important;
}

/* --- Plan Card Modal --- */
.cps-aff-modal {
  position: fixed !important;
  inset: 0 !important;
  z-index: 99999 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: var(--cps-space-lg) !important;
}

.cps-aff-modal[hidden] {
  display: none !important;
}

.cps-aff-modal__backdrop {
  position: absolute !important;
  inset: 0 !important;
  background: color-mix(in srgb, var(--cps-navy-500) 70%, transparent) !important;
  backdrop-filter: blur(6px) !important;
  -webkit-backdrop-filter: blur(6px) !important;
  cursor: pointer !important;
}

.cps-aff-modal__dialog {
  position: relative !important;
  z-index: 1 !important;
  background: var(--cps-white) !important;
  border-radius: var(--cps-radius-lg) !important;
  box-shadow: var(--cps-shadow-xl) !important;
  width: 100% !important;
  max-width: 560px !important;
  max-height: 90vh !important;
  overflow-y: auto !important;
  display: flex !important;
  flex-direction: column !important;
}

/* Modal header band — teal accent strip */
.cps-aff-modal__header {
  display: flex !important;
  align-items: center !important;
  gap: var(--cps-space-md) !important;
  padding: var(--cps-space-lg) var(--cps-space-xl) !important;
  background: var(--cps-accent-bg) !important;
  border-bottom-style: solid !important;
  border-bottom-width: var(--cps-border-thin) !important;
  border-bottom-color: color-mix(in srgb, var(--cps-accent) 20%, transparent) !important;
  border-radius: var(--cps-radius-lg) var(--cps-radius-lg) 0 0 !important;
}

.cps-aff-modal__icon {
  color: var(--cps-accent) !important;
  flex-shrink: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.cps-aff-modal__header-text {
  display: flex !important;
  flex-direction: column !important;
  gap: var(--cps-space-2xs) !important;
  flex: 1 !important;
}

.cps-aff-modal__title {
  margin-bottom: 0 !important;
  color: var(--cps-text-heading) !important;
}

/* Modal body — force light-theme text on white bg */
.cps-aff-modal__body {
  padding: var(--cps-space-lg) var(--cps-space-xl) !important;
  display: flex !important;
  flex-direction: column !important;
  gap: var(--cps-space-md) !important;
}

.cps-aff-modal__body,
.cps-aff-modal__body .cps-t-body,
.cps-aff-modal__body .cps-t-label,
.cps-aff-modal__body li {
  color: var(--cps-text-body) !important;
  font-family: var(--cps-font-body) !important;
}

.cps-aff-modal__body .cps-aff-plan-card__benefits li {
  color: var(--cps-text-body) !important;
}

.cps-aff-modal__body .cps-aff-plan-card__benefits svg {
  color: var(--cps-accent) !important;
}

.cps-aff-modal__close {
  position: absolute !important;
  top: var(--cps-space-md) !important;
  right: var(--cps-space-md) !important;
  background: none !important;
  border-style: none !important;
  cursor: pointer !important;
  color: var(--cps-text-muted) !important;
  padding: var(--cps-space-xs) !important;
  border-radius: var(--cps-radius-sm) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: color var(--cps-transition-fast),
              background var(--cps-transition-fast) !important;
}

.cps-aff-modal__close:hover {
  color: var(--cps-text-body) !important;
  background: color-mix(in srgb, var(--cps-accent) 15%, transparent) !important;
}

.cps-aff-modal__profile {
  font-family: var(--cps-font-body, 'Outfit', sans-serif) !important;
  color: var(--cps-text-secondary) !important;
  hyphens: auto !important;
  -webkit-hyphens: auto !important;
  overflow-wrap: break-word !important;
}

.cps-aff-modal__benefits {
  border-top-style: solid !important;
  border-top-width: var(--cps-border-thin) !important;
  border-top-color: var(--cps-line-subtle) !important;
  padding-top: var(--cps-space-md) !important;
  display: flex !important;
  flex-direction: column !important;
  gap: var(--cps-space-sm) !important;
}

.cps-aff-modal__benefits .cps-t-label {
  display: block !important;
  color: var(--cps-text-muted) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  font-size: var(--cps-text-xs) !important;
  margin-bottom: var(--cps-space-xs) !important;
}

/* Modal footer with actions */
.cps-aff-modal__actions {
  display: flex !important;
  gap: var(--cps-space-sm) !important;
  padding: var(--cps-space-md) var(--cps-space-xl) var(--cps-space-lg) !important;
  border-top-style: solid !important;
  border-top-width: var(--cps-border-thin) !important;
  border-top-color: var(--cps-line-subtle) !important;
  background: var(--cps-surface-chrome) !important;
  border-radius: 0 0 var(--cps-radius-lg) var(--cps-radius-lg) !important;
}

.cps-aff-modal__actions .cps-btn {
  flex: 1 !important;
  justify-content: center !important;
}

/* --- Animation (respects reduced-motion) --- */
.cps-aff-section,
.cps-aff-hero,
.cps-aff-cta-final {
  opacity: 0 !important;
  transform: translateY(var(--cps-space-md)) !important;
  transition: opacity var(--cps-transition-slow),
              transform var(--cps-transition-slow) !important;
}

.cps-aff--visible {
  opacity: 1 !important;
  transform: translateY(0) !important;
}

.cps-aff-plan-card--featured.cps-aff--visible {
  transform: var(--cps-hover-scale) !important;
}

/* --- FAQ Section --- */
.cps-aff-faq__accordion {
  max-width: 780px !important;
  margin: 0 auto !important;
  border-style: solid !important;
  border-width: 1px !important;
  border-color: var(--cps-line-subtle) !important;
  border-radius: var(--cps-radius-md) !important;
  overflow: hidden !important;
}

.cps-aff-faq__accordion .cps-accordion__item {
  border-bottom-style: solid !important;
  border-bottom-width: 1px !important;
  border-bottom-color: var(--cps-line-subtle) !important;
  border-top: none !important;
  border-left: none !important;
  border-right: none !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.cps-aff-faq__accordion .cps-accordion__item:last-child {
  border-bottom: none !important;
}

.cps-aff-faq__accordion .cps-accordion__trigger {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  width: 100% !important;
  gap: var(--cps-space-sm) !important;
  padding: var(--cps-space-lg) var(--cps-space-xl) !important;
  background: transparent !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  cursor: pointer !important;
  text-align: left !important;
  color: var(--cps-text-heading) !important;
  font-family: var(--cps-font-body) !important;
  font-size: var(--cps-text-lg) !important;
  font-weight: 400 !important;
  line-height: 1.3 !important;
  transition: background var(--cps-transition-fast) !important;
}

.cps-aff-faq__accordion .cps-accordion__trigger:hover {
  background: var(--cps-surface-tinted) !important;
  color: var(--cps-text-heading) !important;
  border: none !important;
  box-shadow: none !important;
}

.cps-aff-faq__accordion .cps-accordion__trigger:focus,
.cps-aff-faq__accordion .cps-accordion__trigger:active,
.cps-aff-faq__accordion .cps-accordion__trigger:focus-visible {
  background: var(--cps-surface-tinted) !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
}

.cps-aff-faq__accordion .cps-accordion__trigger[aria-expanded="true"] {
  background: var(--cps-surface-card) !important;
  color: var(--cps-text-secondary) !important;
  border: none !important;
  box-shadow: none !important;
}

.cps-aff-faq__accordion .cps-accordion__chevron {
  display: inline-flex !important;
  flex-shrink: 0 !important;
  color: var(--cps-text-hint) !important;
  transition: transform var(--cps-transition-normal) !important;
  margin-top: 1px !important;
}

.cps-aff-faq__accordion .cps-accordion__trigger[aria-expanded="true"] .cps-accordion__chevron {
  transform: rotate(180deg) !important;
}

.cps-aff-faq__accordion .cps-accordion__content {
  max-height: 0 !important;
  overflow: hidden !important;
  transition: max-height var(--cps-transition-slow) !important;
  border: none !important;
  box-shadow: none !important;
}

.cps-aff-faq__accordion .cps-accordion__content[aria-hidden="false"] {
  max-height: 600px !important;
}

.cps-aff-faq__accordion .cps-accordion__body {
  padding: var(--cps-space-md) var(--cps-space-xl) var(--cps-space-lg) !important;
  border: none !important;
}

.cps-aff-faq__accordion .cps-accordion__body .cps-t-body {
  color: var(--cps-text-body) !important;
  line-height: 1.65 !important;
  font-size: var(--cps-text-md) !important;
}

.cps-aff-faq__label {
  display: inline-flex !important;
  align-items: flex-start !important;
  gap: var(--cps-space-xs) !important;
  flex: 1 1 auto !important;
  /* min-width:0 permite o item flex encolher abaixo do conteúdo; sem isso o
     texto não quebra linha e é cortado em telas estreitas (mobile). */
  min-width: 0 !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
  color: inherit !important;
}

/* Ícone da pergunta não deve encolher nem forçar corte do texto. */
.cps-aff-faq__label > svg {
  flex-shrink: 0 !important;
  margin-top: 2px !important;
}

@media (prefers-reduced-motion: reduce) {
  .cps-aff-hero__content > * {
    animation: none !important;
  }
  .cps-aff-section,
  .cps-aff-hero,
  .cps-aff-cta-final {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }

  .cps-aff-benefit-card,
  .cps-aff-step,
  .cps-aff-benefit-card__icon-wrap {
    transition: none !important;
  }

  .cps-aff-benefit-card:hover,
  .cps-aff-step:hover {
    transform: none !important;
  }
}

/* Stats bar com 2 números (ex.: institucional após revisão): centraliza e limita a largura
   para não esticar demais os dois cards. */
.cps-aff-stats .cps-grid--2col {
  max-width: 640px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* --- Responsive --- */
@media (max-width: 1024px) {
  /* Plans + guidance cards: 3 columns on tablet (mesma grade) */
  .cps-aff-plans,
  .cps-aff-guidance__cards {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  .cps-aff-stats .cps-grid--4col,
  .cps-aff-stats .cps-grid--3col,
  .cps-aff-stats .cps-grid--2col {
    grid-template-columns: repeat(2, 1fr) !important;
  }

  .cps-aff-flow {
    flex-wrap: wrap !important;
  }

  .cps-aff-meaning {
    grid-template-columns: 1fr !important;
  }

  .cps-aff-benefit-featured {
    gap: var(--cps-space-lg) !important;
  }
}

@media (max-width: 640px) {
  /* Plans: 2 columns on narrow tablet/large phone */
  .cps-aff-plans {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 768px) {
  /* Grids collapse to single column */
  .cps-affiliation .cps-grid--4col,
  .cps-affiliation .cps-grid--3col,
  .cps-affiliation .cps-grid--2col,
  .cps-aff-plans {
    grid-template-columns: 1fr !important;
  }

  /* Hero — stack vertically */
  .cps-aff-hero {
    flex-direction: column !important;
    min-height: auto !important;
  }

  .cps-aff-hero__inner {
    padding-left: var(--cps-space-md) !important;
    padding-right: var(--cps-space-md) !important;
  }

  .cps-aff-hero__content {
    max-width: 100% !important;
    padding: var(--cps-space-2xl) 0 !important;
  }

  .cps-aff-hero__title {
    font-size: var(--cps-text-2xl) !important;
  }

  .cps-aff-hero__actions {
    flex-direction: column !important;
    align-items: stretch !important;
  }

  .cps-aff-hero__actions .cps-btn {
    width: 100% !important;
    justify-content: center !important;
  }

  /* Sections */
  .cps-aff-section {
    padding: var(--cps-space-xl) var(--cps-space-md) !important;
  }

  .cps-aff-section.cps-aff-section--fullwidth {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  .cps-aff-section__heading {
    font-size: var(--cps-text-xl) !important;
  }

  /* Stats: 2 columns on mobile */
  .cps-aff-stats .cps-grid--4col,
  .cps-aff-stats .cps-grid--3col,
  .cps-aff-stats .cps-grid--2col {
    grid-template-columns: repeat(2, 1fr) !important;
  }

  /* Meaning */
  .cps-aff-meaning {
    grid-template-columns: 1fr !important;
  }

  /* Plan tabs: allow wrap, smaller font */
  .cps-aff-type-tabs {
    gap: var(--cps-space-xs) !important;
  }

  .cps-aff-type-tabs .cps-btn {
    font-size: var(--cps-text-xs) !important;
    padding: 6px 10px !important;
  }

  /* Plan cards: visible wrappers take full width */
  .cps-aff-plan-wrap {
    width: 100% !important;
  }

  .cps-aff-plan-card {
    width: 100% !important;
    max-width: 420px !important;
    margin: 0 auto !important;
  }

  /* Benefits grid: 1 col */
  .cps-aff-benefits-grid {
    grid-template-columns: 1fr !important;
  }

  /* Benefit card illustration: shorter on mobile */
  .cps-aff-benefit-card__illustration img {
    max-height: 110px !important;
    object-fit: cover !important;
  }

  /* Benefit plan chips: smaller */
  .cps-aff-benefit-plan-chip {
    width: 24px !important;
    height: 24px !important;
  }

  .cps-aff-benefit-plan-chip svg {
    width: 12px !important;
    height: 12px !important;
  }

  /* Guidance section cards */
  .cps-aff-guidance__cards {
    grid-template-columns: 1fr !important;
  }

  /* Flow steps: vertical stack */
  .cps-aff-flow {
    flex-direction: column !important;
    align-items: center !important;
  }

  .cps-aff-step__connector {
    transform: rotate(90deg) !important;
    padding: var(--cps-space-sm) !important;
  }

  /* Modals: full-screen on mobile */
  .cps-aff-modal__panel {
    width: 100% !important;
    max-width: 100% !important;
    max-height: 100dvh !important;
    border-radius: 0 !important;
    margin: 0 !important;
  }

  /* Policy accordion */
  .cps-aff-policy-wrap {
    padding: 0 var(--cps-space-md) !important;
  }

  /* CTA final */
  .cps-aff-cta-final__content {
    padding: var(--cps-space-2xl) var(--cps-space-lg) !important;
  }

  .cps-aff-cta-final__actions {
    flex-direction: column !important;
    align-items: stretch !important;
  }

  .cps-aff-cta-final__actions .cps-btn {
    width: 100% !important;
    justify-content: center !important;
  }
}

/* --- Extra small (phones < 480px) --- */
@media (max-width: 480px) {
  .cps-aff-hero__title {
    font-size: var(--cps-text-xl) !important;
  }

  .cps-aff-section__heading {
    font-size: var(--cps-text-lg) !important;
  }

  /* Stats: 1 column on very small screens */
  .cps-aff-stats .cps-grid--4col,
  .cps-aff-stats .cps-grid--3col,
  .cps-aff-stats .cps-grid--2col {
    grid-template-columns: 1fr !important;
  }

  .cps-aff-type-tabs .cps-btn {
    padding: 5px 8px !important;
  }

  /* Benefits section: reduce padding */
  #beneficios.cps-aff-section {
    padding-left: var(--cps-space-md) !important;
    padding-right: var(--cps-space-md) !important;
  }
}

/* ─────────────────────────────────────────────────────────────────────────────
   Diferenciação por audiência — pessoa (teal) vs. instituição (navy).
   As duas páginas usam o mesmo layout; o acento cromático + o eyebrow de audiência
   deixam claro, à primeira vista, em qual página o visitante está.
   ───────────────────────────────────────────────────────────────────────────── */
.cps-aff-hero__tags {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: var(--cps-space-xs) !important;
  /* Aproxima a tag do título abaixo: puxa o título para cima anulando parte do
     gap de flex (md) do .cps-aff-hero__content — resta um respiro pequeno (md − sm). */
  margin-bottom: calc(var(--cps-space-sm) * -1) !important;
}
/* Tag de audiência = MESMO estilo do eyebrow do hero de Produções (.cps-prod-hero__eyebrow):
   pílula "glass" (branco translúcido) + texto teal-claro em caixa alta com tracking largo.
   Idêntica para as duas audiências e legível sobre o hero navy (sem navy-on-navy). Vence o
   .cps-aff-hero .cps-tag (mesma especificidade, vem depois na folha). */
.cps-aff-hero .cps-aff-audience-tag {
  display: inline-flex !important;
  align-items: center !important;
  font-family: var(--cps-font-heading) !important;
  font-size: var(--cps-text-xs) !important;
  font-weight: 400 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.18em !important;
  color: var(--cps-teal-200) !important;
  padding: var(--cps-space-2xs) var(--cps-space-md) !important;
  border-style: solid !important;
  border-width: 1px !important;
  border-color: color-mix(in srgb, var(--cps-white) 18%, transparent) !important;
  border-radius: var(--cps-radius-full) !important;
  background: color-mix(in srgb, var(--cps-white) 5%, transparent) !important;
}

/* Acento no topo dos cards de plano: teal para pessoa, navy para instituição. */
.cps-aff-plan-card {
  border-top-width: 3px !important;
  border-top-style: solid !important;
  border-top-color: var(--cps-teal-500) !important;
}
.cps-affiliation--institucional .cps-aff-plan-card {
  border-top-color: var(--cps-navy-500) !important;
}
.cps-affiliation--institucional .cps-aff-plan-card__icon,
.cps-affiliation--institucional .cps-aff-plan-card__currency,
.cps-affiliation--institucional .cps-aff-plan-card__amount {
  color: var(--cps-navy-500) !important;
}
.cps-affiliation--institucional .cps-aff-plan-card:hover {
  border-color: var(--cps-navy-500) !important;
}
/* Aba de filtro ativa acompanha o acento da audiência. */
.cps-affiliation--institucional .cps-aff-type-tabs .cps-btn--primary {
  background: var(--cps-navy-500) !important;
  border-color: var(--cps-navy-500) !important;
}

/* Camadas complementares (só pessoa): Comunidade + Reconhecimento Honorário. */
.cps-aff-layers__grid {
  margin-top: var(--cps-space-lg) !important;
}
.cps-aff-layer-card {
  display: flex !important;
  flex-direction: column !important;
  gap: var(--cps-space-xs) !important;
  padding: var(--cps-space-lg) !important;
  height: 100% !important;
}
.cps-aff-layer-card__head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-bottom: var(--cps-space-xs) !important;
}
.cps-aff-layer-card__icon {
  color: var(--cps-accent) !important;
}