:host { display: block; container: host / inline-size; color: var(--site-sponsorship-banner-container-color, var(--fds-on-alternate-surface-hi)); }
:host(.hidden) { display: none; }
.banner-container { border-radius: var(--border-radius-large); overflow: hidden; margin-bottom: var(--fds-spacing-200); }
.banner-shell { position: relative; height: 100%; min-height: 208px; }
.banner-image { z-index: 0; position: absolute; height: 100%; width: 100%; inset: 0px; object-fit: cover; }
.banner-tint { z-index: 1; position: absolute; height: 100%; width: 100%; inset: 0px; background: linear-gradient(270deg, rgba(0, 0, 0, 0) 40%, rgba(0, 0, 0, 0.4) 60%, rgba(0, 0, 0, 0.95) 100%); }
.banner { z-index: 2; box-sizing: border-box; position: relative; }
.banner-message { display: flex; flex-direction: column; gap: var(--fds-spacing-100); width: 132px; }
h3, h4, p { all: unset; }
.banner, p { padding: var(--fds-spacing-150); }
h3 { font: var(--fds-headline-tiny); }
h4 { font: var(--fds-paragraphs-tiny); }
.banner-button-container { margin-top: var(--fds-spacing-300); }
p { display: block; font: var(--fds-paragraphs-tiny); background-color: var(--site-sponsorship-banner-terms-description-background-color, var(--fds-alternate-surface)); }
@container host (width >= 375px) {
  .banner-message { width: 160px; }
  h4 { font: var(--fds-paragraphs-small); }
}
@container host (width >= 412px) {
  .banner, p { padding: var(--fds-spacing-200); }
  .banner-shell { min-height: 280px; }
  .banner-message { width: 174px; }
  h3 { font: var(--fds-headline-small); }
}
@container host (width >= 768px) {
  .banner { padding: var(--fds-spacing-400); }
  .banner-message { width: 336px; }
  h3 { font: var(--fds-headline-regular); }
  h4 { font: var(--fds-paragraphs-regular); }
}
@container host (width >= 1024px) {
  .banner-container { margin: var(--fds-spacing-200) 0; }
  .banner-shell { min-height: 309px; }
  .banner-message { width: 586px; }
}