/**** INTRO AND HISTORY ****//**** INTRO AND HISTORY ****//**** INTRO AND HISTORY ****/

#about-intro {background-color: var(--color-bg-primary);}
#about-intro .lead {max-width: 62ch;}
#history {background-color: var(--color-bg-light);}
#documents {background-color: var(--color-bg-secondary);}
#documents p {max-width: var(--text-width);}
.documents {display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); width: 100%; max-width: none; gap: var(--space-md); margin: var(--space-xl) 0px 0px 0px; padding: 0px; list-style: none;}
.documents li {min-width: 0px; margin: 0px;}
#mission {color: var(--color-bg-secondary); background-color: var(--color-navy-dark);}
#mission h2, #mission h3 {color: var(--color-bg-light);}
#mission p {color: var(--color-bg-secondary);}

/**** ABOUT GRIDS ****//**** ABOUT GRIDS ****//**** ABOUT GRIDS ****/

#values {background-color: var(--color-bg-primary);}
#values .cards, #structure .cards {display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); margin: var(--space-xl) 0px 0px 0px;}
#today {background-color: var(--color-bg-secondary);}
#today .facts {margin: var(--space-xl) 0px 0px 0px;}
#structure {background-color: var(--color-bg-primary);}
#base {background-color: var(--color-bg-light);}
#contests {background-color: var(--color-bg-secondary);}
#contests .cards {display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); margin: var(--space-xl) 0px 0px 0px;}
#activity {background-color: var(--color-bg-primary);}
#activity h3 {margin: var(--space-lg) 0px var(--space-xs) 0px;}

/**** MEDIA 1350 ****//**** MEDIA 1350 ****//**** MEDIA 1350 ****/

@media (max-width: 1350px) {
    #values .cards, #structure .cards {grid-template-columns: repeat(2, minmax(0px, 1fr));}
}

/**** MEDIA 750 ****//**** MEDIA 750 ****//**** MEDIA 750 ****/

@media (max-width: 750px) {
    .documents {grid-template-columns: 1fr;}
    #values .cards, #structure .cards, #contests .cards {grid-template-columns: 1fr;}
}