/* ======= Ajustements Ginko Body Art ======= */

/* Images de fond responsives
   - L'effet « fixed » est désactivé partout : il dimensionne l'image sur tout l'écran
     au lieu du bandeau (photos très zoomées), et iOS/Safari l'agrandit à toute la page.
   - Sur tablette et téléphone, les bandeaux plein écran sont moins hauts pour
     limiter le recadrage des photos en paysage.
   - Le point de cadrage peut être réglé par page avec la variable --bg-pos-mobile
     (ex. style="--bg-pos-mobile: 70% center"). */
.bg-fixed {
    background-attachment: scroll !important;
}
/* Sur ordinateur, les bandeaux suivent le format des photos (16:9) sans dépasser
   la hauteur de l'écran : on voit la photo entière au lieu d'une fine bande. */
@media screen and (min-width: 992px) {
    .banner-header {
        min-height: min(56.25vw, 100vh);
    }
}
@media screen and (max-width: 991px) {
    .bg-img {
        background-position: var(--bg-pos-mobile, center);
    }
    .banner-header.full-height {
        min-height: 70vh;
    }
    /* Les titres ne doivent jamais être coupés au milieu d'un mot */
    .banner-header h1,
    .banner-header h2 {
        font-size: 44px;
        overflow-wrap: normal;
        word-wrap: normal;
    }
}
/* Tablette : le menu tient sur une ligne sans que les liens se touchent */
@media screen and (min-width: 768px) and (max-width: 991px) {
    .navbar .logo-img {
        width: 170px !important;
    }
    .navbar .navbar-nav .nav-link {
        font-size: 13px;
        letter-spacing: 1px;
        padding-left: 8px;
        padding-right: 8px;
    }
}
@media screen and (max-width: 575px) {
    .banner-header {
        padding: 200px 0 70px;
    }
    .banner-header.full-height {
        min-height: 60vh;
    }
    /* Le contenu centré en absolu passerait sous le logo : on le remet dans le flux */
    .banner-header .v-middle {
        position: relative;
        top: auto;
        transform: none;
    }
    /* Titres des bandeaux à une taille qui tient sur un téléphone */
    .banner-header h1 {
        font-size: 36px;
        letter-spacing: 2px;
    }
    .banner-header h2 {
        font-size: 40px;
        line-height: 1.15em;
        letter-spacing: 2px;
    }
    .banner-header h4 span {
        letter-spacing: 3px;
    }
    .section-title {
        font-size: 34px;
    }
}