body {
    overflow-x: hidden;
}
header > img {
    position: absolute;
}
#headerImg {
    width: 8%;
    position: absolute;
    margin-top: -20px;
    max-width: 130px;
}
.header-background {
    /*background: url("../images/cuisine/plat-6-Zn2mC2e.png");*/
    /*background-position: center 150px;*/
    /*background-size: cover;*/
    /*background-repeat: no-repeat;*/
    /*height: 700px;*/
    /*position: relative;*/
    /*z-index: 2;*/
}
.header-background h1 {
    position: relative;
    z-index: 2;
}
.golden-background {
    background-color: #dac373;
    z-index: 1;
    margin-top: -250px;
    padding: 250px 50px 0 50px;
}
.golden-background-blog {
    background-color: #dac373;
    z-index: 1;
    margin-top: -150px;
    padding: 150px 50px 0 50px;
}
.white-background {
    z-index: 2;
    background-color: #fff;
    margin-top: -180px;
    padding: 50px 50px 0 50px;
}
.white-background-blog {
    z-index: 2;
    background-color: #fff;
    margin-top: -10px;
    padding: 50px 50px 0 50px;
}
footer {
    background-color: #1B1E1F;
    color: #FFFFFF;
    margin-top: -100px;
    padding: 250px 50px 0 50px;
    margin-bottom: -25px
}
.display-inline {
    display: inline;
}
.headerBackgroundImage {
    z-index: 1;
    width: 100%;
    height: 550px;
    overflow: hidden;
    position: relative;
    margin-top: -145px;
    border-radius: 20px;
}
.headerBackgroundImageBlog {
    z-index: 1;
    width: 100%;
    height: 250px;
    overflow: hidden;
    position: relative;
    margin-top: -66px;
    border-radius: 20px;
}
/* Les images portent leurs dimensions réelles (width/height) pour réserver leur place avant
   chargement ; quand le CSS impose une largeur seule, la hauteur doit suivre le ratio de l'image.
   :where() garde une spécificité nulle : toute règle de classe (pied de page, badges, blog) prime. */
img:where([width][height]) {
    height: auto;
}
.headerBackgroundImage img {
    width: 100%;
    height: inherit;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 20px;
}
.socialNetworkFooterLink {
    margin-left: 10px;
    color: #fff !important;
}
/* Polices : WOFF2 d'abord (quatre fois plus léger), l'original en repli ; le texte reste
   visible pendant le chargement (font-display: swap). */
@font-face {
    font-family: 'ACaslonPro-Bold';
    src: url("../fonts/ACaslonPro-Bold-CWxCMJd.woff2") format('woff2'), url("../fonts/ACaslonPro-Bold-SXQuFri.otf") format('opentype');
    font-display: swap;
}

@font-face {
    font-family: 'Almarena-Mono-Bold';
    src: url("../fonts/Almarena-Mono-Bold-q5KXTLe.woff2") format('woff2'), url("../fonts/Almarena-Mono-Bold-S3GpszB.otf") format('opentype');
    font-display: swap;
}

@font-face {
    font-family: 'Almarena-Mono-Light';
    src: url("../fonts/Almarena-Mono-Light-V_nBZVc.woff2") format('woff2'), url("../fonts/Almarena-Mono-Light-xNYKGIg.otf") format('opentype');
    font-display: swap;
}

@font-face {
    font-family: 'TIMMONSNY';
    src: url("../fonts/TIMMONSNY-zSpB35B.woff2") format('woff2'), url("../fonts/TIMMONSNY-zY8s7-j.ttf") format('truetype');
    font-display: swap;
}

h1 {
    font-family: 'TIMMONSNY', serif;
    font-size: 15em;
    color: #1B1E1F;
    margin-top: -30px;
}
h2 {
    font-family: 'TIMMONSNY', serif;
    font-size: 8em;
    color: #e42223 !important;
}
.footer-title {
    color: #fff !important;
    font-size: 1em;
    font-family: 'Almarena-Mono-Light', sans-serif;
    letter-spacing: 2px;
    margin-bottom: 30px;
}
.rounded {
    border-radius: 20px !important;
}
.kitchen-presentation {
    padding: 0 100px;
    font-size: 1.5em;
    font-family: 'Arial', sans-serif;
    font-weight: bold;
    line-height: 1.3;
}
#img-decoration-2 {
    margin-top: 75px;
}
.about h3, p {
    font-family: 'Almarena-Mono-Light', sans-serif;
    letter-spacing: 2px;
    line-height: 2;
    font-size: 1em;
}
.red-mention {
    display: block;
    color: #e42223 !important;
    font-family: 'Almarena-Mono-Bold', serif;
    font-size: 2rem;
    letter-spacing: 4px;
    margin-top: -23px;
    position: relative;
    z-index: 3;
}
.short-icon-mofusan {
    width: 20%;
    margin-left: 30px;
}
.mt-0 {
    margin-top: 0;
}
.mt-80 {
    margin-top: 80px;
}
.mr-50 {
    margin-right: 50px;
}
.pl-50 {
    padding-left: 50px;
}
.pb-50 {
    padding-bottom: 50px !important;
}
.border-bottom, .desktop-border-bottom {
    border-bottom: #1B1E1F 2px solid !important;
}
.nav-link {
    color: #000;
    font-weight: 600;
}
.px-2 {
    padding-right: 1.5rem !important;
    padding-left: 1.5rem !important;
}
.link-secondary {
    color: #e42223 !important;
}
.btn-outline-primary {
    color: #1B1E1F;
    font-weight: 700;
    letter-spacing: 1.5px;
    border: #1B1E1F 2px solid;
    border-radius: 10px;
}
#hauteCuisineBadge {
    display: block;
    position: absolute;
    margin-top: -65px;
}
.footer-bottom-content {
    font-family: Arial,sans-serif !important;
    letter-spacing: .5px;
}
.footer-bottom-content p {
    font-family: Arial,sans-serif !important;
    letter-spacing: .5px;
    font-size: .8em;
}
.link-body-emphasis {
    color: #fff !important;
    text-decoration: none !important;
    font-size: .8em;
}
.link-body-emphasis:hover {
    color: #fff !important;
}
.footer-bottom-content a {
    color: #D9C372;
    text-decoration: none;
}
.footer-bottom-content a:hover {
    color: #D9C372;
    text-decoration: underline;
}
#footerFont ul li a {
    color: #fff !important;
    font-family: 'Arial', sans-serif;
    font-weight: 300;
}
.footer-sub-title {
    font-size: .8em;
    font-weight: 500;
    color: #fff !important;
    margin-bottom: 35px;
    font-family: 'Arial', sans-serif !important;
    letter-spacing: normal;
    line-height: 1.5;
}
.footer-content {
    font-family: 'Arial', sans-serif !important;
    font-weight: 600;
    line-height: 25px;
    letter-spacing: 1px;
}
.footer-content a {
    color: #fff;
    text-decoration: none;
}
.footer-picture {
    width: 300px;
    height:300px
}
.btn-outline-primary-white {
    display: inline;
    border: 2px solid #fff;
    color: #fff;
    font-family: 'Almarena-Mono-Bold', serif;
    border-radius: 10px;
    font-weight: 700;
    letter-spacing: 1.5px;
    padding-left: 20px;
    padding-right: 20px;
}
.btn-outline-primary-white:hover {
    border: 2px solid #fff;
    color: #1B1E1F;
    background-color: #fff;
}
.btn-outline-primary {
    padding-left: 20px;
    padding-right: 20px;
}
.btn-outline-primary:hover {
    border: 2px solid #1B1E1F;
    color: #fff;
    background-color: #1B1E1F;
}
.btn-outline-primary:active {
    border: 2px solid #1B1E1F !important;
    color: #fff !important;
    background-color: #1B1E1F !important;
}
.btn-outline-primary:focus {
    border: 2px solid #1B1E1F !important;
    color: #fff !important;
    background-color: #1B1E1F !important;
}
#inkBackground1 {
    position: absolute;
    right: 0;
    margin-top: -120px;
    margin-right: -100px;
    width: 35%;
}
#inkBackground2 {
    position: absolute;
    left: 0;
    margin-top: -120px;
    margin-left: -100px;
    width: 35%;
}
#img-decoration-2 {
    margin-top: 3rem;
}
.align-right {
    text-align: right;
}
.nav-link:hover {
    color: #e42223;
}
.link-secondary:hover {
    color: #000 !important;
}
.mb-40 {
    margin-bottom: 40px;
}
.mt-40 {
    margin-top: 40px;
}
.img-profile {
    max-height: 500px;
    object-fit: cover;
    object-position: top;
}
@media screen and (max-width: 767px) {
    #headerImg {
        position: relative;
        margin-top: 0;
        width: 20%;
        margin-left: 40%;
    }
    .header-background-image {
        margin-top: 58px;
    }

    #inkBackground1, #inkBackground2 {
        display: none;
    }
    .bookButton {
        float: left !important;
        margin-bottom: 25px;
        margin-top: 20px !important;
    }
    #firstSpan {
        float: left !important;
        margin-bottom: 0 !important;
        margin-top: 0 !important;
    }
    #secondSpan {
        float: left !important;
        margin-bottom: 0 !important;
        margin-top: 15px !important;
    }
    #secondPresentation1 {
        order: 2;
    }
    #secondPresentation2 {
        order: 1;
    }
    .pr-0 {
        padding-right: 0 !important;
    }
    .container, .container-sm {
         max-width: none;
    }
    .containerHeader {
        padding-left: 0 !important;
    }
    .me-2 {
         margin-right: 0 !important;
    }
    .mt-80 {
        margin-top: 25px;
    }
    .mobile-mt-40 {
        margin-top: 40px;
    }
    .mobile-mt-80 {
        margin-top: 80px;
    }
    .mobile-mt-75 {
        margin-top: 75px;
    }
    .mobile-mt-240 {
        margin-top: 90px;
    }
    .desktop-border-bottom {
        border-bottom: none !important;
    }
    .mobile-display-none {
        display: none;
    }
    h1 {
        font-size: 8em;
        margin-top: -15px;
    }
    h2 {
        font-size: 5em;
    }
    #img-decoration-2 {
        margin-top: 40px;
    }
    .kitchen-presentation {
        padding: 0;
        font-size: 1.2em;
        margin-bottom: -20px;
    }
    #cuisine-restaurant-bistronomique-lyon-mofusan {
        text-align: center;
    }
    .footer-picture {
        margin-top: 40px;
        width: 90%;
        margin-left: 5%;
        height: auto;
    }
    .prml-0 {
        margin-right: 0 !important;
        padding-right: 0 !important;
    }
    /* Les trois boutons du bloc d'action (réserver, carte, boissons) : même largeur,
       libellé sur une ligne, hauteur de cible tactile suffisante. */
    .footerButton {
        display: block;
        width: 100%;
        max-width: 240px;
        min-height: 44px;
        white-space: nowrap;
        text-align: center;
    }
    .footer-actions-menus {
        flex-direction: column;
        width: 100%;
    }
    footer {
        padding-top: 100px;
    }
    #footerFont {
        margin-top: 30px;
    }
    .footer-bottom-content a {
        display: inline-block;
    }
    .desktop-text-end {
        text-align: center !important;
    }
}
@media screen and (min-width: 768px) and (max-width: 991px) {
    .desktop-text-end {
        text-align: right !important;
        width: 100% !important;
    }
    #inkBackground1 {
        display: none;
    }
}
@media screen and (min-width: 992px) and (max-width: 1199px) {
    .desktop-text-end {
        text-align: right !important;
        /*width: 100% !important;*/
    }
}
@media screen and (min-width: 2000px) {
    .desktop-text-end {
        text-align: right !important;
        /*width: 100% !important;*/
    }
}
@media screen and (min-width: 768px) {
    .col-md-6, .col-6 {
        width: 45%;
        margin-right: 2.5%;
        margin-left: 2.5%;
    }
    .pt-170 {
        padding-top: 175px;
    }
    .mln-100 {
        margin-left: -100px;
    }
    .mln-250 {
        margin-left: -250px;
    }
    .mln-180 {
        margin-left: -180px;
    }
    .mln-110 {
        margin-left: -110px;
    }
    .mln-40 {
        margin-left: -40px;
    }
    .mln-30 {
        margin-left: -30px;
    }
    .ml-40 {
        margin-left: 40px;
    }
    .ml-110 {
        margin-left: 110px;
    }
    .mobile-mt-240 {
        margin-top: -50px;
    }
    #cuisine-restaurant-bistronomique-lyon-mofusan {
        margin-top: 20px;
    }
}
.articleTitle {
    font-size: 6em !important;
}
.lire-article-title {
    font-size: 4em;
}
.blog-picture {
    height: 250px !important;
    object-fit: cover;
}
/* --- Sélecteur de langue (drapeaux, dernier élément du menu) --- */
.language-switcher-item,
.language-switcher {
    /* Sans cela, le menu saturé rétrécit le sélecteur jusqu'à le faire
       disparaître : c'est le seul élément sans largeur minimale de contenu. */
    flex: 0 0 auto;
}
.language-switcher {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
/* Un seul drapeau est affiché, celui de la langue vers laquelle on bascule :
   c'est une action, donc pleine couleur. Le liseré reste neutre et discret,
   juste pour détacher les bandes blanches des drapeaux du fond blanc. */
.language-switcher-flag {
    flex: 0 0 auto;
    display: inline-flex;
    line-height: 0;
    border-radius: 2px;
    overflow: hidden;
    text-decoration: none;
    box-shadow: 0 0 0 1px rgba(27, 30, 31, .15);
    transition: opacity .15s ease-in-out;
}
/* Dimensions explicites : une largeur « auto » n'offrirait aucun plancher au
   flex du menu, qui écraserait le drapeau quand la place vient à manquer. Les
   deux drapeaux partagent le même gabarit 3:2, donc la même règle. */
.language-switcher-flag svg {
    display: block;
    width: 30px;
    height: 20px;
}
a.language-switcher-flag:hover,
a.language-switcher-flag:focus-visible {
    opacity: .7;
}
@media screen and (max-width: 767px) {
    .language-switcher {
        margin-top: 8px;
    }
    .language-switcher-flag svg {
        width: 36px;
        height: 24px;
    }
}

/* --- Badge Restaurant Guru (pied de page, sous « Nous suivre ») --- */
/* Deux sortes de règles. Celles qui annulent les styles globaux du site restent
   peu spécifiques, pour ne jamais prendre le pas sur Restaurant Guru. Celles qui
   corrigent leur feuille de style, chargée après celle-ci (dans le pied de
   page), ont besoin de #b-rcircle préfixé de .restaurant-guru-badge pour l'emporter. */

/* Le badge force `margin: 0 !important` sur lui-même : l'espacement se règle
   donc sur son conteneur, .footer-badges, qui le place à côté de l'écusson Gault&Millau. */
.footer-badges {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 20px 28px;
    margin-top: 30px;
}
/* Dans la rangée, le badge Restaurant Guru garde sa largeur de dessin : laissé à lui-même,
   l'élément flex le rétrécit jusqu'à son mot le plus long et l'écrase. */
.footer-badges .restaurant-guru-badge {
    flex: 0 0 148px;
    width: 148px;
    margin-top: 0;
}
/* L'écusson Gault&Millau est un disque jaune inscrit dans une image carrée à fond blanc :
   on le découpe en rond, légèrement à l'intérieur du bord pour ne laisser aucun liseré. */
.gault-millau-badge {
    display: inline-block;
    line-height: 0;
    transition: opacity .15s ease-in-out;
}
.gault-millau-badge:hover,
.gault-millau-badge:focus-visible {
    opacity: .85;
}
.gault-millau-badge img {
    width: 140px;
    height: 140px;
    border-radius: 50%;
    clip-path: circle(49.5% at 50% 50%);
}
/* Sur mobile, la colonne fait ~290 px : écart réduit pour garder les deux écussons côte à côte. */
@media screen and (max-width: 767px) {
    .footer-badges {
        gap: 20px 16px;
    }
    .gault-millau-badge img {
        width: 120px;
        height: 120px;
    }
}
/* La règle globale des <p> faisait sortir l'année dans la police du site et
   espaçait trop les lettres de « Recommandé ». */
.restaurant-guru-badge p {
    font-family: inherit;
    letter-spacing: inherit;
}
/* Bootstrap aligne les <svg> au milieu de la ligne : le texte courbe
   « Restaurant Guru » descendait de 4px et mordait sur les lauriers. */
.restaurant-guru-badge svg {
    vertical-align: baseline;
}
/* La boîte du badge (150 à 170px) est plus large que son dessin (148px), centré
   dedans : il apparaissait décalé de 10px par rapport aux liens au-dessus. */
.restaurant-guru-badge #b-rcircle {
    min-width: 0;
    max-width: 148px;
}
/* Bug de la variante blanche de Restaurant Guru : un `filter: invert(1)` passe
   en noir le texte « Restaurant Guru », qu'ils ont pourtant rempli en blanc. Il
   devenait invisible sur un fond sombre. */
.restaurant-guru-badge #b-rcircle:not(.b-rcircle_black) .b-rcircle_heading__link {
    filter: none;
}
/* Sur le fond sombre, le rouge de « Recommandé » (#972428) n'offre qu'un
   contraste de 2:1 : on l'affiche en blanc, comme le reste du pied de page. La
   variante blanche prévoit bien un bandeau blanc, mais Restaurant Guru colore
   directement le paragraphe en rouge, ce qui l'emporte sur le blanc hérité. On
   vise tous les paragraphes du bandeau, au cas où un futur badge afficherait
   son texte sur deux lignes. */
.restaurant-guru-badge #b-rcircle:not(.b-rcircle_black) .b-rcircle_bottom p {
    color: #fff;
}

/* --- Page Presse --- */
.press-media {
    color: #DAC373;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
}
.press-picture {
    height: 250px !important;
    object-fit: cover;
}

/* --- Avis Google (page d'accueil, section « Vos avis ») --- */
.google-reviews {
    margin-top: 40px;
    padding-bottom: 30px;
}
/* Même en-tête que les autres sections, suivi d'une ligne de synthèse en police du site. */
.google-reviews-summary {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px 20px;
    margin: -10px 0 35px;
    font-family: 'Almarena-Mono-Bold', serif;
    letter-spacing: 1.5px;
    line-height: 1.5;
}
.google-reviews-link,
.google-review-more,
.google-review-author a {
    color: #1B1E1F;
    text-decoration: underline;
    text-underline-offset: 3px;
}
.google-reviews-link:hover,
.google-review-more:hover,
.google-review-author a:hover {
    color: #e42223;
}
/* Étoiles : une rangée grise, recouverte d'une rangée dorée dont la largeur suit la note
   (--rating sur 5), pour représenter une moyenne comme 4,8. */
.google-stars {
    position: relative;
    display: inline-block;
    font-family: Arial, sans-serif;
    font-size: 1.4em;
    line-height: 1;
    letter-spacing: 2px;
    white-space: nowrap;
}
.google-stars-base {
    color: rgba(27, 30, 31, .2);
}
.google-stars-fill {
    position: absolute;
    top: 0;
    left: 0;
    overflow: hidden;
    width: calc(var(--rating, 0) / 5 * 100%);
    color: #DAC373;
}
.google-review {
    border-radius: 20px !important;
}
.google-review .card-body {
    padding: 30px;
}
.google-review-stars {
    font-size: 1.1em;
    margin-bottom: 15px;
}
.google-review-text {
    margin: 0 0 10px;
    font-family: 'Almarena-Mono-Light', sans-serif;
    font-size: .95em;
    letter-spacing: 1px;
    line-height: 1.7;
    quotes: '« ' ' »';
}
.google-review-text::before {
    content: open-quote;
}
.google-review-text::after {
    content: close-quote;
}
/* Tronqué à l'écran seulement : le texte complet reste dans la page, et le lien
   « Voir cet avis sur Google » mène à l'avis entier. */
.google-review-text--clamped {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 9;
    line-clamp: 9;
    overflow: hidden;
}
.google-review-more {
    display: inline-block;
    margin-bottom: 25px;
    font-family: 'Almarena-Mono-Light', sans-serif;
    font-size: .85em;
    letter-spacing: 1px;
}
/* <figure> pour la citation et sa source ; pas de <footer>, que les styles globaux
   du pied de page transformeraient en bloc noir. */
.google-review-figure {
    margin: 0;
}
.google-review-author {
    display: flex;
    align-items: center;
    gap: 12px;
    font-family: Arial, sans-serif;
    font-size: .9em;
}
.google-review-avatar {
    flex: 0 0 auto;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    object-fit: cover;
}
.google-review-author-name {
    display: flex;
    flex-direction: column;
    line-height: 1.4;
}
.google-review-author-name a {
    font-weight: 700;
    text-decoration: none;
}
.google-review-author time {
    color: rgba(27, 30, 31, .7);
    font-size: .9em;
}
.google-reviews-footer {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 15px 25px;
    margin-top: 10px;
}
/* Attribution exigée par Google hors d'une carte : logo officiel de 16 à 19 px de haut,
   marges de 10 px (5 px en bas), dans le même bloc que les avis. */
.google-reviews-attribution {
    display: flex;
    align-items: center;
    margin: 0;
    font-family: Arial, sans-serif;
    font-size: .85em;
    font-weight: 700;
    letter-spacing: .5px;
    line-height: 1.5;
}
.google-reviews-attribution-logo {
    height: 19px;
    width: auto;
    margin: 10px 10px 5px;
}
.google-review-translated {
    margin-bottom: 10px;
    font-family: Arial, sans-serif;
    font-size: .8em;
    color: rgba(27, 30, 31, .7);
}
.google-reviews-disclaimer {
    margin: 20px 0 0;
    font-family: Arial, sans-serif;
    font-size: .8em;
    letter-spacing: .3px;
    line-height: 1.6;
    color: rgba(27, 30, 31, .7);
}
.google-reviews-disclaimer a {
    color: inherit;
    text-decoration: underline;
    text-underline-offset: 3px;
}
@media screen and (max-width: 767px) {
    .google-reviews-summary {
        margin-top: 0;
    }
    .google-review .card-body {
        padding: 25px 20px;
    }
    .google-reviews-write {
        margin-top: 10px;
    }
}

/* --- Pied de page : bloc d'action (réserver, puis la carte et les boissons) --- */
.footer-actions {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
}
.footer-actions-menus {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}
/* RÉSERVER, l'action principale, en plein ; la carte et les boissons restent cerclées.
   C'est l'état survolé des boutons blancs, et l'inverse au survol. */
.btn-footer-primary {
    background-color: #fff;
    color: #1B1E1F;
}
.btn-footer-primary:hover,
.btn-footer-primary:focus-visible {
    background-color: transparent;
    color: #fff;
}

/* --- Accueil : signature du titre et section quartier --- */
/* Sous le grand « MOFUSAN », une ligne qui dit ce qu'est le lieu. Elle chevauche la photo
   d'en-tête : un fond sombre arrondi la garde lisible quelle que soit l'image. */
.site-tagline {
    display: table;
    /* Collée sous « MOFUSAN » : la boîte de ligne du titre (police de 240 px) laisse sinon un grand vide. */
    margin: -2.3em auto 0;
    padding: .5em 1.4em;
    border-radius: 999px;
    background: rgba(27, 30, 31, .8);
    font-family: 'Almarena-Mono-Bold', serif;
    font-size: .11em;
    letter-spacing: 4px;
    line-height: 1.3;
    color: #fff;
}
.home-access {
    margin-top: 40px;
    padding-top: 40px;
    border-top: #1B1E1F 2px solid;
}
.home-access-subtitle {
    display: block;
    margin-top: 40px;
    font-family: 'Almarena-Mono-Bold', serif;
    font-size: 1.4rem;
    letter-spacing: 3px;
    color: #e42223 !important;
}
.home-access-actions .btn {
    margin: 10px 10px 0 0;
}
@media screen and (max-width: 767px) {
    .site-tagline {
        margin-top: -1.2em;
        padding: .4em 1em;
        font-size: .17em;
        letter-spacing: 2px;
    }
    .home-access-subtitle {
        margin-top: 10px;
        font-size: 1.1rem;
    }
}

/* --- Pages éditoriales (la carte, le chef, accès) : contenu saisi dans l'admin --- */
/* La typographie est portée par le conteneur : un bloc que l'éditeur écrirait en <div>
   garde l'aspect d'un paragraphe. */
.page-body {
    font-family: 'Almarena-Mono-Light', sans-serif;
    letter-spacing: 2px;
    line-height: 2;
}
/* La police de titre (TIMMONSNY) n'a pas de minuscules : on force les capitales,
   quelle que soit la casse saisie. Un <h1> collé depuis un autre site prend l'aspect d'un intertitre. */
.page-body h1,
.page-body h2 {
    margin-top: 50px;
    font-family: 'TIMMONSNY', serif;
    font-size: 3.2em;
    line-height: 1;
    letter-spacing: normal;
    text-transform: uppercase;
    color: #e42223;
}
.page-body h1:first-child,
.page-body h2:first-child {
    margin-top: 0;
}
.page-files .btn {
    margin: 0 10px 10px 0;
}
.page-body h3 {
    margin-top: 35px;
    font-family: 'Almarena-Mono-Bold', serif;
    font-size: 1.15rem;
    letter-spacing: 2px;
    color: #e42223;
}
.page-body ol,
.page-body ul {
    font-family: 'Almarena-Mono-Light', sans-serif;
    letter-spacing: 2px;
    line-height: 2;
    padding-left: 1.5rem;
}
.page-body a {
    color: #e42223;
    text-decoration: underline;
    text-underline-offset: 3px;
}
.page-body a:hover {
    color: #1B1E1F;
}
@media screen and (max-width: 767px) {
    .page-body h1,
    .page-body h2 {
        font-size: 2.4em;
    }
    /* Titres de page longs : 6em (96 px) donnerait cinq à sept lignes sur un téléphone. */
    .articleTitle.page-title {
        font-size: clamp(2.5em, 12vw, 6em) !important;
        line-height: 1.05;
    }
}

/* --- Presse : distinctions --- */
.press-awards {
    list-style: none;
    padding: 0;
    font-family: 'Almarena-Mono-Light', sans-serif;
    letter-spacing: 2px;
    line-height: 2;
}
.press-awards a {
    color: #1B1E1F;
    text-decoration: underline;
    text-underline-offset: 3px;
}
.press-awards a:hover {
    color: #e42223;
}
/* Logo exigé par Google à côté d'une note issue de ses services, sans modification. */
.press-awards-google-logo {
    height: 16px;
    width: auto;
    margin-left: 8px;
    vertical-align: middle;
}

/* --- En-tête : logo, menu et bouton Réserver ---
   Le logo occupe sa place dans l'en-tête (il ne déborde plus dessous, où il passait sous le
   menu ou sous la photo des pages) : menu et bouton s'alignent sur son milieu. Une seule ligne
   dès 992 px ; sur tablette, menu centré sous le logo et le bouton ; sur téléphone, la
   disposition empilée d'origine. */
@media screen and (min-width: 768px) {
    .site-header .header-logo {
        flex: 0 0 auto;
        width: min(8vw, 130px);
    }
    .site-header #headerImg {
        position: static;
        width: 100%;
        max-width: none;
        height: auto;
        margin-top: 0;
    }
    .site-header .header-book {
        flex: 0 0 auto;
        /* !important : .desktop-text-end impose width: 100% !important sur tablette. */
        width: auto !important;
        margin-left: auto;
    }
    .site-header .header-book .btn {
        float: none !important;
        margin-right: 0 !important;
        white-space: nowrap;
    }
    .site-header .header-nav .nav-link {
        white-space: nowrap;
    }
}
@media screen and (min-width: 768px) and (max-width: 991.98px) {
    .site-header .header-nav {
        order: 3;
        flex: 0 0 100%;
        justify-content: center !important;
        margin-top: 12px;
    }
}
@media screen and (min-width: 992px) {
    .site-header {
        flex-wrap: nowrap !important;
        column-gap: 16px;
    }
    /* Retour à la ligne permis en dernier recours (police plus large que prévu), sans chevauchement. */
    .site-header .header-nav {
        flex: 1 1 auto;
        width: auto;
        min-width: 0;
        flex-wrap: wrap;
        justify-content: center !important;
    }
    .site-header .header-nav .nav-link {
        padding: 8px 5px !important;
        font-size: 13.5px;
    }
    .site-header .header-book {
        margin-left: 0;
    }
}
@media screen and (min-width: 1200px) {
    .site-header .header-nav .nav-link {
        padding: 8px 8px !important;
        font-size: 15px;
    }
}
@media screen and (min-width: 1400px) {
    .site-header .header-nav .nav-link {
        padding: 8px 12px !important;
        font-size: 16px;
    }
}

/* --- Bandeau de consentement (mesure d'audience) ---
   Fixé en bas d'écran, sans bloquer la visite ; « Refuser » et « Accepter » ont le même aspect. */
.consent-banner {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1050;
    padding: 18px 0;
    background: #fff;
    border-top: 2px solid #1B1E1F;
    box-shadow: 0 -6px 24px rgba(27, 30, 31, .12);
}
.consent-banner[hidden] {
    display: none !important;
}
.consent-inner {
    display: flex;
    align-items: center;
    gap: 24px;
}
.consent-text {
    flex: 1 1 auto;
}
.consent-text p {
    margin: 0;
    font-size: .9rem;
    line-height: 1.6;
    color: #1B1E1F;
}
.consent-text .consent-title {
    margin-bottom: 4px;
    font-family: 'Almarena-Mono-Bold', serif;
    font-size: 1rem;
    text-transform: uppercase;
}
.consent-text a {
    color: #1B1E1F;
    text-decoration: underline;
    text-underline-offset: 3px;
}
.consent-actions {
    flex: 0 0 auto;
    display: flex;
    gap: 12px;
}
.consent-button {
    min-width: 130px;
}
@media screen and (max-width: 767px) {
    .consent-banner {
        padding: 14px 0;
    }
    .consent-inner {
        flex-direction: column;
        align-items: stretch;
        gap: 12px;
    }
    .consent-text p {
        font-size: .8rem;
        letter-spacing: 1px;
    }
    .consent-button {
        flex: 1 1 0;
        min-width: 0;
    }
}
/* « Gestion des cookies » : un bouton qui a l'aspect du lien « Mentions légales » voisin. */
.footer-link-button {
    padding: 0;
    border: 0;
    background: none;
    font-family: inherit;
    letter-spacing: inherit;
    line-height: inherit;
    cursor: pointer;
}
.footer-link-button:hover,
.footer-link-button:focus-visible {
    text-decoration: underline !important;
}
.footer-link-button[hidden] {
    display: none !important;
}
