/* ------------------------------------ *\
  CONTENTS
\* ------------------------------------ */

/**
 * CONTENTS..............You’re reading it!
 * ANIMATIONS............................
*/

/* ------------------------------------ *\
  ==ANIMATION
\* ------------------------------------ */
.hero__title,
.region-top-content .block:not(.no-animation, .image--no-parallax),
.field__items
  > .field__item
  > .paragraph:not(.no-animation, .image--no-parallax)
  > .layout
  > .layout__region
  > .paragraph:not(.no-animation, .image--no-parallax),
.paragraph:not(.paragraph--type--slider, .no-animation, .image--no-parallax)
  .field:not(.field--name-field-slider-components) {
  overflow: clip;
}

.layout__region
  .paragraph:not(
    .no-animation,
    .paragraph--type--slider,
    .js-lpb-component
  ).animated,
.field__items
  > .field__item
  > .paragraph:not(.no-animation, .image--no-parallax)
  > .layout
  > .layout__region
  > .paragraph.animated,
.paragraph:not(
    .no-animation,
    .image--no-parallax,
    .paragraph--type--slider,
    .paragraph--type--texte
  ).animated
  .field:not(
    .field--name-field-testimony-photo,
    .field--name-field-mod-01-image,
    .field--name-field-mod-02-image,
    .field--name-field-hero-image,
    .field--name-field-small-push-image,
    .field--name-field-big-push-image,
    .field--name-field-hero-image,
    .field--name-field-image
  ) {
  overflow: unset;
}

/* \/ cible les éléments du footer */
footer > .region-footer > .block:not(.no-animation),
/* \/ cible le titre de page et breadcrumb */
.region-top-content .block:not(.no-animation),
/* \/ cible les éléments du héro en entête de page */
.region-header
  > .block
  .field
  > .paragraph:not(.no-animation)
  :is(h1, h2, h3, h4, h5, h6, span, p, ul, .paragraph--type--cta),
/* \/ cible les éléments paragraphs contenus dans une section imbriquée dans une autre section */
.field__items
  > .field__item
  > .paragraph:not(.no-animation)
  > .layout
  > .layout__region
  > .paragraph--type--section:not(.no-animation)
  > .layout
  > .layout__region
  > .paragraph:not(.no-animation),
  /* \/ cible les éléments paragraphs contenus dans une section section parente */
.field__items
  > .field__item
  > .paragraph:not(.no-animation)
  > .layout
  > .layout__region
  > .paragraph:not(.no-animation),
  /* \/ cible les éléments éléments de texte d'un paragraph contenus dans une section section parent */
.field__items
  > .field__item
  > .paragraph:not(.no-animation)
  > .layout
  > .layout__region
  > .paragraph:not(.no-animation, .active)
  :is(h1, h2, h3, h4, h5, h6, span, p, ul) {
  opacity: 0;
  -webkit-transform: translateY(5rem);
          transform: translateY(5rem);
  -webkit-transition:
    opacity 0.7s ease-in-out,
    -webkit-transform 0.9s cubic-bezier(0.76, 0, 0.24, 1);
  transition:
    opacity 0.7s ease-in-out,
    -webkit-transform 0.9s cubic-bezier(0.76, 0, 0.24, 1);
  transition:
    opacity 0.7s ease-in-out,
    transform 0.9s cubic-bezier(0.76, 0, 0.24, 1);
  transition:
    opacity 0.7s ease-in-out,
    transform 0.9s cubic-bezier(0.76, 0, 0.24, 1),
    -webkit-transform 0.9s cubic-bezier(0.76, 0, 0.24, 1);
}

/* \/ cible les éléments du footer */
footer.active > .region-footer > .block.active,
/* \/ cible le titre de page et breadcrumb */
.region-top-content .block.active,
  /* \/ cible les éléments du héro en entête de page */
.region-header
  > .block
  .field
  > .paragraph.active
  :is(h1, h2, h3, h4, h5, h6, span, p, ul, .paragraph--type--cta),
/* \/ cible les éléments paragraphs contenus dans une section imbriquée dans une autre section */
.field__items
  > .field__item
  > .paragraph:not(.no-animation)
  > .layout
  > .layout__region
  > .paragraph--type--section
  > .layout
  > .layout__region
  > .paragraph.active:not(.no-animation),
/* \/ cible les éléments paragraphs contenus dans une section section parent */
.field__items
  > .field__item
  > .paragraph:not(.no-animation)
  > .layout
  > .layout__region
  > .paragraph.active:not(.no-animation),
  /* \/ cible les éléments éléments de texte d'un paragraph contenus dans une section section parent */
.field__items
  > .field__item
  > .paragraph:not(.no-animation)
  > .layout
  > .layout__region
  > .paragraph.active:not(.no-animation)
  :is(h1, h2, h3, h4, h5, h6, span, p, ul) {
  opacity: 1;
  -webkit-transform: unset;
          transform: unset;
  -webkit-transition:
    opacity 0.7s ease-in-out,
    -webkit-transform 0.9s cubic-bezier(0.76, 0, 0.24, 1);
  transition:
    opacity 0.7s ease-in-out,
    -webkit-transform 0.9s cubic-bezier(0.76, 0, 0.24, 1);
  transition:
    opacity 0.7s ease-in-out,
    transform 0.9s cubic-bezier(0.76, 0, 0.24, 1);
  transition:
    opacity 0.7s ease-in-out,
    transform 0.9s cubic-bezier(0.76, 0, 0.24, 1),
    -webkit-transform 0.9s cubic-bezier(0.76, 0, 0.24, 1);
}

.field--name-field-media-image {
  -webkit-transition: -webkit-transform 0.05s ease-in-out;
  transition: -webkit-transform 0.05s ease-in-out;
  transition: transform 0.05s ease-in-out;
  transition: transform 0.05s ease-in-out, -webkit-transform 0.05s ease-in-out;
}

.paragraph:not(.js-lpb-component) .paragraph--type--separator hr {
  width: 0;
  -webkit-transition: width 1.5s cubic-bezier(0.76, 0, 0.24, 1);
  transition: width 1.5s cubic-bezier(0.76, 0, 0.24, 1);
}

.paragraph:not(.js-lpb-component) .paragraph--type--separator.active hr {
  width: 100%;
}

.paragraph--type--small-push:not(.js-lpb-component) img.img-fluid,
.paragraph--type--hero:not(.js-lpb-component) img {
  width: 0;
  opacity: 0;
  -webkit-transition:
    opacity 1.5s ease-out,
    width 1s cubic-bezier(0.76, 0, 0.24, 1);
  transition:
    opacity 1.5s ease-out,
    width 1s cubic-bezier(0.76, 0, 0.24, 1);
}

.no-animation .paragraph--type--small-push img,
.no-animation .paragraph--type--hero img,
.no-animation .paragraph--type--small-push:not(.js-lpb-component) img.img-fluid,
.no-animation .paragraph--type--hero:not(.js-lpb-component) img,
.paragraph--type--small-push.active:not(.js-lpb-component) img,
.paragraph--type--hero.active:not(.js-lpb-component) img {
  opacity: 1;
  width: 100%;
}

footer .block-amu-copyright-block.no-animation:last-of-type .logo,
footer .block-amu-copyright-block.no-animation:last-of-type .logo img {
  opacity: 1;
  -webkit-transition: unset;
  transition: unset;
}

footer .block-amu-copyright-block:last-of-type .logo,
footer .block-amu-copyright-block:last-of-type .logo img {
  max-width: 100%;
  width: 90rem;
  -webkit-filter: unset;
          filter: unset;
  opacity: 0;
  margin-bottom: -1.6rem;
  -webkit-transition:
    opacity 1.5s ease-out,
    width 2s cubic-bezier(0.76, 0, 0.24, 1);
  transition:
    opacity 1.5s ease-out,
    width 2s cubic-bezier(0.76, 0, 0.24, 1);
}

footer.active .block-amu-copyright-block:last-of-type .logo,
footer.active .block-amu-copyright-block:last-of-type .logo img,
footer .block-amu-copyright-block.no-animation:last-of-type .logo,
footer .block-amu-copyright-block.no-animation:last-of-type .logo img {
  opacity: 1;
  width: 50rem;
}

header .navbar-brand img {
  -webkit-transition:
    width 0.3s ease-in-out,
    -webkit-transform 0.3s ease-in-out;
  transition:
    width 0.3s ease-in-out,
    -webkit-transform 0.3s ease-in-out;
  transition:
    transform 0.3s ease-in-out,
    width 0.3s ease-in-out;
  transition:
    transform 0.3s ease-in-out,
    width 0.3s ease-in-out,
    -webkit-transform 0.3s ease-in-out;
}

@media (prefers-reduced-motion) {
  .layout__region .paragraph:not(.paragraph--type--slider, .js-lpb-component),
  .paragraph:not(.paragraph--type--slider, .paragraph--type--texte) .field {
    overflow: unset;
  }

  .paragraph:not(.js-lpb-component) .paragraph--type--separator hr {
    width: 100%;
  }

  footer .region-footer > div > *,
  .paragraph .hero__title > *,
  .paragraph:not(.js-lpb-component),
  .paragraph:not(.js-lpb-component) .field > * {
    opacity: 1;
    -webkit-transform: unset;
            transform: unset;
    -webkit-transition: unset;
    transition: unset;
  }

  .paragraph--type--small-push:not(.js-lpb-component) img.img-fluid,
  .paragraph--type--hero:not(.js-lpb-component) img {
    opacity: 1;
    width: 100%;
  }

  footer .block-amu-copyright-block:last-of-type .logo,
  footer .block-amu-copyright-block:last-of-type .logo img {
    opacity: 1;
    width: 50rem;
  }

  header .navbar-brand img {
    -webkit-transition: unset;
    transition: unset;
  }
}