.atelier-module.atelier-hero-banner {
  box-sizing: border-box;
  position: relative;
  display: grid;
  align-items: end;
  width: 100%;
  max-width: none;
  min-height: calc(100svh - 147px);
  padding: 0;
  margin: 0 0 var(--am-next-gap, 0px);
  border: 0;
  border-bottom: 1px solid var(--am-border, #000);
  background: var(--am-bg, #b88b58);
  overflow: hidden;
  isolation: isolate;
}
.atelier-hero-banner .atelier-hero-banner__media {
  position: absolute;
  inset: 0;
  z-index: -2;
}
.atelier-hero-banner .atelier-hero-banner__media picture { display: contents; }
.atelier-hero-banner .atelier-hero-banner__media img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  object-fit: cover;
  object-position: 50% 50%;
}
.atelier-hero-banner .atelier-hero-banner__copy-shell {
  position: relative;
  width: 100%;
  display: flex;
  justify-content: center;
  align-self: end;
}
.atelier-hero-banner .atelier-hero-banner__gradient {
  position: absolute;
  z-index: -1;
  inset: -96px 0 0;
  background: linear-gradient(to bottom, transparent, var(--am-overlay-color, #000));
  opacity: 0.75;
  pointer-events: none;
}
.atelier-hero-banner .atelier-hero-banner__copy {
  position: relative;
  box-sizing: content-box;
  width: calc(100% - 2 * var(--am-padding, 40px));
  max-width: var(--am-content-width, 384px);
  padding: var(--am-padding, 40px);
  margin: 0;
  text-align: center;
}
.atelier-hero-banner .atelier-hero-banner__heading {
  display: block;
  width: 100%;
  padding: 0;
  margin: 0;
  font-family: "Galano Classic", ui-sans-serif, sans-serif;
  font-size: var(--am-heading-size, 38px);
  font-weight: 600;
  line-height: 1.1;
  letter-spacing: -0.1px;
  text-transform: none;
  color: var(--am-heading, #fff);
}
.atelier-hero-banner .atelier-hero-banner__subtitle {
  padding: 0;
  margin: 0 0 var(--am-subtitle-gap, 12px);
  font-family: "Galano Classic", ui-sans-serif, sans-serif;
  font-size: var(--am-subtitle-size, 18px);
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 1px;
  text-transform: none;
  color: var(--am-subtitle-color, #fff);
}
.atelier-hero-banner .atelier-hero-banner__body {
  padding: 0;
  margin: var(--am-gap, 16px) 0 0;
  font-family: "Galano Classic", ui-sans-serif, sans-serif;
  font-size: var(--am-body-size, 16px);
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: normal;
  color: var(--am-text, #fff);
}
.atelier-hero-banner .atelier-button.atelier-hero-banner__button {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  min-height: 41px;
  padding: 10px 20px;
  margin: var(--am-button-gap, 32px) 0 0;
  border: 0;
  border-radius: 4px;
  box-shadow: none;
  font-family: Toma, ui-sans-serif, sans-serif;
  font-size: var(--am-button-size, 14px);
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: normal;
  text-transform: uppercase;
  text-decoration: none;
  background: var(--am-button-bg, #fff);
  color: var(--am-button-text, #000);
  transition: background-color 150ms ease;
}
.atelier-hero-banner a.atelier-hero-banner__button:hover {
  background: var(--am-button-hover-background, #ede6d6);
  color: var(--am-button-text, #000);
}
.atelier-hero-banner a.atelier-hero-banner__button:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 4px;
}
@media (max-width: 767.98px) {
  .atelier-module.atelier-hero-banner {
    min-height: calc(100svh - 99px);
    margin-bottom: var(--am-next-gap-mobile, 0px);
  }
  .atelier-hero-banner .atelier-hero-banner__copy {
    width: calc(100% - 2 * var(--am-padding-mobile, 20px));
    max-width: var(--am-content-width-mobile, 350px);
    padding: var(--am-padding-mobile, 20px);
  }
  .atelier-hero-banner .atelier-hero-banner__heading { font-size: var(--am-heading-mobile, 30px); }
  .atelier-hero-banner .atelier-hero-banner__subtitle { font-size: var(--am-subtitle-size-mobile, 16px); }
  .atelier-hero-banner .atelier-hero-banner__body { font-size: var(--am-body-mobile, 16px); margin-top: var(--am-gap-mobile, 16px); }
  .atelier-hero-banner .atelier-button.atelier-hero-banner__button { font-size: var(--am-button-mobile, 14px); }
}
@media (prefers-reduced-motion: reduce) {
  .atelier-hero-banner .atelier-hero-banner__button { transition: none; }
}