:root {
  --page-bg: #F5F5F5;

  --menu-color: #333;
  --hero-text-color: #333;

  --intro-title-color: #333;
  --intro-paragraph-color: #333;

  --footer-bg: #333;
  --footer-text-color: #F5F5F5;
}

.page-intro,
.page-en {
  --page-bg: #C3ACEE;
  --menu-color: #F2EDFB;

  --footer-bg: #8806CE;
  --footer-text-color: #F2EDFB;
}

.page-qui,
.page-who {
  --page-bg: #FDE4A1;
  --menu-color: #23A172;

  --footer-bg: #23A172;
  --footer-text-color: #FDE4A1;
}

.page-quoi,
.page-what {
  --page-bg: #F7C5DB;
  --menu-color: #BE252B;

  --footer-bg: #BE252B;
  --footer-text-color: #F7C5DB;
}

.page-work-fr {
  --page-bg: #C0D4F8;
  --menu-color: #FF7900;

  --footer-bg: #FF7900;
  --footer-text-color: #C0D4F8;
}

.page-work-en {
  --page-bg: #C0D4F8;
  --menu-color: #FF7900;

  --footer-bg: #FF7900;
  --footer-text-color: #C0D4F8;
}

.page-parent-work:not(.page-work-fr):not(.page-work-en),
body[class*="page-parent"][class*="work"]:not(.page-work-fr):not(.page-work-en),
.page-template-studio-yetta,
.page-template-studio-yetta-en,
body.page-template-studio-yetta,
body.page-template-studio-yetta-en,
body[class*="page-studio-yetta"] {
  --page-bg: #F5F5F5 !important;
  --menu-color: #333333 !important;

  --footer-bg: #333333 !important;
  --footer-text-color: #F5F5F5 !important;
}

.page-mentions-legales,
.page-conditions-utilisation,
.page-politique-de-confidentialite,
.page-legal-notice,
.page-terms-of-use,
.page-privacy-policy {
  --page-bg: #F5F5F5;
  --menu-color: #333333;

  --footer-bg: #333333;
  --footer-text-color: #F5F5F5;
}

.error404 {
  --page-bg: #8806CE;
  --menu-color: #FFDB58;

  --footer-bg: #000000;
  --footer-text-color: #FFDB58;
}

.barba-container[data-barba-namespace="intro"],
.barba-container[data-barba-namespace="en"] {
  --hero-text-color: #F2EDFB;
  --intro-title-color: #8806CE;
  --intro-paragraph-color: #F2EDFB;
}

.barba-container[data-barba-namespace="qui"],
.barba-container[data-barba-namespace="who"] {
  --hero-text-color: #23A172;
  --intro-title-color: #23A172;
  --intro-paragraph-color: #23A172;
}

.barba-container[data-barba-namespace="quoi"],
.barba-container[data-barba-namespace="what"] {
  --hero-text-color: #BE252B;
  --intro-title-color: #BE252B;
  --intro-paragraph-color: #BE252B;
}

.barba-container[data-barba-namespace="work"] {
  --hero-text-color: #FF7900;
  --intro-title-color: #FF7900;
  --intro-paragraph-color: #FF7900;
}

.barba-container[data-barba-namespace*="studio-yetta"],
.barba-container[data-barba-namespace="projet"] {
  --hero-text-color: #333333;
  --intro-title-color: #333333;
  --intro-paragraph-color: #333333;
}

.barba-container[data-barba-namespace="404"] {
  --hero-text-color: #FFDB58;
  --intro-title-color: #FFDB58;
  --intro-paragraph-color: #FFDB58;
}

.site-header .main-menu a,
.site-header .main-menu a:visited,
.site-header .main-menu a:hover,
.site-header .main-menu a:focus,
.site-header .main-menu a:active,
.site-header .contact-link,
.site-header .contact-link:visited,
.site-header .contact-link:hover,
.site-header .contact-link:focus,
.site-header .contact-link:active {
  color: #222222;
}

.page-intro .site-header .main-menu a,
.page-intro .site-header .main-menu a:visited,
.page-intro .site-header .main-menu a:hover,
.page-intro .site-header .main-menu a:focus,
.page-intro .site-header .main-menu a:active,
.page-intro .site-header .contact-link,
.page-intro .site-header .contact-link:visited,
.page-intro .site-header .contact-link:hover,
.page-intro .site-header .contact-link:focus,
.page-intro .site-header .contact-link:active,
.page-en .site-header .main-menu a,
.page-en .site-header .main-menu a:visited,
.page-en .site-header .main-menu a:hover,
.page-en .site-header .main-menu a:focus,
.page-en .site-header .main-menu a:active,
.page-en .site-header .contact-link,
.page-en .site-header .contact-link:visited,
.page-en .site-header .contact-link:hover,
.page-en .site-header .contact-link:focus,
.page-en .site-header .contact-link:active {
  color: #F2EDFB !important;
}

.page-qui .site-header .main-menu a,
.page-qui .site-header .main-menu a:visited,
.page-qui .site-header .main-menu a:hover,
.page-qui .site-header .main-menu a:focus,
.page-qui .site-header .main-menu a:active,
.page-qui .site-header .contact-link,
.page-qui .site-header .contact-link:visited,
.page-qui .site-header .contact-link:hover,
.page-qui .site-header .contact-link:focus,
.page-qui .site-header .contact-link:active,
.page-who .site-header .main-menu a,
.page-who .site-header .main-menu a:visited,
.page-who .site-header .main-menu a:hover,
.page-who .site-header .main-menu a:focus,
.page-who .site-header .main-menu a:active,
.page-who .site-header .contact-link,
.page-who .site-header .contact-link:visited,
.page-who .site-header .contact-link:hover,
.page-who .site-header .contact-link:focus,
.page-who .site-header .contact-link:active {
  color: #23A172 !important;
}

.page-quoi .site-header .main-menu a,
.page-quoi .site-header .main-menu a:visited,
.page-quoi .site-header .main-menu a:hover,
.page-quoi .site-header .main-menu a:focus,
.page-quoi .site-header .main-menu a:active,
.page-quoi .site-header .contact-link,
.page-quoi .site-header .contact-link:visited,
.page-quoi .site-header .contact-link:hover,
.page-quoi .site-header .contact-link:focus,
.page-quoi .site-header .contact-link:active,
.page-what .site-header .main-menu a,
.page-what .site-header .main-menu a:visited,
.page-what .site-header .main-menu a:hover,
.page-what .site-header .main-menu a:focus,
.page-what .site-header .main-menu a:active,
.page-what .site-header .contact-link,
.page-what .site-header .contact-link:visited,
.page-what .site-header .contact-link:hover,
.page-what .site-header .contact-link:focus,
.page-what .site-header .contact-link:active {
  color: #BE252B !important;
}

.page-work-fr .site-header .main-menu a,
.page-work-fr .site-header .main-menu a:visited,
.page-work-fr .site-header .main-menu a:hover,
.page-work-fr .site-header .main-menu a:focus,
.page-work-fr .site-header .main-menu a:active,
.page-work-fr .site-header .contact-link,
.page-work-fr .site-header .contact-link:visited,
.page-work-fr .site-header .contact-link:hover,
.page-work-fr .site-header .contact-link:focus,
.page-work-fr .site-header .contact-link:active {
  color: #FF7900 !important;
}

.page-work-en .site-header .main-menu a,
.page-work-en .site-header .main-menu a:visited,
.page-work-en .site-header .main-menu a:hover,
.page-work-en .site-header .main-menu a:focus,
.page-work-en .site-header .main-menu a:active,
.page-work-en .site-header .contact-link,
.page-work-en .site-header .contact-link:visited,
.page-work-en .site-header .contact-link:hover,
.page-work-en .site-header .contact-link:focus,
.page-work-en .site-header .contact-link:active {
  color: #FF7900 !important;
}

.page-parent-work:not(.page-work-fr):not(.page-work-en) .site-header .main-menu a,
.page-parent-work:not(.page-work-fr):not(.page-work-en) .site-header .main-menu a:visited,
.page-parent-work:not(.page-work-fr):not(.page-work-en) .site-header .main-menu a:hover,
.page-parent-work:not(.page-work-fr):not(.page-work-en) .site-header .main-menu a:focus,
.page-parent-work:not(.page-work-fr):not(.page-work-en) .site-header .main-menu a:active,
.page-parent-work:not(.page-work-fr):not(.page-work-en) .site-header .contact-link,
.page-parent-work:not(.page-work-fr):not(.page-work-en) .site-header .contact-link:visited,
.page-parent-work:not(.page-work-fr):not(.page-work-en) .site-header .contact-link:hover,
.page-parent-work:not(.page-work-fr):not(.page-work-en) .site-header .contact-link:focus,
.page-parent-work:not(.page-work-fr):not(.page-work-en) .site-header .contact-link:active,
.page-template-studio-yetta .site-header .main-menu a,
.page-template-studio-yetta .site-header .main-menu a:visited,
.page-template-studio-yetta .site-header .main-menu a:hover,
.page-template-studio-yetta .site-header .main-menu a:focus,
.page-template-studio-yetta .site-header .main-menu a:active,
.page-template-studio-yetta .site-header .contact-link,
.page-template-studio-yetta .site-header .contact-link:visited,
.page-template-studio-yetta .site-header .contact-link:hover,
.page-template-studio-yetta .site-header .contact-link:focus,
.page-template-studio-yetta .site-header .contact-link:active,
.page-template-studio-yetta-en .site-header .main-menu a,
.page-template-studio-yetta-en .site-header .main-menu a:visited,
.page-template-studio-yetta-en .site-header .main-menu a:hover,
.page-template-studio-yetta-en .site-header .main-menu a:focus,
.page-template-studio-yetta-en .site-header .main-menu a:active,
.page-template-studio-yetta-en .site-header .contact-link,
.page-template-studio-yetta-en .site-header .contact-link:visited,
.page-template-studio-yetta-en .site-header .contact-link:hover,
.page-template-studio-yetta-en .site-header .contact-link:focus,
.page-template-studio-yetta-en .site-header .contact-link:active,
body[class*="page-studio-yetta"] .site-header .main-menu a,
body[class*="page-studio-yetta"] .site-header .main-menu a:visited,
body[class*="page-studio-yetta"] .site-header .main-menu a:hover,
body[class*="page-studio-yetta"] .site-header .main-menu a:focus,
body[class*="page-studio-yetta"] .site-header .main-menu a:active,
body[class*="page-studio-yetta"] .site-header .contact-link,
body[class*="page-studio-yetta"] .site-header .contact-link:visited,
body[class*="page-studio-yetta"] .site-header .contact-link:hover,
body[class*="page-studio-yetta"] .site-header .contact-link:focus,
body[class*="page-studio-yetta"] .site-header .contact-link:active {
  color: #333333 !important;
}

.page-mentions-legales .site-header .main-menu a,
.page-mentions-legales .site-header .main-menu a:visited,
.page-mentions-legales .site-header .main-menu a:hover,
.page-mentions-legales .site-header .main-menu a:focus,
.page-mentions-legales .site-header .main-menu a:active,
.page-mentions-legales .site-header .contact-link,
.page-mentions-legales .site-header .contact-link:visited,
.page-mentions-legales .site-header .contact-link:hover,
.page-mentions-legales .site-header .contact-link:focus,
.page-mentions-legales .site-header .contact-link:active,
.page-conditions-utilisation .site-header .main-menu a,
.page-conditions-utilisation .site-header .main-menu a:visited,
.page-conditions-utilisation .site-header .main-menu a:hover,
.page-conditions-utilisation .site-header .main-menu a:focus,
.page-conditions-utilisation .site-header .main-menu a:active,
.page-conditions-utilisation .site-header .contact-link,
.page-conditions-utilisation .site-header .contact-link:visited,
.page-conditions-utilisation .site-header .contact-link:hover,
.page-conditions-utilisation .site-header .contact-link:focus,
.page-conditions-utilisation .site-header .contact-link:active,
.page-politique-de-confidentialite .site-header .main-menu a,
.page-politique-de-confidentialite .site-header .main-menu a:visited,
.page-politique-de-confidentialite .site-header .main-menu a:hover,
.page-politique-de-confidentialite .site-header .main-menu a:focus,
.page-politique-de-confidentialite .site-header .main-menu a:active,
.page-politique-de-confidentialite .site-header .contact-link,
.page-politique-de-confidentialite .site-header .contact-link:visited,
.page-politique-de-confidentialite .site-header .contact-link:hover,
.page-politique-de-confidentialite .site-header .contact-link:focus,
.page-politique-de-confidentialite .site-header .contact-link:active,
.page-legal-notice .site-header .main-menu a,
.page-legal-notice .site-header .main-menu a:visited,
.page-legal-notice .site-header .main-menu a:hover,
.page-legal-notice .site-header .main-menu a:focus,
.page-legal-notice .site-header .main-menu a:active,
.page-legal-notice .site-header .contact-link,
.page-legal-notice .site-header .contact-link:visited,
.page-legal-notice .site-header .contact-link:hover,
.page-legal-notice .site-header .contact-link:focus,
.page-legal-notice .site-header .contact-link:active,
.page-terms-of-use .site-header .main-menu a,
.page-terms-of-use .site-header .main-menu a:visited,
.page-terms-of-use .site-header .main-menu a:hover,
.page-terms-of-use .site-header .main-menu a:focus,
.page-terms-of-use .site-header .main-menu a:active,
.page-terms-of-use .site-header .contact-link,
.page-terms-of-use .site-header .contact-link:visited,
.page-terms-of-use .site-header .contact-link:hover,
.page-terms-of-use .site-header .contact-link:focus,
.page-terms-of-use .site-header .contact-link:active,
.page-privacy-policy .site-header .main-menu a,
.page-privacy-policy .site-header .main-menu a:visited,
.page-privacy-policy .site-header .main-menu a:hover,
.page-privacy-policy .site-header .main-menu a:focus,
.page-privacy-policy .site-header .main-menu a:active,
.page-privacy-policy .site-header .contact-link,
.page-privacy-policy .site-header .contact-link:visited,
.page-privacy-policy .site-header .contact-link:hover,
.page-privacy-policy .site-header .contact-link:focus,
.page-privacy-policy .site-header .contact-link:active {
  color: #333333 !important;
}

.error404 .site-header .main-menu a,
.error404 .site-header .main-menu a:visited,
.error404 .site-header .main-menu a:hover,
.error404 .site-header .main-menu a:focus,
.error404 .site-header .main-menu a:active,
.error404 .site-header .contact-link,
.error404 .site-header .contact-link:visited,
.error404 .site-header .contact-link:hover,
.error404 .site-header .contact-link:focus,
.error404 .site-header .contact-link:active {
  color: #FFDB58 !important;
}

.page-parent-work:not(.page-work-fr):not(.page-work-en) .site-header,
.page-template-studio-yetta .site-header,
.page-template-studio-yetta-en .site-header,
body[class*="page-studio-yetta"] .site-header {
  background-color: #F5F5F5 !important;
}

.page-mentions-legales .site-header,
.page-conditions-utilisation .site-header,
.page-politique-de-confidentialite .site-header,
.page-legal-notice .site-header,
.page-terms-of-use .site-header,
.page-privacy-policy .site-header {
  background-color: #F5F5F5 !important;
}

:root {
  --popup-bg: #F5F5F5;
  --popup-text: #333333;
  --popup-shadow: rgba(118, 71, 143, 0.15);
  --popup-overlay: rgba(15, 180, 188, 0.6);
}

.page-intro,
.page-en {
  --popup-bg: #8806CE;
  --popup-text: #F2EDFB;
  --popup-shadow: rgba(58, 25, 121, 1);
  --popup-overlay: rgba(142, 98, 223, 0.7);
}

.page-qui,
.page-who {
  --popup-bg: #23A172;
  --popup-text: #FDE4A1;
  --popup-shadow: rgba(145, 107, 3, 1);
  --popup-overlay: rgba(251, 204, 73, 0.7);
}

.page-quoi,
.page-what {
  --popup-bg: #BE252B;
  --popup-text: #F7C5DB;
  --popup-shadow: rgba(139, 19, 71, 1);
  --popup-overlay: rgba(236, 113, 166, 0.7);
}

.page-work-fr {
  --popup-bg: #FF7900;
  --popup-text: #C0D4F8;
  --popup-shadow: rgba(16, 60, 141, 1);
  --popup-overlay: rgba(106, 152, 238, 0.7);
}

.page-work-en {
  --popup-bg: #FF7900;
  --popup-text: #C0D4F8;
  --popup-shadow: rgba(16, 60, 141, 1);
  --popup-overlay: rgba(106, 152, 238, 0.7);
}

.page-parent-work:not(.page-work-fr):not(.page-work-en),
.page-template-studio-yetta,
.page-template-studio-yetta-en,
body[class*="page-studio-yetta"] {
  --popup-bg: #ffffff;
  --popup-text: #333333;
  --popup-shadow: rgba(0, 0, 0, 1);
  --popup-overlay: rgba(0, 0, 0, 0.7);
}

.page-mentions-legales,
.page-conditions-utilisation,
.page-politique-de-confidentialite,
.page-legal-notice,
.page-terms-of-use,
.page-privacy-policy {
  --popup-bg: #ffffff;
  --popup-text: #333333;
  --popup-shadow: rgba(0, 0, 0, 1);
  --popup-overlay: rgba(0, 0, 0, 0.7);
}

.error404 {
  --popup-bg: #FFDB58;
  --popup-text: #8806CE;
  --popup-shadow: rgba(49, 2, 74, 1);
  --popup-overlay: rgba(108, 5, 163, 0.7);
}

.error404 .footer-hand {
  display: none !important;
}

.site-header .main-menu a:active,
.site-header .contact-link:active {
  color: inherit !important;
}

.site-header .main-menu a:focus,
.site-header .contact-link:focus {
  color: inherit !important;
  outline: none !important;
}

.barba-container[data-barba-namespace="mentions-legales"],
.barba-container[data-barba-namespace="conditions-utilisation"],
.barba-container[data-barba-namespace="legal-notice"],
.barba-container[data-barba-namespace="terms-of-use"],
.barba-container[data-barba-namespace="privacy-policy"],
.barba-container[data-barba-namespace*="studio-yetta"],
.barba-container[data-barba-namespace="projet"] {
  --circle-reveal-color: #f5f5f5;
}

body.is-transitioning .site-header .main-menu a,
body.is-transitioning .site-header .main-menu a:visited,
body.is-transitioning .site-header .main-menu a:hover,
body.is-transitioning .site-header .main-menu a:focus,
body.is-transitioning .site-header .main-menu a:active,
body.is-transitioning .site-header .contact-link,
body.is-transitioning .site-header .contact-link:visited,
body.is-transitioning .site-header .contact-link:hover,
body.is-transitioning .site-header .contact-link:focus,
body.is-transitioning .site-header .contact-link:active {
  color: var(--locked-menu-color) !important;
}

body[class*="studio-yetta"] .back-to-projects-link,
body[class*="studio-yetta"] .back-to-projects-link:visited,
body[class*="studio-yetta"] .back-to-projects-link:hover,
body[class*="studio-yetta"] .back-to-projects-link:focus,
body[class*="studio-yetta"] .back-to-projects-link:active,
.page-parent-work:not(.page-work-fr):not(.page-work-en) .back-to-projects-link,
.page-parent-work:not(.page-work-fr):not(.page-work-en) .back-to-projects-link:visited,
.page-parent-work:not(.page-work-fr):not(.page-work-en) .back-to-projects-link:hover,
.page-parent-work:not(.page-work-fr):not(.page-work-en) .back-to-projects-link:focus,
.page-parent-work:not(.page-work-fr):not(.page-work-en) .back-to-projects-link:active {
  color: #333333 !important;
}

body[class*="studio-yetta"] .back-to-projects-link:hover,
.page-parent-work:not(.page-work-fr):not(.page-work-en) .back-to-projects-link:hover {
  color: #8806CE !important;
}

.page-parent-work:not(.page-work-fr):not(.page-work-en),
.page-template-studio-yetta,
.page-template-studio-yetta-en,
body[class*="page-studio-yetta"] {
  background-color: #F5F5F5 !important;
}

.page-parent-work:not(.page-work-fr):not(.page-work-en) .site-header,
.page-template-studio-yetta .site-header,
.page-template-studio-yetta-en .site-header,
body[class*="page-studio-yetta"] .site-header {
  background-color: #F5F5F5 !important;
}

.error404 {
  --locked-menu-color: #FFDB58;
  --locked-hero-text-color: #FFDB58;
}

.error404 {
  --locked-menu-color: #FFDB58;
  --locked-hero-text-color: #FFDB58;
  --hero-text-color: #FFDB58;
}

body.is-transitioning.error404 .hero-text,
body.is-transitioning.error404 .hero-text h1 {
  color: var(--locked-hero-text-color) !important;
}