/* Generated from accueil.css by scripts/home_decor.py. Do not edit. */
.m-hero {--s:url(/vendor/lfc/arc-en-ciel/svg/etoile-sauge.svg);--b:url(/vendor/lfc/arc-en-ciel/svg/etoile-bleu.svg);--y:url(/vendor/lfc/arc-en-ciel/svg/etoile-beurre.svg);--p:url(/vendor/lfc/arc-en-ciel/svg/etoile-peche.svg);--si:url(/vendor/lfc/arc-en-ciel/svg/etincelle-sauge.svg);--bi:url(/vendor/lfc/arc-en-ciel/svg/etincelle-bleu.svg);--yi:url(/vendor/lfc/arc-en-ciel/svg/etincelle-beurre.svg);--pi:url(/vendor/lfc/arc-en-ciel/svg/etincelle-peche.svg);}
.m-hero::before,.m-hero::after{
  content: ""; position: absolute; top: 0; height: 700px; pointer-events: none; z-index: -1; background-repeat: no-repeat;
}
@media (min-width: 1200px){
.m-hero::before{
    left: 0; width: 400px;
    background-image: url(/vendor/lfc/arc-en-ciel/images/fee-officielle-hero.webp), var(--y), var(--y), var(--si), var(--bi), var(--y), var(--s), url(/vendor/lfc/arc-en-ciel/svg/maquette-hero-gauche.svg);
    background-position: 189px 105px, 306px 146px, 330px 136px, 359px 124px, 266px 299px, 174px 356px, 286px 439px, 0 100px;
    background-size: auto 142px, 18px, 21px, 27px, 27px, 42px, 33px, 300px 600px;
  }
.m-hero::after{
    /* Approved wider arch; compensate the stars to keep their screen positions. */
    right: -155px; width: 620px;
    background-image: var(--yi), var(--b), var(--s), var(--pi), url(/vendor/lfc/arc-en-ciel/images/hero-arc-peint-desktop-v10.webp);
    background-position: 114px 181px, 300px 164px, 212px 247px, 170px 379px, 0 100px;
    background-size: 28px, 47px, 42px, 26px, 620px 600px;
  }
}
@media (min-width: 1200px) and (max-width: 1439.98px){
.m-hero::after{ background-position: 255px 150px, 300px 164px, 225px 262px, 255px 470px, 0 100px; }
.m-hero::before{ background-position: 189px 105px, 306px 146px, 330px 136px, 359px 124px, 226px 299px, 150px 346px, 250px 470px, 0 100px; }
}
@media (max-width: 1199.98px){
.m-hero::before,.m-hero::after{
    content: ""; position: absolute; pointer-events: none; z-index: -1; background-repeat: no-repeat;
  }
.m-hero::before{
    left: 0; top: 72px; width: 110px; height: 300px;
    background-image: url(/vendor/lfc/arc-en-ciel/images/fee-officielle-hero.webp), url(/vendor/lfc/arc-en-ciel/svg/maquette-hero-gauche.svg);
    background-position: 9px -6px, 0 24px;
    background-size: auto 64px, 90px 180px;
  }
.m-hero::after{
    right: 0; top: auto; bottom: -60px; width: 110px; height: 190px;
    background: url(/vendor/lfc/arc-en-ciel/images/hero-arc-peint-mobile-v10.webp) 0 0 / 110px 165px no-repeat;
  }
}
@media (min-width: 768px) and (max-width: 1199.98px){
.m-hero::before{
    top: 96px; width: 190px; height: 420px;
    background-image: url(/vendor/lfc/arc-en-ciel/images/fee-officielle-hero.webp), var(--y), url(/vendor/lfc/arc-en-ciel/svg/maquette-hero-gauche.svg);
    background-position: 27px -4px, 110px 4px, 0 40px; background-size: auto 96px, 18px, 140px 280px;
  }
.m-hero::after{ width: 170px; height: 290px; bottom: -150px; background-size: 170px 255px; }
}
@media (max-width: 809.98px){
.m-hero::before{
    left: 0; right: 0; width: auto; top: 100px; height: 300px; z-index: 0;
    background-image: url(/vendor/lfc/arc-en-ciel/images/fee-officielle-hero.webp), var(--y), var(--si), url(/vendor/lfc/arc-en-ciel/svg/mobile/hero-gauche-vol.svg);
    background-position: calc(50% + 4px) -3px, calc(50% + 62px) 6px, calc(50% - 60px) 4px, 0 0;
    background-size: auto 70px, 14px, 16px, 150px 300px;
  }
.m-hero::after{
    /* A viewport-wide paint layer keeps every star in place while the arc exits right.
       The left blue/green shapes end at x=131px: leave at least 24px of clear space. */
    right: 0; top: 64px; bottom: auto; width: 100%; height: 560px;
    background-image: var(--b), var(--y), var(--s), var(--pi), var(--y), url(/vendor/lfc/arc-en-ciel/images/hero-arc-peint-mobile-v10.webp);
    background-position: calc(100vw - 120px) 22px, calc(100vw - 56px) 330px, calc(100vw - 200px) 400px, calc(100vw - 80px) 470px, calc(100vw - 150px) 520px, max(155px, calc(100vw - 235px)) 0;
    background-size: 18px, 15px, 16px, 13px, 12px, 420px 405px;
  }
}