/* Fichier de remplacement de styles par défaut du thème */

/* =====================
   AJUSTEMENTS DU THEME
======================== */

/* Espacements gauche et droite du header
.site-header {
    padding-left: clamp(1rem, 0.848rem + 0.758vw, 1.5rem);
    padding-right: clamp(1rem, 0.848rem + 0.758vw, 1.5rem);
}*/

/* Équilibre les titres et les textes avec la classe "balance" comportant un ou plusieurs retour(s) à la ligne */
:is(h1, h2, h3, h4, h5, h6),
:is[class*=style-h] {
    text-wrap: balance;
}

.balance {
    text-wrap: balance !important;
}

/* Évite les orphelins dans les paragraphes et listes */
p,
li {
    text-wrap: pretty;
}

/* Ajuste la marge gauche des listes */
ol, ul {
  margin: 0 0 1.5em .5rem;
}

/* Supprime la marge inférieure du dernier paragraphe d'un bloc */
p:last-child:last-of-type,
h1:last-child:last-of-type,
h2:last-child:last-of-type,
h3:last-child:last-of-type,
h4:last-child:last-of-type,
h5:last-child:last-of-type,
h6:last-child:last-of-type
{
    margin-bottom: 0px;
}

/* ==========================================
   ACCESSIBILITE DES BLOCS CLIQUABLES (CARDS)
   https://youtu.be/HBriBrnRlQE?si=DLiSXEiBHt6lw91l
=================================================== */

.stretch-link {
    position: relative;
}

.stretch-link a::after {
    content: '';
    position: absolute;
    inset: 0;
}

.stretch-link a:is(:focus-visible)::after {
    outline: 2px solid;
}

.stretch-link a:is(:hover, :focus) {
    outline: none;
}

/* ========================
   LARGEUR MAXIMALE DU SITE
=========================== */

/*.site-wrapper {
    width: 100%;
    max-width: 1920px;
    margin-left: auto;
	margin-right: auto;
}*/


/* ==========================================
   CAROUSELS FLICKITY
=================================================== */

/**ADD PAGE ID IN PHP SNIPPET IN ORDER FOR THE SLIDER TO WORK**/

/********************************** Hide carousel behavior on desktop **********************************/
/* enable Flickity by default */
.talents-carousel:after,
.team-carousel:after,
.board-carousel:after,
.devgoals-carousel:after,
.partners-carousel:after {
  content: 'flickity';
  display: none; /* hide :after */
}

@media screen and ( min-width: 1024px ) {
  /* disable Flickity for large devices */
	.talents-carousel:after,
	.team-carousel:after,
	.board-carousel:after,
	.partners-carousel:after{
    content: '';
  }
}

@media screen and ( min-width: 1164px ) {
  /* disable Flickity for large devices */
	.devgoals-carousel:after {
    content: '';
  }
}

/********************************** Slides sizes **********************************/

/*HOMEPAGE - Dev goals carousel*/
@media (min-width:770px) and (max-width:1163px) {
	.carousel-cell-devgoals {
		margin-right:1rem;
		width:calc(50% - 2rem * 1/2);
	}
}
@media (max-width:769px) {
	.carousel-cell-devgoals {
		margin-right:1rem;
		width:calc(93% - 1rem * 1/2);
	}
}

/*WHAT WE DO PAGE - Success stories carousel*/
.carousel-cell-successstories {
	margin-right:1rem;
}
/*WHAT WE DO PAGE - Resources carousel*/
.carousel-cell-resources {
	margin-right:2rem;
	width:calc(50% - 2rem * 1/2);
}
@media (max-width:538px) {
	.carousel-cell-resources {
		margin-right:1rem;
		width:calc(100% - 1rem * 1/2);
	}
}
/*JOIN OUR COMMUNITY PAGE - Talents carousel*/
@media (min-width:768px) and (max-width:1024px) {
	.carousel-cell-talents {
		margin-right:3rem;
		width: 400px;
	}
}
@media (max-width:767px) {
	.carousel-cell-talents {
		margin-right:3rem;
		width: 300px;
	}
}
/*JOIN OUR COMMUNITY PAGE - Opportunities carousel*/
.carousel-cell-opportunities {
	margin-right:1rem;
	width: 380px;
}
/*WHO WE ARE - Team carousel*/
@media (min-width:768px) and (max-width:1024px) {
	.carousel-cell-team,
	.carousel-cell-board {
		margin-right:3rem;
		width:calc(50% - 2rem * 1/2);
	}
}
@media (max-width:767px) {
	.carousel-cell-team,
	.carousel-cell-board {
		margin-right:3rem;
		width:300px;
	}
}
/*WHO WE ARE - Partners carousel*/
@media (max-width:1024px) {
	.carousel-cell-partner {
		margin-right:2.5rem;
		width:calc(30% - 2.5rem * 1/2);
		max-height:80px;
	}
}

/********************************** Pagination dots **********************************/

/*Required so that dots 'absolute' position works*/
.carousel {
	position:relative;
}
/*All carousels*/
.flickity-page-dots {
	width: max-content; /*Required to give a background color to the dots container*/
	position: absolute; /*Center the dots container*/
  	left: 50%; /*Center the dots container*/
  	transform: translateX(-50%); /*Center the dots container*/
  	bottom: -30px;
  	padding: 0; /*Cancels primary padding*/
  	margin: 0; /*Cancels primary margin*/
  	display: flex;
  	flex-direction: row;
  	justify-content: center;
  	gap: 0rem; /*Cancels primary gap*/
	background-color:var(--dark-1); /*Primary color for all carousels*/
	border-radius:100px;
}
/*All carousels*/
.flickity-page-dots .dot {
	width: 2rem;
	height: .5rem;
	border-radius:100px;
	margin: 0;
	background-color:var(--dark-1); /*Primary color for all carousel dots*/
	transition:all 0.2s ease 0s;
	opacity:1; /*Cancels primary opacity*/
}
/*All carousels*/
.flickity-page-dots .dot.is-selected {
	width: 3rem;
	background: var(--accent-dark) !important; /*dark orange - Primary color for all carousel selected dots*/
}
/*WHAT WE DO PAGE - Success stories carousel*/
.success-stories-carousel .flickity-page-dots,
.success-stories-carousel .flickity-page-dots .dot {
	background-color:white; /*Exception for carousel background color & dots color*/
}
/*WHAT WE DO PAGE - Resources carousel*/
.resources-carousel .flickity-page-dots {
  bottom: -45px;
}
/*JOIN OUR COMMUNITY PAGE - Opportunities carousel*/
.opportunities-carousel .flickity-page-dots {
	width: max-content; /*Required to give a background color to the dots container*/
	position: absolute; /*Center the dots container*/
  	left: 50%; /*Center the dots container*/
  	transform: translateX(-50%); /*Center the dots container*/
  	bottom: -40px !important;
}
@media (max-width:1024px) {
	.opportunities-carousel .flickity-page-dots {
  		left: 50%; /*Center the dots container*/
  		transform: translateX(-50%); /*Center the dots container*/
	}
}