.mainGrid {grid-template-columns: [full-start] minmax(var(--min-column-size), .5fr) [content-start] repeat(12, minmax(var(--min-column-size), 1fr)) [content-end] minmax(var(--min-column-size), .5fr) [full-end]}

.page_sommaire main section,.recently section {--count-column: 2}
.intro, .spotlight {grid-column: span 2}    
.spotlight article > * {grid-column: 1;grid-row: 1;z-index: 1}
.spotlight .content {align-self: end;padding: var(--space-l); padding-right: 25%}        
.spotlight .logo {z-index: 0}  
.spotlight h3 {font-size: var(--size-step-3)}
.spotlight :is(h3 a, .date) {color: white}
.spotlight .tag.rub {background-color: transparent}   
.spotlight .tag {border-color:white;color: white}
.tag.selection {border-color: #FF8383}  
.spotlight .date {margin-bottom: var(--space-2xs)} 
.highlight { margin-top: var(--space-m)} 
.h2--spotlight,.h2--recently,
.recently header {grid-column: span 2}
.page_sommaire main section, .row--third {grid-column-gap: var(--space-m)}
.row--third {grid-column: span 2; --count-column: 2}

.footer_actus section {
    --count-column: 2;
    grid-column: 2 / -2}
.footer_actus header {grid-column: span 2}
.footer_actus article {display: flex}
.footer_actus .logo {
    max-width: 33%;
    margin-right: var(--space-s)}
.recently :is(h3, .h3) {font-size: var(--size-step-1)}
.footer_actus :is(h3, .h3) {font-size: var(--size-step-0)}

.btn-group > * {flex:0}