/**
* 2007-2025 PrestaShop
*
* NOTICE OF LICENSE
*
* This source file is subject to the Academic Free License (AFL 3.0)
* that is bundled with this package in the file LICENSE.txt.
* It is also available through the world-wide-web at this URL:
* http://opensource.org/licenses/afl-3.0.php
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to license@prestashop.com so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
* versions in the future. If you wish to customize PrestaShop for your
* needs please refer to http://www.prestashop.com for more information.
*
*  @author    PrestaShop SA <contact@prestashop.com>
*  @copyright 2007-2025 PrestaShop SA
*  @license   http://opensource.org/licenses/afl-3.0.php  Academic Free License (AFL 3.0)
*  International Registered Trademark & Property of PrestaShop SA
*
* Don't forget to prefix your containers with your own identifier
* to avoid any conflicts with others containers.
*/
@import url('https://fonts.googleapis.com/css2?family=Brush+Script+MT&display=swap');

.btn-star {
  display: inline-flex;
  align-items: center;
  gap: 8px;

  font-family: 'Brush Script MT', cursive;
  font-size: 30px; 
  color: rgb(37, 29, 103);
  text-decoration: none;
  font-weight: bold;

}


.btn-star .star {
  color: rgb(37, 29, 103);
  font-size: 40px;
  line-height: 0; 
  transform: translateY(2px);
  flex-shrink: 0; 
  background: #fce5c6;
  border: 2px solid #78c6b9;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 30px;
  z-index: 1;
}


.btn-star .btn-text {
  position: relative;
  display: inline-block;
  margin-left: -33px;
  background : #78c6b9;
  border-radius :0px 20px 20px 0px;
  padding: 0px 20px 0px 30px;
  text-shadow:
 -2px -2px 0 #fce5c6,
   2px -2px 0 #fce5c6,
  -2px  2px 0 #fce5c6,
   2px  2px 0 #fce5c6,
  0    -2px 0 #fce5c6,
  -2px  0    0 #fce5c6,
   2px  0    0 #fce5c6,
  0     2px 0 #fce5c6;


}
.btn-star .btn-text:hover {
  background: #fce5c6;
  color: rgb(37, 29, 103);
}


.btn-star .btn-text::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  height: 3px;
  width: 73%;
  background: linear-gradient(
    to right,
    #3b9677,
    #78c6b9,
    #e06367,
    #e98d74,
    #f1b666
  );
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.5s ease;
  margin-left: 25px;
}

.btn-star:hover .btn-text::after {
  transform: scaleX(1);
  margin-left: 25px;
}
/*effet a HLBROC*/
.hlbroc {
  position: relative;
  color: #231b6e;
  text-decoration: none;
  font-weight: normal;
  font-family: 'Brush Script MT', cursive;
  font-size: 27px;
}


.hlbroc::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -2px; 
  width: 100%;
  height: 3px;
  background: linear-gradient(
    to right,
    #3b9677,
    #78c6b9,
    #e06367,
    #e98d74,
    #f1b666
  );
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.4s ease;
  pointer-events: none; 
  z-index: 1;
}


.hlbroc:hover::after {
  transform: scaleX(1);
}

.hlbroc:hover {
  color: #3b9677;
}




.titre-h1 {
  font-family: 'Brush Script MT', cursive;
  font-size: 38px;
  text-align: center;
  font-weight: 500;
  color: #231b6e;
}



.p-vert2 {
  color: #3b9677;
  font-size: 18px;
  text-align: right;
}
.p-rouge2 {
  color: #e06367;
  font-size: 18px;
  text-align: right;
}
.p-bleu2 {
  color: #78c6b9;
  font-size: 18px;
  text-align: right;
}
.p-jaune2 {
  color: #f1b666;
  font-size: 18px;
  text-align: right;
}

.p-vert {
  color: #3b9677;
  font-size: 18px;
}
.p-rouge {
  color: #e06367;
  font-size: 18px;
}
.p-bleu {
  color: #78c6b9;
  font-size: 18px;
}
.p-jaune {
  color: #f1b666;
  font-size: 18px;
}
.p-bleuF{
  color: #231b6e;
  font-size: 20px;
  font-weight: 800;
}
.etoile-bleuF {class="link-titre"
   color: #231b6e;
  font-size: 40px;
  line-height: 0; 
  transform: translateY(2px);
  flex-shrink: 0; 
  z-index: 999;

  width: 50px;
  height: 50px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 30px;
}


.etoile-vert {
   color: #3b9677;
  font-size: 40px;
  line-height: 0; 
  transform: translateY(2px);
  flex-shrink: 0; 
  z-index: 999;

  width: 50px;
  height: 50px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 30px;
}
.etoile-rouge {
   color: #e06367;
  font-size: 40px;
  line-height: 0; 
  transform: translateY(2px);
  flex-shrink: 0; 
  z-index: 999;

  width: 50px;
  height: 50px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 30px;
}
.etoile-jaune {
   color: #f1b666;
  font-size: 40px;
  line-height: 0; 
  transform: translateY(2px);
  flex-shrink: 0; 
  z-index: 999;

  width: 50px;
  height: 50px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 30px;
}
.etoile-bleu {
   color: #78c6b9;
  font-size: 40px;
  line-height: 0; 
  transform: translateY(2px);
  flex-shrink: 0; 
  z-index: 999;

  width: 50px;
  height: 50px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 30px;
}
/* Style général des paragraphes */
.bloc-descrip-gauche p {
  position: relative;
  padding-left: 20px; 
  text-indent: -30px; 
  margin-bottom: 20px;
  line-height: 1;
  max-width: 600px; 
}

/* Décalage progressif en diagonale */
.bloc-descrip-gauche p:nth-of-type(1) { margin-left: 0px; }
.bloc-descrip-gauche p:nth-of-type(2) { margin-left: 20px; line-height: 22px; }
.bloc-descrip-gauche p:nth-of-type(3) { margin-left: 40px; line-height: 22px;}
.bloc-descrip-gauche p:nth-of-type(4) { margin-left: 60px;line-height: 22px; }
.bloc-descrip-gauche p:nth-of-type(5) { margin-left: 80px;line-height: 22px; }
.bloc-descrip-gauche p:nth-of-type(6) { margin-left: 100px; line-height: 22px;}


.bloc-description {
  display: flex;
  gap: 40px; 
  align-items: flex-start;
  justify-content: space-between;
  max-width: 1200px;
  margin: 40px auto;
  padding: 20px;
  box-sizing: border-box;
  background: #fff9f2; 
  border-radius: 20px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1); 
  box-sizing: border-box;
}

.bloc-descrip-gauche {
  flex: 1;
  font-family: 'Arial', sans-serif;
  color: #251d67; 
  font-size: 1.1rem;
  line-height: 1.6;
}
.bloc-descrip-gauche2 {
  flex: 1;
  font-family: 'Arial', sans-serif;
  color: #251d67; 
  font-size: 1.1rem;
  line-height: 1.6;
}


/* Style général des paragraphes */
.bloc-descrip-gauche2 p {
  position: relative;
  padding-left: 20px; 
  text-indent: -30px; 
  margin-bottom: 20px;
 
  max-width: 600px; 
}

/* Décalage progressif vers la droite */
.bloc-descrip-gauche2 p:nth-of-type(1) { margin-right: 0px;line-height: 25px; }
/*.bloc-descrip-gauche2 p:nth-of-type(4) { margin-right: 20px;line-height: 25px; }*/
.bloc-descrip-gauche2 p:nth-of-type(4) { margin-right: 40px;line-height: 25px; }
.bloc-descrip-gauche2 p:nth-of-type(6) { margin-right: 60px;line-height: 25px; }
.bloc-descrip-gauche2 p:nth-of-type(9) { margin-right: 80px;line-height: 25px; }
/*.bloc-descrip-gauche2 p:nth-of-type(8) { margin-right: 100px;line-height: 25px; }*/


.bloc-descrip-gauche h2 {
  font-size: 1.8rem;
  margin-bottom: 10px;
  color: #e06367; 
}
.bloc-descrip-gauche2 h2 {
  font-size: 1.8rem;
  margin-bottom: 10px;
  color: #e06367; 
}

.bloc-descrip-droite {
  flex: 1;
  min-height: 200px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #999;
}
.bloc-descrip-droite {
  width: 400px;
  height: 500px;
  overflow: hidden;
  background: #fff9f2;
  position: relative;
  box-shadow: 0 8px 20px rgba(0,0,0,0.15);
  background: repeating-conic-gradient(
    from 0deg,
    #3b9677 0deg 10deg,
    #fff9f2 10deg 15deg,
    #e06367 15deg 25deg,
    #fff9f2 25deg 30deg,
    #78c6b9 30deg 40deg,
    #fff9f2 40deg 45deg,
    #f1b666 45deg 55deg,
    #fff9f2 55deg 60deg
  );
}
.bloc-descrip-droite2 {
  flex: 1;
  min-height: 200px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #999;
}
.bloc-descrip-droite2 {
  width: 400px;
  height: 722px;
  overflow: hidden;
  background: #fff9f2;
  position: relative;
  box-shadow: 0 8px 20px rgba(0,0,0,0.15);
  background: repeating-conic-gradient(
    from 0deg,
    #3b9677 0deg 10deg,
    #fff9f2 10deg 15deg,
    #e06367 15deg 25deg,
    #fff9f2 25deg 30deg,
    #78c6b9 30deg 40deg,
    #fff9f2 40deg 45deg,
    #f1b666 45deg 55deg,
    #fff9f2 55deg 60deg
  );
}
.btn-container {
  text-align: right!important;
  margin-top: 20px;
}
.image-droit {
  width: 80%;
  height: 90%;
  object-fit: cover;
  
  border-radius: 40px;
  display: block;
}
/*avant après*/
.slider-wrapper {
  position: relative;
  width: 95%;
  height: 687px;
    aspect-ratio: 16 / 9;
  margin: 40px auto;
  overflow: hidden;
  background: #000;
  user-select: none;
  touch-action: none;
   border-radius: 40px;
}

.img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.slider-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 50%;
  height: 100%;
  overflow: hidden;
  z-index: 2;
}

.slider-overlay .img-before {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.slider-handle {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 50px;
  height: 50px;
  background-color: #005f5b;
  color: #fff;
  font-size: 20px;
  line-height: 50px;
  text-align: center;
  border-radius: 50%;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
  cursor: grab;
  z-index: 3;
}
.text-lorem {
  width:40%;
  flex-shrink: 1;
  
}
.container-flex {
    width: 100%;
}
.PS {
  font-style: italic;
  font-size: 15px;
  color: #666;
  margin-top: 5px;
  line-height: 19px;
}