/****************/
/*  COMPONENTS*/

.container{
    max-width:120rem;
    padding: 0 3.2rem;
    margin:0 auto;
}
.grid{
    display:grid;
    column-gap:9.4rem;
    row-gap:9.6rem;
}
.grid:not(:la st-child){
    margin-bottom:9.6rem;
}
.grid-2-cols{
    grid-template-columns:repeat(2,1fr)
}
.grid-3-cols{
    grid-template-columns:repeat(3,1fr)
}
.grid-4-cols{
    grid-template-columns:repeat(4,1fr);
}

.grid-center-vertical{
    align-items:center;
}
.heading-primary,
.heading-secondary{
    font-weight:700;
    color:#333;
    letter-spacing:-0.5px;

}
.heading-primary{
    font-size:5.2rem;
    font-weight:700;
    line-height:1.05;
    color:#333;
    letter-spacing:-0.5px;
    margin-bottom:32px;
}

.heading-secondary{
    font-size:4.4rem;
    line-height:1.2;
    margin-bottom:9.6rem;
}
.heading-tertiary{
    font-size:3rem;
    line-height:1.2;
    margin-bottom:3.2rem;
}
.subheading{
    display:block;
    font-size:1.5rem;
    font-weight:500;
    color:var(--darker-color);
    text-transform:uppercase;
    margin-bottom:.6rem;
    letter-spacing:0.75px;
}
.btn,
.btn:link,
.btn:visited{
    display:inline-block;
    font-size:2rem;
    padding:1.6rem 3.2rem;
    text-decoration: none;
    border-radius:9px;
    transition:all 0.3s;
    font-weight:600;
    border:none;
    cursor:pointer;
    font-family:inherit;
}
.btn-full:link,
.btn-full:visited{
    background-color:var(--primary-color);
    color:#fff;
}
.btn-full:hover,
.btn-full:active{
    background-color:var(--darker-color);
   
}
.btn-outline:link,
.btn-outline:visited{
    background-color:#fff;
    color:#555
}
.btn-outline:hover,
.btn-outline:active{
    background-color:var(--lighter-color);
    box-shadow:inset 0 0 0 3px #fff;
}
.btn-form{
    background-color:#333;
    color:var(--lighter-color);
    align-self:end;
    padding:1.2rem;
    
}
.btn-form:hover{
    background-color:#fff;
    color:#555;
}
.link:link,
.link:visited{
    display:inline-block; 
    color:var(--primary-color);
    text-decoration:none;
    border-bottom:1px solid currentColor;
    padding-bottom:2px;
    transition:all 0.3s;
}
.link:hover,
.link:active{
    color:var(--darker-color);
    border-bottom:1px solid transparent;
}

.margin-right-sm{
    margin-right:1.6rem !important;
}
strong{
    font-weight:500;
}
.margin-bottom-md{
    margin-bottom:4.8rem !important
}
.center-text{
    text-align:center;
}