/* ==========================================================================
   TYPOGRAPHY
   ========================================================================== */

body{

    font-family:var(--mut-font-body);

    font-size:var(--mut-text-base);

    color:var(--mut-text-body);

    line-height:var(--mut-leading-body);

    background:var(--mut-bg-body);

}

/*
|--------------------------------------------------------------------------
| Headings
|--------------------------------------------------------------------------
*/

h1,
h2,
h3,
h4,
h5,
h6{

    font-family:var(--mut-font-heading);

    color:var(--mut-text-heading);

    font-weight:var(--mut-fw-bold);

    line-height:1.2;

}

h1{

    font-size:clamp(2.8rem,5vw,4.8rem);

}

h2{

    font-size:clamp(2.2rem,4vw,3.5rem);

}

h3{

    font-size:clamp(1.8rem,3vw,2.5rem);

}

h4{

    font-size:1.6rem;

}

h5{

    font-size:1.25rem;

}

h6{

    font-size:1rem;

}

/*
|--------------------------------------------------------------------------
| Paragraph
|--------------------------------------------------------------------------
*/

p{

    margin-bottom:1.25rem;

}

/*
|--------------------------------------------------------------------------
| Links
|--------------------------------------------------------------------------
*/

a{

    transition:var(--mut-transition);

}

a:hover{

    color:var(--mut-primary);

}

/*
|--------------------------------------------------------------------------
| Strong
|--------------------------------------------------------------------------
*/

strong{

    font-weight:700;

}

/*
|--------------------------------------------------------------------------
| Selection
|--------------------------------------------------------------------------
*/

::selection{

    background:var(--mut-primary);

    color:#fff;

}