/*
Theme Name: Sainte Marie
Theme URI: https://www.gazellecommunication.fr
Author: Gazelle Communication
Author URI: https://www.gazellecommunication.fr
Description: Thème sur mesure pour l’Institut Sainte Marie de Chavagnes.
Version: 1.0.0
Requires at least: 6.4
Tested up to: 6.9
Requires PHP: 8.0
Text Domain: sainte-marie-starter
*/

/*
 * Le CSS principal est chargé via assets/css/base.css
 * Ce fichier reste minimal pour respecter les conventions WP.
 */
.custom-logo-alternative {
	height: 128px;
	width: auto;
}
.site-nav {
	background-color: #002442;
}
.site-nav a {
	color: #7F96FF;
}
.max-w-45 {
  max-width: 45%;
}
.max-w-620 {
  max-width: 620px;
}
.max-w-900 {
  max-width: 900px;
}
.p-relative {
	position: relative;
}
.bg-bird::after {
  content: " ";
  background-image: url('assets/img/oiseau-removebg.png');
  width: 210px;
  height: 200px;
  position: absolute;
	top: -27px;
  right: -10px;
}
.bg-arrow::after {
  content: " ";
  background-image: url('assets/img/fleche-removebg.png');
  width: 146px;
  height: 43px;
  position: absolute;
bottom: -30px;
  left: 60%;
}
.bg-sun::after {
  content: " ";
  background-image: url('assets/img/soleil-removebg.png');
  width: 210px;
  height: 200px;
  position: absolute;
top: -82px;
  right: -100px;
}
.remove-bg {
    mix-blend-mode: multiply;
}
.radius-25 {
	border-radius: 25px;
}
.border-top-violet {
	border-top: 1px solid #7F96FF;
}
.border-left-1 {
	border-left: 1px solid #002442;
}
.m-auto {
  margin-left: auto !important;
  margin-right: auto !important;
}
.mb-60 {
	margin-bottom: 60px;
}
.mb-0 {
	margin-bottom: 0;
}
.p-0, .p-0 .wp-block-button__link {
	padding: 0;
}
.gap-10 {
  gap: 10px !important;
}
/* footer */
:root {
    // Colors
    --color-white: #FFF;
    --color-black: #000;

    --color-black-50: rgba(0,0,0,.5);
    --color-black-25: rgba(0,0,0,.25);
    --color-black-10: rgba(0,0,0,.1);

    --color-white-50: rgba(255,255,255,.5);
    --color-white-25: rgba(255,255,255,.25);

    --color-blue-light: #00B1EB;
    --color-blue-xlight: #79DCFD;
    --color-blue-green: #3A7B84;

    --color-green-xlight: #DDF8E8;

    --color-purple-dark: #0B0033;
    --color-purple-medium: #3A56B1;
    --color-purple-light: #7F70E7;
    --color-purple-xlight: #bfb7f3;

    --color-orange-light: #FFC394;

    --color-yellow-regular: #FBBA00;

    --color-pink-regular: #E93F84;
    --color-pink-light: #ffecf4;

    --color-grey-light: #F7F5F3;

    // Fonts
    // Source : https://css-tricks.com/snippets/css/system-font-stack/
    --system-ui: system-ui, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    --font-main: 'Quicksand', var(--system-ui);
    --font-secondary: 'Source Serif 4', var(--system-ui);

    // Sizes
    --wrap-width: 1280px;
    --wrap-medium-width: 1600px;
    --wrap-large-padding: 20px;
    --wrap-padding: 50px;
    --wrap-narrow-padding: 100px;

    // Line-height
    --line-height-medium: 1.5;
    --line-height-main: 1.35;
    --line-height-regular: normal;
    --line-height-base: 1;
    --line-height-small: 1.15;
    --line-height-custom-1: 1.25;

    // Radius
    --radius-circle: 50%;
    --radius-rounded: 9999px;
    --radius-small: 6px;
    --radius-medium: 30px;

    // z-index
    --z-index-max: 2147483647;
    --z-index-xxtop: 15;
    --z-index-xtop: 14;
    --z-index-top: 13;
    --z-index-medium: 12;
    --z-index-regular: 11;
    --z-index-bg: -1;
    --z-index-deep: -2;

    // Transitions
    --transition-regular: all .2s;
    --transition-ease-in-out: all .15s ease-in-out;
    --transition-fast: all .1s;
    --transition-opacity-fast: opacity .1s linear 0.1s;
    --transition-smooth: all .15s ease-out;

    // Others
    --height-header: 104px;
    --recaptcha-min-height: 78px;

    // Cookies
    --color-cookies-bg: var(--color-blue-light);
    --color-cookies-text: var(--color-white);
    --color-cookies-borders: var(--color-white);
    --color-cookies-primary-bg: var(--color-white);
    --color-cookies-primary-text: var(--color-purple-dark);
    --color-cookies-secondary-bg: var(--color-blue-light);
    --color-cookies-secondary-text: var(--color-white);

    --filter-cookies-primary-icon: invert(0);
    --filter-cookies-secondary-icon: invert(1);

    // Filters
    // Source : https://codepen.io/sosuke/pen/Pjoqqp
    --filter-color-blue-light: invert(59%) sepia(47%) saturate(5674%) hue-rotate(162deg) brightness(101%) contrast(101%);
    --filter-color-blue-xlight: invert(79%) sepia(6%) saturate(3411%) hue-rotate(163deg) brightness(102%) contrast(98%);
    --filter-color-purple-medium: invert(27%) sepia(81%) saturate(849%) hue-rotate(198deg) brightness(97%) contrast(92%);
    --filter-color-purple-dark: invert(6%) sepia(33%) saturate(7371%) hue-rotate(252deg) brightness(84%) contrast(114%);
    --filter-color-purple-light: invert(46%) sepia(44%) saturate(1791%) hue-rotate(220deg) brightness(93%) contrast(94%);
    --filter-color-pink-regular: invert(57%) sepia(93%) saturate(5601%) hue-rotate(314deg) brightness(97%) contrast(88%);
    --filter-color-yellow-regular: invert(74%) sepia(48%) saturate(1097%) hue-rotate(355deg) brightness(95%) contrast(109%);
    --filter-color-orange-light: invert(72%) sepia(95%) saturate(247%) hue-rotate(324deg) brightness(101%) contrast(101%);
    --filter-color-green-xlight: invert(92%) sepia(24%) saturate(158%) hue-rotate(83deg) brightness(101%) contrast(95%);

.gz-c-Footer {
  --spacing-footer-menu-regular: 8px;
  --gap-footer-inner: var(--wrap-padding);
  --gap-footer-menu-regular: 20px;
  --gap-footer-menu-fancy-x: 10px;
  --gap-footer-menu-fancy-y: 10px;
  --gap-footer-col: 20px;
  --gap-footer-more: 20px;
}

.gz-c-Footer-inner {
  gap: var(--gap-footer-inner);
}

.gz-c-Footer-logo {
  max-width: 150px;
}

.gz-c-Footer-col {
  gap: var(--gap-footer-col);
}

.gz-c-Footer-col:first-of-type {
  width: calc(100% - 62.1%);
}

.gz-c-Footer-col:last-of-type {
  width: 62.1%;
}

.gz-c-Footer-tagline {
  margin-top: auto;
}

.gz-c-Footer-links {
  gap: var(--gap-footer-menu-fancy-y) var(--gap-footer-menu-fancy-x);
}

.gz-c-Footer-cta > a {
  min-width: max-content;
}

.gz-c-Footer-more {
  gap: var(--gap-footer-more);
}

.gz-c-Footer-menu-fancy {
  gap: var(--gap-footer-menu-fancy-y) var(--gap-footer-menu-fancy-x);
}

.gz-c-Footer-menu-fancy .wp-block-navigation-item__content {
  padding: 12px 16px;
  border-radius: 25px;
  background: var(--color-blue-light);
  border: 1px solid var(--color-white);
  transition: var(--transition-smooth);
}

@media (hover: hover) {
  .gz-c-Footer-menu-fancy .wp-block-navigation-item__content:hover {
    border-radius: var(--radius-small);
  }
}

.gz-c-Footer-menu-regular {
  gap: var(--gap-footer-menu-regular);
}

.gz-c-Footer-menu-regular .wp-block-navigation__container > li:not(:last-of-type) .wp-block-navigation-item__content {
  position: relative;
}

.gz-c-Footer-menu-regular .wp-block-navigation__container > li:not(:last-of-type) .wp-block-navigation-item__content::after {
  content: '';
  position: absolute;
  background: currentColor;
  width: 2px;
  height: calc(100% - var(--spacing-footer-menu-regular));
  top: calc(var(--spacing-footer-menu-regular) / 2);
  right: calc(var(--gap-footer-menu-regular) / 2 * -1);
}

.gz-c-Footer-menu-regular .wp-block-navigation-item__content {
  /* TODO: remplacer par le contenu de @include link-style-1(); */
}

@media (hover: hover) {
  .gz-c-Footer-menu-regular .wp-block-navigation-item__content:hover {
    /* TODO: remplacer par le contenu de @include link-style-1-hover(); */
  }
}

.gz-c-Footer .wpcf7 > form > p {
  position: relative;
}

.gz-c-Footer .wpcf7 > form .wpcf7-response-output {
  display: none !important;
}

.gz-c-Footer .wpcf7 > form[data-status="submitting"] .wpcf7-form-control-wrap,
.gz-c-Footer .wpcf7 > form[data-status="resetting"] .wpcf7-form-control-wrap {
  opacity: .5;
  cursor: not-allowed;
}

.gz-c-Footer .wpcf7 > form[data-status="submitting"] .wpcf7-form-control-wrap input,
.gz-c-Footer .wpcf7 > form[data-status="resetting"] .wpcf7-form-control-wrap input {
  pointer-events: none;
}

.gz-c-Footer .wpcf7 > form[data-status="submitting"] .wpcf7-submit,
.gz-c-Footer .wpcf7 > form[data-status="resetting"] .wpcf7-submit {
  background-image: url('/wp-content/themes/aer/img/progress.svg');
  background-position: center;
  background-size: 50%;
  cursor: not-allowed;
  pointer-events: none;
  transition: all 0s !important;
  opacity: .5;
  animation: rotateBackground 1s linear infinite;
}

@keyframes rotateBackground {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

.gz-c-Footer .wpcf7 > form[data-status="sent"] .wpcf7-form-control-wrap {
  cursor: not-allowed;
}

.gz-c-Footer .wpcf7 > form[data-status="sent"] .wpcf7-form-control-wrap input {
  pointer-events: none;
}

.gz-c-Footer .wpcf7 > form[data-status="sent"] .wpcf7-submit {
  background-image: url('/wp-content/themes/aer/img/check.svg');
  background-position: center;
  background-size: 60%;
  cursor: not-allowed;
  pointer-events: none;
  transition: all 0s !important;
  opacity: .5;
}

.gz-c-Footer .wpcf7 > form[data-status="spam"] .wpcf7-form-control-wrap {
  opacity: .5;
  cursor: not-allowed;
}

.gz-c-Footer .wpcf7 > form[data-status="spam"] .wpcf7-form-control-wrap input {
  pointer-events: none;
}

.gz-c-Footer .wpcf7 > form[data-status="spam"] .wpcf7-submit {
  background-image: url('/wp-content/themes/aer/img/cross.svg');
  background-position: center;
  background-size: 55%;
  cursor: not-allowed;
  pointer-events: none;
  transition: all 0s !important;
  opacity: .5;
}

.gz-c-Footer .wpcf7 .wpcf7-form {
  max-width: max-content;
}

.gz-c-Footer .wpcf7 .wpcf7-form-control-wrap {
  display: block;
  max-width: 350px;
}

.gz-c-Footer .wpcf7 .wpcf7-form-control-wrap input {
  font-family: var(--font-main);
  font-size: 16px;
  font-weight: 400;
  width: 100%;
  appearance: none;
  background: transparent;
  border: 1px solid var(--color-white);
  margin: 0;
  box-sizing: border-box;
  color: var(--color-white);
  height: 47px;
  border-radius: var(--radius-rounded);
  padding: 0 16px;
  padding-right: calc(36px + 6px + 16px);
}

.gz-c-Footer .wpcf7 .wpcf7-form-control-wrap input::placeholder {
  font-weight: 400;
  color: var(--color-white);
}

.gz-c-Footer .wpcf7 .wpcf7-form-control-wrap input:focus {
  outline: 0;
}

.gz-c-Footer .wpcf7 .wpcf7-form-control-wrap .wpcf7-not-valid-tip {
  color: var(--color-white);
  font-weight: 400;
  margin-top: 10px;
}

.gz-c-Footer .wpcf7 .wpcf7-submit {
  font-size: 0;
  padding: 0;
  outline: none;
  line-height: 1;
  margin-top: 0;
  position: absolute;
  top: 6px;
  right: 6px;
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  background-color: transparent;
  filter: invert(1);
  background-image: url('/wp-content/themes/aer/img/arrow-circle.svg');
  background-repeat: no-repeat;
  background-position: 0;
  background-size: 36px;
  height: 36px;
  width: 36px;
}

@media (hover: hover) {
  .gz-c-Footer .wpcf7 .wpcf7-submit:hover {
    opacity: 1;
    transform: scale(1.075);
  }
}

.gz-c-Footer .wpcf7 .wpcf7-spinner {
  display: none !important;
}

.gz-c-Footer .wpcf7 .recaptcha:not(:has(iframe))::before {
  filter: invert(1);
}

@media (max-width: 1075px) {
  .gz-c-Footer {
    text-align: center;
  }

  .gz-c-Footer-col {
    align-items: center !important;
    width: 100% !important;
  }

  .gz-c-Footer-inner {
    flex-direction: column;
    align-items: center;
  }

  .gz-c-Footer-tagline {
    text-align: center;
  }

  .gz-c-Footer-links {
    flex-direction: column;
    align-items: center !important;
  }

  .gz-c-Footer-menu-fancy {
    justify-content: center;
  }

  .gz-c-Footer-more {
    justify-content: center !important;
  }

  .gz-c-Footer-more .wp-block-social-links {
    width: 100%;
  }

  .gz-c-Footer .wpcf7 {
    display: flex;
    justify-content: center;
  }

  .gz-c-Footer .wpcf7 .wpcf7-form-control-wrap {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
}

footer .gz-c-Footer {
	width: 100%;
}
footer .is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
  max-width: unset;
}
/* =============================================
   ACCORDÉONS - Section Collège
   ============================================= */

/* Conteneur général accordion */
.wp-block-accordion {
  display: flex;
  flex-direction: column;
  gap: 20px;
  width: 100%;
}

/* Chaque item = carte blanche */
.wp-block-accordion-item {
  background-color: #FFFFFF;
  border-radius: 20px;
  overflow: hidden;
}

/* Heading = la barre cliquable */
.wp-block-accordion-heading {
  margin: 0;
  padding: 0;
}

/* Bouton toggle = toute la ligne */
.wp-block-accordion-heading__toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 38px 40px;
  background: transparent;
  border: none;
  cursor: pointer;
  text-align: left;
  min-height: 120px;
  box-sizing: border-box;
}

.wp-block-accordion-heading__toggle:hover .wp-block-accordion-heading__toggle-title {
  text-decoration: none !important;
}

/* Titre de l'accordéon */
.wp-block-accordion-heading__toggle-title {
  font-family: 'Work Sans', sans-serif;
  font-size: 40px;
  font-weight: 400;
  color: #002442;
  letter-spacing: -1.8px;
  line-height: 105%;
  flex: 1;
}

/* Bouton cercle bleu avec flèche → */
.wp-block-accordion-heading__toggle-icon {
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 43px;
  height: 43px;
  min-width: 43px;
  border-radius: 50%;
  background-color: #7F96FF;
  color: transparent;    /* cacher le texte "+" */
  font-size: 0;          /* cacher le texte "+" */
  flex-shrink: 0;
  position: relative;
  transition: transform 0.3s ease, background-color 0.2s ease;
}

/* Flèche → en pseudo-élément */
.wp-block-accordion-heading__toggle-icon::after {
  content: '';
  display: block;
  width: 12px;
  height: 12px;
  border-right: 2px solid #FFFFFF;
  border-top: 2px solid #FFFFFF;
  transform: rotate(45deg) translateX(-2px);
}

/* Quand l'accordéon est ouvert : bouton × */
.wp-block-accordion-heading__toggle[aria-expanded="true"] .wp-block-accordion-heading__toggle-icon {
  transform: rotate(0deg);
}

.wp-block-accordion-heading__toggle[aria-expanded="true"] .wp-block-accordion-heading__toggle-icon::after {
  width: 14px;
  height: 14px;
  border-right: 2px solid #FFFFFF;
  border-top: 2px solid #FFFFFF;
  transform: rotate(135deg) translateX(-1px);
}

/* Contenu du panneau ouvert */
.wp-block-accordion-panel {
  padding: 0 40px 40px 40px;
}

.wp-block-accordion-panel[aria-hidden="true"],
.wp-block-accordion-panel[inert] {
  display: none;
}

/* =============================================
   Responsive mobile
   ============================================= */
@media (max-width: 768px) {
  .wp-block-accordion-heading__toggle {
    padding: 24px 24px;
    min-height: 80px;
  }

  .wp-block-accordion-heading__toggle-title {
    font-size: 24px;
    letter-spacing: -0.8px;
  }

  .wp-block-accordion-panel {
    padding: 0 24px 24px 24px;
  }
}

.wp-block-accordion {
	max-width: var(--wp--style--global--wide-size);
}