/* Motif décoratif Figma : compatible avec les trois styles de section. */
:where(
  .fhv-helice-hero,
  .fhv-helice-hero-debordante,
  .fhv-helice-hero-interieur,
  .fhv-helice-footer,
  footer.wp-block-template-part > .wp-block-group
) {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}
:where(
  .fhv-helice-hero,
  .fhv-helice-hero-debordante,
  .fhv-helice-hero-interieur,
  .fhv-helice-footer,
  footer.wp-block-template-part > .wp-block-group
)::before {
  content: "";
  position: absolute;
  z-index: -1;
  pointer-events: none;
  width: var(--fhv-helice-largeur, min(728px, 100%));
  aspect-ratio: 728 / 736.615479;
  background-color: var(--fhv-helice-couleur, var(--wp--preset--color--secondary));
  opacity: var(--fhv-helice-opacite, 0.4);
  mix-blend-mode: overlay;
  -webkit-mask: url("../images/decors/helice.svg") center / contain no-repeat;
  mask: url("../images/decors/helice.svg") center / contain no-repeat;
}
.fhv-helice-hero::before {
  left: var(--fhv-helice-x, -4.583333%);
  top: var(--fhv-helice-y, 42.544987%);
}
.fhv-helice-hero-debordante {
  z-index: 2 !important;
  overflow-x: clip !important;
  overflow-y: visible !important;
}
.fhv-helice-hero-debordante::before {
  z-index: 1;
  top: auto;
  bottom: var(--fhv-helice-bas, -180px);
  left: var(--fhv-helice-x, calc(50% - 800px));
  width: var(--fhv-helice-largeur, min(560px, 65vw));
  transform: rotate(var(--fhv-helice-rotation, 0deg));
  transform-origin: center;
  will-change: transform;
}
.fhv-helice-hero-debordante
  > :not(
    .wp-block-cover__background,
    .wp-block-cover__image-background,
    .wp-block-cover__video-background
  ) {
  position: relative;
  z-index: 2;
}
.fhv-helice-hero-debordante + * {
  position: relative;
  z-index: 1;
}
.fhv-helice-hero-interieur::before {
  left: var(--fhv-helice-x, -4.513889%);
  top: var(--fhv-helice-y, 20.400008%);
}
.fhv-helice-footer::before {
  right: var(--fhv-helice-x, -9.375%);
  top: var(--fhv-helice-y, -4.520180%);
}
footer.wp-block-template-part > .wp-block-group::before {
  right: calc(50vw - 600px);
  top: var(--fhv-helice-y, -4.520180%);
  z-index: 1;
}

@media (max-width: 1499px) {
  .fhv-helice-hero-debordante::before {
    left: -80px !important;
  }
}

@media (max-width: 781px) {
  .fhv-helice-hero-debordante::before {
    bottom: var(--fhv-helice-bas-mobile, -160px);
    width: var(--fhv-helice-largeur-mobile, min(420px, 90vw));
  }

  footer.wp-block-template-part > .wp-block-group::before {
    top: 50%;
  }
}