.HeroComponent{position:relative;z-index:1;height:calc(100vh + 80px);min-height:58.75rem;width:100%;display:flex;justify-content:center}.HeroComponent.backgroundwhite{background-color:#fff}.HeroComponent.backgroundbeige{background-color:#fffef3}.HeroComponent.backgrounddark{background-color:#212121}.HeroComponent .wrapper{position:relative;z-index:1;overflow:hidden;display:grid;grid-template-columns:repeat(6,1fr);gap:0 1rem;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:2rem 1.75rem;text-align:center;color:#fff;width:100%}.HeroComponent .content{grid-column:1/-1}.HeroComponent .coordinates{display:flex;flex-direction:column;justify-content:center;align-items:center;font-family:Work Sans,sans-serif;font-size:.75rem;line-height:.875rem;font-weight:500;letter-spacing:.12rem;flex-direction:row;margin-bottom:4rem}.HeroComponent .coordinates__icon{display:inline-block;width:15px;height:10px;border-radius:14px;background-color:#ffbe5a;margin-right:1rem}.HeroComponent .heading{margin:0}.HeroComponent .heading *{margin:0;font-family:Work Sans,sans-serif;font-weight:300;font-style:italic;font-size:2.5rem;line-height:3rem;color:#fff}.HeroComponent .background-image__wrapper{position:absolute;top:0;left:0;width:100%;height:100%;z-index:0;background-color:#212121}.HeroComponent .background-image__wrapper.backgroundwhite{background-color:#fff}.HeroComponent .background-image__wrapper.backgroundbeige{background-color:#fffef3}.HeroComponent .background-image__wrapper.backgrounddark{background-color:#212121}.HeroComponent .background-image{display:block;width:100%;height:100%;object-fit:cover}@media (min-width:48rem){.HeroComponent .wrapper{display:grid;grid-template-columns:repeat(12,1fr);gap:0 2rem;padding:0 4rem}.HeroComponent .content{grid-column:3/11}.HeroComponent .coordinates{margin-bottom:4.5rem}.HeroComponent .heading *{font-family:Work Sans,sans-serif;font-weight:300;font-style:italic;font-size:2.5rem;line-height:3rem}}@media (min-width:48rem) and (min-width:48rem){.HeroComponent .heading *{font-size:4rem;line-height:4.6875rem}}@media (min-width:48rem){.HeroComponent .background-image{left:0;transform:translateX(0)}}@media (min-width:80rem){.HeroComponent .wrapper{display:grid;grid-template-columns:repeat(12,1fr);gap:0 2rem;max-width:1440px;padding:0 4rem}.HeroComponent .heading *{font-family:Work Sans,sans-serif;font-weight:300;font-style:italic;font-size:2.5rem;line-height:3rem}}@media (min-width:80rem) and (min-width:48rem){.HeroComponent .heading *{font-size:5.25rem;line-height:6.125rem}}