.audience-section {
  width: 100%;
  padding: 24px 18px 32px;
  background:
    radial-gradient(circle at 8% 12%, rgba(107,77,255,.045), transparent 30%),
    radial-gradient(circle at 92% 85%, rgba(55,139,255,.04), transparent 30%),
    #fff;
}

.audience-section__inner { width: 100%; max-width: 430px; margin: 0 auto; }
.audience-header { text-align: center; }
.audience-eyebrow { display: inline-flex; align-items: center; justify-content: center; min-height: 30px; margin: 0; padding: 7px 14px; border-radius: 999px; color: #7550e8; background: linear-gradient(90deg, rgba(119,73,255,.11), rgba(72,132,255,.10)); font-size: 10px; line-height: 1; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; }
.audience-title { margin: 12px auto 0; color: #080b1a; font-family: var(--font-display); font-size: clamp(34px, 9vw, 40px); line-height: .99; font-weight: 900; letter-spacing: 0; text-align: center; text-wrap: balance; }
.audience-title > span { display: block; }
.audience-accent { color: #634dff; background: linear-gradient(90deg, #634dff, #3b82ff); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.audience-grid { display: flex; flex-direction: column; gap: 14px; margin-top: 32px; }
.audience-card { position: relative; isolation: isolate; width: 100%; min-height: 190px; overflow: hidden; padding: 20px; border: 1px solid rgba(88,91,165,.09); border-radius: 24px; background: rgba(255,255,255,.96); box-shadow: 0 10px 32px rgba(40,48,100,.045); transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
.audience-card::before { position: absolute; z-index: -1; inset: 0; content: ""; pointer-events: none; background: radial-gradient(circle at 100% 0%, var(--audience-glow), transparent 44%); }
.audience-card--creators { --audience-accent: #694bff; --audience-glow: rgba(136,85,255,.05); --audience-icon-a: rgba(144,88,255,.14); --audience-icon-b: rgba(194,112,255,.08); }
.audience-card--agencies { --audience-accent: #387eff; --audience-glow: rgba(62,139,255,.05); --audience-icon-a: rgba(73,137,255,.15); --audience-icon-b: rgba(76,197,255,.08); }
.audience-card--teams { --audience-accent: #7247f2; --audience-glow: rgba(117,76,255,.05); --audience-icon-a: rgba(129,75,255,.14); --audience-icon-b: rgba(82,136,255,.08); }
.audience-card__header { display: flex; align-items: center; gap: 14px; min-width: 0; }
.audience-icon { width: 58px; height: 58px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 50%; color: var(--audience-accent); background: linear-gradient(135deg, var(--audience-icon-a), var(--audience-icon-b)); }
.audience-icon svg { width: 29px; height: 29px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.audience-card h3 { min-width: 0; margin: 0; color: #11162a; font-size: 21px; line-height: 1.1; font-weight: 700; }
.audience-card__description { max-width: 330px; margin: 15px 0 0; color: #626c82; font-size: 14px; line-height: 1.45; }
.audience-tags { display: flex; flex-wrap: wrap; gap: 7px; margin: 16px 0 0; padding: 0; list-style: none; }
.audience-tags li { min-height: 30px; display: inline-flex; align-items: center; padding: 0 11px; border: 1px solid rgba(83,91,150,.06); border-radius: 999px; color: #59637a; background: #f5f7fc; font-size: 11px; line-height: 1.15; font-weight: 500; white-space: nowrap; }
.audience-card:nth-child(2) { --reveal-delay: 35ms; }
.audience-card:nth-child(3) { --reveal-delay: 70ms; }

@media (min-width: 414px) {
  .audience-section { padding-right: 20px; padding-left: 20px; }
}

@media (min-width: 768px) {
  .audience-section { padding: 36px 28px 88px; }
  .audience-section__inner { max-width: 760px; }
  .audience-title { font-size: 48px; }
  .audience-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); align-items: stretch; gap: 14px; margin-top: 36px; }
  .audience-card { min-height: 220px; padding: 23px; }
  .audience-card:nth-child(3) { grid-column: 1 / -1; width: min(58%, 440px); justify-self: center; }
  .audience-card h3 { font-size: 22px; }
  .audience-card__description { font-size: 15px; }
}

@media (min-width: 1024px) {
  .audience-section { padding: 36px 28px 90px; }
  .audience-section__inner { max-width: 1280px; }
  .audience-title { font-size: clamp(50px, 4.2vw, 60px); }
  .audience-grid { grid-template-columns: repeat(3, minmax(0,1fr)); gap: 20px; margin-top: 38px; }
  .audience-card { min-height: 244px; display: flex; flex-direction: column; padding: 27px; border-radius: 26px; }
  .audience-card:nth-child(3) { grid-column: auto; width: 100%; }
  .audience-card h3 { font-size: 23px; }
  .audience-card__description { font-size: 15px; }
  .audience-tags { margin-top: auto; padding-top: 18px; }
}

@media (hover: hover) and (min-width: 1024px) {
  .audience-card:hover { transform: translateY(-3px); border-color: rgba(100,82,220,.14); box-shadow: 0 16px 38px rgba(45,52,105,.075); }
}

@media (prefers-reduced-motion: reduce) {
  .audience-card { transition: none; }
}
