/* ==========================================================
   HERITAGE COLLECTION™
   LAYOUT
   CONTAINER
========================================================== */

.container{

    width:100%;

    max-width:var(--container-width);

    margin:0 auto;

    padding-left:32px;

    padding-right:32px;

}

.container-lg{

    max-width:var(--container-lg);

}

.container-md{

    max-width:var(--container-md);

}

.container-sm{

    max-width:var(--container-sm);

}

/* ==========================================================
   SECTION
========================================================== */

.section{

    position:relative;

    padding:140px 0;

    overflow:hidden;

}

.section-sm{

    padding:90px 0;

}

.section-lg{

    padding:180px 0;

}

.section-dark{

    background:var(--color-background);

}

.section-surface{

    background:var(--color-surface);

}

.section-gradient{

    background:

    linear-gradient(

        180deg,

        var(--color-background),

        var(--color-background-alt)

    );

}

/* ==========================================================
   CONTENT WIDTH
========================================================== */

.content{

    max-width:820px;

}

.content-wide{

    max-width:1080px;

}

.content-full{

    max-width:none;

}

/* ==========================================================
   SPACING HELPERS
========================================================== */

.mt-0{margin-top:0;}

.mt-16{margin-top:16px;}

.mt-24{margin-top:24px;}

.mt-32{margin-top:32px;}

.mt-48{margin-top:48px;}

.mt-64{margin-top:64px;}

.mt-80{margin-top:80px;}

.mb-0{margin-bottom:0;}

.mb-16{margin-bottom:16px;}

.mb-24{margin-bottom:24px;}

.mb-32{margin-bottom:32px;}

.mb-48{margin-bottom:48px;}

.mb-64{margin-bottom:64px;}

.mb-80{margin-bottom:80px;}

/* ==========================================================
   FLEX HELPERS
========================================================== */

.flex{

    display:flex;

}

.flex-center{

    display:flex;

    align-items:center;

    justify-content:center;

}

.flex-between{

    display:flex;

    align-items:center;

    justify-content:space-between;

}

.flex-column{

    display:flex;

    flex-direction:column;

}

/* ==========================================================
   RESPONSIVE
========================================================== */

@media (max-width:1200px){

    .container{

        padding-left:28px;

        padding-right:28px;

    }

}

@media (max-width:992px){

    .section{

        padding:110px 0;

    }

    .section-lg{

        padding:140px 0;

    }

}

@media (max-width:768px){

    .container{

        padding-left:20px;

        padding-right:20px;

    }

    .section{

        padding:80px 0;

    }

    .section-lg{

        padding:100px 0;

    }

}