/* ─── CARD ASSOCIAÇÃO — mesma largura do promo card (grid full-width) ─── */
.assoc-card {
  grid-column: 1 / -1;
  background: linear-gradient(135deg, rgba(30,80,160,.28) 0%, rgba(10,30,80,.22) 60%, rgba(5,15,50,.18) 100%);
  backdrop-filter: blur(20px) saturate(1.5) brightness(1.08);
  -webkit-backdrop-filter: blur(20px) saturate(1.5) brightness(1.08);
  border: 1.5px solid rgba(80,140,255,.30);
  border-radius: 18px;
  overflow: hidden;
  position: relative;
  display: flex;
  align-items: stretch;
  min-height: 160px;

  box-shadow:
    0 0 0 1px rgba(80,140,255,.12) inset,
    0 2px  4px  rgba(0,0,0,.14),
    0 8px  22px rgba(0,20,80,.14),
    0 20px 48px rgba(0,0,0,.08),
    0 0 50px rgba(30,80,200,.06) inset;

  transition: transform .32s cubic-bezier(.22,1,.36,1), box-shadow .32s ease, border-color .32s ease;
}

/* ── HOVER — zoom ── */
.assoc-card:hover {
  transform: scale(1.025);
  z-index: 10;
  border-color: rgba(80,140,255,.55);
  background: linear-gradient(135deg, rgba(30,80,160,.36) 0%, rgba(10,30,80,.30) 60%, rgba(5,15,50,.24) 100%);
  box-shadow:
    0 0 0 1.5px rgba(80,140,255,.30) inset,
    0 4px  10px  rgba(30,80,200,.10),
    0 10px 28px rgba(0,20,80,.12),
    0 24px 56px rgba(0,0,0,.10),
    0 0 70px rgba(30,80,200,.08) inset;
}

@media (max-width: 600px) {
  .assoc-card { flex-direction: column; min-height: unset; }
}

.assoc-stripes {
  position: absolute; inset: 0; overflow: hidden; opacity: .05; pointer-events: none;
}
.assoc-stripes::before {
  content: ''; position: absolute; inset: -50%;
}

.assoc-logo-wrap {
  flex-shrink: 0; width: 170px;
  display: flex; align-items: center; justify-content: center;
  padding: 20px; position: relative; z-index: 1;
}
@media (max-width: 600px) { .assoc-logo-wrap { width: 100%; padding: 20px 20px 0; } }
.assoc-logo-wrap img {
  width: 100%; max-width: 130px;
  filter: drop-shadow(0 0 18px rgba(245,194,0,.35));
}

.assoc-body {
  flex: 1; padding: 24px 24px 24px 12px;
  display: flex; flex-direction: column; justify-content: center; gap: 10px;
  position: relative; z-index: 1;
}
@media (max-width: 600px) {
  .assoc-body { padding: 14px 16px 20px; gap: 8px; }
  .assoc-eyebrow { font-size: .58rem; letter-spacing: .14em; }
  .assoc-title { font-size: 1.1rem; }
  .assoc-benefits li { font-size: .78rem; }
  .assoc-row { flex-direction: column; align-items: stretch; gap: 10px; }
  .assoc-price { font-size: 1.1rem; text-align: center; }
  .assoc-cta { text-align: center; width: 100%; box-sizing: border-box; }
}

.assoc-eyebrow {
  font-family: var(--ff); font-size: .65rem; font-weight: 800;
  letter-spacing: .22em; text-transform: uppercase;
  color: #0a1a3a;
}
.assoc-title {
  font-family: var(--fm); font-size: clamp(1.2rem, 3.5vw, 1.85rem);
  color: #080f24; line-height: 1.1;
}
.assoc-desc {
  font-family: var(--fb); font-size: .84rem;
  color: #0d1e42; line-height: 1.5;
}
.assoc-desc strong { color: #0a1a3a; }

.assoc-benefits {
  list-style: none;
  margin: 0; padding: 0;
  display: flex; flex-direction: column; gap: 6px;
}
.assoc-benefits li {
  font-family: var(--fb); font-size: .84rem;
  color: #0d1e42; line-height: 1.45;
  display: flex; align-items: flex-start; gap: 8px;
}
.assoc-benefits li strong { color: #080f24; font-weight: 700; }
.assoc-benefit-dot {
  flex-shrink: 0;
  width: 6px; height: 6px;
  border-radius: 50%;
  background: #0a1a3a;
  opacity: .60;
  margin-top: .45em;
}

.assoc-row {
  display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin-top: 2px;
}
.assoc-price {
  font-family: var(--ff); font-weight: 900; font-size: 1.35rem;
  color: #0a1a3a;
  background: rgba(10,26,58,.10); border-radius: 8px; padding: 4px 12px;
}
.assoc-cta {
  font-family: var(--ff); font-weight: 800; font-size: .85rem;
  letter-spacing: .08em; text-transform: uppercase;
  background: var(--yellow); color: var(--navy);
  border: none; border-radius: 8px; padding: 10px 20px;
  cursor: pointer; text-decoration: none; display: inline-block;
  transition: background .2s, transform .15s;
}
.assoc-cta:hover { background: var(--yellow2); transform: translateY(-1px); }

.assoc-cta-outline {
  font-family: var(--ff); font-weight: 800; font-size: .85rem;
  letter-spacing: .08em; text-transform: uppercase;
  background: transparent; color: var(--yellow);
  border: 2px solid var(--yellow); border-radius: 8px; padding: 8px 18px;
  cursor: pointer; text-decoration: none; display: inline-block;
  transition: background .2s, color .2s, transform .15s;
}
.assoc-cta-outline:hover { background: rgba(245,194,0,.10); transform: translateY(-1px); }