// Hero feature // ==========================

.usa-hero {

@include border-box-sizing;
@include typeset;
@include u-padding-y($theme-site-margins-width);
background-image: url("#{$theme-hero-image}");
background-position: center;
background-size: cover;
color: color("white");

}

.usa-hero__callout {

background-color: color("primary-darker");
padding: units(4);

@include at-media("tablet") {
  max-width: units("mobile");
}

}

.usa-hero__heading {

@include typeset-h2;
color: color("accent-cool");
line-height: line-height("heading", 2);

}

.usa-hero__heading–alt {

color: color("white");
display: block;

}