{% scope_css %}

.dgrd-brochure {
position: relative;
width: 100%;
box-sizing: border-box;
isolation: isolate;
overflow: visible;

padding-top: 0;
}

.dgrd-brochure__hero {
position: relative;
width: 100%;
height: var(--br-hero-height-desktop);
overflow: hidden;
z-index: 0;
}

.dgrd-brochure__hero-image {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
object-fit: cover;
display: block;
}

.dgrd-brochure__hero-fade {
position: absolute;
inset: 0;
background-image: linear-gradient(180deg,
  #FFFFFF 0%,
  rgba(255, 255, 255, 0.5) 35%,
  rgba(255, 255, 255, 0) 65%);
pointer-events: none;
}

.dgrd-brochure__inner {
position: relative;
z-index: 1;
max-width: 1440px;
margin: 0 auto;
padding: 0 40px;
box-sizing: border-box;
display: grid;
grid-template-columns: minmax(0, 1fr) auto;
align-items: end;
gap: 60px;
}

.dgrd-brochure__content {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 32px;
max-width: 698px;
padding-top: 80px;
min-width: 0;
}

.dgrd-brochure__eyebrow {
  margin: 0;
  color: var(--br-eyebrow-color, #1E5D85);
}

.dgrd-brochure__heading {
margin: 0;
color: var(--br-heading-color);
font-weight: 500;
font-size: 40px;
line-height: 1.1;
letter-spacing: 0;
}

.dgrd-brochure__description,
.dgrd-brochure__description p {
margin: 0;
color: var(--br-body-color);
font-weight: 400;
font-size: 18px;
line-height: 1.4;
}

.dgrd-brochure__description > * + * {
margin-top: 16px;
}

.dgrd-brochure__ctas {
display: flex;
flex-wrap: wrap;
gap: 10px;
align-items: center;
margin: 0;
}

.dgrd-brochure__button {
margin: 0;
}

.dgrd-brochure__preview {
position: relative;
flex: 0 0 auto;
width: 329px;
height: auto;

margin-top: -150px;
}

.dgrd-brochure__preview-image {
display: block;
width: 100%;
height: auto;
border-radius: 5px;
box-shadow: 0 4px 20px 5px rgba(0, 0, 0, 0.1);
background-color: #FFFFFF;
}

@media (max-width: 1023px) and (min-width: 768px) {
.dgrd-brochure__hero {
  height: var(--br-hero-height-tablet);
}

.dgrd-brochure__inner {
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 40px;
  padding-top: 80px;
  padding-bottom: 80px;
}

.dgrd-brochure__content {
  padding-top: 0;
  gap: 24px;
  max-width: none;
}

.dgrd-brochure__heading {
  font-size: 35px;
}

.dgrd-brochure__preview {
  width: 224px;
  margin-top: 0;
}
}

@media (max-width: 767px) {
.dgrd-brochure__hero {
  height: var(--br-hero-height-mobile);
}

.dgrd-brochure__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 58px;
  margin-top: 40px;
  padding: 40px 16px;
}

.dgrd-brochure__content {
  align-items: flex-start;
  width: 100%;
  max-width: none;
  padding-top: 0;
  gap: 24px;
}

.dgrd-brochure__heading {
  font-size: 30px;
}

.dgrd-brochure__preview {
  width: 224px;
  margin-top: 0;
  align-self: center;
}

/* Defeat the section's top-padding override above so the hero band
  * has a small breathing room before the content. */
.dgrd-brochure__content {
  padding-top: 0;
}
}

{% end_scope_css %}
