h1 {
    color: rgb(12, 12, 30);
    box-shadow: 0 4px 6px rgba(0,0,0,0.1);
    text-align: center;
    font-family:ph_title, sans-serif
}

h2 {
    color: rgb(13, 13, 30);
    text-align: center;
}

p {
    color: #d52d00;
    text-align: center;
}
bold {
    color: #d52d00; 
    text-align : center;
}

body { font-family: ph_body, sans-serif; background-color: #f4f4f9; color: #333; margin: 0; }
        header { background-color: #2c3e50; color: white; padding: 20px; text-align: center; }
        .container { max-width: 800px; margin: 40px auto; padding: 20px; background: white; border-radius: 8px; box-shadow: 0 4px 6px rgba(0,0,0,0.1); }
header { background-color: #2c3e50; color: white; padding: 30px; text-align: center; }
section { max-width: 900px; margin: 40px auto; padding: 0 20px; }

.dernier-numero { background: white; padding: 30px; border-radius: 8px; box-shadow: 0 4px 10px rgba(0,0,0,0.1); text-align: center; border-top: 5px solid #d52d00; }
.gros-bouton { display: inline-block; background: #ef7627; color: white; padding: 15px 30px; text-decoration: none; border-radius: 5px; font-weight: bold; font-size: 1.2em; margin-top: 15px; }
.gros-bouton:hover { background: #d52d00; }


.titre-annee { border-bottom: 2px solid #bdc3c7; color: #2c3e50; padding-bottom: 5px; margin-top: 40px; }
.grille-annee { display: flex; flex-wrap: wrap; gap: 20px; margin-top: 20px; }

.carte-journal { background: white; border-radius: 8px; width: calc(33.333% - 14px); box-shadow: 0 2px 5px rgba(0,0,0,0.05); display: flex; flex-direction: column; overflow: hidden; }
.icone-pdf { background: #ecf0f1; color: #7f8c8d; font-size: 1.5em; font-weight: bold; text-align: center; padding: 40px 0; border-bottom: 1px solid #e0e0e0; }
.infos-journal { padding: 15px; text-align: center; flex-grow: 1; display: flex; flex-direction: column; justify-content: space-between; }
.infos-journal h4 { margin: 0 0 15px 0; font-size: 1.1em; color: #34495e; }
.bouton-lire { background: #b55690; color: white; text-decoration: none; padding: 8px; border-radius: 4px; display: block; font-weight: bold; }
.bouton-lire:hover { background: #a30262; }

@media (max-width: 768px) {
    .carte-journal { width: calc(50% - 10px); }
}
@media (max-width: 480px) {
    .carte-journal { width: 100%; }
}

@font-face {
  font-family: ph_title; /* set name */
  src: url('assets/fonts/BBBPoppinsTN-TextBold.otf'); /* url of the font */
}

@font-face {
  font-family: ph_body; /* set name */
  font-weight: normal;
  src: url('assets/fonts/Archivo.ttf'); /* url of the font */
}

.logo-ph {
    display: block;
    margin-left: auto;
    margin-right: auto;
    margin-top: 15px;
    width: 10%;
}

.petit-ph {
    position: relative;
    top: 7px;
    width: 20px;
    margin: 2px
}