/*
Theme Name: Divi Child
Text Domain: leconcertideal
Theme URI: http://www.elegantthemes.com/gallery/divi/
Template: Divi
Author: Elegant Themes
Author URI: http://www.elegantthemes.com
Description: Smart. Flexible. Beautiful. Divi is the most powerful theme in our collection.
Version: 4.27.7.1783600434
Updated: 2026-07-09 14:33:54

*/

/* couleurs du site */
:root {
 /* --bleufonce: #254874; /* utilisation variable : var(--bleufonce)  */
/*  --bleufonce-transparent: rgba(37, 72, 116, 0.1); /* utilisation variable : var(--bleufonce-transparent)  */
  --bleufonce: #00347c; /* utilisation variable : var(--bleufonce)  */
  --bleufonce-transparent: rgba(0, 52, 124, 0.1); /* utilisation variable : var(--bleufonce-transparent)  */
  --taupe : #877A7A; /* utilisation variable : var(--taupe)  */
  --taupe-transparent : rgba(122, 0, 10, 0.1); /* utilisation variable : var(--taupe-transparent)  */
  --bleumoyen: #1764A3; /* utilisation variable : var(--bleumoyen)  */
  --orange: #DE6502; /* utilisation variable : var(--orange)  */
  --violet: #42092D; /* utilisation variable : var(--violet)  */

/* couleurs des créations */
  --heurebleue: #009FE3; /* utilisation variable : var(--heurebleue)  */
  --heurebleue-glow: rgba(0, 159, 227, 0.15);
  --piazzolla: #CD1619; /* utilisation variable : var(--piazzolla)  */
  --piazzolla-glow: rgba(205, 22, 25, 0.15);
  --polyptyque: #801c51; /* utilisation variable : var(--polyptyque)  */
  --polyptyque-glow: rgba(128, 28, 81, 0.15);
  --sousletoile: #008d9b; /* utilisation variable : var(--sousletoile)  */
  --sousletoile-glow: rgba(0, 141, 155, 0.15);
  --roadtrip: #78201C; /* utilisation variable : var(--roadtrip)  */
  --roadtrip-glow: rgba(120, 32, 28, 0.15);
  --vivaldiao: #231d4c; /* utilisation variable : var(--vivaldiao) */
  --vivaldiao-glow: rgba(35, 29, 76, 0.15);
  --nuittrans: #7076af; /* utilisation variable : var(--nuittrans)  */
  --nuittrans-glow: rgba(112, 118, 175, 0.15);
}

/* ############################################################################# */
/* ############################################################################# */
/* ##################     interface générale      ############################## */

:root {
  --border-radius-standard: 4px; /* utilisation variable : var(--border-radius-standard)  */
  --border-radius-bouton: 8px;
}

/* #################### */
/* alignement du hamburger */
.column_menu .et_pb_menu .et_pb_menu_inner_container {
    width: fit-content;
    float: right;
}

.page blockquote {
    font-size: 1.5em !important;
    line-height: 1.3 !important;
    padding: 40px !important;
    margin: 30px 0 !important;
    border: 1px solid white !important;
    border-radius: var(--border-radius-standard) !important;
}
.single blockquote {
    font-size: 1.5em !important;
    line-height: 1.3 !important;
    padding: 40px !important;
    margin: 30px 0 !important;
    border: 1px solid black !important;
    border-radius: var(--border-radius-standard)!important;
}
@media (max-width: 767px) {
	.page blockquote {
		font-size: 1em !important;
		padding: 20px !important;
	}
	.single blockquote {
		font-size: 1em !important;
		padding: 20px !important;
	}
}

.page .single .single-creation #main-content {
    background-color: #fcfcfc !important;
}

.exergue:before {
      content: "";
    position: absolute;
    top: 50%;
    left: -40px;
    width: 150%;
    height: 150%;
    background-image: url(/wp-content/uploads/2026/07/arabesque2.png);
    background-repeat: no-repeat;
    background-size: contain;
    transform: translateY(-50%) rotate(0deg);
    opacity: 0.15;
}

.et_password_protected_form .et_submit_button{
    color: var(--orange);
}

/* ######### pages Musique en partage - Le projet ### le sous-menu sticky */
@media (max-width: 980px) {
  /* Cache le hamburger, uniquement pour ce menu */
  .menu_sticky .et_mobile_nav_menu {
    display: none !important;
  }
  /* Affiche le menu horizontal, uniquement pour ce menu */
  .menu_sticky .et_pb_menu__menu,
  .menu_sticky .et_pb_menu__menu > nav {
    display: block !important;
  }
  .menu_sticky ul.et-menu {
    display: flex !important;
    flex-wrap: wrap;            /* évite le débordement sur téléphone */
    justify-content: center;
  }
  .menu_sticky ul.et-menu > li {
    padding-right: 0;
    margin: 0 10px;
  }
}


/* #################### */
/* STYLE DES H3 */
/*.page #main-content */h3:not(.et-fb-tabs *), /*.single #main-content */h3:not(.et-fb-tabs *) {
  display: flex;
  align-items: center;
  text-align: center;
  margin: 40px 0;
}
/*.single #main-content */h3:not(.et-fb-tabs *)::before,
/*.single #main-content */h3:not(.et-fb-tabs *)::after,
/*.page #main-content */h3:not(.et-fb-tabs *)::before,
/*.page #main-content */h3:not(.et-fb-tabs *)::after {
  content: "";
  flex: 1;
  border-bottom: 1px solid #8a94a3;
}
/*.single #main-content */h3:not(.et-fb-tabs *) span,
/*.page #main-content */h3:not(.et-fb-tabs *) span {
  padding: 0 20px;
  font-size: 1.3em;
  letter-spacing: 0.05em;
  line-height: 1;
}
@media (max-width: 767px) {
  /*.single #main-content */h3:not(.et-fb-tabs *) span,
  /*.page #main-content */h3:not(.et-fb-tabs *) span {
    font-size: 1.1em;
  }
}
/* #################### */
/* STYLE DES H4 */
/*.single #main-content */h4:not(.et-fb-tabs *),
/*.page #main-content */h4:not(.et-fb-tabs *) {
  font-size: 1em;
  font-weight: 700;
}
/* #################### */


/* ############################################################################# */
/* ############################################################################# */
/* ##################     TEMPLATE CREATIONS      ############################## */

/* tag année dans les page creations */
div#tag-annee {
    position: absolute;
    top: 0;
    left: 0;
    background: white;
    padding: 5px 20px;
    color: black;
}
/* #################### */
/* DIAPORAMA */
.creation-swiper {
  width: 100%;
  height: auto;
}
.creation-swiper .swiper-slide img {
  width: 100%;
  height: auto;
  display: block;
  cursor: pointer;
}
/* #################### */

/* #################### */
/* ACCROCHE */
.creation__accroche {
    position: relative;
    padding: 20px 20px 20px 20%;
    color: white;
    font-size: 2em;
    line-height: 1.3;
}
.creation__accroche::before {
    content: "";
    position: absolute;
    top: 50%;
    right: 0;
    width: 100%;
    height: 100%;
    background-image: url("/wp-content/uploads/2026/07/arabesque2.png");
    background-repeat: no-repeat;
    background-size: contain;
    transform: translateY(-50%) rotate(0deg);
    opacity: 0.15;
}

/* #################### */

/* #################### */
/* Synopsis */
.creation__synopsis, .creation__programme {
    font-size: 110%;
    line-height: 1.3;
}
/* ############################ */

/* #################### */
/* bloc de chaque personne de l'équipe artistique */
.creation__equipe__poste, .creation__equipe__nombre {
	margin-bottom: 40px;
}

/* NBR REPRÉSENTATIONS */
.creation__nb-representations {
    padding: 40px;
    font-size: 3em;
    line-height: 1.7;
}
.creation__nb-representations strong {
    font-size: 4em;
    line-height: 0.5;
}
@media (max-width: 767px) {
	.creation__nb-representations {
		padding: 40px 0;
		font-size: 2em;
		line-height: 1.7;
	}
}



/* #################### */

/* STYLE DES CITATIONS DE PRESSE */

blockquote.creation__presse__citation {
    font-size: 15px !important;
    padding: 5px 0 !important;
    margin: 0 !important;
    border: 0 !important;
}





/* ################################################################################################################ */
/* ################################################################################################################ */
/* ****************************________ AGENDA________ ************************************************************ */
/* ######________ tout ce qui touche aux dates, à venir ou passées quel que soit l'endroit d'affichage________ ### */


/* ****************** spécificités agenda page d'accueil WHITE + 3 colonnes **************************************** */
.accueil__prochaines-dates {
	display: flex;
	flex-wrap: wrap;
	gap: 40px 80px;
	color: white;
}
.accueil__prochaines-dates h3 {
	flex: 1 1 100%;
    margin-bottom: -20px;
    padding-bottom: 0;
    font-size: 3em;	
    color: white !important;
	margin: 0 !important;
}
.accueil__prochaines-dates h4 {
	color: white !important;
	font-weight: 700;
}
.accueil__prochaines-dates .accueil__prochaines-dates__elem {
    border: 1px solid white;
	padding: 20px;
  }
/* Desktop : 3 colonnes */
@media (min-width: 981px) {
  .accueil__prochaines-dates .accueil__prochaines-dates__elem {
    flex: 0 1 calc(33.333% - 53.33px);
    position: relative;
  }
}
/* Tablette : 3 colonnes */
@media (min-width: 768px) and (max-width: 980px) {
  .accueil__prochaines-dates .accueil__prochaines-dates__elem {
		flex: 0 1 calc(33.333% - 53.33px);
		position: relative;
  }
	.accueil__prochaines-dates h3 {
		font-size: 2em;	
  }
}
/* Mobile : 1 colonne */
@media (max-width: 767px) {
	.accueil__prochaines-dates {
	gap: 20px;
}
  .accueil__prochaines-dates .accueil__prochaines-dates__elem {
    flex: 0 1 100%;
    position: relative;
  }
	.accueil__prochaines-dates h3 {
		font-size: 1.6em;	
  }
}
/* ****************** spécificités agenda footer WHITE + 1 colonnes **************************************** */
footer .accueil__prochaines-dates {
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
	color: white;
}
footer .accueil__prochaines-dates h3 {
	flex: 1 1 100%;
    margin-bottom: -20px;
    padding-bottom: 0;
    font-size: 0.9em;	
    color: white !important;
	margin: 0 !important;
}
footer .accueil__prochaines-dates h4 {
	color: white !important;
	font-weight: 700;
}
footer .accueil__prochaines-dates .accueil__prochaines-dates__elem {
    border: 1px solid white;
	padding: 20px;
  }
/* Desktop : 3 colonnes */
@media (min-width: 981px) {
  footer .accueil__prochaines-dates .accueil__prochaines-dates__elem {
    flex: 0 1 calc(33.333% - 13.33px);
    position: relative;
  }
}
/* Tablette : 3 colonnes */
@media (min-width: 768px) and (max-width: 980px) {
  footer .accueil__prochaines-dates .accueil__prochaines-dates__elem {
    flex: 0 1 calc(33.333% - 13.33px);
    position: relative;
  }
}
/* Mobile : 1 colonne */
@media (max-width: 767px) {
	footer .accueil__prochaines-dates .accueil__prochaines-dates__elem {
		flex: 0 1 100%;
		position: relative;
	}
	footer .accueil__prochaines-dates h3 {
		font-size: 2em;	
	}
}

/* ********** pour les agendas de la page d'accueil et du footer, un lien pour voir toutes les dates */
.accueil__prochaines-dates__tout {
  flex: 1 1 100%;   /* passe sous les dates dans le conteneur flex */
}
.accueil__prochaines-dates__tout a.btn-toutes-dates {
  display: inline-block;
  padding: 5px 15px 0 15px;
  border: 1px solid white;
  border-radius: var(--border-radius-standard);
  background: transparent;
  color: white;
  text-transform: uppercase;
  font-weight: 800;
}
.accueil__prochaines-dates__tout a.btn-toutes-dates:hover {
  background: white;
  color: var(--bleufonce);
}
footer .accueil__prochaines-dates__tout a.btn-toutes-dates {
  font-size: 0.8em;
}

/* *************************************************************************************************************************************************************** */
/* ************************************************* item DATE + COMPLET + Bouton RESA pour tous les agendas ************************************************* */

/* ### étiquette COMPLET ### */
.accueil__prochaines-dates .accueil__prochaines-dates__elem__complet, .creation__prochaines-dates__elem__complet, .agenda-avenir__ligne__complet, .agenda-passees__ligne__complet {
  position: absolute;
  top: 50%;
  transform: translateY(-50%) rotate(-25deg);
  display: block;
  left: 50%;
  text-transform: uppercase;
  color: red;
  z-index: 22;
  background: rgba(255, 255, 255, 0.9);
  padding: 0 5px;
  font-weight: 600;
  font-size: 90%;
}

.accueil__prochaines-dates__elem a.btn-resa {
    padding: 5px 15px 0 15px;
    border: 1px solid white;
    border-radius: var(--border-radius-standard);
    margin-top: 0;
    display: block;
    width: fit-content;
    background: var(--bleufonce);
    text-transform: uppercase;
    font-weight: 800;
	color: white;
}
.accueil__prochaines-dates__elem a.btn-resa:hover {
    padding: 5px 25px 0 25px;
    background: white;
	color: var(--bleufonce);
}
.creation__prochaines-dates__elem a.btn-resa, .agenda-avenir__ligne  a.btn-resa, .agenda-academie__ligne a.btn-resa {
    padding: 5px 15px;
    border: 0;
    border-radius: var(--border-radius-standard);
    margin-top: 5px;
    display: block;
    width: fit-content;
    background: white;
    text-transform: uppercase;
    font-weight: 800;
    color: var(--bleufonce);
}
.creation__prochaines-dates__elem a.btn-resa:hover, .agenda-avenir__ligne a.btn-resa:hover, .agenda-academie__ligne a.btn-resa:hover {
    padding: 5px 25px 0 25px;
    background: var(--bleufonce);
	color: white;
}

/* ********** spécificités COULEUR agenda passé + transmission *********************************** */
/* ### couleur date et lieu spécifique ### */
.agenda-passees__ligne__date {
  color: var(--bleufonce) !important;
	font-size: 20px;
	font-weight: 700;
}
.agenda-passees__ligne__lieu {
  color: var(--bleufonce);
}
/* ************* specifique agenda académie *********************************** */
.agenda-academie {
  display: flex !important;
  flex-direction: column !important;
  gap: 20px;
}
.agenda-academie__ligne {
  position: relative;
  border-bottom: 1px dotted #ccc;
  padding: 0 0 20px 0;
}
.agenda-academie__ligne__etiquettes {
  position: absolute;
  bottom: 0;
  right: 0;
  display: flex;
  gap: 4px;
}
.agenda-academie__ligne__etiquette {
  background: var(--bleufonce);
  padding: 0 5px;
  border: 1px solid black;
  color: white;
  font-weight: 800;
  font-size: 70%;
}
.agenda-academie__ligne__titre {
  font-weight: 700;
  margin-bottom: 6px;
}
.agenda-academie__ligne__date {
  color: var(--bleufonce);
  font-weight: 600;
}
.agenda-academie__ligne__lieu {
  font-size: 0.9em;
  margin-top: 4px;
}
.agenda-academie__ligne__complet {
  text-transform: uppercase;
  color: red;
  font-weight: 600;
  margin-top: 8px;
}

/* ************* FLEX pour les blocs d'agenda hors accueil et creation *********************************** */
.agenda-complet__liste, .agenda-avenir__liste, .agenda-passees__liste, .agenda-categorise__liste {
  display: flex;
  flex-wrap: wrap;
  gap: 40px;
}
.agenda-avenir__ligne, .agenda-passees__ligne, .agenda-categorise__ligne {
	position: relative;
}
/* ************* spécificités agenda page des créations ************************************************** */
/* liste représentations à venir dans les pages création */
.creation__prochaines-dates__elem {
    border-bottom: 1px dotted #ccc;
    margin-bottom: 0px;
    position: relative;
    padding: 15px 0;
}
.creation__prochaines-dates__elem:first-of-type {
  padding: 0 0 20px 0 !important;
}
.creation__prochaines-dates__elem__date {
    display: inline-block;
    margin-left: 10px;
    float: right;
}
@media (max-width: 767px) {
	.creation__prochaines-dates__elem__date {
		display: block;
		margin-left: 0px;
		float: none;
	}
}
.creation__prochaines-dates__elem a.btn-resa {
    padding: 5px;
    border: 1px solid black;
    border-radius: var(--border-radius-standard);
    margin-top: 15px;
    display: block;
    width: fit-content;
}
/* ###########################     TEMPLATE AGENDA COMPLET et AGENDA SPÉCIFIQUES (transmission)     ######################## */
/* ############# FILTRES pour les CREATIONS et les ÉTIQUETTES ############# */
/* ===== CONTENEUR DES FILTRES ===== */
.agenda-avenir__filtres,
.agenda-passees__filtres {
  margin-bottom: 40px;
}
.agenda-avenir__filtres-ligne,
.agenda-passees__filtres-ligne {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 12px;
}

/* ===== TAGS DE FILTRE ===== */
.filtre-tag {
  display: inline-block;
  padding: 8px 18px;
  border: 1px solid var(--bleufonce);
  border-radius: var(--border-radius-bouton);
  background: transparent;
  color: var(--bleufonce);
  font-size: 0.9em;
  letter-spacing: 0.02em;
  cursor: pointer;
  transition: background-color 0.25s ease, color 0.25s ease;
  white-space: nowrap;
}
.filtre-tag:hover {
  background-color: var(--bleufonce-transparent); /* teinte légère de bleufonce, ajustez si besoin */
}
.filtre-tag.is-active {
  background-color: var(--bleufonce);
  color: #fff;
  border-color: var(--bleufonce);
}
/* Variante pour les années (même style, mais séparées visuellement des créations/étiquettes) */
.filtre-tag--annee {
  font-weight: 600;
}

/* ############# CASES DATES ############# */

/* Fond couleur pleine : uniquement pour "À venir" (couleur dynamique injectée en inline) */
/* .agenda-avenir__ligne n'a plus de background-color ici, il est défini en inline par PHP */

/* Fond inchangé pour Dates passées et agenda catégorisé */
.agenda-passees__ligne,
.agenda-categorise__ligne {
  background-color: var(--bleufonce-transparent);
}

.agenda-avenir__ligne,
.agenda-passees__ligne,
.agenda-categorise__ligne {
  margin: 0;
  padding: 20px 20px 35px 20px;
  border-radius: var(--border-radius-standard);
  color: #fff;
  position: relative;
  overflow: hidden;
}

.agenda-avenir__ligne__etiquettes,
.agenda-avenir__ligne__titre,
.agenda-avenir__ligne__date,
.agenda-avenir__ligne__lieu,
.agenda-avenir__ligne__complet,
.agenda-avenir__ligne .btn-resa {
  position: relative;
  z-index: 1;
}

.agenda-passees__ligne {
  opacity: 0.5;
}

/* Desktop : 4 colonnes */
@media (min-width: 981px) {
  .agenda-complet__ligne,
  .agenda-avenir__ligne,
  .agenda-passees__ligne,
  .agenda-categorise__ligne {
    flex: 0 1 calc(25% - 30px);
  }
}

/* Tablette : 3 colonnes */
@media (min-width: 768px) and (max-width: 980px) {
  .agenda-complet__ligne,
  .agenda-avenir__ligne,
  .agenda-passees__ligne,
  .agenda-categorise__ligne {
    flex: 0 1 calc(33.333% - 27px);
  }
}

/* Mobile : 1 colonne */
@media (max-width: 767px) {
  .agenda-complet__ligne,
  .agenda-avenir__ligne,
  .agenda-passees__ligne,
  .agenda-categorise__ligne {
    flex: 0 1 100%;
  }
}

/* ################ fond des cases future ############ */
.agenda-avenir__ligne {
  position: relative;
  overflow: hidden;
  border-radius: var(--border-radius-standard);
  padding: 30px; /* cases plus grandes, ajustez selon le rendu voulu */
  color: #fff !important;
}
.agenda-avenir__ligne__titre h2 {
    color: white;
}
.agenda-avenir__ligne__date {
    color: white;
	font-size: 20px;
	font-weight: 700;
}
.agenda-avenir__ligne__lieu {
    color: white;
}

.agenda-avenir__ligne__etiquettes,
.agenda-avenir__ligne__titre,
.agenda-avenir__ligne__date,
.agenda-avenir__ligne__lieu,
.agenda-avenir__ligne__complet,
.agenda-avenir__ligne .btn-resa {
  position: relative;
  z-index: 1;
}




/* ############# ÉTIQUETTES ############# */
.agenda-avenir__ligne__etiquettes, .agenda-passees__ligne__etiquettes, .agenda-categorise__etiquettes {
    position: absolute;
    bottom: -1px;
    right: -1px;
    padding: 0;
    font-size: 14px;
    color: white;
    font-weight: 800;
	display: flex;
  gap: 2px; /* petit espace entre chaque badge */
}
.agenda-passees__ligne__etiquette, .agenda-categorise__etiquette {
    border: 1px solid black;
	border-radius: var(--border-radius-standard);
    background: var(--bleufonce);
    padding: 0 8px;
}
.agenda-avenir__ligne__etiquette {
    border: 1px solid black;
	border-radius: var(--border-radius-standard);
    background: var(--orange);
    padding: 0 8px;
}
.agenda-avenir__ligne__etiquette--reporte,
.agenda-passees__ligne__etiquette--reporte {
    border: 1px solid black;
	border-radius: var(--border-radius-standard);
	background: #C7751E !important;
    padding: 0 8px;
}

/* ############# PAGINATION ############# */
.agenda-avenir__pagination,
.agenda-passees__pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  margin: 30px 0;
}
.agenda-pagination__precedent,
.agenda-pagination__suivant {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 10px 20px;
  border: 1px solid var(--taupe);
  border-radius: var(--border-radius-bouton);
  background: transparent;
  color: var(--taupe);
  font-size: 0.9em;
  letter-spacing: 0.02em;
  cursor: pointer;
  transition: background-color 0.25s ease, color 0.25s ease, opacity 0.25s ease;
}
.agenda-pagination__precedent:hover,
.agenda-pagination__suivant:hover {
  background-color: var(--taupe-transparent);
}
.agenda-pagination__precedent:disabled,
.agenda-pagination__suivant:disabled {
  opacity: 0.35;
  cursor: not-allowed;
  pointer-events: none;
}
.agenda-pagination__periode-affichee,
.agenda-pagination__page-actuelle {
  font-weight: 600;
  color: var(--taupe);
  text-transform: capitalize;
  min-width: 160px;
  text-align: center;
}
@media (max-width: 767px) {
	.agenda-pagination__periode-affichee, .agenda-pagination__page-actuelle {
    min-width: 90px;
	}
  /* masque visuellement « Précédent / Suivant » mais le garde lisible pour les lecteurs d'écran */
  .agenda-pagination__texte {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
  }
}

/* *********************************************************************************************************** */
/* *********************************************************************************************************** */






/* #### select obsolete, ne sert plus ### */
/*select.agenda-complet__filtre-creation, select.agenda-complet__filtre-annee {
    padding: 20px;
    background: #254874;
    color: white;
    font-size: 2rem;
    font-family: inherit;
}
.agenda-complet__filtres {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
  margin-bottom: 40px;
}
.agenda-complet__filtre-creation,
.agenda-complet__filtre-annee {
  margin: 0;
}*/
/* Desktop : chaque select = 1 colonne sur 4 (même largeur que .agenda-complet__ligne) */
/*@media (min-width: 981px) {
  .agenda-complet__filtre-creation,
  .agenda-complet__filtre-annee {
    flex: 0 1 calc(25% - 22.5px);
  }
}*/

/* Tablette : chaque select = 1 colonne sur 3 */
@media (min-width: 768px) and (max-width: 980px) {
  .agenda-complet__filtre-creation,
  .agenda-complet__filtre-annee {
    flex: 0 1 calc(33.333% - 20px);
  }
}

/* Mobile : chaque select = 1 colonne (100%) */
@media (max-width: 767px) {
  .agenda-complet__filtre-creation,
  .agenda-complet__filtre-annee {
    flex: 0 1 100%;
  }
}


/* ****************************************************** */
/* ********** GALERIE DES MUSICIENS ********************* */
.galerie-musiciens {
  margin-bottom: 60px;
}
.galerie-musiciens__groupe {
  margin-bottom: 50px;
}
.galerie-musiciens__grille {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
}
.musicien-carte {
  flex: 0 1 calc(25% - 22.5px);
  display: flex;
  flex-direction: column;
  background: #fff;
  border-radius: var(--border-radius-standard);
  overflow: hidden;
border: 1px solid var(--bleufonce);
  /*box-shadow: 0 2px 10px rgba(0,0,0,0.08);*/
}
.musicien-carte--avant {
  flex-basis: 100%;
  flex-direction: row;
  align-items: center;
  gap: 30px;
  margin-bottom: 40px;
  background: none;
  box-shadow: none;
}
/* Taille d'image contrôlée */
.musicien-carte__photo {
  width: 100%;
  aspect-ratio: 3/4;
  overflow: hidden;
	position: relative;
}
.musicien-carte__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.musicien-carte--avant .musicien-carte__photo {
  width: 220px;
  flex-shrink: 0;
  aspect-ratio: 3/4;
}
/* Espacement entre l'image et le texte */
.musicien-carte__contenu {
  padding: 18px;
}
.musicien-carte--avant .musicien-carte__contenu {
  padding: 0;
  flex: 1;
}
.musicien-carte__nom {
    margin: 0;
    color: white;
    position: absolute;
	bottom: 0px;
    left: 0;
    z-index: 1;
    padding: 5px;
    background: black;
}
.musicien-carte__sous-titre {
  margin: 0 0 12px;
  font-size: 0.9em;
  color: #666;
  font-style: italic;
}
.musicien-carte__bio-apercu {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  font-size: 0.9em;
  line-height: 1.5;
}
.musicien-carte__bio-apercu p {
  margin: 0;
}
.musicien-carte__lire-plus {
  background: none;
  border: none;
  color: var(--bleufonce);
  text-decoration: underline;
  cursor: pointer;
  padding: 0;
  margin: 0;
  font-size: 0.9em;
}
.musicien-carte__site {
  display: inline-block;
  margin-top: 10px;
  font-size: 0.85em;
  color: var(--bleufonce);
}
/* Responsive */
@media (max-width: 980px) {
  .musicien-carte { flex-basis: calc(33.333% - 20px); }
}
@media (max-width: 767px) {
  .musicien-carte { flex-basis: 100%; }
  .musicien-carte--avant {
    flex-direction: column;
    align-items: flex-start;
  }
  .musicien-carte--avant .musicien-carte__photo {
    width: 100%;
  }
}
/* ** menu musiciens fixe réglages faits avec Divi directement */
.menu-instruments__liste {
  list-style: none !important;
  margin: 0;
  padding: 0;
}
.menu-instruments__item {
  margin-bottom: 12px;
}
.menu-instruments__lien {
  color: var(--orange);
  text-decoration: none;
  font-weight: 600;
  transition: opacity 0.2s ease;
}
.menu-instruments__lien:hover {
  opacity: 0.6;
}
@media (max-width: 980px) {
  .menu-instruments {
    position: static;
    margin-bottom: 30px;
  }
}
.musicien-modal {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 99999;
}
.musicien-modal.is-open {
  display: flex;
  align-items: center;
  justify-content: center;
}
.musicien-modal__overlay {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.7);
}
.musicien-modal__contenu {
  position: relative;
  width: 90%;
  max-width: 60%;
  max-height: 85vh;
  overflow-y: auto;
  background: #fff;
  padding: 50px 40px;
  border-radius: var(--border-radius-standard);
  z-index: 1;
}
.musicien-modal__fermer {
  position: absolute;
  top: 15px;
  right: 20px;
  background: none;
  border: none;
  font-size: 2em;
  line-height: 1;
  cursor: pointer;
  color: #333;
	  z-index: 10;
}
.musicien-modal__contenu h3 {
  margin-top: 0;
}
.musicien-modal__sous-titre {
  font-style: italic;
  color: #666;
  margin-bottom: 20px;
}
.musicien-modal__instruments {
  font-weight: 600;
  margin-bottom: 20px;
}
.musicien-modal__bio p {
  margin-bottom: 1em;
  line-height: 1.5;
}
.musicien-modal__site {
  display: inline-block;
  margin-top: 20px;
  color: var(--bleufonce);
  font-weight: 600;
}
@media (max-width: 767px) {
	.musicien-modal__contenu {
		width: 100%;
		max-height: 100vh;
		height: 100vh;
		border-radius: 0;
		padding: 60px 25px 30px;
	}
	.musicien-modal__contenu {
		max-width: 90%;
	}	
	.musicien-modal__fermer {
		position: absolute;
		top: 60px;
		right: 20px;
		background: none;
		border: none;
		font-size: 3em;
		line-height: 1;
		cursor: pointer;
		color: #333;
		z-index: 10;
	}
}



/* ****************************************************** */
/* ********** MOSAÏQUE DES CRÉATIONS ********************* */
.mosaique-creations {
  display: flex;
  flex-wrap: wrap;
  gap: 40px;
}

.mosaique-creations__case {
  position: relative;
  flex: 0 1 calc(25% - 30px);
  aspect-ratio: 1/1; /* carré, au lieu de 3/4 */
  background-size: cover;
  background-position: center;
  display: block;
  text-decoration: none;
  overflow: hidden;
}

.mosaique-creations__titre {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: #fff;
  font-size: 2rem;
	line-height: 1.1;
  font-weight: 400;
  text-align: center;
  padding: 0 15px;
  text-shadow: 0 2px 8px rgba(0,0,0,0.6);
  hyphens: none;
  -webkit-hyphens: none;
}

.mosaique-creations__annee {
  position: absolute;
  bottom: 0;
  left: 0;
  background: var(--bleufonce);
  color: #fff;
  padding: 4px 12px;
  font-size: 0.8em;
  font-weight: 700;
  letter-spacing: 0.05em;
  transform-origin: bottom left;
  transition: transform 0.25s ease;
	box-shadow: 5px -3px 13px 2px rgba(0, 0, 0, 0.78);
}

.mosaique-creations__case:hover .mosaique-creations__annee {
  transform: scale(1.08);
}

/* Voile sombre léger pour la lisibilité du titre sur toutes les images */
.mosaique-creations__case::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.25);
  z-index: 0;
}

.mosaique-creations__titre,
.mosaique-creations__annee {
  z-index: 1;
}
@media (max-width: 1062px) {
	.mosaique-creations__case {
  flex: 0 1 calc(33% - 26px);
}
}
@media (max-width: 980px) {
  .mosaique-creations__case {
    flex-basis: calc(50% - 20px); /* 2 colonnes, gap 40px → 1 espace ÷ 2 = 20px */
  }
}

@media (max-width: 600px) {
  .mosaique-creations__case {
    flex-basis: 100%; /* 1 colonne */
  }
}
.mosaique-creations__overlay {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.25s ease;
}

.mosaique-creations__case:hover .mosaique-creations__overlay {
  opacity: 1;
}


.mosaique-creations__case--pro {
  background-color: black;
  background-image: none !important;
}
.mosaique-creations__case--pro::before {
  background: transparent !important;
}
.mosaique-creations__case--pro__deco {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 70%;
  opacity: 0.25;
  z-index: 0;
}


footer .mosaique-creations__case--pro {
  background-color: transparent;
  background-image: none !important;
	border: 2px solid white;
	border-radius: var(--border-radius-standard);
}
footer .mosaique-creations__case--pro::before {
  background: transparent !important;
}
footer .mosaique-creations__case--pro__deco {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 70%;
  opacity: 0.25;
  z-index: 0;
}
footer a.mosaique-creations__case--pro:hover {
background-color: var(--bleufonce);
}
footer a.mosaique-creations__case--pro {
transition:  2s;
}
.mosaique-creations__case--pro .mosaique-creations__titre {
  z-index: 1;
}





/* ****************************************************** */
/* ********** SWITCH LANGUES ********************* */
.switch-langue {
  display: flex;
  align-items: right;
  gap: 8px;
	border: 1px solid white;
	border-radius: var(--border-radius-standard);
	padding: 5px 15px;
	width: fit-content;
  color: white;
}

.switch-langue__item {
  color: white;
  text-decoration: none;
  font-weight: 600;
  font-size: 0.9em;
  opacity: 0.5;
  transition: opacity 0.2s ease;
}

.switch-langue__item.is-active {
  opacity: 1;
}

.switch-langue__item:hover {
  opacity: 1;
}


/* ****************************************************** */
/* ********** PAGE ACCÈS PRO ***************************** */
.acces-pro {
  display: flex;
  flex-wrap: wrap;
  gap: 40px;
}
.acces-pro__creation__titre {
  font-size: 1.8em;
  margin-bottom: 30px;
  color: white;
  font-weight: 700;
  border-radius: 4px 4px 0 0;
  padding: 30px;
}

.acces-pro__creation {
  flex: 0 1 calc(33.333% - 27px);
  border-bottom: none; /* retire la ligne de séparation horizontale, plus adaptée à une grille */
  border: 1px solid var(--bleufonce);
	border-radius: var(--border-radius-standard);
}
.acces-pro__creation__bloc {
	padding: 0 30px 30px 30px;
}
@media (max-width: 980px) {
  .acces-pro__creation {
    flex-basis: 100%;
  }
}
.acces-pro__creation:last-child {
  border-bottom: none;
}

.acces-pro__creation__titre {
  font-size: 1.8em;
  margin-bottom: 30px;
}

.acces-pro__creation__bloc {
  margin-bottom: 30px;
}

/*.acces-pro__creation__documents {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
}*/

/* Sommaire */
.sommaire-acces-pro {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 40px;
}

.sommaire-acces-pro__liste {
  list-style: none;
  margin: 0;
  padding: 0;
}

.sommaire-acces-pro__liste li {
  margin-bottom: 10px;
}

.sommaire-acces-pro__liste a {
  color: var(--bleufonce);
  text-decoration: none;
  font-weight: 600;
}

.sommaire-acces-pro__liste a:hover {
  opacity: 0.6;
}

@media (max-width: 980px) {
  .sommaire-acces-pro {
    position: static;
    margin-bottom: 30px;
  }
}




/* ****************************************************** */
/* ********** RÉSEAUX SOCIAUX ÉCOUTE MUSIQUE ***************************** */
.reseaux-sociaux {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px 80px;
  flex-wrap: wrap;
}

.reseaux-sociaux__item {
  /*display: inline-flex;
  width: 24px;
  height: 24px;*/
    flex: 0 0 calc(25% - 60px);
    margin: 0 !important;
    display: flex;
    justify-content: center;
  min-width: 48px !important;
  min-height: 48px!important;
  margin: 0 !important;
}
.reseaux-sociaux__item:hover {
	filter: drop-shadow(4px 6px 6px rgba(0, 0, 0, 0.8));
}

.reseaux-sociaux__item svg {
  fill: #fff;
}
@media (max-width: 767px) {
  .reseaux-sociaux {
    gap: 24px 28px;
  }
  .reseaux-sociaux__item {
    flex: 0 0 56px;
    width: 56px;
  }
  .reseaux-sociaux__item svg {
    width: 100%;
    height: auto;
  }
}



/* ****************************************************** */
/* ********** CITATIONS DE PRESSE ***************************** */
.toutes-citations-presse {
  display: flex;
  flex-wrap: wrap;
  gap: 40px;
}

blockquote.toutes-citations-presse__citation {
	/*border: 1px solid var(--bleufonce) !important;
	padding: 20px !important;
	margin: 0 !important;
	border-radius: var(--border-radius-standard);*/
	font-size: 18px !important;
	position: relative;
    padding: 20px 20px 50px 20px !important;
  border-radius: var(--border-radius-standard);
  color: #fff !important;
}
.toutes-citations-presse__citation__support {
	text-align: right;
}

.toutes-citations-presse__citation__creation-liee {
	position: absolute;
    bottom: 1px;
    left: 0;
    background: var(--bleufonce);
    color: #fff;
    padding: 4px 12px;
    font-size: 0.8em;
    font-weight: 700;
    letter-spacing: 0.05em;
    transform-origin: bottom left;
    transition: transform 0.25s ease;
    box-shadow: 2px -3px 9px 0px rgba(0, 0, 0, 0.48);
}
.toutes-citations-presse__citation__creation-liee:hover {
	transform: scale(1.08);
}
.toutes-citations-presse__citation__creation-liee a{
    color: white;
}
.toutes-citations-presse__citation__txt {
font-style: italic;	
}
.toutes-citations-presse__citation__support a {
  color: #fff;
  text-decoration: underline;
}

@media (min-width: 981px) {
  .toutes-citations-presse__citation {
    flex: 0 1 calc(25% - 30px);
  }
}

@media (max-width: 980px) {
  .toutes-citations-presse__citation {
    flex: 0 1 100%;
  }
}


/* ****************************************************** */
/* ********** PARTENAIRES (fond foncé) ******************** */
.partenaires h3 {
  color: var(--violet);
}
.partenaires h3::before,
.partenaires h3::after {
  border-bottom-color: var(--violet);
}
.partenaires__groupe {
  margin-bottom: 50px;
}
.partenaires__grille {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 40px;
}
.partenaires__item {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  max-width: 350px;
  max-height: 120px;
}
.partenaires__item img {
  max-width: 100%;
  max-height: 80px;
  width: auto;
  height: auto;
  object-fit: contain;
}
@media (max-width: 600px) {
  .partenaires__grille {
    gap: 25px;
  }
  .partenaires__item {
    max-width: 120px;
    max-height: 70px;
  }
}

.bouton-don {
  text-align: center;
  margin: 60px 0;
}
.bouton-don__lien {
  display: inline-block;
  padding: 16px 40px;
  background: #fff;
  color: #000;
  text-decoration: none;
  font-weight: 700;
  border-radius: var(--border-radius-bouton);
  transition: opacity 0.2s ease;
}
.bouton-don__lien:hover {
  opacity: 0.8;
}



/* ****************************************************** */
/* ********** MÉDIATHÈQUE PAR CRÉATION ******************* */
.mediatheque-creation {
  margin-bottom: 60px;
}

.mediatheque-creation__videos {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  margin-bottom: 20px;
}

.mediatheque-creation__video {
  flex: 0 1 300px;
  max-width: 300px;
}

.mediatheque-creation__video__player {
  position: relative;
  padding-bottom: 56.25%; /* ratio 16:9 */
  height: 0;
}

.mediatheque-creation__video__player iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.mediatheque-creation__video__titre {
  margin-top: 8px;
  font-size: 0.9em;
  font-weight: 600;
}

.mediatheque-creation__photos {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
}

.mediatheque-creation__photo {
  flex: 0 1 300px;
  max-width: 300px;
  aspect-ratio: 1/1;
  overflow: hidden;
  display: block;
}

.mediatheque-creation__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.mediatheque-creation__photo__legende {
	font-size: 13px;
}