/* ==========================================================================
   Les Ateliers de l'Impro - CSS de theme

   Ce fichier ne contient PLUS de styles de composants.
   - Les couleurs, tailles, bordures, ombres et espacements sont declares dans
     theme.json (thème enfant) et choisis bloc par bloc dans l'editeur.
   - Les effets sans equivalent en attribut sont des styles de blocs nommes,
     enregistres dans wp-content/novamira-sandbox/aoi-block-styles.php et
     visibles dans l'onglet "Styles" de chaque bloc.

   Il ne reste ici que ce qui ne peut pas etre porte par un bloc : le cadre de
   page, le bandeau d'en-tete et le pied de page du constructeur Astra.
   ========================================================================== */

/* ---- Cadre de page : boite de 1200 px posee sur le fond sable ---------- */

html {
	background: var(--wp--preset--color--aoi-page-bg, #CFC4AC);
}

body.astra-child-ateliers-impro {
	background: var(--wp--preset--color--aoi-page-bg, #CFC4AC);
	font-family: var(--wp--preset--font-family--aoi-body);
}

.astra-child-ateliers-impro #page {
	max-width: 1200px;
	margin: 0 auto;
	background: var(--wp--preset--color--aoi-bg, #F7EEDA);
	box-shadow: 0 0 46px rgba(36, 26, 21, 0.20);
	overflow: hidden;
}

@media (max-width: 1240px) {
	.astra-child-ateliers-impro #page {
		max-width: 100%;
		box-shadow: none;
	}
}

/* Le contenu occupe toute la largeur de la boite : chaque bloc de section
   gere sa propre gouttiere via ses attributs d'espacement. */
.astra-child-ateliers-impro .site-content > .ast-container {
	max-width: none;
	width: 100%;
	padding: 0;
	margin: 0;
	display: block;
}
.astra-child-ateliers-impro .site-content #primary,
.astra-child-ateliers-impro .site-content .content-area,
.astra-child-ateliers-impro .site-content .ast-article-single,
.astra-child-ateliers-impro .site-content .entry-content {
	width: 100%;
	max-width: none;
	margin: 0;
	padding: 0;
}
.astra-child-ateliers-impro .entry-content > .wp-block-group {
	margin-block-start: 0;
	margin-block-end: 0;
}

/* Les blocs image portent leur propre ratio et leurs propres marges. */
.astra-child-ateliers-impro .entry-content .wp-block-image img {
	display: block;
	width: 100%;
}

/* ---- Bandeau d'en-tete : version desktop / version mobile -------------- */

/* La ligne du haut porte le bandeau : il doit toucher les deux bords de la
   boite de page. Astra pose 20 px de gouttiere sur ses conteneurs de ligne,
   ce qui laissait deux bandes verticales de part et d'autre de l'image. */
.astra-child-ateliers-impro .site-above-header-wrap,
.astra-child-ateliers-impro .site-above-header-wrap > .ast-builder-grid-row-container-inner {
	max-width: none;
	padding-left: 0;
	padding-right: 0;
}

.aoi-header-banner { position: relative; }
.aoi-header-banner__lien { display: block; line-height: 0; }
.aoi-header-banner img { width: 100%; display: block; }
.aoi-header-banner img.aoi-header-banner--mobile { display: none; }
.aoi-header-banner img.aoi-header-banner--desktop { display: block; }

body.aoi-scrolled .aoi-header-banner {
	max-height: 0;
	overflow: hidden;
	transition: max-height .25s ease;
}
.aoi-nav-sticky {
	position: sticky;
	top: 0;
	z-index: 200;
}

/* Les sections de contenu contiennent des encarts positionnes (titre chevauchant
   l'image d'ouverture, encart flottant sur une image) : sans plan de superposition
   explicite, ces encarts passeraient devant les sous-menus deroulants. */
.astra-child-ateliers-impro .site-header {
	position: relative;
	z-index: 300;
}

@media (max-width: 782px) {
	.aoi-header-banner img.aoi-header-banner--desktop { display: none; }
	.aoi-header-banner img.aoi-header-banner--mobile { display: block; }
}

/* ---- Pied de page (constructeur Astra, hors editeur de blocs) ---------- */

/* Gouttieres et largeur de la rangee, quel que soit le nombre de colonnes. */
.astra-child-ateliers-impro .site-primary-footer-wrap .ast-builder-grid-row {
	gap: 30px;
	align-items: start;
	max-width: 1200px;
	padding-left: 44px;
	padding-right: 44px;
	box-sizing: border-box;
}

/* Premiere colonne plus large pour la description, UNIQUEMENT quand le pied
   compte bien 4 colonnes. Astra pose lui-meme la classe ...-4-equal : si le
   nombre de colonnes est change dans Personnaliser, cette regle ne s'applique
   plus et Astra reprend la main sans rien casser. */
@media (min-width: 922px) {
	.astra-child-ateliers-impro .site-primary-footer-wrap.ast-builder-grid-row-4-equal .ast-builder-grid-row {
		grid-template-columns: 1.5fr 1fr 1fr 1fr;
	}
}
.astra-child-ateliers-impro .footer-widget-area[data-section^="section-fb-"] .ast-builder-html-element,
.astra-child-ateliers-impro .site-footer .footer-widget-area .widget,
.astra-child-ateliers-impro .site-footer .footer-widget-area .widget * {
	text-align: left;
}
.astra-child-ateliers-impro .site-footer,
.astra-child-ateliers-impro .site-footer p,
.astra-child-ateliers-impro .site-footer div,
.astra-child-ateliers-impro .site-footer li {
	color: var(--wp--preset--color--aoi-footer-text, #BFB29A);
	font-size: 16px;
}
.astra-child-ateliers-impro .site-footer a { color: #D9CDB5; text-decoration: none; }
.astra-child-ateliers-impro .site-footer a:hover { color: var(--wp--preset--color--aoi-accent-2, #E8862A); }
.astra-child-ateliers-impro .site-footer .aoi-footer__title,
.astra-child-ateliers-impro .site-footer .widget-title,
.astra-child-ateliers-impro .site-footer h2,
.astra-child-ateliers-impro .site-footer h3,
.astra-child-ateliers-impro .site-footer h4 {
	color: #fff;
	font-family: var(--wp--preset--font-family--aoi-body);
	font-weight: 700;
	font-size: 16px;
	margin: 0 0 10px;
	text-align: left;
}
/* Titre de la premiere colonne : nom de l ecole, police et couleur de marque. */
.astra-child-ateliers-impro .site-footer .aoi-footer__title--marque {
	font-family: var(--wp--preset--font-family--aoi-display, 'Archivo Black', sans-serif);
	color: var(--wp--preset--color--aoi-accent-2, #E8862A);
}
.astra-child-ateliers-impro .site-footer ul { list-style: none; margin: 0; padding: 0; }
.astra-child-ateliers-impro .site-footer li { margin: 0; line-height: 1.9; }
.astra-child-ateliers-impro .site-below-footer-wrap {
	text-align: center;
	color: #8D8069;
	font-size: 16px;
}

@media (max-width: 921px) {
	.astra-child-ateliers-impro .site-primary-footer-wrap .ast-builder-grid-row {
		padding-left: 22px;
		padding-right: 22px;
	}
}
