.block--hero {
position: relative;
width: 100%;
padding: 220px 0;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
color: white;
}
.block--hero .wrapper-bg {
position: absolute;
inset: 0;
}
.block--hero .wrapper-bg img,
.block--hero .wrapper-bg video {
width: 100%;
height: 100%;
object-fit: cover;
}
.block--hero .content {
position: relative;
max-width: 880px;
width: 100%;
margin: auto;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
text-align: center;
gap: 20px;
padding: 0 20px;
}
.block--hero .title-pre {
display: block;
margin-bottom: 20px;
}
.block--hero .title-pre,
.block--hero .title-pre * {
color: inherit;
line-height: 28px;
font-size: 14px;
font-family: 'Avenir Heavy';
text-transform: uppercase;
letter-spacing: 0.2em;
}
.block--hero .title {
display: block;
margin-bottom: 15px;
max-width: 700px;
width: 100%;
line-height: 108px;
}
.block--hero .title,
.block--hero .title * {
font-family: 'The One';
font-weight: 300;
}
.block--hero .title,
.block--hero .title * {
font-size: 56px;
}
@media (max-width: 575px) {
.block--hero .title,
.block--hero .title * {
font-size: 36px;
}
}
.block--hero .title,
.block--hero .title * {
letter-spacing: 0;
color: inherit;
font-weight: 300;
}
@media (max-width: 767px) {
.block--hero .title {
font-size: 60px;
line-height: 70px;
}
}
@media (max-width: 575px) {
.block--hero .title {
font-size: 34px;
line-height: 40px;
}
}
.block--hero .title * {
color: inherit;
}
.block--hero .inner_blocks * {
color: inherit;
font-family: 'Avenir';
}
.block--hero .inner_blocks p {
font-weight: normal;
font-size: 18px;
letter-spacing: 0;
line-height: 28px;
}
.block--hero .button {
margin-top: 55px;
}
.block--hero .button-scroll_down {
position: absolute;
display: block;
width: 15px;
right: 50px;
bottom: 45px;
}
.block--hero .button-scroll_down img {
display: block;
width: 100%;
}