/* Hero: the shared layout utilities own containers, heights and alignment. */
.orly-hero {
  position: relative;
  isolation: isolate;
  margin-block-start: 0;
  background-color: var(--orly-hero-background-color, var(--color-background));
  --orly-hero-default-color: var(--color-text-primary);
}

/* 0 and 20 have no standalone global bottom-spacing utility. */
.orly-hero--mb-0 { margin-block-end: 0; }
.orly-hero--mb-20 { margin-block-end: var(--section-space-20); }

.orly-hero__background,
.orly-hero__overlay {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.orly-hero__background {
  background-image: var(--orly-hero-image);
  background-size: cover;
  background-position: var(--orly-hero-focal-point, 50% 50%);
}

.orly-hero__overlay {
  background-color: var(--orly-hero-overlay-color, #000);
  opacity: var(--orly-hero-overlay-opacity, 0.4);
}

.orly-hero--has-image { --orly-hero-default-color: var(--color-white); }

.orly-hero__inner {
  position: relative;
}

.orly-hero__content {
  min-width: 0;
  gap: var(--space-25);
  padding-block: var(--section-space-60);
  overflow-wrap: anywhere;
}

.orly-hero .orly-container--full .orly-hero__content {
  padding-inline: var(--container-gutter);
}

.orly-hero__title,
.orly-hero__text {
  margin: 0;
  max-width: 100%;
}

.orly-hero .orly-hero__title {
  font-family: var(--font-heading);
  font-weight: var(--font-weight-bold);
  color: var(--orly-hero-title-color, var(--orly-hero-default-color));
}

.orly-hero .orly-hero__title--display {
  font-size: var(--font-size-display);
  line-height: var(--line-height-display);
}

.orly-hero .orly-hero__title--h1 {
  font-size: var(--font-size-h1);
  line-height: var(--line-height-h1);
}

.orly-hero .orly-hero__title--h2 {
  font-size: var(--font-size-h2);
  line-height: var(--line-height-h2);
  font-weight: var(--font-weight-semibold);
}

.orly-hero__title-accent { color: var(--orly-hero-title-accent-color, var(--color-accent)); }

.orly-hero .orly-hero__text {
  font-family: var(--font-body);
  font-size: var(--font-size-body);
  line-height: var(--line-height-body);
  color: var(--orly-hero-text-color, var(--orly-hero-default-color));
}

.orly-hero__text-accent { color: var(--orly-hero-text-accent-color, var(--color-accent)); }

.orly-hero__buttons {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-20);
  max-width: 100%;
}

.orly-hero__buttons > * { min-width: 0; max-width: 100%; }
.orly-hero .orly-align-h-center .orly-hero__buttons { justify-content: center; }
.orly-hero .orly-align-h-right .orly-hero__buttons { justify-content: flex-end; }

.orly-hero__media { display: none; }

@media (min-width: 48rem) {
  .orly-hero--split {
    --orly-hero-default-color: var(--color-text-primary);
  }

  .orly-hero--split > .orly-hero__background,
  .orly-hero--split > .orly-hero__overlay { display: none; }

  .orly-hero--split .orly-hero__inner {
    column-gap: var(--space-40);
  }

  .orly-hero--split.orly-hero--ratio-40-60 .orly-hero__inner {
    grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
  }

  .orly-hero--split.orly-hero--ratio-60-40 .orly-hero__inner {
    grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
  }

  .orly-hero--split .orly-hero__content { grid-column: 1; grid-row: 1; }
  .orly-hero--split.orly-hero--image-left .orly-hero__content { grid-column: 2; }

  .orly-hero__media {
    display: block;
    position: relative;
    grid-column: 2;
    grid-row: 1;
    min-width: 0;
  }

  .orly-hero--image-left .orly-hero__media { grid-column: 1; }

  .orly-hero__media img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: var(--orly-hero-focal-point, 50% 50%);
  }
}

/* Opt-in type presets. Existing Heroes keep their original Design System sizes.
   Values are rem-based and scale between mobile and desktop, then stop growing. */

.orly-hero[class*="orly-hero--title-size-"] .orly-hero__title { font-size: var(--orly-hero-title-size, var(--orly-title-size)); }
.orly-hero[class*="orly-hero--text-size-"] .orly-hero__text { font-size: var(--orly-hero-text-size, var(--orly-text-size)); }

/* Surtitre: plain text, never a heading. */
.orly-hero .orly-hero__eyebrow {
  margin: 0;
  max-width: 100%;
  font-family: var(--font-body);
  font-size: var(--orly-hero-eyebrow-size, var(--orly-eyebrow-size, 0.875rem));
  font-weight: var(--font-weight-semibold);
  line-height: var(--line-height-body);
  color: var(--orly-hero-eyebrow-color, var(--orly-hero-default-color));
}

.orly-hero .orly-hero__title { line-height: var(--orly-hero-title-line-height, var(--orly-title-line-height, 1.0)); }

/* Controlled Hero presets; historic classes remain supported. */
.orly-hero--title-size-30 { --orly-hero-title-size: clamp(1.875rem, 1.875rem + 0.00000vw, 1.875rem); }
.orly-hero--title-size-35 { --orly-hero-title-size: clamp(2.1875rem, 2.1875rem + 0.00000vw, 2.1875rem); }
.orly-hero--title-size-40 { --orly-hero-title-size: clamp(2.5rem, 2.5rem + 0.00000vw, 2.5rem); }
.orly-hero--title-size-45 { --orly-hero-title-size: clamp(2.625rem, 2.547306629834254rem + 0.33149vw, 2.8125rem); }
.orly-hero--title-size-50 { --orly-hero-title-size: clamp(2.625rem, 2.417817679558011rem + 0.88398vw, 3.125rem); }
.orly-hero--title-size-55 { --orly-hero-title-size: clamp(2.625rem, 2.288328729281768rem + 1.43646vw, 3.4375rem); }
.orly-hero--title-size-60 { --orly-hero-title-size: clamp(2.625rem, 2.158839779005525rem + 1.98895vw, 3.75rem); }
.orly-hero--title-size-65 { --orly-hero-title-size: clamp(2.625rem, 2.0293508287292816rem + 2.54144vw, 4.0625rem); }
.orly-hero--title-size-70 { --orly-hero-title-size: clamp(2.625rem, 1.8998618784530388rem + 3.09392vw, 4.375rem); }
.orly-hero--title-size-75 { --orly-hero-title-size: clamp(2.625rem, 1.7703729281767955rem + 3.64641vw, 4.6875rem); }
.orly-hero--title-size-80 { --orly-hero-title-size: clamp(2.625rem, 1.6408839779005526rem + 4.19890vw, 5rem); }
.orly-hero--title-size-85 { --orly-hero-title-size: clamp(2.625rem, 1.5113950276243093rem + 4.75138vw, 5.3125rem); }
.orly-hero--title-size-90 { --orly-hero-title-size: clamp(2.625rem, 1.3819060773480663rem + 5.30387vw, 5.625rem); }
.orly-hero--title-size-95 { --orly-hero-title-size: clamp(2.625rem, 1.2524171270718232rem + 5.85635vw, 5.9375rem); }
.orly-hero--title-size-100 { --orly-hero-title-size: clamp(2.625rem, 1.12292817679558rem + 6.40884vw, 6.25rem); }
.orly-hero__content { gap: 0; }
.orly-hero__content > * + * { margin-block-start: var(--space-25); }
.orly-hero__content > .orly-hero__title + * { margin-block-start: var(--orly-hero-title-gap, var(--space-25)); }
.orly-hero__content > .orly-hero__text + * { margin-block-start: var(--orly-hero-text-gap, var(--space-25)); }
.orly-hero--height-preset .orly-hero__inner { min-height: max(300px, calc(var(--orly-hero-height) * 0.65)); }
@media (min-width: 48rem) { .orly-hero--height-preset .orly-hero__inner { min-height: calc(var(--orly-hero-height) * 0.85); } }
@media (min-width: 64rem) {
  .orly-hero--height-preset .orly-hero__inner { min-height: var(--orly-hero-height); }
  .orly-hero--intro-split .orly-hero__content { row-gap: var(--space-25); }
  .orly-hero--intro-split .orly-hero__content > * { margin-block-start: 0; }
}
