/* #region Custom Styles */
@container preview (min-width: 0) {
  .hero-background {
    height: 47rem;
    background-color: var(--wa-color-brand-fill-loud);
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: -1;
  }

  .hero-background::after {
    background: url(/assets/images/themer/default/hero.png) 10rem bottom no-repeat;
    background-size: 95%;
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
  }

  .hero wa-button[variant='brand'] {
    --background: var(--wa-color-neutral-fill-quiet);
    --text-color: var(--wa-color-neutral-on-normal);
  }

  .project-header {
    color: var(--wa-color-brand-on-loud);
  }

  .strata.hero {
    height: 26rem;
  }

  .hero .title {
    margin-inline-end: 40%;
    color: var(--wa-color-brand-on-loud);
  }
}

/* responsive */
@container preview (min-width: 1040px) {
  .hero-background::after {
    background-position: right bottom;
    background-size: 90%;
  }
}
/* #endregion */