#splash{ display: flex; flex: none; align-items: center; justify-content: center; padding: 1em 3em; }
#splash div{ display: flex; flex: none; width: 100%; aspect-ratio: 2.75/1; background: url(images/splash.jpg) center calc( 50% - 3em ) no-repeat; background-size: cover; border-radius: 4em;  }

.accordeon{ padding: 1em 3em; }
.accordeon a{ text-decoration: none; display: block; padding: 1em 6em; font-weight: bold; color: var(--second-text); background: var(--sec-color-grad3); border-radius: 1em; }
.accordeon > section{ margin-bottom: 1em; font-size: 2.25em; }
.accordeon > section:first-of-type .lien{ display: none; }
.accordeon > section:not(:first-of-type) .panel{ display: none; }

.accordeon .panel{ overflow: hidden; border-radius: 1em; color: var(--reverse-text); }
.accordeon .panel div{ display: flex; flex: none; flex-direction: column; width: 100%; min-height: 29em; padding: 2em 6em; background: #0007; }
.accordeon .panel ul{ margin: 0; padding: 0; list-style-type: none; }
.accordeon .panel p{ width: 32em; text-align: justify;  }
.accordeon .panel h3{ display: flex; flex: none; align-items: center; }
.accordeon .panel h3 i{ display: inline-block; width: 1em; aspect-ratio: 1/1; margin-right: 0.33em; background: var(--reverse-text); border-radius: 100%; }
.accordeon .panel h3 span{ flex: 1; }

#agri .panel{ background: url(images/agri.jpg) top center no-repeat; background-size: cover; }
#cosm .panel{ background: url(images/cosm.jpg) center center no-repeat; background-size: cover; }
#mat .panel{ background: url(images/mat.jpg) top center no-repeat; background-size: cover; }
#nrg .panel{ background:  url(images/nrg.jpg) top center no-repeat; background-size: cover; }