.callout-card{
  border-radius: 16px;
  background: rgba(55, 55, 55, 0.45);
  margin: auto;
  padding:32px;
}
#seasonal{
  min-height: 712px;
  /* background-position: center bottom; */
  background-position: center;
  background-repeat: no-repeat;
  display: flex;
  justify-content: center;
  align-items: center;
  background-size: cover;
}
.callout-wrapper{
  max-width: 1440px;
  margin: auto;
  display: flex;
  gap:100px;
}
.callout-title{
  color: var(--text-inverse, #F2F2F3);
  font-family: var(--type-font-family-sub-heading, Inter);
  font-size: var(--fontsize-heading-h4, 32px);
  font-weight: 700;
  line-height: var(--line-height-heading-h4, 40px); /* 125% */
}
.callout-body {
  padding-top: 16px;
  padding-bottom: 16px;
}
.callout-btn{
  display: flex;
  align-items: center;
  gap: 12px;
}
.callout-btn a{
  border-radius: var(--border-radius-md, 4px);
  text-decoration: none!important;
  padding: 12px 24px;
  transition: all 0.3s ease-in-out;
}

.callout-logo svg{
  padding:32px;
}
.callout-scrim{
  background: linear-gradient(0deg,rgba(0,0,0,0.2) 0%,rgba(0,0,0,0.2) 100%);
  width:100%;
  display: flex;
  min-height: 712px;
}

@media only screen and (max-width: 1500px) {
  .callout-wrapper{
    padding-left: 100px;
    padding-right: 100px;
  }
}

@media only screen and (max-width: 1000px) {
  .callout-wrapper{
    padding: 56px 24px;
    flex-direction: column;
    gap:32px;
  }
}

@media only screen and (max-width: 743px) {
  .callout-wrapper{
    padding: 32px 16px;
  }
}