@layer repui.components {
  :where(.rui-hero) { display: grid; grid-template-columns: minmax(0, 1fr) minmax(18rem, .9fr); overflow: hidden; border: var(--rui-hero-border); border-radius: var(--rui-hero-radius); background: var(--rui-hero-background); color: var(--rui-hero-foreground); box-shadow: var(--rui-hero-shadow); }
  :where(.rui-hero[data-media-side="start"]) { grid-template-columns: minmax(18rem, .9fr) minmax(0, 1fr); }
  :where(.rui-hero[data-media-side="start"] .rui-hero__content) { order: 2; }
  :where(.rui-hero[data-media-side="start"] .rui-hero__media) { order: 1; }
  :where(.rui-hero__content) { display: flex; min-width: 0; flex-direction: column; justify-content: center; gap: var(--rui-hero-content-gap); padding: var(--rui-hero-padding); }
  :where(.rui-hero__eyebrow) { color: var(--rui-hero-eyebrow-color); font-size: var(--rui-text-label-size); font-weight: var(--rui-font-weight-semibold); letter-spacing: .04em; text-transform: uppercase; }
  :where(.rui-hero__title) { margin: 0; font-size: var(--rui-hero-title-size); font-weight: var(--rui-font-weight-bold); line-height: 1.08; text-wrap: balance; }
  :where(.rui-hero__description, .rui-hero__body) { max-width: 62ch; color: var(--rui-hero-muted); font-size: var(--rui-hero-description-size); line-height: var(--rui-line-height-normal); }
  :where(.rui-hero__actions) { display: flex; flex-wrap: wrap; gap: var(--rui-space-2); padding-top: var(--rui-space-2); }
  :where(.rui-hero__media) { position: relative; min-height: var(--rui-hero-media-min-height); overflow: hidden; background: var(--rui-hero-media-background); }
  :where(.rui-hero__image, .rui-hero__placeholder) { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
  :where(.rui-hero__placeholder) { background: var(--rui-hero-placeholder-background); }
  :where(.rui-hero__atlas) { position: absolute; inset: 0; background-image: var(--rui-hero-atlas-image); background-repeat: no-repeat; background-size: 305% 205%; background-position: calc(var(--rui-hero-atlas-column, 0) * 50%) calc(var(--rui-hero-atlas-row, 0) * 100%); }
  :where([data-rui-color-scheme="dark"] .rui-hero__atlas) { --rui-hero-atlas-row: 1; }
  :where([data-rui-theme="default"] .rui-hero__atlas) { --rui-hero-atlas-column: 0; }
  :where([data-rui-theme="mineral"] .rui-hero__atlas) { --rui-hero-atlas-column: 1; }
  :where([data-rui-theme="ocean-deep"] .rui-hero__atlas) { --rui-hero-atlas-column: 2; }
  :where(.rui-hero__image--dark) { opacity: 0; }
  :where([data-rui-color-scheme="dark"] .rui-hero__image--light) { opacity: 0; }
  :where([data-rui-color-scheme="dark"] .rui-hero__image--dark) { opacity: 1; }
  @media (max-width: 52rem) { :where(.rui-hero, .rui-hero[data-media-side="start"]) { grid-template-columns: 1fr; } :where(.rui-hero[data-media-side="start"] .rui-hero__content, .rui-hero[data-media-side="start"] .rui-hero__media) { order: initial; } }
}