/*
	Theme Name: Hello Elementor child
	Template: hello-elementor
	Theme URI: https://elementor.com/hello-theme/?utm_source=wp-themes&utm_campaign=theme-uri&utm_medium=wp-dash
	Description: A plain-vanilla & lightweight theme for Elementor page builder
	Author: Elementor Team
	Author URI: https://elementor.com/?utm_source=wp-themes&utm_campaign=author-uri&utm_medium=wp-dash
	Version: 2.4.2
	Stable tag: 2.4.2
	Requires at least: 4.7
	Tested up to: 5.9
	Requires PHP: 5.6
	License: GNU General Public License v3 or later.
	License URI: https://www.gnu.org/licenses/gpl-3.0.html
	Text Domain: hello-elementor
	Tags: flexible-header, custom-colors, custom-menu, custom-logo, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/* ==========================================================================
   GÉNÉRAL
   ========================================================================== */

html {
  overflow-x: hidden;
}


/* ==========================================================================
   HEADER : fixe, disparaît en descendant, réapparaît en remontant
   (le script header-scroll gère les classes et l'espace sous le header)
   ========================================================================== */

.elementor-location-header {
  position: fixed;
  top: var(--wp-admin--admin-bar--height, 0px); /* sous la barre d'admin WordPress si connecté */
  left: 0;
  right: 0;
  z-index: 999;
  background-color: #fff; /* fond du header : à adapter si besoin */
  transition:
    transform 0.35s ease,
    box-shadow 0.35s ease;
  /* pas de will-change / transform au repos : sinon le menu mobile (en position fixe)
     reste enfermé dans le header au lieu de prendre tout l'écran */
}

/* Header caché (on descend) */
.elementor-location-header.header-cache {
  transform: translateY(calc(-100% - var(--wp-admin--admin-bar--height, 0px)));
}

/* Petite ombre une fois qu'on a quitté le haut de la page */
.elementor-location-header.header-scrolle {
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}


/* ==========================================================================
   BOUTONS
   ========================================================================== */

/* Contour décalé autour du bouton (classe "btn-style") */
.btn-style {
  position: relative;
}

.btn-style::after {
  content: '';
  position: absolute;
  inset: -6px;
  border: 1px solid #bf1f2c;
  border-radius: 999px;
  pointer-events: none;
}

/* Variante blanche : classes "btn-style white" */
.btn-style.white::after {
  border-color: #fff;
}


/* ==========================================================================
   FORMULAIRES
   ========================================================================== */

/* Accueil : bouton d'envoi */
.elementor-11 .elementor-element.elementor-element-c56f684 .elementor-button[type='submit'] {
  position: relative;
  width: 215px;
  margin-top: 20px;
}

/* Contact : bouton d'envoi */
.elementor-509 .elementor-element.elementor-element-2684520 .elementor-button[type='submit'] {
  margin-top: 15px !important;
}

.elementor-509 .elementor-element.elementor-element-2684520 .elementor-button::after {
  content: '';
  position: absolute;
  width: 216px;
  height: 50px;
  left: 0;
  top: 50%;
  transform: translateY(-34%);
  border: 1px solid #bf1f2c;
  border-radius: 999px;
  pointer-events: none;
}


/* ==========================================================================
   ACCUEIL : blocs prestations
   ========================================================================== */

.bloc-prestation {
  transform: rotate(-1deg) !important;
  transition:
    transform 0.2s ease-in-out,
    background-color 0.2s ease-in-out !important;
}

.bloc-prestation svg path {
  fill: #bf1f2c !important;
}

.bloc-prestation:hover {
  transform: rotate(0) !important;
  background-color: #bf1f2c;
  z-index: 1;
}

.bloc-prestation:hover h3.elementor-icon-box-title,
.bloc-prestation:hover p.elementor-icon-box-description {
  color: #fff !important;
}

.bloc-prestation:hover svg path {
  fill: #fff !important;
}


/* ==========================================================================
   BANNIÈRE : annotation "mais pas que !" sur "Dordogne"
   ========================================================================== */

.mot-annote {
  position: relative;
  display: inline-block;
}

.annotation,
.annot {
  position: absolute;
  bottom: 85%;
  left: 87%;
  display: flex;
  align-items: flex-start;
  gap: 0.1em;
  white-space: nowrap;
  pointer-events: none;
  color: #fff;
  font-size: 32px;
  line-height: 1;
}

/* Flèche blanche */
.annotation::before {
  content: '';
  flex-shrink: 0;
  width: 3.6em;
  aspect-ratio: 112 / 54;
  background: no-repeat center / contain
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-2 -4 112 54' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M105 12 C 80 -2, 30 -4, 8 42'/%3E%3Cpath d='M7 33 L8 42 L15.5 37'/%3E%3C/svg%3E");
}

/* Variante rouge : classes "annot red" */
.annot.red::before {
  content: '';
  flex-shrink: 0;
  width: 3.6em !important;
  aspect-ratio: 112 / 54;
  background: no-repeat center / contain
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-2 -4 112 54' fill='none' stroke='%23BF1F2C' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M105 12 C 80 -2, 30 -4, 8 42'/%3E%3Cpath d='M7 33 L8 42 L15.5 37'/%3E%3C/svg%3E");
}

.annotation em,
.annot.red em {
  font-family: var(--e-global-typography-2484440-font-family), sans-serif;
  font-style: normal;
  margin-top: 3px;
  transform: rotate(-8deg);
}

.annot.red em {
  color: #bf1f2c;
}


/* ==========================================================================
   À PROPOS : annotations "Kélian" et "Chloé" sur la photo
   ========================================================================== */

.photo-duo {
  position: relative;
  overflow: visible !important;
  --annot-color: #c01f2e;
  --annot-font: var(--e-global-typography-2484440-font-family), sans-serif;
}

.photo-duo::before,
.photo-duo::after {
  position: absolute;
  z-index: 2;
  pointer-events: none;
  font-family: var(--annot-font);
  color: var(--annot-color);
  font-size: clamp(16px, 1.5vw, 32px);
  line-height: 1;
  white-space: nowrap;
  background-repeat: no-repeat;
}

/* Kélian : en haut à gauche, flèche vers le visage */
.photo-duo::before {
  content: 'Kélian';
  top: -12%;
  left: -30%;
  padding: 1.6em 5.5em 0 0;
  background-position: right top;
  background-size: 5.5em auto;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 60' fill='none' stroke='%23c01f2e' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 22 C 40 -4, 100 0, 114 52'/%3E%3Cpath d='M105 44 L114 54 L119 41'/%3E%3C/svg%3E");
}

/* Chloé : en bas à droite, flèche vers le visage */
.photo-duo::after {
  content: 'Chloé';
  bottom: -12%;
  right: -6%;
  padding: 3.8em 0 0 3.2em;
  background-position: left top;
  background-size: 3.6em auto;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 80' fill='none' stroke='%23c01f2e' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M76 76 C 30 78, 6 50, 10 6'/%3E%3Cpath d='M3 15 L10 5 L17 14'/%3E%3C/svg%3E");
}


/* ==========================================================================
   SIGNATURE : annotation "installez-vous" sur la photo du plat
   ========================================================================== */

.photo-plat {
  position: relative;
  overflow: visible !important;
}

.photo-plat::after {
  content: 'installez-vous';
  position: absolute;
  z-index: 2;
  top: 66%;               /* hauteur de la pointe sur la photo */
  right: 57%;             /* position de la pointe */
  padding: 3.8em 5em 0 0; /* place pour la flèche au-dessus / à droite du texte */
  pointer-events: none;
  font-family: var(--e-global-typography-2484440-font-family), sans-serif;
  font-size: clamp(17px, 1.3vw, 30px);
  color: #bf1f2c;
  line-height: 1;
  white-space: nowrap;
  background: no-repeat right top / 6em auto
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 70' fill='none' stroke='%23bf1f2c' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 66 C 20 20, 70 6, 112 10'/%3E%3Cpath d='M102 3 L112 10 L103 18'/%3E%3C/svg%3E");
}


/* ==========================================================================
   MARIAGE : flèche qui pointe vers le bouton (classe "btn-fleche")
   ========================================================================== */

.btn-fleche,
.btn-fleche .elementor-widget-container {
  overflow: visible !important;
}

.btn-fleche .elementor-button {
  position: relative;
  overflow: visible !important;
}

.btn-fleche .elementor-button::after {
  content: '';
  position: absolute;
  left: calc(100% + 30px); /* écart entre le bouton et la pointe */
  bottom: 35%;             /* hauteur de la pointe par rapport au bouton */
  width: 63px;
  aspect-ratio: 90 / 132;
  pointer-events: none;
  background: no-repeat center / contain
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 90 132' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M66 2 C 94 40, 82 120, 6 124'/%3E%3Cpath d='M17 114 L6 124 L18 131'/%3E%3C/svg%3E");
}


/* ==========================================================================
   ANNOTATION "À très bientôt !" en bas à droite de la section
   ========================================================================== */

.annot-bientot {
  position: relative;
  overflow: visible !important;
}

.annot-bientot::after {
  content: 'À très bientôt !';
  position: absolute;
  z-index: 2;
  top: calc(100% - 2em);    /* la pointe entre un peu dans le bas de la section */
  left: calc(100% - 3em);   /* la pointe entre un peu dans la droite de la section */
  padding: 2.4em 0 0 2.6em; /* place pour la flèche au-dessus à gauche du texte */
  pointer-events: none;
  font-family: var(--e-global-typography-2484440-font-family), sans-serif;
  font-size: clamp(18px, 1.5vw, 32px);
  color: #bf1f2c;
  line-height: 1;
  white-space: nowrap;
  transform: rotate(-6deg);
  transform-origin: left top;
  background: no-repeat left top / 4.6em auto
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 110 60' fill='none' stroke='%23bf1f2c' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M100 56 C 100 30, 80 12, 12 12'/%3E%3Cpath d='M21 5 L12 12 L21 19'/%3E%3C/svg%3E");
}


/* ==========================================================================
   ANNOTATION : flèche qui part vers le haut (classe "fleche-haut")
   ========================================================================== */

.fleche-haut,
.fleche-haut .elementor-widget-container {
  position: relative;
  overflow: visible !important;
}

.fleche-haut::before {
  content: '';
  position: absolute;
  bottom: calc(100% + 4px); /* écart entre le texte et le départ de la flèche */
  left: 40%;                /* position horizontale de la flèche sur le texte */
  width: 55px;
  aspect-ratio: 70 / 80;
  pointer-events: none;
  background: no-repeat center / contain
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 70 80' fill='none' stroke='%23bf1f2c' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 74 C 20 76, 36 70, 38 58 C 40 46, 26 42, 22 50 C 18 58, 30 62, 40 54 C 52 44, 56 26, 62 6'/%3E%3Cpath d='M54 13 L62 5 L67 15'/%3E%3C/svg%3E");
}


/* ==========================================================================
   AVIS : taille dégressive avec écart constant (classe "avis-slider")
   ========================================================================== */

.avis-slider {
  --s1: 0.88; /* taille des voisines */
  --s2: 0.76; /* taille des extrémités */
}

.avis-slider .jet-listing-grid__slider {
  padding: 30px 0 !important;
}

.avis-slider .swiper-slide .e-con.e-parent {
  transform-origin: center center !important;
  transition: none !important;
}

.avis-slider.avis-ready .swiper-slide .e-con.e-parent {
  transition: transform 0.5s ease !important;
}

/* Centre */
.avis-slider .pos-0 .e-con.e-parent {
  transform: translateX(0) scale(1) !important;
}

/* Voisines : rapprochées de la moitié de ce qu'elles ont perdu */
.avis-slider .pos-l1 .e-con.e-parent {
  transform: translateX(calc((1 - var(--s1)) * 50%)) scale(var(--s1)) !important;
}

.avis-slider .pos-r1 .e-con.e-parent {
  transform: translateX(calc((1 - var(--s1)) * -50%)) scale(var(--s1)) !important;
}

/* Extrémités : rapprochées en tenant compte des voisines */
.avis-slider .pos-l2 .e-con.e-parent {
  transform: translateX(calc(((1 - var(--s1)) + (1 - var(--s2)) / 2) * 100%)) scale(var(--s2)) !important;
}

.avis-slider .pos-r2 .e-con.e-parent {
  transform: translateX(calc(((1 - var(--s1)) + (1 - var(--s2)) / 2) * -100%)) scale(var(--s2)) !important;
}


/* ==========================================================================
   RESPONSIVE : ≤ 1440px
   ========================================================================== */

@media (max-width: 1440px) {
  /* Mariage : flèche du bouton */
  .btn-fleche .elementor-button::after {
    left: calc(100% + 21px);
    bottom: 30%;
    width: 48px;
  }

  /* À très bientôt */
  .annot-bientot::after {
    left: calc(100% - 2.5em);
    font-size: 25px;
  }
}


/* ==========================================================================
   RESPONSIVE : ≤ 1024px (tablette + mobile)
   ========================================================================== */

@media (max-width: 1024px) {
  /* À propos : Kélian et Chloé en blanc, dans la marge rouge */
  .photo-duo {
    --k-arrow: 4.8em; /* taille flèche Kélian */
    --k-gap: 0.4em;   /* espace texte ↔ flèche Kélian */
    --c-arrow: 3.4em; /* taille flèche Chloé */
    --c-gap: 0.5em;   /* espace texte ↔ flèche Chloé */
    --c-in: 2.4em;    /* profondeur de la flèche Chloé dans l'image */
  }

  .photo-duo::before,
  .photo-duo::after {
    color: #fff;
    font-size: clamp(20px, 3vw, 28px);
    filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.35));
  }

  .photo-duo::before {
    top: auto;
    bottom: calc(100% - 1.6em);
    left: 3%;
    padding: 0 calc(var(--k-arrow) + var(--k-gap)) 1.6em 0;
    background-position: right 0 top 0.1em; /* départ de la flèche = milieu du texte */
    background-size: var(--k-arrow) auto;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 60' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 10 C 55 2, 104 8, 112 50'/%3E%3Cpath d='M104 43 L112 51 L117 39'/%3E%3C/svg%3E");
  }

  .photo-duo::after {
    bottom: auto;
    top: calc(100% - var(--c-in));
    right: 6%;
    padding: calc(var(--c-in) + 0.3em) 0 0 calc(var(--c-arrow) + var(--c-gap));
    background-position: left top;
    background-size: var(--c-arrow) auto;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 80' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M76 76 C 30 78, 6 50, 10 6'/%3E%3Cpath d='M3 15 L10 5 L17 14'/%3E%3C/svg%3E");
  }

  /* Signature : "installez-vous" sous la photo, flèche qui remonte */
  .photo-plat {
    --p-arrow: 3.4em; /* taille de la flèche */
    --p-gap: 0.4em;   /* espace texte ↔ flèche */
    --p-in: 2.4em;    /* profondeur de la flèche dans l'image */
  }

  .photo-plat::after {
    right: auto;
    bottom: auto;
    top: calc(100% - var(--p-in) + 0.8em);
    left: 8%;
    padding: calc(var(--p-in) + 0.3em) calc(var(--p-arrow) + var(--p-gap)) 0 0;
    font-size: clamp(20px, 3vw, 28px);
    background-position: right top;
    background-size: var(--p-arrow) auto;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 80' fill='none' stroke='%23bf1f2c' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 76 C 50 78, 74 50, 70 6'/%3E%3Cpath d='M63 15 L70 5 L77 14'/%3E%3C/svg%3E");
  }
	
	  /* Menu mobile : logo en bas du panneau */
  .jet-mobile-menu__container-inner::after {
    content: '';
    position: absolute;
    bottom: 10px;
    left: 50%;
    width: 150px;
    height: 60px;
    transform: translateX(-50%);
    opacity: 1;
    background-image: url(https://refonte.pastel-traiteur.com/wp-content/uploads/2026/09/logo_pastel-1-1-1.svg);
    background-size: 150px;
    background-repeat: no-repeat;
  }

  /* Bannière : annotation "mais pas que !" masquée */
  .annotation,
  .annot {
    display: none;
  }

  /* À très bientôt : masquée sur tablette (réaffichée sur mobile plus bas) */
  .annot-bientot::after {
    display: none;
  }
}


/* ==========================================================================
   RESPONSIVE : ≤ 767px (mobile)
   ========================================================================== */

@media (max-width: 767px) {
  /* À propos : noms un peu plus décollés de la photo, flèche Kélian vers son visage */
  .photo-duo {
    --k-arrow: 1.8em;
    --k-gap: 0.3em;
  }

  .photo-duo::before {
    bottom: calc(100% - 1.7em);
    padding: 0 calc(var(--k-arrow) + var(--k-gap)) 2.5em 0;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 70' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 8 C 26 6, 34 24, 32 62'/%3E%3Cpath d='M25 54 L32 63 L38 54'/%3E%3C/svg%3E");
  }

  .photo-duo::after {
    padding-top: calc(var(--c-in) + 0.8em);
  }

  /* Signature : "installez-vous" plus grand */
  .photo-plat::after {
    font-size: 26px;
  }

  /* Mariage : flèche du bouton masquée */
  .btn-fleche .elementor-button::after {
    display: none;
  }

  /* À très bientôt : réaffichée, sous la section, alignée à droite */
  .annot-bientot::after {
    display: block;
    left: auto;
    right: 16px;
    top: calc(100% - 1em);
    font-size: 22px;
  }

  /* Flèche vers le haut */
  .fleche-haut::before {
    width: 42px;
    left: 50%;
  }

  /* Avis : toutes les cartes à la même taille */
  .avis-slider {
    --s1: 1;
    --s2: 1;
  }

  .avis-slider .jet-listing-grid__slider {
    padding: 0 !important;
  }


  /* Carrousels d'images (pages 305 et 502) : hauteur fixe */
  .elementor-305 .elementor-element.elementor-element-f76a24c .elementor-image-carousel-wrapper .elementor-image-carousel .swiper-slide-image,
  .elementor-502 .elementor-element.elementor-element-767148a .elementor-image-carousel-wrapper .elementor-image-carousel .swiper-slide-image,
  .elementor-444 .elementor-element.elementor-element-5cd6368 .elementor-image-carousel-wrapper .elementor-image-carousel .swiper-slide-image{
    width: 100%;
    height: 350px;
    object-fit: cover;
  }
}