.emw-cj-brand-state {
  --emw-cj-accent: #ef1b23;
  --emw-cj-surface: #0b0e12;
  --emw-cj-border: rgba(255, 255, 255, 0.15);
  display: grid;
  gap: 0.75rem;
  margin: 1.25rem 0 1.75rem;
  padding: clamp(1rem, 2.2vw, 1.5rem);
  color: #f4f1ec;
  background: var(--emw-cj-surface);
  border: 1px solid var(--emw-cj-border);
  border-left: 4px solid var(--emw-cj-accent);
}

.emw-cj-brand-state--populated {
  --emw-cj-accent: #38c980;
}

.emw-cj-brand-state--request-only {
  --emw-cj-accent: #55b7d9;
}

.emw-cj-brand-state--gated {
  --emw-cj-accent: #e7a93a;
}

.emw-cj-brand-state--broken {
  --emw-cj-accent: #df675f;
}

.emw-cj-brand-state__eyebrow {
  margin: 0;
  color: var(--emw-cj-accent);
  font: 800 0.72rem/1.2 Inter, ui-sans-serif, system-ui, sans-serif;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.emw-cj-brand-state h2,
.emw-cj-brand-state > p {
  margin: 0;
}

.emw-cj-brand-state h2 {
  color: inherit;
  font: 800 clamp(1.35rem, 3vw, 2rem)/1.1 "Barlow Condensed", Impact, sans-serif;
  text-transform: uppercase;
}

.emw-cj-brand-state > p:not(.emw-cj-brand-state__eyebrow) {
  max-width: 68ch;
  color: #b9bec6;
  font: 500 0.9rem/1.6 Inter, ui-sans-serif, system-ui, sans-serif;
}

.emw-cj-brand-state__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.625rem;
  margin-top: 0.25rem;
}

.emw-cj-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0.72rem 1rem;
  color: #fff;
  background: var(--emw-cj-accent);
  border: 1px solid var(--emw-cj-accent);
  font: 800 0.72rem/1.2 Inter, ui-sans-serif, system-ui, sans-serif;
  letter-spacing: 0.08em;
  text-decoration: none;
  text-transform: uppercase;
}

.emw-cj-action:hover,
.emw-cj-action:focus-visible {
  color: #fff;
  filter: brightness(0.86);
  outline: 2px solid #fff;
  outline-offset: 2px;
}

.emw-cj-fitment {
  --emw-cj-badge-color: #d9a33b;
  display: inline-flex;
  align-items: center;
  width: max-content;
  max-width: 100%;
  min-height: 28px;
  margin: 0.45rem 0;
  padding: 0.38rem 0.58rem 0.34rem;
  color: var(--emw-cj-badge-color);
  background: color-mix(in srgb, var(--emw-cj-badge-color) 10%, transparent);
  border: 1px solid color-mix(in srgb, var(--emw-cj-badge-color) 58%, transparent);
  font: 850 0.66rem/1 Inter, ui-sans-serif, system-ui, sans-serif;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.emw-cj-fitment--verified {
  --emw-cj-badge-color: #38c980;
}

.emw-cj-fitment--verification-required {
  --emw-cj-badge-color: #e7a93a;
}

.emw-cj-fitment--universal {
  --emw-cj-badge-color: #63bde4;
}

select[data-emw-cj-platform-constrained] {
  border-color: #63bde4;
  box-shadow: 0 0 0 1px rgba(99, 189, 228, 0.28);
}

[data-emw-cj-inert-card="true"] {
  display: none !important;
}

[data-emw-cj-unresolved-brand="true"] {
  display: none !important;
}

@media (max-width: 560px) {
  .emw-cj-brand-state__actions,
  .emw-cj-action {
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .emw-cj-action {
    scroll-behavior: auto;
    transition: none;
  }
}
