/*
Theme Name: Media Animation
Theme URI: https://media-animation.be/
Author: Media Animation ASBL
Author URI: https://wordpress.org
Description:
Requires at least: 6.8
Tested up to: 8.0
Requires PHP: 8.0
Version: 1.10.86
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: cawab-theme
Tags: one-column, custom-colors, custom-menu, custom-logo, editor-style, featured-images, full-site-editing, block-patterns, rtl-language-support, sticky-post, threaded-comments, translation-ready, wide-blocks, block-styles, style-variations, accessibility-ready, blog, portfolio, news
*/

:root {
	--ca-radius-30: clamp(20px, calc(20px + (30 - 20) * ((100vw - 320px) / 1600)), 30px);
	--ca-radius-button: clamp(20.33px, calc(20.33px + (36 - 20.33) * ((100vw - 320px) / 1280)), 36px);
	--site-pad: clamp(22px, calc(11.2px + 0.0408333 * 100vw - 13.1px), 50.4px);

	--curve-radius: clamp(45px, calc(250px - 205 * ((1920px - 100vw) / 984)), 250px);

	/* H1 - Fil d’ariane */
	--h1-fil-ariane: clamp(40px, calc(40px + (70 - 40) * ((100vw - 650px) / 1270)), 70px);

	/* Fil d’ariane - texte d’intro */
	--intro-text: clamp(49px, calc(49px + (70 - 49) * ((100vw - 650px) / 1270)), 70px);

	/* Padding sections avec un fond haut */
	--section-padding-top-bg: clamp(50px, calc(50px + (75 - 50) * ((100vw - 650px) / 1270)), 75px);

	/* Padding sections avec un fond bas */
	--section-padding-bottom-bg: clamp(75px, calc(75px + (135 - 75) * ((100vw - 650px) / 1270)), 135px);

	--section-padding-top: clamp(80px, calc(80px + (100 - 80) * ((100vw - 650px) / 1270)), 100px);
	--section-padding-bottom: clamp(80px, calc(80px + (100 - 80) * ((100vw - 650px) / 1270)), 100px);

	--section-button: clamp(50px, calc(50px + (75 - 50) * ((100vw - 650px) / 1270)), 75px);

	/* Fin-début de section */
	--section-gap: clamp(80px, calc(80px + (100 - 80) * ((100vw - 650px) / 1270)), 100px);

	/* Ajusté de 10px parce que le menu prendre 10px */
	--main-top: clamp(70px, calc(70px + (90 - 70) * ((100vw - 650px) / 1270)), 90px);

	/* H2 handled via theme.json */
	--h2-text: var(--wp--preset--spacing--60);

	/* Header - 1ere section */
	--header-first-section: clamp(80px, calc(80px + (100 - 80) * ((100vw - 650px) / 1270)), 100px);

	/* Dernière section - footer */
	--footer-last-section: clamp(100px, calc(100px + (150 - 100) * ((100vw - 650px) / 1270)), 150px);
}

@media (min-width: 1280px) {

  :root {
	--site-pad: clamp(50.4px, calc(50.4px + 0.17125 * 100vw - 219.2px), 160px);
  }
}


@media (min-width: 1440px) {

  :root {
      --fs-article-title: clamp(60px, 4.1667vw, 80px);
  }
}

/* // Accessibility: styles for the "skip to content" link */

.skip-link.screen-reader-text{
	background-color: #f2c6df;
	color: #403f91;
}

.skip-link.screen-reader-text:hover,
.skip-link.screen-reader-text:focus,
.skip-link.screen-reader-text:focus-visible {
	background-color: #403f91 !important;
	color: #f2c6df !important;
}

/* \Accessibility: styles for the "skip to content" link */


main{
	margin-top: 0;
	padding-top: var(--main-top);
	padding-bottom: var(--footer-last-section);
}

main#template-main-no-bottom-margin{
	margin-top: 0;
	padding-bottom: 0;
	margin-bottom: 0;
}

#template-footer{
	margin-top: calc(-1 * clamp(11.2px, calc(11.2px + 0.007 * 100vw - 2.2px), 17.9px));
}

#mention-copyright{
	max-width: 100%;
}

@media (max-width: 1000px) {
	
	#footer-last-section{
		display: flex;
		flex-direction: column-reverse;
		align-items: baseline;
	}
}

/* menu mobile : use core/separator inside core/navigation */
#navigation-mobile-top-space{
	background-color: var(--wp--preset--color--rouge-vif);
    width: 100% !important;
}

#navigation-mobile-section-space{
	background-color: var(--wp--preset--color--bg);
    width: 100% !important;
}

.wp-block-navigation__responsive-container-open,
.wp-block-navigation__responsive-container-close {
  min-width: 44px;
  min-height: 44px;
  padding: 10px; /* expands clickable area */
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.wp-block-navigation__responsive-container-open svg,
.wp-block-navigation__responsive-container-close svg{
	transform: scale(1.5);
	transform-origin: center;
}

.single h2,
.single h3,
.single h4{
	padding-top: 1.5rem;
	padding-bottom: 1.5rem;
}

/* variation buttons */
.wp-block-button__link{
    display: flex;
    align-items: center;
}

/* variation etoile button */
.is-style-button-bg-star a::before{
	content: "✦";
    padding-right: 15px;
    display: inline-flex;
    font-size: 1.5em;
    align-items: center;
}

/* styles / download.json */
.wp-block-file__button::before,
.is-style-download::before{
	content: " ";
	display: inline-block;
	width: 1em;
	height: 1em;
	padding-right: 0.5em;
	background-image: url('data:image/svg+xml,<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M16 21.3333L9.33337 14.6666L11.2 12.7333L14.6667 16.1999V5.33325H17.3334V16.1999L20.8 12.7333L22.6667 14.6666L16 21.3333ZM8.00004 26.6666C7.26671 26.6666 6.63893 26.4055 6.11671 25.8833C5.59449 25.361 5.33337 24.7333 5.33337 23.9999V19.9999H8.00004V23.9999H24V19.9999H26.6667V23.9999C26.6667 24.7333 26.4056 25.361 25.8834 25.8833C25.3612 26.4055 24.7334 26.6666 24 26.6666H8.00004Z" fill="white"/></svg>');
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	background-origin: content-box;
}

.wp-block-file__button::before{
    transform-origin: bottom left;
    transform: scale(1.2);
}

.is-style-download::before{
    transform-origin: top center;
    transform: scale(1.4);
}

/* Visually hidden, but available to @media  readers */
.sr-only {
	position: absolute !important;
	width: calc(var(--wp--preset--spacing--10-10) / 8) !important;
	height: calc(var(--wp--preset--spacing--10-10) / 8) !important;
	padding: 0 !important;
	margin: calc(var(--wp--preset--spacing--10-10) / -8) !important;
	overflow: hidden !important;
	clip: rect(0 0 0 0) !important; /* legacy */
	clip-path: inset(50%) !important; /* modern */
	white-space: nowrap !important; /* prevent line breaks */
	border: 0 !important;
}

/* Hide selected navigation content in inline mode and reveal it in the mobile overlay. */
.wp-block-navigation__responsive-container .ca-mobile-navigation-only {
	display: none;
}

.wp-block-navigation__responsive-container.is-menu-open li.ca-mobile-navigation-only {
	display: flex;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-image.ca-mobile-navigation-only {
	display: block;
}

@media (min-width: 1440px) {

	* {
		text-underline-position: under;
	}
}

*:focus-visible,
a:focus-visible,
button:focus-visible,
label:focus-visible,
input:focus-visible,
textarea:focus-visible,
summary:focus-visible {
	outline-color: var(--wp--preset--color--rouge-vif);
	outline-style: solid;
	outline-offset: 2px;
	outline-width: 2px;
}

textarea::placeholder,
input::placeholder {
	color: var(--wp--preset--color--text);
	opacity: 1; /* Firefox */
	font-style: italic;
}

fieldset {
	margin-left: 0;
	margin-right: 0;
}

a,
label,
button,
input[type="button"],
input[type="submit"],
input[type="reset"] {
	cursor: pointer;
	box-sizing: border-box;
}

a {
	transition: all 0.3s ease;
	-webkit-tap-highlight-color: transparent;
	-webkit-text-size-adjust: 100%;
}

a:hover,
a:focus-visible {
	text-decoration-thickness: 3px;
	transition: all 0.3s ease;
}

/* Core image style "Round": square ratio with rounded corners. */
.wp-block-image.is-style-rounded {
	aspect-ratio: 1 / 1;
	border-radius: 50%;
	overflow: hidden;
}

.wp-block-image.is-style-rounded > a {
	display: block;
	height: 100%;
}

.wp-block-image.is-style-rounded img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 0 !important;
}

.axes-section,
.accessibility-form,
.axe-ressources-section {
	--root-pad-left: var(--wp--style--root--padding-left, 0px);
	--root-pad-right: var(--wp--style--root--padding-right, 0px);
	--wide-size: var(--wp--style--global--wide-size);

	position: relative;
	overflow: hidden;
	z-index: 0;
}

.axe-ressources-section::after,
.accessibility-form::after,
.axes-section::after {
	content: "";
	position: absolute;
	pointer-events: none;
	z-index: 0;
}

.axe-ressources-section::after{
	--spiral-render-size: clamp(560px, 42vw, 808.59px);
	--spiral-inside: calc(var(--spiral-render-size) * 0.13);
	--spiral-outside: calc(var(--spiral-render-size) - var(--spiral-inside));
	width: var(--spiral-render-size);
	height: var(--spiral-render-size);

	top : 0;
	height: 100%;
	z-index: -1;
	margin-top: auto;
	margin-bottom: auto;
	background: url("../cawab-theme/assets/images/spiral.svg") no-repeat center / contain;
	right: calc(
		var(--root-pad-right) +
		max(
			(
				100% -
				var(--root-pad-left) -
				var(--root-pad-right) -
				var(--wide-size)
			) / 2,
			0px
		) -
		var(--spiral-outside)
	);
}

.axes-section::after {
	--asterisk-render-size: clamp(560px, 42vw, 808.59px);
	--asterisk-inside: calc(var(--asterisk-render-size) * 0.4366);
	--asterisk-outside: calc(var(--asterisk-render-size) - var(--asterisk-inside));
	width: var(--asterisk-render-size);
	height: var(--asterisk-render-size);

	bottom: 47px;
	right: calc(
		var(--root-pad-right) +
		max(
			(
				100% -
				var(--root-pad-left) -
				var(--root-pad-right) -
				var(--wide-size)
			) / 2,
			0px
		) -
		var(--asterisk-outside)
	);
	background: url("../cawab-theme/assets/images/asterisk.svg") no-repeat center / contain;
}

.accessibility-form::after {
	--asterisk-render-size: clamp(560px, 42vw, 808.59px);
	--asterisk-inside: calc(var(--asterisk-render-size) * 0.4366);
	--asterisk-outside: calc(var(--asterisk-render-size) - var(--asterisk-inside));
	width: var(--asterisk-render-size);
	height: var(--asterisk-render-size);

	bottom: 47px;
	left: calc(
		var(--root-pad-left) +
		max(
			(
				100% -
				var(--root-pad-left) -
				var(--root-pad-right) -
				var(--wide-size)
			) / 2,
			0px
		) -
		var(--asterisk-outside)
	);
	background: url("../cawab-theme/assets/images/asterisk.svg") no-repeat center / contain;
}

.axe-ressources-section > .wp-block-group__inner-container,
.accessibility-form > .wp-block-group__inner-container,
.axes-section > .wp-block-group__inner-container {
	position: relative;
	z-index: 1;
}

@media (max-width: 768px) {
	.axe-ressources-section,
	.accessibility-form::after,
	.axes-section::after {
		display: none;
	}
}

.form-deco {
	--asterisk-render-size: clamp(560px, 42vw, 808.59px);
	--asterisk-inside: calc(var(--asterisk-render-size) * 0.4366);
	--asterisk-outside: calc(var(--asterisk-render-size) - var(--asterisk-inside));
	--root-pad-left: var(--wp--style--root--padding-left, 0px);
	--root-pad-right: var(--wp--style--root--padding-right, 0px);
	--wide-size: var(--wp--style--global--wide-size);

	position: relative;
	overflow: hidden;
	z-index: 0;
}

.form-deco::after {
	content: "";
	position: absolute;
	width: var(--asterisk-render-size);
	height: var(--asterisk-render-size);
	bottom: 47px;

	left: calc(
		var(--root-pad-left) +
		max(
			(
				100% -
				var(--root-pad-left) -
				var(--root-pad-right) -
				var(--wide-size)
			) / 2,
			0px
		) -
		var(--asterisk-outside)
	);

	background: url("../cawab-theme/assets/images/asterisk.svg") no-repeat center / contain;
	pointer-events: none;
	z-index: 0;
}

.form-deco > .wp-block-group__inner-container {
	position: relative;
	z-index: 1;
}

@media (max-width: 768px) {
	.form-deco::after {
		display: none;
	}
}

#team-wrapper{
	column-gap: var(--wp--preset--spacing--70);
	row-gap: var(--wp--preset--spacing--50);
}

.contact-section,
.newsletter-section,
.actualites-section {
	--decoration-render-width: clamp(360px, 30vw, 552px);

	position: relative;
	overflow: hidden;
	z-index: 0;
}

.contact-section::before,
.newsletter-section::before,
.actualites-section::before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	max-height: 100%;
	width: var(--decoration-render-width);
	aspect-ratio: 552 / 993;

	background: url("../cawab-theme/assets/images/round.svg") no-repeat left center / contain;
	pointer-events: none;
	z-index: -1;
}

.contact-section::before,
.newsletter-section::before{
	background-image: url("../cawab-theme/assets/images/round-newsletter.svg");
	opacity: 0.15;
}

.contact-section > .wp-block-group__inner-container,
.newsletter-section > .wp-block-group__inner-container,
.actualites-section > .wp-block-group__inner-container {
	position: relative;
	z-index: 1;
}

@media (max-width: 768px) {
	.contact-section::before,
	.newsletter-section::before,
	.actualites-section::before {
		display: none;
	}
}


.resources-section {
	--decoration-render-size: 810px;
	--decoration-inside: 27.69px;
	--decoration-outside: calc(var(--decoration-render-size) - var(--decoration-inside));
	--root-pad-left: var(--wp--style--root--padding-left, 0px);
	--root-pad-right: var(--wp--style--root--padding-right, 0px);
	--wide-size: var(--wp--style--global--wide-size);

	position: relative;
	overflow: hidden;
	z-index: 0;
}

.resources-section::after {
	content: "";
	position: absolute;
	width: var(--decoration-render-size);
	height: auto;
	aspect-ratio: 810 / 809;
	bottom: 0;

	right: calc(
		var(--root-pad-right) +
		max(
			(
				100% -
				var(--root-pad-left) -
				var(--root-pad-right) -
				var(--wide-size)
			) / 2,
			0px
		) -
		var(--decoration-outside)
	);

	background: url("../cawab-theme/assets/images/spiral.svg") no-repeat center / contain;
	pointer-events: none;
	z-index: 0;
}

.resources-section > .wp-block-group__inner-container {
	position: relative;
	z-index: 1;
}

@media (max-width: 768px) {
	.resources-section::after {
		display: none;
	}
}


/* menu navigation styles */

.nav-mobile {
	display: none;
}

@media (max-width: 1280px) {
	.nav-desktop {
		display: none !important;
	}

	.main-menu-group{
		border-bottom: 2px solid var(--wp--preset--color--text);
	}

}

@media (min-width: 1281px) {

	.nav-mobile {
		display: none !important;
	}

	.wp-block-navigation__submenu-container,
	.wp-block-navigation__submenu-container {
		box-shadow: 0px 2px 4px 0px;
		border-radius: 0px 0px 16px 16px;
		/* overflow: hidden; */
	}

	.wp-block-navigation__submenu-container .wp-block-navigation-item__label,
	.wp-block-navigation__submenu-container .wp-block-navigation-item__label {
		text-align: center;
		margin-left: auto;
		margin-right: auto;
	}

}

/* used in the single templates for post and ressources */


@media (max-width: 900px) {
	#post-content-columns{
		display: flex;
		flex-direction: column-reverse;
	}
}

/* gravity Froms */

/* form: 
contact: #gform_wrapper_1
newsletter: #gform_fields_2
accessibility: #gform_fields_3
*/
#gform_wrapper_1,
#gform_fields_2,
#gform_fields_2
{
	--gf-field-gap-x : var(--wp--preset--spacing--50);
}

#gform_fields_1 input,
#gform_fields_2 input,
#gform_fields_3 input,
#gform_fields_1 textarea,
#gform_fields_2 textarea,
#gform_fields_3 textarea {
	--gf-local-outline-color : var(--wp--preset--color--rouge-vif);
	min-height: 44px;
	border-radius: 36px 0px 36px 36px;
	background-color: #fff;
	border: 2px solid var(--wp--preset--color--text);
	color: var(--wp--preset--color--text);
	box-sizing: border-box;
}

#gform_fields_1 .gform-field-label,
#gform_fields_2 .gform-field-label,
#gform_fields_3 .gform-field-label{
	font-size: clamp(20px, 1.25vw,24px);
	line-height: 32px;
	display: inline-block;
	font-family: 'Atkinson Hyperlegible';
	font-weight: 700;
	color: #41428f;
}

#gform_fields_1 .gfield_label_before_complex,
#gform_fields_2 .gfield_label_before_complex,
#gform_fields_3 .gfield_label_before_complex{
	text-transform: uppercase;
}

#gform_fields_1 input[type="checkbox"],
#gform_fields_2 input[type="checkbox"],
#gform_fields_3 input[type="checkbox"]{
	min-height: 24px;
	min-width: 24px;
}

#gform_fields_1 .gfield_required_text,
#gform_fields_2 .gfield_required_text,
#gform_fields_3 .gfield_required_text,
#gform_fields_1 .gfield_required_asterisk,
#gform_fields_2 .gfield_required_asterisk,
#gform_fields_3 .gfield_required_asterisk
{
	font-size: clamp(20px, 1.25vw,24px);
	line-height: 32px;
	display: inline-block;
	font-family: 'Atkinson Hyperlegible';
	font-weight: 700;
	color: var(--wp--preset--color--rouge-vif);
}

#gform_fields_1 .gfield_description,
#gform_fields_2 .gfield_description,
#gform_fields_3 .gfield_description,
#gfield_consent_description_2_4{
	padding-left: 0;
	padding-right: 0;
	font-style: italic;
	color: var(--wp--preset--color--text);
}

/* form: Newsletter inscription "envoyer" */
#gform_submit_button_1,
#gform_submit_button_2,
#gform_submit_button_3{
	--gf-local-outline-color : var(--wp--preset--color--rouge-vif);
	border-radius: 36px 0px 36px 36px;
	background-color: var(--wp--preset--color--rouge-vif);
	color: #fff;
	text-transform: uppercase;
	font-weight: 600;
	font-size: var(--wp--preset--font-size--regular, clamp(16px, 16px + 6 * (100vw - 1280px) / 640, 22px));
	padding-inline: clamp(1.5rem, 3vw, 2.35rem);
	min-height: 44px;
	padding: .6rem 1.75rem;
}


#gform_submit_button_1:hover,
#gform_submit_button_1:focus-visible,
#gform_submit_button_2:hover,
#gform_submit_button_2:focus-visible,
#gform_submit_button_3:hover,
#gform_submit_button_3:focus-visible
{
	background-color: var(--wp--preset--color--text);
}

