.hero{padding:var(--lg-padding) 0 var(--lg-padding);background:var(--color__aa-bg-gradient);z-index:2;display:block;position:relative;overflow:hidden;&:before,&:after{content:"";z-index:0;background-repeat:no-repeat;background-size:100%;width:50%;height:200%;display:block;position:absolute;top:0}&:before{background-image:url(/assets/static/375_left.Cis4Txo2.svg);left:0}&:after{background-image:url(/assets/static/375_right.iTnpbtBM.svg);right:0}.page-container--stripped &{background:0 0}.hero__inner{margin:var(--md-padding) auto 0;text-align:center;z-index:2;grid-column:1/7;& h1,h2,p,a{color:var(--color__white)}}&.hero--price{padding-bottom:144px}&.hero--black-friday{background-image:url(/assets/static/black-friday-hero.eAHJMxSD.svg);padding-top:110px}&.hero--article{background:var(--color__aa-navy--50);background-position:0 0;.hero__inner{text-align:left;max-width:750px;margin:32px 0 0;position:relative;& h1,h2,p,a{color:var(--color__aa-navy)}&:after{content:"";bottom:calc(var(--lg-padding) * -1);background:var(--color__aa-bright-blue);z-index:2;width:80px;height:10px;display:block;position:absolute;left:0}}&:before,&:after{display:none}}&.hero--dark-theme{background:var(--color__aa-gradient-black);.hero__inner{& h1,h2,p,a{color:var(--color__white)}&:after{background:var(--color__aa-pink)}}&:before,&:after{display:block}}@media(width>=768px){&:before{background-image:url(/assets/static/1440_left.C-Tm_-qN.svg);left:-2%}&:after{background-image:url(/assets/static/1440_right.CluegdUO.svg);right:-2%}.hero__inner{grid-column:2/12}&.hero--price{padding-bottom:140px}&.hero--article .hero__inner{grid-column:1/11;max-width:1000px;margin-top:48px}}@media(width>=1024px){&:before{left:-5%}&:after{right:-5%}.hero__inner{grid-column:3/11}.hero__inner h1{margin-bottom:32px}.hero__inner p{max-width:650px;margin:0 auto}&.hero--article .hero__inner{grid-column:2/12}}@media(width>=1200px){padding-bottom:80px;.hero__inner{grid-column:4/10;margin-top:65px}&.hero--article{padding:40px 0 var(--lg-padding)}&.hero--article .hero__inner:after{bottom:calc(var(--lg-padding) * -1)}&.hero--price{padding-bottom:240px}}@media(width>=1440px){&:before{max-width:900px;top:-5%;left:-0%}&:after{max-width:900px;top:-15%;right:-0%}}}
