/*
=========================================
Reset
=========================================
*/

*,
*::before,
*::after{

    margin:0;

    padding:0;

    box-sizing:border-box;

}

html{

    scroll-behavior:smooth;

    -webkit-text-size-adjust:100%;

    text-size-adjust:100%;

}

body{

    background:var(--background);

    color:var(--text);

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

    line-height:1.7;

    min-width:320px;

    overflow-wrap:anywhere;

    -webkit-font-smoothing:antialiased;

    -moz-osx-font-smoothing:grayscale;

    overflow-x:hidden;

}

/*
=========================================
Container
=========================================
*/

.container{

    width:min(96%,var(--container));

    margin:auto;

}

/*
=========================================
Typography
=========================================
*/

h1,h2,h3,h4{

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

}

a{

    color:inherit;

    text-decoration:none;

}

img{

    display:block;

    max-width:100%;

    height:auto;

}

section{

    padding:clamp(72px,8vw,100px) 0;

    scroll-margin-top:110px;

}