.elementor-4649 .elementor-element.elementor-element-4e340f3{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-4649 .elementor-element.elementor-element-42e53cb{--display:flex;--min-height:160px;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;--margin-top:10px;--margin-bottom:10px;--margin-left:20px;--margin-right:20px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-4649 .elementor-element.elementor-element-42e53cb:not(.elementor-motion-effects-element-type-background), .elementor-4649 .elementor-element.elementor-element-42e53cb > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:transparent;background-image:linear-gradient(180deg, #FDEAF2 0%, #FFF1F7 100%);}.elementor-4649 .elementor-element.elementor-element-18ac7ec{--display:flex;}.elementor-widget-image .widget-image-caption{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-4649 .elementor-element.elementor-element-5d893f1{text-align:center;}.elementor-4649 .elementor-element.elementor-element-5d893f1 img{width:100%;max-width:1000px;height:100%;}.elementor-4649 .elementor-element.elementor-element-a0edccc{--display:flex;}.elementor-4649 .elementor-element.elementor-element-e721131{--display:flex;}.elementor-4649 .elementor-element.elementor-element-e313c6c{--display:flex;}.elementor-4649 .elementor-element.elementor-element-54295f3{--display:flex;}.elementor-4649 .elementor-element.elementor-element-40d23e4{--e-n-carousel-swiper-slides-to-display:2;--e-n-carousel-swiper-slides-gap:10px;margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;--e-n-carousel-slide-height:auto;--e-n-carousel-slide-container-height:100%;--e-n-carousel-arrow-prev-left-align:0%;--e-n-carousel-arrow-prev-translate-x:0px;--e-n-carousel-arrow-prev-left-position:0px;--e-n-carousel-arrow-prev-top-align:50%;--e-n-carousel-arrow-prev-translate-y:-50%;--e-n-carousel-arrow-prev-top-position:0px;--e-n-carousel-arrow-next-right-align:0%;--e-n-carousel-arrow-next-translate-x:0%;--e-n-carousel-arrow-next-right-position:0px;--e-n-carousel-arrow-next-top-align:50%;--e-n-carousel-arrow-next-translate-y:-50%;--e-n-carousel-arrow-next-top-position:0px;}.elementor-4649 .elementor-element.elementor-element-40d23e4.elementor-element{--align-self:center;}:where( .elementor-4649 .elementor-element.elementor-element-40d23e4 .swiper-slide ) > .e-con{--border-radius:0px 0px 0px 0px;--padding-top:20px;--padding-right:40px;--padding-bottom:20px;--padding-left:40px;}:where( [data-core-v316-plus="true"] .elementor-element.elementor-widget-n-carousel .swiper-slide ) > .e-con{--padding-block-start:20px;--padding-inline-end:40px;--padding-block-end:20px;--padding-inline-start:40px;}.elementor-4649 .elementor-element.elementor-element-a8dc284{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-4649 .elementor-element.elementor-element-fe5458a{--display:flex;--min-height:320px;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;--gap:20px 20px;--row-gap:20px;--column-gap:20px;--flex-wrap:wrap;--overflow:auto;--overlay-opacity:0;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:20px;--padding-bottom:20px;--padding-left:20px;--padding-right:20px;}.elementor-4649 .elementor-element.elementor-element-fe5458a:not(.elementor-motion-effects-element-type-background), .elementor-4649 .elementor-element.elementor-element-fe5458a > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://tizanaetcompagnie.fr/wp-content/uploads/2026/01/fond_menu_pastel_1920x500-1024x267.webp");background-position:center center;background-repeat:no-repeat;background-size:cover;}.elementor-4649 .elementor-element.elementor-element-fe5458a::before, .elementor-4649 .elementor-element.elementor-element-fe5458a > .elementor-background-video-container::before, .elementor-4649 .elementor-element.elementor-element-fe5458a > .e-con-inner > .elementor-background-video-container::before, .elementor-4649 .elementor-element.elementor-element-fe5458a > .elementor-background-slideshow::before, .elementor-4649 .elementor-element.elementor-element-fe5458a > .e-con-inner > .elementor-background-slideshow::before, .elementor-4649 .elementor-element.elementor-element-fe5458a > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{--background-overlay:'';}.elementor-4649 .elementor-element.elementor-element-fe5458a > .elementor-shape-bottom svg, .elementor-4649 .elementor-element.elementor-element-fe5458a > .e-con-inner > .elementor-shape-bottom svg{width:calc(100% + 1.3px);height:0px;}.elementor-4649 .elementor-element.elementor-element-9987537{--display:grid;--e-con-grid-template-columns:repeat(3, 1fr);--e-con-grid-template-rows:repeat(2, 1fr);--grid-auto-flow:row;}.elementor-4649 .elementor-element.elementor-element-be6c926{text-align:center;}.elementor-4649 .elementor-element.elementor-element-ff8a1f0 img{width:120px;box-shadow:15px 15px 10px 0px rgba(0,0,0,0.5);}.elementor-4649 .elementor-element.elementor-element-a398336 img{width:120px;box-shadow:15px 15px 10px 0px rgba(0,0,0,0.5);}.elementor-4649 .elementor-element.elementor-element-63fc9b7{margin:21px 21px calc(var(--kit-widget-spacing, 0px) + 21px) 21px;border-style:dotted;box-shadow:2px 12px 10px 0px rgba(0,0,0,0.5);}.elementor-4649 .elementor-element.elementor-element-63fc9b7.elementor-element{--order:-99999 /* order start hack */;--flex-grow:1;--flex-shrink:0;}.elementor-4649 .elementor-element.elementor-element-63fc9b7 img{width:100%;max-width:100%;height:49px;border-style:none;box-shadow:10px 10px 10px 0px rgba(0,0,0,0.5);}.elementor-4649 .elementor-element.elementor-element-55ac1eb img{box-shadow:15px 15px 10px 0px rgba(0,0,0,0.5);}.elementor-4649 .elementor-element.elementor-element-1d2aaa9 img{box-shadow:15px 15px 10px 0px rgba(0,0,0,0.5);}.elementor-4649 .elementor-element.elementor-element-543dfba img{box-shadow:15px 15px 10px 0px rgba(0,0,0,0.5);}.elementor-4649 .elementor-element.elementor-element-b825200 img{box-shadow:15px 15px 10px 0px rgba(0,0,0,0.5);}.elementor-4649 .elementor-element.elementor-element-307eedc{width:var( --container-widget-width, 50% );max-width:50%;--e-transform-scale:1.2;margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 91px;padding:0px 0px 0px 0px;--container-widget-width:50%;--container-widget-flex-grow:0;z-index:1;text-align:center;}.elementor-4649 .elementor-element.elementor-element-307eedc.elementor-element{--align-self:flex-end;--order:99999 /* order end hack */;--flex-grow:0;--flex-shrink:0;}.elementor-4649 .elementor-element.elementor-element-307eedc img{width:400px;max-width:100%;opacity:100;border-radius:0px 0px 0px 0px;}.elementor-theme-builder-content-area{height:400px;}.elementor-location-header:before, .elementor-location-footer:before{content:"";display:table;clear:both;}@media(min-width:768px){.elementor-4649 .elementor-element.elementor-element-fe5458a{--width:100%;}}@media(max-width:1024px){.elementor-4649 .elementor-element.elementor-element-42e53cb{--min-height:140;}.elementor-4649 .elementor-element.elementor-element-40d23e4{--e-n-carousel-swiper-slides-to-display:2;}.elementor-4649 .elementor-element.elementor-element-fe5458a{--min-height:260px;}.elementor-4649 .elementor-element.elementor-element-9987537{--grid-auto-flow:row;}.elementor-4649 .elementor-element.elementor-element-ff8a1f0 img{width:90px;}.elementor-4649 .elementor-element.elementor-element-a398336 img{width:90px;}}@media(max-width:767px){.elementor-4649 .elementor-element.elementor-element-42e53cb{--min-height:120px;--padding-top:10px;--padding-bottom:10px;--padding-left:20px;--padding-right:20px;}.elementor-4649 .elementor-element.elementor-element-40d23e4{--e-n-carousel-swiper-slides-to-display:1;}.elementor-4649 .elementor-element.elementor-element-fe5458a{--width:100%;--min-height:60px;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--align-items:flex-start;--gap:24px 18px;--row-gap:24px;--column-gap:18px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-4649 .elementor-element.elementor-element-fe5458a.e-con{--align-self:center;}.elementor-4649 .elementor-element.elementor-element-9987537{--e-con-grid-template-columns:repeat(1, 1fr);--grid-auto-flow:row;}.elementor-4649 .elementor-element.elementor-element-ff8a1f0 img{width:70px;}.elementor-4649 .elementor-element.elementor-element-a398336 img{width:70px;}.elementor-4649 .elementor-element.elementor-element-307eedc{--e-transform-scale:1.7;margin:10px 0px calc(var(--kit-widget-spacing, 0px) + 10px) 0px;padding:0px 0px 0px 0px;z-index:0;}.elementor-4649 .elementor-element.elementor-element-307eedc.elementor-element{--flex-grow:0;--flex-shrink:1;}.elementor-4649 .elementor-element.elementor-element-307eedc img{width:180px;max-width:60%;height:20%;border-radius:0px 0px 0px 0px;}}/* Start custom CSS for container, class: .elementor-element-9987537 */<link rel="alternate" hreflang="fr" href="https://tizanaetcompagnie.fr/" />
<link rel="alternate" hreflang="es" href="https://tizanaetcompagnie.fr/inicio/" />
<link rel="alternate" hreflang="en" href="https://tizanaetcompagnie.fr/home/" />
<link rel="alternate" hreflang="de" href="https://tizanaetcompagnie.fr/startseite/" />
<link rel="alternate" hreflang="ca" href="https://tizanaetcompagnie.fr/benvinguts/" />
<link rel="alternate" hreflang="zh" href="https://tizanaetcompagnie.fr/zh/" />
<link rel="alternate" hreflang="x-default" href="https://tizanaetcompagnie.fr/" />/* End custom CSS */
/* Start custom CSS for image, class: .elementor-element-307eedc *//* Mobile uniquement */
@media (max-width: 767px) {
  .float-logo {
    width: 180px !important; /* ajuste si besoin */
    max-width: none !important;
  }
}/* Supprimer TOUTES les ombres */
.float-logo,
.float-logo img {
  box-shadow: none !important;
  filter: none !important;
  text-shadow: none !important;
}
.elementor-4649 .elementor-element.elementor-element-307eedc {
  transition: transform 0.3s ease;
}

.elementor-4649 .elementor-element.elementor-element-307eedc:hover {
  transform: scale(1.05);
}
/* 🐭 LOGO : animation permanente */
.logo-souris {
  cursor: pointer;
  animation: logo-float 4s ease-in-out infinite !important;
  transition: transform 0.4s ease, filter 0.4s ease;
  will-change: transform;
}

.logo-souris:hover {
  animation-play-state: paused;
  transform: translateY(-8px) rotate(-2deg) scale(1.06);
  filter: drop-shadow(0 12px 25px rgba(0,0,0,0.25));
}

@keyframes logo-float {
  0%   { transform: translateY(0); }
  50%  { transform: translateY(-6px); }
  100% { transform: translateY(0); }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-fe5458a *//* SUPPRESSION OMBRE SOUS HEADER - THEME BUILDER */
.elementor-location-header + section,
.elementor-location-header + .elementor-section,
.elementor-location-header + .elementor-container,
.elementor-location-header + div {

    box-shadow: none !important;
    filter: none !important;
    background-image: none !important;
}

/* Cas où l'ombre est sur la première section */
.elementor-top-section:first-of-type {
    box-shadow: none !important;
    filter: none !important;
}
/* === LOGO === */
.logo-tizana {
    position: relative;
    z-index: 5;
    max-width: 320px;
}

/* === MENU === */
.menu-tizana {
    position: relative;
    z-index: 5;
}

/* === RESPONSIVE MOBILE === */
@media (max-width: 768px) {

    }
    .logo-tizana {
        max-width: 220px;
    }
}#sound-toggle {
  position: fixed;
  top: 15px;
  right: 15px;
  z-index: 9999;
  font-size: 20px;
  cursor: pointer;
  background: rgba(255,255,255,0.65);
  border-radius: 50%;
  padding: 8px 10px;
  box-shadow: 0 4px 10px rgba(0,0,0,0.15);
  transition: transform 0.2s ease, opacity 0.2s ease;
}

#sound-toggle:hover {
  transform: scale(1.1);
}

#sound-toggle.sound-off {
  opacity: 0.4;
}.sound-btn {
  cursor: pointer;
  transition: transform 0.2s ease, opacity 0.2s ease;
}

.sound-btn:hover {
  transform: scale(1.1);
}.sound-btn {
  cursor: pointer;
  transition: transform 0.2s ease, opacity 0.2s ease;
}

.sound-btn:hover {
  transform: scale(1.1);
}/* Le container du menu doit être une référence pour l'absolu */.elementor-4649 .elementor-element.elementor-element-fe5458a {
  position: relative;
  overflow: visible;
}

/* =========================
   BOUTON VOLUME
   ========================= */
.elementor-4649 .elementor-element.elementor-element-fe5458a .site-sound-toggle {
  position: absolute;
  top: 12px;        /* distance depuis le haut du menu */
  left: 12px;       /* distance depuis la gauche du menu */
  width: 50px;      /* taille du bouton */
  height: auto;
  z-index: 9999;
  cursor: pointer;
  transition: transform 0.15s ease, opacity 0.15s ease, filter 0.15s ease;
}

/* Hover */
.elementor-4649 .elementor-element.elementor-element-fe5458a .site-sound-toggle:hover {
  transform: scale(1.08);
}

/* Etat OFF (bleuté / discret) */
.elementor-4649 .elementor-element.elementor-element-fe5458a .site-sound-toggle.is-off {
  opacity: 0.6;
  filter: grayscale(0.2) saturate(0.7) hue-rotate(160deg);
}

/* hover sympa */
.elementor-4649 .elementor-element.elementor-element-fe5458a .site-sound-toggle img:hover{
  transform: scale(1.1);
}

/* ETAT OFF = effet bleu / discret */
.elementor-4649 .elementor-element.elementor-element-fe5458a .site-sound-toggle img.is-off{
  filter: grayscale(100%) hue-rotate(180deg) brightness(0.9);
  opacity: 0.55;
}/* applique l'effet OFF sur le widget ET sur l'image à l'intérieur */
.elementor-4649 .elementor-element.elementor-element-fe5458a .site-sound-toggle.is-off,
.elementor-4649 .elementor-element.elementor-element-fe5458a .site-sound-toggle.is-off img {
  opacity: 0.6;
  filter: grayscale(0.2) saturate(0.7) hue-rotate(160deg);
}
/* ============ INTERACTIONS MENU ============ */

/* Le wrapper + l'image à l'intérieur */
.elementor-4649 .elementor-element.elementor-element-fe5458a .tbtn,
.elementor-4649 .elementor-element.elementor-element-fe5458a .tbtn img,
.elementor-4649 .elementor-element.elementor-element-fe5458a .logo-souris,
.elementor-4649 .elementor-element.elementor-element-fe5458a .logo-souris img{
  transition: transform .25s ease, filter .25s ease, opacity .25s ease;
  transform-origin: center;
  will-change: transform, filter;
}

/* Survol (wrapper OU image) */
.elementor-4649 .elementor-element.elementor-element-fe5458a .tbtn:hover,
.elementor-4649 .elementor-element.elementor-element-fe5458a .tbtn:hover img,
.elementor-4649 .elementor-element.elementor-element-fe5458a .logo-souris:hover,
.elementor-4649 .elementor-element.elementor-element-fe5458a .logo-souris:hover img{
  transform: translateY(-6px) rotate(-2deg) scale(1.06);
  filter: drop-shadow(0 10px 18px rgba(0,0,0,.18));
}

/* Bouton volume */
.elementor-4649 .elementor-element.elementor-element-fe5458a .site-sound-toggle{
  transition: transform .2s ease, filter .2s ease, opacity .2s ease;
  cursor: pointer;
}
.elementor-4649 .elementor-element.elementor-element-fe5458a .site-sound-toggle:hover{ transform: scale(1.08); }
.elementor-4649 .elementor-element.elementor-element-fe5458a .site-sound-toggle.is-off{
  opacity:.55;
  filter:saturate(.35) hue-rotate(180deg) brightness(1.05);
}
/* --- Desktop (déjà OK) --- */
.elementor-4649 .elementor-element.elementor-element-fe5458a .site-sound-toggle{
  position:absolute;
  top:18px;
  left:18px;
  width:56px;
  cursor:pointer;
  z-index:9999;
  transition:transform .2s ease, filter .2s ease, opacity .2s ease;
}
.elementor-4649 .elementor-element.elementor-element-fe5458a .site-sound-toggle:hover{ transform:scale(1.08); }
.elementor-4649 .elementor-element.elementor-element-fe5458a .site-sound-toggle.is-off{
  opacity:.55;
  filter:saturate(.35) hue-rotate(180deg) brightness(1.05);
}

/* --- Mobile --- */
@media (max-width:768px){
  .elementor-4649 .elementor-element.elementor-element-fe5458a .site-sound-toggle{
    top:10px;
    left:10px;
    width:42px;      /* plus petit */
  }
}

/* Très petit écran */
@media (max-width:480px){
  .elementor-4649 .elementor-element.elementor-element-fe5458a .site-sound-toggle{
    top:8px;
    left:8px;
    width:36px;
  }
}.site-sound-toggle.is-off { opacity: .45; filter: grayscale(100%); }
.site-sound-toggle { cursor: pointer; }.site-sound-toggle.is-off{
  filter: grayscale(1);
  opacity: 0.45;
}/* Slider : hauteur responsive propre */
.elementor-location-header .elementor-widget-carousel .swiper,
.elementor-location-header .elementor-widget-carousel .swiper-wrapper,
.elementor-location-header .elementor-widget-carousel .swiper-slide {
  height: clamp(160px, 22vw, 320px) !important;
}

.elementor-location-header .elementor-widget-carousel img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center !important;
}

/* Boutons : se replacent bien sur mobile */
@media (max-width: 767px) {
  .btn-coloriages, .btn-jeux, .btn-univers, .btn-contact {
    width: clamp(90px, 34vw, 150px) !important;
    height: auto !important;
  }
}/* Force le bloc "boutons" à prendre toute la largeur de l'écran (full-bleed) */
.elementor-location-header .header-navages {
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
}

/* Boutons : restent centrés + passent à la ligne si besoin */
.elementor-location-header .header-navages .elementor-container,
.elementor-location-header .header-navages .e-con-inner {
  justify-content: center !important;
  flex-wrap: wrap !important;
  gap: 20px !important;
}

/* Tailles boutons responsive (si classes css sur les images) */
.btn-coloriages, .btn-jeux, .btn-univers, .btn-contact {
  max-width: 120px !important;
  height: auto !important;
}

@media (max-width: 1024px) {
  .btn-coloriages, .btn-jeux, .btn-univers, .btn-contact { max-width: 100px !important; }
}
@media (max-width: 767px) {
  .btn-coloriages, .btn-jeux, .btn-univers, .btn-contact { max-width: 85px !important; }
}/* FULL WIDTH vrai (même si le thème est en boxed) */
.elementor-location-header,
.elementor-location-header .elementor-section,
.elementor-location-header .e-con,
.elementor-location-header .e-con-inner{
  max-width: 100% !important;
}

/* Ton conteneur arc-en-ciel en full-bleed */
#header-navages{
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
}

/* Les boutons restent groupés et responsive */
#header-navages .e-con-inner,
#header-navages{
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 20px !important;
}

/* Empêche les images de casser les proportions */
#header-navages img{
  height: auto !important;
  max-width: 100% !important;
}/* 1) Le bloc arc-en-ciel : hauteur contrôlée + cover propre */.hero-rainbow{
  width: 100%;
  position: relative;
  overflow: hidden;
  min-height: clamp(220px, 28vw, 360px);
  background: none !important; /* on ignore le background Elementor */
}

.hero-rainbow::before{
  content:"";
  position:absolute;
  inset:0;
  background-image: var(--hero-bg, none);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  z-index: 1;
}

.hero-rainbow > *{
  position: relative;
  z-index: 2; /* le contenu passe au-dessus du fond */
}/* MOBILE : 2 boutons par ligne */
@media (max-width: 767px) {

  .menu-boutons {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 18px 12px; /* ligne / colonne */
  }

  .menu-boutons > * {
    flex: 0 0 48%;
    max-width: 48%;
    box-sizing: border-box;
  }

  .menu-boutons img {
    width: 100%;
    height: auto;
    display: block;
    margin: 0 auto;
  }
}/* Le fond sert de repère */
.fond-arc{
  position: relative;
}

/* Bouton volume placé en haut à droite (mobile) */
@media (max-width: 767px){
  .fond-arc .btn-volume{
    position: absolute !important;
    top: 12px;
    right: 12px;
    z-index: 999;
    width: 56px;
  }
}/* 1) Le container arc-en-ciel : hauteur responsive (évite "énorme") */
.fond-arc{
  position: relative;               /* repère pour placer le volume en absolu */
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;

  /* Hauteur "propre" sur tous écrans */
  min-height: clamp(220px, 30vw, 420px);
  width: 100%;
  overflow: hidden;
}

/* 2) Zone des boutons : flex stable */
.menu-boutons{
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 18px 18px;                   /* (colonne / ligne) = équivalent de GAP */
  width: 100%;
}

/* Les widgets enfants dans Elementor (images/boutons) */
.menu-boutons > .elementor-element{
  flex: 0 0 auto;
}

/* 3) Desktop : 4 boutons sur une ligne (si place), sinon ça wrap proprement */
@media (min-width: 768px){
  .menu-boutons > .elementor-element{
    width: auto;
  }
}

/* 4) Mobile : 2 boutons par ligne */
@media (max-width: 767px){
  .menu-boutons{
    justify-content: center;         /* centre joliment sur mobile */
    gap: 14px 14px;
  }

  /* 2 colonnes */
  .menu-boutons > .elementor-element{
    width: calc(50% - 14px);
  }

  /* Images qui prennent bien la largeur de leur "case" */
  .menu-boutons img{
    width: 100%;
    height: auto;
    display: block;
  }
}

/* 5) Bouton volume : on le "décale" et on le fixe en haut à droite sur mobile */
@media (max-width: 767px){
  .fond-arc .btn-volume{
    position: absolute !important;
    top: 12px;
    right: 12px;
    z-index: 999;
    width: 56px;                    /* ajuste si besoin */
    height: auto;
  }
}/* =========================
   MENU BOUTONS - BASE
========================= */
.menu-boutons{
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;     /* évite le décalage à droite */
  gap: 22px;                   /* espace entre boutons */
  width: 100%;
}

/* Les boutons (sauf volume) restent "dans le flux" */
.menu-boutons .btn-coloriages,
.menu-boutons .btn-jeux,
.menu-boutons .btn-univers,
.menu-boutons .btn-contact{
  flex: 0 0 auto;
}

/* Le bouton volume : positionné au-dessus, indépendant */
.menu-boutons .btn-volume{
  position: absolute;
  left: 18px;
  top: 18px;
  z-index: 999;
}

/* Empêche l’effet “énorme” sur les images */
.menu-boutons img{
  max-width: 100%;
  height: auto;
  display: block;
}

/* =========================
   MOBILE : 2 BOUTONS / LIGNE
   + volume en haut à droite
========================= */
@media (max-width: 767px){

  .menu-boutons{
    justify-content: space-between;
    gap: 14px;
    padding-top: 70px; /* on laisse la place au bouton volume */
  }

  /* 2 par ligne (sauf volume) */
  .menu-boutons .btn-coloriages,
  .menu-boutons .btn-jeux,
  .menu-boutons .btn-univers,
  .menu-boutons .btn-contact{
    flex: 0 0 48%;
    max-width: 48%;
  }

  /* Volume en haut à droite sur mobile */
  .menu-boutons .btn-volume{
    left: auto;
    right: 12px;
    top: 12px;
    width: 56px;   /* ajuste si besoin */
  }

  /* Si Elementor te duplique le bouton volume, on masque les suivants */
  .menu-boutons .btn-volume ~ .btn-volume{
    display: none !important;
  }
}@media (max-width: 767px) {
  .menu-boutons {
    justify-content: center;
  }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-a8dc284 */.elementor-4649 .elementor-element.elementor-element-a8dc284:hover {
    transform: scale(1.05);
    transition: 0.3s ease;
}/* End custom CSS */