.brand{
display:flex;
align-items:center;
gap:8px
}
.brand img{
display:block;
width:212px;
height:auto
}
.button{
display:inline-flex;
align-items:center;
gap:26px;
padding:15px 18px 15px 20px;
font-size:13px;
font-weight:800;
transition:transform var(--transition),background var(--transition)
}
.button:hover{
transform:translateY(-3px)
}
.button-primary,.button-teal{
background:var(--color-teal);
color:var(--color-primary)
}
.button-dark{
background:var(--color-primary);
color:#fff
}
.text-link{
border-bottom:1px solid currentColor;
padding-bottom:4px;
font-size:13px;
font-weight:800
}
.text-link span{
margin-left:16px
}
.section-head{
display:flex;
align-items:end;
justify-content:space-between;
margin-bottom:var(--space-5)
}
.section-head h2{
margin:0
}
.reveal{
opacity:1;
transform:none
}
.js .reveal{
opacity:0;
transform:translateY(20px);
transition:opacity .7s ease,transform .7s ease
}
.js .reveal.visible{
opacity:1;
transform:none
}
@media (prefers-reduced-motion:reduce){
.js .reveal{
opacity:1;
transform:none;
transition:none
}
}