.descente.ouv{ height: auto; }
.descente.ouv .ecran{ position: relative; height: 100vh; height: 100svh; min-height: 620px; overflow: hidden; background: #103C32; }
.descente.ouv .repli{ will-change: transform, opacity; }
.descente.ouv .texte{ position: absolute; inset: 0; z-index: 6; display: block; justify-items: start; margin: 0; text-align: left; pointer-events: none;
  padding: clamp(120px, 21vh, 210px) 0 0 max(var(--marge, 64px), 5vw); max-width: calc(min(720px, 50vw) + max(var(--marge, 64px), 5vw)); }
.descente.ouv .etiquette{ max-width: 40ch; margin: 0 0 16px; font: 400 15px/1.4 var(--corps); color: var(--sauge); }
.descente.ouv h1{ display: block; max-width: 13.5em; margin: 0; font-size: clamp(2.25rem, 3.35vw, 3.5rem); line-height: 1.06; text-wrap: balance; }
.descente.ouv .appui{ position: static; transform: none; display: flex; flex-direction: column; align-items: flex-start; gap: 22px; margin-top: 26px; width: auto; max-width: 560px; }
.descente.ouv .appui .promesse-accueil{ margin: 0; max-width: 44ch; font-size: 19px; line-height: 1.5; text-wrap: pretty; color: var(--ivoire); }
.descente.ouv .promesse-accueil strong, .descente.ouv .promesse-accueil span{ display: block; font-weight: 400; }
.descente.ouv .promesse-accueil span{ margin-top: 8px; font-size: 16px; color: var(--sauge); }
.descente.ouv .appui .decouvrir{ order: 2; pointer-events: auto; display: inline-flex; align-items: center; min-height: 48px; padding: 0 22px;
  border: 0; border-radius: 0; background: var(--ivoire); color: #103C32; font: 600 16px/1 var(--corps); text-decoration: none; transition: transform 150ms var(--entree), background-color 150ms linear; }
.descente.ouv .appui .decouvrir:active{ transform: scale(0.97); }
@media (hover: hover){.descente.ouv .appui .decouvrir:hover{ background: #fff; }
}
.descente.ouv .appui .decouvrir:focus-visible{ outline: 3px solid var(--sauge); outline-offset: 3px; }
.descente.ouv .credit{ z-index: 4; right: max(var(--marge, 64px), 24px); bottom: 22px; max-width: 46ch; padding: 6px 10px; font-size: 13px; color: var(--ivoire);
  background: rgba(16, 60, 50, 0.9); }
.descente.ouv .voile{ --tx: calc(max(var(--marge, 64px), 5vw) + min(640px, 50vw) + 24px); z-index: 2;
  background:
    radial-gradient(ellipse 62% 85% at 0% 50%, rgba(16, 60, 50, 0.18) 0%, rgba(16, 60, 50, 0.177) 12.5%, rgba(16, 60, 50, 0.161) 25%, rgba(16, 60, 50, 0.13) 37.5%, rgba(16, 60, 50, 0.09) 50%, rgba(16, 60, 50, 0.05) 62.5%, rgba(16, 60, 50, 0.019) 75%, rgba(16, 60, 50, 0.003) 87.5%, rgba(16, 60, 50, 0) 100%),
    linear-gradient(90deg, rgba(16, 60, 50, 0.84) 0, rgba(16, 60, 50, 0.82) calc(var(--tx) + -10vw), rgba(16, 60, 50, 0.817) calc(var(--tx) + -6.857vw), rgba(16, 60, 50, 0.801) calc(var(--tx) + -3.714vw), rgba(16, 60, 50, 0.763) calc(var(--tx) + -0.571vw), rgba(16, 60, 50, 0.701) calc(var(--tx) + 2.571vw), rgba(16, 60, 50, 0.618) calc(var(--tx) + 5.714vw), rgba(16, 60, 50, 0.518) calc(var(--tx) + 8.857vw), rgba(16, 60, 50, 0.41) calc(var(--tx) + 12vw), rgba(16, 60, 50, 0.302) calc(var(--tx) + 15.143vw), rgba(16, 60, 50, 0.202) calc(var(--tx) + 18.286vw), rgba(16, 60, 50, 0.119) calc(var(--tx) + 21.429vw), rgba(16, 60, 50, 0.057) calc(var(--tx) + 24.571vw), rgba(16, 60, 50, 0.019) calc(var(--tx) + 27.714vw), rgba(16, 60, 50, 0.003) calc(var(--tx) + 30.857vw), rgba(16, 60, 50, 0) calc(var(--tx) + 34vw)),
    linear-gradient(180deg, rgba(16, 60, 50, 0.5) 0%, rgba(16, 60, 50, 0.496) 10.6%, rgba(16, 60, 50, 0.471) 13.2%, rgba(16, 60, 50, 0.418) 15.8%, rgba(16, 60, 50, 0.341) 18.4%, rgba(16, 60, 50, 0.25) 21%, rgba(16, 60, 50, 0.159) 23.6%, rgba(16, 60, 50, 0.082) 26.2%, rgba(16, 60, 50, 0.029) 28.8%, rgba(16, 60, 50, 0.004) 31.4%, rgba(16, 60, 50, 0) 34%, rgba(16, 60, 50, 0) 76%, rgba(16, 60, 50, 0.009) 79%, rgba(16, 60, 50, 0.057) 82%, rgba(16, 60, 50, 0.151) 85%, rgba(16, 60, 50, 0.275) 88%, rgba(16, 60, 50, 0.399) 91%, rgba(16, 60, 50, 0.493) 94%, rgba(16, 60, 50, 0.541) 97%, rgba(16, 60, 50, 0.55) 100%); }
.hl{ position: absolute; inset: 0; z-index: 1; pointer-events: none; }
.hl-plan{ position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; will-change: transform, opacity; }
.hl-rep, .hl-tag, .hl-cadre{ will-change: transform, opacity; }
.hl-dessus{ position: absolute; inset: 0; z-index: 3; pointer-events: none; }
.hl-rep{ position: absolute; left: 0; top: 0; display: block; line-height: 0; transform: translate(-50%, -50%); opacity: 0; }
.hl-rep svg{ display: block; }
.hl-cadre{ position: absolute; transform: translate(-50%, -50%); border: 2px solid var(--ivoire); opacity: 0; }
.hl-trait{ position: absolute; background: var(--ivoire); }
.hl-etiq{ position: absolute; width: 300px; padding: 14px 16px 12px; background: var(--ivoire); color: #103C32; border-left: 4px solid #103C32; opacity: 0; pointer-events: auto; }
.hl-etiq-tete{ display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin: 0 0 8px; font: 400 21px/1.2 var(--titre); }
.hl-ex{ flex: none; font: 600 13px/1.3 var(--corps); color: #103C32; border: 1px solid #103C32; padding: 1px 6px; }
.hl-etiq ul{ margin: 0; padding: 0; list-style: none; display: grid; gap: 4px; }
.hl-etiq li{ position: relative; padding-left: 14px; font: 400 16px/1.4 var(--corps); }
.hl-etiq li::before{ content: ""; position: absolute; left: 0; top: 0.6em; width: 6px; height: 6px; background: #103C32; }
.hl-tag{ position: absolute; white-space: nowrap; padding: 4px 9px; background: var(--ivoire); color: #103C32; font: 600 14px/1.25 var(--corps); border: 1px solid #103C32; opacity: 0; }
@media (max-width: 700px){.descente.ouv .ecran{ min-height: 640px; }
.descente.ouv .texte{ padding: 88px 20px 0; max-width: none; }
.descente.ouv .etiquette{ font-size: 14px; margin-bottom: 10px; }
.descente.ouv h1{ font-size: clamp(28px, 7.8vw, 34px); max-width: 15em; }
.descente.ouv .appui{ gap: 16px; margin-top: 16px; }
.descente.ouv .appui .promesse-accueil{ font-size: 16px; line-height: 1.45; }
.descente.ouv .promesse-accueil span{ display: none; }
.descente.ouv .appui .decouvrir{ min-height: 44px; font-size: 15px; }
.descente.ouv .credit{ left: 0; right: 0; bottom: 0; max-width: none; padding: 8px 20px 12px; text-align: left; font-size: 12px; }
.descente.ouv .voile{ background: linear-gradient(180deg, rgba(16, 60, 50, 0.84) 0, rgba(16, 60, 50, 0.84) 44%, rgba(16, 60, 50, 0.833) 47.6%, rgba(16, 60, 50, 0.791) 51.2%, rgba(16, 60, 50, 0.703) 54.8%, rgba(16, 60, 50, 0.573) 58.4%, rgba(16, 60, 50, 0.42) 62%, rgba(16, 60, 50, 0.267) 65.6%, rgba(16, 60, 50, 0.137) 69.2%, rgba(16, 60, 50, 0.049) 72.8%, rgba(16, 60, 50, 0.007) 76.4%, rgba(16, 60, 50, 0) 80%, rgba(16, 60, 50, 0) 84%, rgba(16, 60, 50, 0.03) 86.333%, rgba(16, 60, 50, 0.176) 88.667%, rgba(16, 60, 50, 0.42) 91%, rgba(16, 60, 50, 0.664) 93.333%, rgba(16, 60, 50, 0.81) 95.667%, rgba(16, 60, 50, 0.84) 98%); }
.hl-etiq{ width: auto; max-width: 340px; right: auto; }
.hl-etiq-tete{ font-size: 19px; }
.hl-etiq li{ font-size: 15px; }
.hl-tag{ font-size: 13px; padding: 3px 7px; }
}
@media (max-width: 700px) and (max-height: 599px){.hl-etiq{ padding: 4px 12px 4px 12px; }
.hl-etiq-tete{ font-size: 16px; line-height: 1.2; margin: 0 0 1px; }
.hl-etiq ul{ gap: 1px; }
.hl-etiq li{ font-size: 13px; line-height: 1.2; }
}
@media (max-width: 400px){.descente.ouv .ecran{ min-height: 800px; }
}
@media (scripting: enabled) and (prefers-reduced-motion: no-preference) and (min-width: 701px) and (min-height: 620px){.descente.ouv.defile{ height: calc(100svh + 100svh); }
.descente.ouv.defile .ecran{ position: sticky; top: 0; }
}
@media (scripting: enabled) and (prefers-reduced-motion: no-preference) and (min-width: 401px) and (max-width: 700px) and (min-height: 640px){.descente.ouv.defile{ height: calc(100svh + 80svh); }
.descente.ouv.defile .ecran{ position: sticky; top: 0; }
}
@media (scripting: enabled) and (prefers-reduced-motion: no-preference) and (max-width: 400px) and (min-height: 800px){.descente.ouv.defile{ height: calc(100svh + 80svh); }
.descente.ouv.defile .ecran{ position: sticky; top: 0; }
}
@media (prefers-reduced-motion: reduce){.descente.ouv .appui .decouvrir{ transition: none; }
}