/* Last full read through 27/12/2020

*
*##############################################
*# walk landing sass         /_sass/env/walk.sass
*##############################################
*
*/

$hero-follow-top: 4.5vh

.image__filter–blur

@include image-filter--blur

.hero__overlay

background-color: $env-primary

.bg–env-100

background-color: $env-primary

.bg–env-50

background-color: rgba($env-primary, .5)

.hero__strap–env

color: $env-secondary

.hero__strap–start

color: $env-primary

.hero__follow

background-color: $env-primary
bottom: $hero-follow-top
bottom: calc(var(--vh, 1vh) * #{strip-unit($hero-follow-top)})

.segment__wrap

display: flex
flex-direction: column-reverse
width: 100vw

.segment__gaurentee

@include logo-color($white)
align-items: center
background-color: $env-primary
color: $white
display: flex
flex-direction: column
justify-content: center
padding: 4rem 0
width: 100%

.site__logo
  margin: 0 5vw
  text-align: center
  height: 10vh

.segment__keywords

height: 50%

.image–guarantee

@include image-filter-rotate
height: 100vh

.strap__guarantee

border-top: solid 1px $soft-white
margin: 3rem 0
width: 80%

.strap–env-primary

background-color: $env-primary
color: $white

.segment__keywords

display: flex
flex-direction: row
flex-wrap: wrap
justify-content: space-around
align-items: center
& > *
  padding: 3rem 0
  width: 50%

.segment__right

background-color: $image-blend