/* ==========================
   Reset général
   ========================== */

* {
    box-sizing: border-box;
}


html {
    scroll-behavior: smooth;
}


body {

    margin: 0;

    font-family:
        "Inter",
        Arial,
        sans-serif;

    color: #243447;

    background: #ffffff;

    line-height: 1.6;

}





/* ==========================
   Conteneur
   ========================== */

.container {

    width: min(1100px, 90%);

    margin: auto;

}





/* ==========================
   Accessibilité
   ========================== */

.skip-link {

    position: absolute;

    left: -9999px;

}


.skip-link:focus {

    left: 1rem;

    top: 1rem;

    background: white;

    padding: .5rem 1rem;

    border-radius: 6px;

    z-index: 1000;

}





/* ==========================
   Navigation
   ========================== */

nav {

    background: #102A43;

    color: white;

    box-shadow:
        0 2px 8px rgba(0,0,0,.12);

}



.nav-container {

    display: flex;

    justify-content: space-between;

    align-items: center;

    min-height: 72px;

}



.logo {

    color: white;

    text-decoration: none;

    font-size: 1.2rem;

    font-weight: 700;

}



.menu {

    display: flex;

    gap: 2rem;

    list-style: none;

    padding: 0;

    margin: 0;

}



.menu a {

    color: rgba(255,255,255,.8);

    text-decoration: none;

    font-weight: 500;

}



.menu a:hover,
.menu a.active {

    color: white;

}





/* ==========================
   Titres
   ========================== */

h1 {

    font-size: 2.2rem;

    color: #102A43;

    margin-bottom: 1rem;

}



h2 {

    color: #102A43;

    font-size: 1.7rem;

    margin-top: 2.5rem;

}



h3 {

    color: #102A43;

    margin-top: 0;

}





/* ==========================
   Contenu
   ========================== */

main {

    padding: 3.5rem 0;

}



section {

    margin-bottom: 3rem;

}





/* ==========================
   Cartes
   ========================== */

.card {

    background: white;

    border: 1px solid #e5e7eb;

    border-radius: 12px;

    padding: 1.5rem;

    margin-bottom: 1.5rem;

    box-shadow:
        0 4px 12px rgba(16,42,67,.06);

    display: flex;

    flex-direction: column;

}



.card:hover {

    box-shadow:
        0 8px 20px rgba(16,42,67,.10);

}



.chapter {

    border-left:
        4px solid #B08D57;

}





/* ==========================
   Grilles
   ========================== */


/* Cours et exercices ECT */

.resource-grid {

    display: grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 1.5rem;

}



/* DL, DS, colles */

.compact-grid {

    grid-template-columns:
        repeat(3, minmax(0, 1fr));

}



/* Annales */

.annales-grid {

    display: grid;

    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 1.5rem;

}



/* Accueil */

.home-grid {

    display: grid;

    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 1.5rem;

}





/* ==========================
   Documents
   ========================== */

.documents {

    display: flex;

    flex-direction: column;

    align-items: stretch;

    gap: .8rem;

    margin-top: auto;

}



.document-link {

    display: flex;

    align-items: center;

    gap: .5rem;

    width: 100%;

    padding: .55rem 1rem;

    border-radius: 8px;

    background: #f1f5f9;

    color: #102A43;

    text-decoration: none;

    font-weight: 500;

    transition:
        background .2s ease,
        transform .2s ease;

}



.document-link:hover {

    background: #e2e8f0;

    transform: translateX(3px);

}



.document-link::before {

    content: "";

    width: 9px;

    height: 9px;

    flex-shrink: 0;

    border-radius: 50%;

    background: #64748b;

}





/* ==========================
   Couleurs documents
   ========================== */

.document-link.cours::before {

    background: #B08D57;

}



.document-link.exercices::before {

    background: #2E5D8A;

}



.document-link.correction::before {

    background: #3A7D44;

}



.document-link.sujet::before {

    background: #102A43;

}



.document-link.rapport::before {

    background: #7B5EA7;

}





/* ==========================
   Annales
   ========================== */

details {

    border: 1px solid #e5e7eb;

    border-radius: 10px;

    padding: 1rem 1.5rem;

    margin-bottom: 1.5rem;

}



summary {

    cursor: pointer;

    color: #102A43;

    font-weight: 600;

}





/* ==========================
   Footer
   ========================== */

footer {

    background: #102A43;

    color: rgba(255,255,255,.85);

    text-align: center;

    padding: 2rem 0;

    margin-top: 3rem;

}





/* ==========================
   Responsive
   ========================== */


@media (max-width: 1000px) {


    .compact-grid,
    .annales-grid,
    .home-grid {

        grid-template-columns:
            repeat(2, minmax(0, 1fr));

    }

}





@media (max-width: 700px) {


    .nav-container {

        flex-direction: column;

        padding: 1rem 0;

    }



    .menu {

        flex-direction: column;

        gap: .7rem;

        margin-top: 1rem;

    }



    .resource-grid,
    .compact-grid,
    .annales-grid,
    .home-grid {

        grid-template-columns:
            1fr;

    }

}