/*
 Theme Name:   Thème Coam
 Theme URI:    https://agence-coam.fr/
 Description:  Thème de l'Agence Coam, basé sur GeneratePress.
 Author:       Agence Coam
 Author URI:   https://agence-coam.fr/
 Template:     generatepress
 Version:      0.1
*/

/* Fichier de personnalisation du site */


/* ---------- TYPOGRAPHIE ---------- */

/* Affecte la font family définie en "headings" dans la font library à tous les titres,
 * et à tous les textes ayant pour classe additionnelle "style-hX" */
h1,h2,h3,h4,h5,h6,[class*=style-h] {
	font-family: Roboto;	
	line-height:1.2em;
	margin-bottom:1.5rem;
}

/* Taille des titres et des textes ayant pour classe "style-hX".
 * Paramétré ici plutôt que dans le Customizer pour n'avoir à le changer qu'une fois
 * Ajouter les font-weight pour chaque niveau de titre. */

p {
	font-size:1rem;
	margin-bottom:1.5rem;
	line-height:1.5;
}

h1, .style-h1 {
	font-size:clamp(2.1rem, 2.7528vw + .858rem, 3.125rem);
}

h2, .style-h2 {
	font-size:clamp(1.8rem, 1.8799vw + .9518rem, 2.5rem);
	font-weight:500;
}

h3, .style-h3 {
	font-size:clamp(1.3rem, .5371vw + 1.0577rem, 1.5rem);
	font-weight:500;
}

h4, .style-h4 {
	font-size:clamp(1.5938rem, 1.3525rem + 0.9649vw, 2.1245rem);
}

h5, .style-h5 {
	font-size:clamp(1.3281rem, 1.1271rem + 0.8041vw, 1.7704rem);
}

h6, .style-h6 {
	font-size:clamp(1.1953rem, 1.0144rem + 0.7237vw, 1.5934rem);
}


/* ---------- CARROUSELS ---------- */


/********************************** Hide carousel behavior on desktop ***********************************/
/* enable Flickity by default */
.carousel:after {
  content: 'flickity';
  display: none; /* hide :after */
}

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

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

@media screen and (max-width:1084px) {
	.carousel-cell {
	  width: calc(90% - 1rem * 1/2);
	  margin-right: 1rem;
	}
}

/* Pagination */
.flickity-page-dots {
    width: 100%;
    bottom: -1.5rem;
    padding: 0;
    margin: 0;    
    display: flex;
    flex-direction: row;
    justify-content: center;
    gap: 0.5rem;
}

.flickity-page-dots .dot {
    width: 0.5rem;
    height: 0.5rem;
    margin: 0;
    background: #000;
}