/*
Theme Name: La couleur du Zèbre
Theme URI:
Author: LCDZ
Author URI:
Description: Thème de l'agence
Requires at least: 6.7
Tested up to: 6.7
Requires PHP: 5.7
Version:
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Template: twentytwentyfive
Text Domain: la-couleur-du-zebre
Tags:
*/

.wp-site-blocks{
    padding: 0;
}

.entry-content{
    position : relative;
    z-index : 0;
}

.banniere_hero {
    position: relative;
    z-index: 0;
    overflow: hidden;
}
.banniere_hero::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(359deg, rgba(0, 160, 210, 0.00) 13.36%, rgba(0, 76, 131, 0.30) 46.7%, rgba(1, 39, 67, 0.60) 95.91%),
    linear-gradient(0deg, rgba(6, 32, 51, 0.30) 0%, rgba(6, 32, 51, 0.30) 100%);
    z-index: 1;
    pointer-events: none;
}

.banniere_hero .wp-block-cover__inner-container {
    position: relative;
    z-index: 2 !important;
}

/* Positionnement du bouton Réserver */
.reserver_sticky {
    position: fixed;
    right: 0;
    top: 80%;
    transform: translateY(-50%);
    z-index: 9999;
    transition: all 0.3s ease;
}

/* Effet au survol */
.reserver_sticky:hover {
    padding-right: 30px;
}

.titre .titre {
    display: inline-block;
    position: relative;
}

.titre::after {
    content: ""; /* Obligatoire pour que le pseudo-élément s'affiche */
    display: inline-block;

    /* Dimensions de ton image */
    width: 141px;
    height: 32px;

    /* Lien vers ton image */
    background: url('https://reserver.plan-incline.com/wp-content/uploads/2026/03/vague.svg') no-repeat center center;
    background-size: contain; /* L'image s'adapte à la taille du bloc */

    /* Ajustement de la position */
    vertical-align: bottom;
    margin-left: 10px; /* Espace entre le texte et l'image */
}

.boutonlarge {
    display: block !important;
    width: 100% !important;
    margin-left: 0;
    margin-right: 0;
}

.titre2 {
    display: block; /* Le titre prend toute la largeur pour permettre le centrage */
    text-align: center; /* Centre le texte du titre */
    position: relative;
}

.titre2::after {
    content: "";
    display: block; /* Force le passage à la ligne sous le texte */

    /* Dimensions de ton image */
    width: 141px;
    height: 32px;

    /* Centrage horizontal */
    margin: 10px auto 0 auto; /* 10px en haut, auto à gauche/droite pour centrer */

    /* Ton image SVG */
    background: url('https://reserver.plan-incline.com/wp-content/uploads/2026/03/vague.svg') no-repeat center center;
    background-size: contain;
}

/* On prépare le paragraphe pour accueillir le cercle */
.numero {
    position: relative;
    display: flex;
    align-items: center;    /* Centre verticalement */
    justify-content: center; /* Centre horizontalement */
    text-align: center;
    min-height: 80px;        /* Doit être au moins aussi haut que le cercle */
    z-index: 1;              /* Force le texte à rester au premier plan */
}

/* On crée le cercle en arrière-plan */
.numero::before {
    content: "";
    position: absolute;
    z-index: -1;             /* Place le cercle DERRIÈRE le texte */

    /* Taille du cercle */
    width: 25px;
    height: 25px;

    /* Apparence */
    background-color: #E84E0F;
    border-radius: 50%;      /* Transforme le carré en cercle parfait */

    /* Centrage parfait du cercle par rapport au paragraphe */
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.titre3 {
    display: inline-block; /* Indispensable pour que le titre ne prenne pas toute la largeur */
    position: relative;    /* Sert de point d'ancrage à l'image */
    margin-bottom: 40px;   /* Espace pour ne pas que l'image chevauche le contenu suivant */
}

.titre3::after {
    content: "";
    position: absolute;

    /* Positionnement : en dessous et aligné à droite */
    top: calc(100% + 10px); /* 100% (bas du texte) + 10px d'écart */
    right: 0;               /* Aligné sur le bord droit du titre */

    /* Dimensions demandées */
    width: 231px;
    height: 27px;

    /* Image de la vague blanche */
    background: url('https://reserver.plan-incline.com/wp-content/uploads/2026/03/vagueblanc.svg') no-repeat center center;
    background-size: contain;
}
.logoPI {
    position: relative;
    display: inline-block;
    z-index: 1;
    padding: 13px 20px 20px 20px;
}
.logoPI::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: -1;
    background: #FFFFFF;
    border-radius: 0 0 170px 180px;
}

header {
    z-index: 500;
}

.header .wp-block-group {
    position : relative;
    z-index : 10;
}
.wp-block-group .wpml-language-switcher-block{
    width: 40px !important;
    margin: 0;
    border: solid 2px #FFFFFF;
    border-radius: 50%;
    height: 40px;
    display: flex !important;
    align-items: center;
    justify-content: center;
    padding: 0;
}
.wp-block-navigation__container{
    align-items: center;
    justify-content: center;
}

.colonnes2 .wp-block-cover {
    height: 150px !important;
}


footer{
    margin-block-start: 0;
}
.wp-block-image>a, .wp-block-image>figure>a
{
    display: flex;
    align-items: center;
    justify-content: center;
}
.div-btn{
    position:relative;
}

@media screen and (max-width : 425px){
    .btn-header a{
        font-size: 12px;
        padding-left: 15px;
        padding-right: 15px;
    }
}

@media screen and (max-width : 320px){
    .btn-header a{
        font-size: 8px;
        padding: 8px;
    }
}