/* Compléments au theme.json : ce que les réglages de blocs ne savent pas faire. */

/* En-tête */
.rl-entete { border-bottom: 1px solid #eee; }
.rl-entete .wp-block-site-logo img { width: 120px; height: auto; }
.rl-entete .wp-block-navigation .wp-block-navigation__submenu-container {
	border: 0; box-shadow: 0 8px 24px rgb(0 0 0 / .12); padding: .4rem 0; min-width: 260px;
	text-transform: none; font-weight: 400;
}
.rl-entete .wp-block-navigation-item__content:hover { color: var(--wp--preset--color--bleu); }

/* Bandeau de titre des pages intérieures */
.rl-bandeau { padding-block: clamp(48px, 8vw, 88px); margin-block-start: 0 !important; }
.rl-bandeau h1 { color: inherit; font-size: 1.25rem; font-weight: 500; letter-spacing: .02em; }
.wp-site-blocks > main > .entry-content > .rl-bandeau:first-child,
main .wp-block-post-content > .rl-bandeau:first-child { margin-top: 0; }

/* Accueil : tuiles image + couleur */
.rl-tuiles { margin-block: 3rem 0; }
.rl-tuiles + .rl-tuiles { margin-top: 0; }
.rl-tuiles .wp-block-column { padding: clamp(24px, 4vw, 48px); display: flex; flex-direction: column; justify-content: center; }
.rl-tuiles .wp-block-column.rl-col-image { padding: 0; }
.rl-tuiles .rl-col-image .wp-block-cover { height: 100%; }
.rl-tuiles h2, .rl-tuiles h3 { color: inherit; }
.rl-tuiles h2 { font-size: 1rem; font-weight: 500; letter-spacing: .02em; margin-bottom: .8rem; }
@media (min-width: 782px) { .rl-tuiles > .wp-block-column { flex: 1 1 50% !important; } }
.rl-tuiles h3 { font-size: 1.15rem; margin: .4rem 0; }
.rl-tuiles h3 a { color: inherit; text-decoration: none; }
.rl-tuiles h3 a:hover { text-decoration: underline; color: inherit; }

/* Sections colorées (ex. bloc gris des deux boutons de l'accueil) */
.rl-section { padding-block: clamp(32px, 6vw, 64px); }
.rl-section .wp-block-columns { gap: 2rem; }

/* Valeurs (Nos missions) */
.rl-valeur__icone { display: flex; justify-content: center; color: var(--wp--preset--color--ciel); }
.rl-valeur__icone svg { width: 64px; height: 64px; }
.rl-valeur h3 { color: var(--wp--preset--color--ciel); margin-top: .6rem; }

/* Équipe */
.rl-equipe figure { margin: 0; }
.rl-equipe img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; object-position: top; }
.rl-equipe figcaption { text-align: center; }

/* Listes d'articles */
.rl-articles .wp-block-post-template { gap: 2rem; }
.rl-articles .wp-block-post-title { font-size: 1.1rem; margin-top: .6rem; }
.rl-articles .wp-block-post-title a { color: var(--wp--preset--color--noir); text-decoration: none; }
.rl-articles .wp-block-post-title a:hover { color: var(--wp--preset--color--bleu); }

/* Diaporama de l'accueil */
.rl-diaporama { position: relative; overflow: hidden; }
.rl-diaporama__piste { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; scrollbar-width: none; }
.rl-diaporama__piste::-webkit-scrollbar { display: none; }
.rl-diaporama__piste > .wp-block-cover { flex: 0 0 100%; scroll-snap-align: start; margin: 0 !important; }
.rl-diaporama h2 { font-size: clamp(1.3rem, 3vw, 2rem); }
.rl-diaporama .wp-block-button.is-style-outline .wp-block-button__link { color: #fff; border-color: #fff; background: transparent; }
.rl-diaporama .wp-block-button.is-style-outline .wp-block-button__link:hover { background: #fff; color: var(--wp--preset--color--noir); }
.rl-diaporama__fleche {
	position: absolute; top: 50%; transform: translateY(-50%); z-index: 2;
	width: 44px; height: 44px; border: 0; border-radius: 50%; cursor: pointer;
	background: rgb(0 0 0 / .25); color: #fff; font-size: 1.4rem; line-height: 1;
}
.rl-diaporama__fleche:hover { background: rgb(0 0 0 / .5); }
.rl-diaporama__fleche--prec { left: 12px; }
.rl-diaporama__fleche--suiv { right: 12px; }
.rl-diaporama__points { position: absolute; bottom: 12px; left: 0; right: 0; display: flex; justify-content: center; gap: 8px; z-index: 2; }
.rl-diaporama__points button { width: 10px; height: 10px; padding: 0; border-radius: 50%; border: 0; background: rgb(255 255 255 / .5); cursor: pointer; }
.rl-diaporama__points button[aria-current="true"] { background: #fff; }
/* Dans l'éditeur : diapos empilées, pour pouvoir les modifier une à une */
.editor-styles-wrapper .rl-diaporama > .wp-block-cover + .wp-block-cover { margin-top: 1rem; }

/* Pied de page */
.rl-pied { font-size: .9rem; }
.rl-pied a { color: inherit; }

/* Mobile */
@media (max-width: 781px) {
	.rl-tuiles .wp-block-column.rl-col-image { min-height: 220px; }
	.rl-diaporama .wp-block-cover { min-height: 340px !important; }
	.rl-diaporama__fleche { display: none; }
}

/* Formulaires Gravity Forms : bouton aux couleurs du site */
.gform_wrapper .gform_footer input[type="submit"],
.gform_wrapper .gform_footer button {
	background: var(--wp--preset--color--framboise); color: #fff; border: 0; border-radius: 3px;
	padding: .8em 2em; font: 500 1rem/1 var(--wp--preset--font-family--roboto); cursor: pointer;
}
.gform_wrapper .gform_footer input[type="submit"]:hover { background: var(--wp--preset--color--marine); }
.rl-valeur h3 { font-size: 1.6rem; }
.rl-texte::after { content: ""; display: table; clear: both; }
.rl-texte .alignleft { margin: .3em 1.5em 1em 0; }
.rl-texte .alignright { margin: .3em 0 1em 1.5em; }
.rl-articles .wp-block-post-excerpt { font-size: var(--wp--preset--font-size--small); }