.hero-banner{position:relative;overflow:hidden;z-index:2;padding:5rem 0;text-align:center}.hero-banner h2{font-size:clamp(2.5rem,5vw,4rem);font-weight:900;line-height:1.1;letter-spacing:-.02em;margin-bottom:1.5rem;opacity:0;animation:banner-reveal .8s cubic-bezier(.4,0,.2,1) .2s forwards}.hero-banner p{font-size:1.25rem;font-weight:600;opacity:0;animation:banner-reveal .8s cubic-bezier(.4,0,.2,1) .4s forwards}@keyframes banner-reveal{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.hero-banner--dark{background-color:var(--midnight);color:var(--ivory)}.hero-banner--dark h2{color:var(--ivory)}.hero-banner--dark p,.hero-banner--dark .hero-banner__body{color:var(--text-muted-dark)}.hero-banner--purple{background-color:var(--midnight);color:var(--ivory)}.hero-banner--purple h2{color:var(--ivory)}.hero-banner--purple p,.hero-banner--purple .hero-banner__body{color:var(--mist)}.hero-banner__body{font-weight:400!important;font-size:1.1rem!important;max-width:600px;margin-left:auto;margin-right:auto}@media (max-width: 992px){.hero-banner{padding:4rem 0}}@media (max-width: 768px){.hero-banner{padding:3rem 0}.hero-banner h2{font-size:2.25rem}.hero-banner p{font-size:1rem}}