/* ==========================================
   Layout
========================================== */

.container{

    width:min(1280px,90%);

    margin-inline:auto;

}

.section{

    padding:6rem 0;

}

.grid{

    display:grid;

    gap:2rem;

}
/* =======================================================
   Section Header
======================================================= */

.section-header{

    max-width:700px;

    margin:0 auto 5rem;

    text-align:center;

}

.section-kicker{

    display:inline-block;

    margin-bottom:1rem;

    color:var(--accent-light);

    font-size:.75rem;

    font-weight:500;

    letter-spacing:3px;

    text-transform:uppercase;

}

.section-header h2{

    margin-bottom:1rem;

}

.section-header p{

    max-width:60ch;

    margin:0 auto;

}
/* =======================================================
   Card Grid
======================================================= */

.card-grid{

    display:grid;

    grid-template-columns:repeat(auto-fit, minmax(320px, 1fr));

    gap:2rem;

}