/* Boutons, cartes, témoignages, bandeaux, etc. */


/* Call To Action */
/* -------------------------------------- */
.ctaButton {
	background-color: var(--color-highlight); /* Rouge */
	-moz-box-shadow: 0 0 5px 0 black;
	-webkit-box-shadow: 0 0 5px 0 black;
	box-shadow: 0 0 5px 0 black;
	display: inline-block;
	font-family: tahoma,arial,helvetica,sans-serif;
	font-size: 1.3rem;
	border: 1px solid white;
	color: white; /* Blanc */
	/*font-weight: bold;*/
	padding: 8px 12px;
	text-decoration: none;
	text-transform: uppercase;
	text-align:center;
    width:auto;
	margin : auto;
	margin-bottom:0;
    transition: background-color 0.3s ease;
}

.ctaButton_light {
	background-color: var(--background-second); /* Blanc */
	border-radius: 0.5rem 0.5rem 0.5rem 0.5rem;
	-moz-box-shadow: 0 0 5px 0 black;
	-webkit-box-shadow: 0 0 5px 0 black;
	box-shadow: 0 0 5px 0 black;
	display: inline-block;
	font-family: tahoma,arial,helvetica,sans-serif;
	font-size: 1.1rem;
	border: 1px solid white;
	color: var(--color-highlight); /* Rouge */
	padding: 4px 8px;
	text-decoration: none;
	text-align:center;
    width:auto;
	margin : auto;
	margin-bottom:0;
    transition: background-color 0.3s ease;
}


.ctaButton:hover {
    background-color : var(--button-primary-hover);
    border: 1px solid #a91d1b;
}

.ctaButton_light:hover {
    background-color : var(--color-accent);
    border: 1px solid #a91d1b;
}


/* =========================================
   BOUTON PRINCIPAL ET SECONDAIRE
   ========================================= */
.btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 15px 22px;
  border-radius: 30px;
  font-weight: bold;
  font-size: 1rem;
  text-decoration: none;
  transition:
    background-color 0.25s ease,
    transform 0.25s ease;
}

.btn--primary {
  background: var(--color-accent);
  color: var(--color-white);
}


.btn--primary:hover {
  background: var(--color-accent-dark);
  transform: translateY(-2px);
}

.btn--secondary {
    background: var(--color-white);
    color: var(--color-primary);
    border: 1px solid var(--color-primary);
  font-weight: normal;
}

.btn--secondary:hover {
   border: 1px solid var(--color-accent);
  transform: translateY(-2px);
}

.btn span {
  font-size: 18px;
  line-height: 0;
}

.btn--primary span {
  color: var(--color-gold-light);
}

.btn--secondary span {
  color: var(--color-gold);
}


/* -------------------------------------- */
/* ------------- BANDEAU----------------- */
/* -------------------------------------- */
.bandeau {
    position:relative;
  border-radius: 0.4rem 0.5rem 0.5rem 0.5rem;
  overflow: hidden; /* Pour rogner le haut de l'image */
  height: 100%; /* Pour definir la hauteur de l'image */
}

.bandeau img{
	height:300px;
	max-width: 100%;
	opacity:0.5;
    object-fit: cover;
    margin:0;
}

.bg-image {
    position: relative;
}

.bg-image::before{
    content: "";
    position: absolute;
    inset: 0;
    background-image: url("../images/Banniere_Carcassonne.jpg");
    background-size: cover;
    background-position: center; 
    background-repeat: no-repeat;
    opacity: 0.1;
    z-index: 0;
}
.bg-image> * {
  position: relative;
  z-index: 1; /* le texte passe au-dessus */
}

.bg-carcassonne::before{
   background-image: url("../images/Banniere_Carcassonne.jpg"); 
}

.bg-ateliers::before{
   background-image: url("../images/Ateliers.jpg"); 
}

.bg-montpellier::before{
   background-image: url("../images/Banniere-Montpellier.jpg"); 
}

.bg-toulouse::before{
   background-image: url("../images/Banniere-Toulouse.jpg"); 
}

.photo_presta_vignette{
	width:100%;
	min-height:100px;
	max-height:250px;
	object-fit: cover;
	overflow: hidden;
	border:2px solid white;
    -moz-box-shadow: 0 5px 5px grey; /*h-offset v-offset blur spread color |inset|initial|inherit; */
    -webkit-box-shadow: 0 5px 5px #ccc;
    box-shadow: 0 5px 5px #ccc;
    -moz-border-radius:25px;
    -webkit-border-radius:25px;
    border-radius:25px;
	/*margin: 0 0 20px 0;*/
    display:block;
    margin: 0 auto;
}

.photo-position-top{
    object-position: top;
}

.image-container {
position: relative;
display: inline-block;
}

/*.photos{
	grid-column: 1 / 13;
	display:flex;
  flex-wrap: wrap;
}*/

.photos {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
}

.photos img {
    width: 200px;
    aspect-ratio: 1;
    object-fit: cover;
    display: block;
}

.photos-bottom {
    text-align: center;
    margin: 0 0 15px;
}

.avis-google-5etoiles{
    width:auto;
    height:80px;
}

.animate-effect{
  transition: transform 0.3s ease;
  transform-origin: bottom center; /* origine pour rotation */
}

.animate-effect:hover {
    transform: scale(1.05);
    background:#F9F9FB; /* gris clair*/
}

.div-parente img{
    height:200px;
    width:auto;
    max-width:100%;
    margin-bottom:10px;
}

.div-enfant-image{
position: relative;
}

.avis-align-center {
  position: relative;
  flex: 1;
  max-width: 90%;
  margin:10px 10px 10px 10px;
  background:white;
  text-align: center;
  border: solid 1px gray;
    border-radius: 4px;
  padding:5px;
}

.avis-icon{
	fill: var(--color-gold);
	margin:0 0 0 5px;
	position:absolute;
	top: 0;
	left: -15px;
}

.avis-text{
/*	font-style: italic;*/
	margin: 0 5px 0 5px;
    font-size:0.8em;
    text-align:justify;
    color:var(--section-text-color);
}

.avis-personne{
	text-align:right;
	font-weight: bold;
	margin: 0 0 0 0;
}

.icone-magie {
  width: 40px; /* Taille largeur */
  height: auto; /* Garder proportions */
  fill: var(--color-gold);
}


/* -------------------------------------- */

/* SMARTPHONE */
@media screen  and (max-width: 480px)
  {
  .photos img {
      width: 120px;
  }
}