.h5-plat { cursor: pointer; isolation: isolate; }
.h5-media[data-r='1:1'] .h5-reel { aspect-ratio: 1 / 1; }
.h5-media[data-r='9:16'] .h5-reel { aspect-ratio: 9 / 16; }
.h5-four-small.h5-plat { aspect-ratio: 1 / 1; }
.h5-four-tall.h5-plat { aspect-ratio: 9 / 16; width: min(100%, 380px); align-self: flex-end; }
.h5-plat-num { position: absolute; left: 18px; top: 18px; z-index: 2; display: flex; gap: 8px; align-items: center; pointer-events: none; font-family: bicyclette, 'Helvetica Neue', Arial, sans-serif; font-weight: 700; font-size: 11px; line-height: 1; letter-spacing: 0.22em; text-transform: uppercase; color: #f8f0e5; }
.h5-plat-num span { padding: 7px 10px 6px; border-radius: 99px; background-color: rgba(26, 26, 26, 0.55); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.h5-plat-ticket { position: absolute; left: 20px; bottom: 20px; z-index: 2; max-width: min(400px, calc(100% - 40px)); padding: 18px 62px 16px 20px; border-radius: 14px; background-color: #f8f0e5; color: #1a1a1a; box-shadow: 0 10px 30px rgba(26, 26, 26, 0.18); pointer-events: none; transition: transform 0.6s cubic-bezier(0.215, 0.61, 0.355, 1); }
.h5-plat.is-survol .h5-plat-ticket { transform: translateY(-6px); }
.h5-plat-client { margin: 0; font-family: bicyclette, 'Helvetica Neue', Arial, sans-serif; font-weight: 700; font-size: 12px; line-height: 1; letter-spacing: 0.25em; text-transform: uppercase; color: #cc3d00; }
.h5-plat-phrase { margin: 9px 0 10px; font-family: antarctican-headline, cheddar-gothic-sans, 'Arial Black', sans-serif; font-weight: 800; font-size: 26px; line-height: 1.02; text-transform: uppercase; }
.h5-plat.is-petit .h5-plat-phrase { font-size: 20px; }
.h5-plat-tags { margin: 0; font-family: bicyclette, 'Helvetica Neue', Arial, sans-serif; font-weight: 700; font-size: 11px; line-height: 1.2; letter-spacing: 0.2em; text-transform: uppercase; color: rgba(26, 26, 26, 0.6); }
.h5-plat-fleche { position: absolute; right: 14px; top: 14px; width: 36px; height: 36px; overflow: hidden; border-radius: 50%; background-color: #ff4e00; color: #f8f0e5; font-size: 18px; line-height: 1; }
.h5-plat-fleche i { position: absolute; left: 0; top: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; font-style: normal; transition: transform 0.35s cubic-bezier(0.215, 0.61, 0.355, 1); }
.h5-plat-fleche i + i { transform: translate(-100%, 100%); }
.h5-plat.is-survol .h5-plat-fleche i:first-child { transform: translate(100%, -100%); }
.h5-plat.is-survol .h5-plat-fleche i + i { transform: translate(0, 0); }
.h5-plat:focus-visible, .h5-cmp-media:focus-visible { outline: 3px solid #f8f0e5; outline-offset: 4px; }
.h5-campagnes.has-cmp, .h5-campagnes.has-passe { overflow: clip; }
.h5-cmp-piste { position: relative; margin-top: 60px; }
.h5-cmp-scene { position: relative; }
.h5-cmp-piste.is-boucle .h5-cmp-scene { position: sticky; }
.h5-cmp-tete.h5-container { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-bottom: 26px; }
.h5-cmp-aide { margin: 0; font-family: bicyclette, 'Helvetica Neue', Arial, sans-serif; font-weight: 700; font-size: 12px; letter-spacing: 0.25em; text-transform: uppercase; color: rgba(248, 240, 229, 0.85); }
.h5-cmp-nav { display: flex; align-items: center; gap: 14px; }
.h5-cmp-fl { position: relative; display: grid; place-items: center; width: 56px; height: 56px; padding: 0; border: 2px solid #f8f0e5; border-radius: 50%; background: none; color: #f8f0e5; cursor: pointer; transition: color 0.3s ease, box-shadow 0.3s ease, transform 0.15s ease; }
.h5-cmp-fl::before { content: ''; position: absolute; inset: -1px; border-radius: 50%; background-color: #f8f0e5; transform: scale(0); transition: transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1); }
.h5-cmp-fl svg { position: relative; width: 26px; height: 26px; fill: none; stroke: currentColor; stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; transition: transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1); }
.h5-cmp-fl.is-prec svg { transform: scaleX(-1); }
.h5-cmp-fl:hover { color: #ff4e00; box-shadow: 4px 4px 0 #1a1a1a; }
.h5-cmp-fl:hover::before { transform: scale(1); }
.h5-cmp-fl.is-suiv:hover svg { transform: translateX(4px); }
.h5-cmp-fl.is-prec:hover svg { transform: scaleX(-1) translateX(4px); }
.h5-cmp-fl:active { transform: translateY(2px); box-shadow: 2px 2px 0 #1a1a1a; }
.h5-cmp-fl:focus-visible, .h5-cmp-pause:focus-visible, .h5-tk-voir:focus-visible, .h5-passe-plus:focus-visible { outline: 3px solid #1a1a1a; outline-offset: 3px; }
.h5-cmp-compte { display: flex; align-items: center; margin: 0; font-family: bicyclette, 'Helvetica Neue', Arial, sans-serif; font-weight: 700; font-size: 14px; letter-spacing: 0.2em; color: #f8f0e5; white-space: nowrap; }
.h5-cmp-n, .h5-passe-n { position: relative; display: inline-block; width: 2.5ch; height: 1.25em; overflow: hidden; vertical-align: top; }
.h5-cmp-n { margin-right: 0.45em; }
.h5-cmp-n b, .h5-passe-n b { position: absolute; left: 0; top: 0; font-weight: 700; line-height: 1.25; }
.h5-cmp-pause { padding: 6px 2px; border: 0; background: none; font-family: bicyclette, 'Helvetica Neue', Arial, sans-serif; font-weight: 700; font-size: 12px; letter-spacing: 0.2em; text-transform: uppercase; color: #f8f0e5; text-decoration: underline; text-underline-offset: 4px; cursor: pointer; }
.h5-cmp-fenetre { position: relative; }
.is-boucle .h5-cmp-fenetre { padding: 14px 0 6px; overflow-x: clip; cursor: grab; touch-action: pan-y; }
.is-boucle .h5-cmp-fenetre.is-glisse { cursor: grabbing; }
.h5-cmp-bande { position: relative; display: flex; gap: 24px; margin: 0; padding: 0; }
.is-boucle .h5-cmp-bande { display: block; }
.is-boucle .h5-cmp-carte { position: absolute; left: 0; top: 0; }
.h5-cmp-carte { flex: none; width: clamp(300px, 28vw, 420px); -webkit-user-select: none; user-select: none; }
.h5-cmp-media.h5-media { width: 100%; aspect-ratio: 3 / 2; border-radius: 18px; background-color: #1a1a1a; cursor: pointer; transition: transform 0.35s cubic-bezier(0.215, 0.61, 0.355, 1), box-shadow 0.35s ease; }
.h5-cmp-media img { pointer-events: none; -webkit-user-drag: none; }
.h5-cmp-info { position: absolute; left: 0; right: 0; bottom: 0; z-index: 2; display: grid; gap: 8px; padding: 14px 18px 16px; background-color: #f8f0e5; color: #1a1a1a; clip-path: inset(100% 0 0 0); transition: clip-path 0.45s cubic-bezier(0.215, 0.61, 0.355, 1); }
.h5-cmp-info p { margin: 0; font-family: Aeonik, bicyclette, 'Helvetica Neue', Arial, sans-serif; font-size: 15px; line-height: 1.25; opacity: 0; transform: translateY(10px); transition: opacity 0.45s ease, transform 0.45s cubic-bezier(0.215, 0.61, 0.355, 1); }
.h5-cmp-info p + p { transition-delay: 0.06s; }
.h5-cmp-info span { display: block; margin-bottom: 3px; font-family: bicyclette, 'Helvetica Neue', Arial, sans-serif; font-weight: 700; font-size: 10px; letter-spacing: 0.2em; text-transform: uppercase; color: #cc3d00; }
@media (hover: hover) and (pointer: fine) {
.h5-cmp-media:hover { transform: translateY(-8px) scale(1.02); box-shadow: 6px 8px 0 rgba(26, 26, 26, 0.25); }
.h5-cmp-media:hover .h5-cmp-info { clip-path: inset(0 0 0 0); }
.h5-cmp-media:hover .h5-cmp-info p { opacity: 1; transform: none; }
}
.h5-cmp-legende { padding-top: 16px; color: #f8f0e5; }
.h5-cmp-titre { margin: 0; font-family: antarctican-headline, cheddar-gothic-sans, 'Arial Black', sans-serif; font-weight: 800; font-size: 22px; line-height: 1.05; text-transform: uppercase; }
.h5-cmp-ligne { display: flex; align-items: baseline; gap: 10px; margin: 8px 0 0; font-family: bicyclette, 'Helvetica Neue', Arial, sans-serif; font-weight: 700; font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; color: rgba(248, 240, 229, 0.85); }
.h5-cmp-ligne span { white-space: nowrap; }
.h5-cmp-ligne i { flex: 1; min-width: 12px; border-bottom: 1.5px dotted rgba(248, 240, 229, 0.6); transform: translateY(-3px); }
.is-natif .h5-cmp-scene { display: flex; flex-direction: column-reverse; }
.is-natif .h5-cmp-tete.h5-container { margin: 18px 0 0; }
.is-natif .h5-cmp-fenetre { overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-inline: 96px; scrollbar-width: none; }
.is-natif .h5-cmp-fenetre::-webkit-scrollbar { display: none; }
.is-natif .h5-cmp-bande { width: max-content; padding: 10px 96px 14px; gap: 18px; }
.is-natif .h5-cmp-carte { scroll-snap-align: start; }
.h5-passe-vide { display: none !important; }
.h5-passe-piste { position: relative; margin-top: 160px; }
.h5-passe-titre { position: relative; text-align: center; }
.h5-passe-titre .h5-container.h5-avis-head { margin-top: 0; }
.h5-passe-compte { display: flex; justify-content: center; align-items: center; gap: 0.35em; margin: 26px 0 0; font-family: bicyclette, 'Helvetica Neue', Arial, sans-serif; font-weight: 700; font-size: 13px; letter-spacing: 0.25em; text-transform: uppercase; color: #f8f0e5; }
.h5-passe-piste.is-grand { height: 370vh; margin-top: 110px; }
.is-grand .h5-passe-scene { position: sticky; top: 0; height: 100vh; overflow: clip; }
.is-grand .h5-passe-titre { position: absolute; inset: 0; z-index: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.is-grand .h5-passe-titre .h5-title { font-size: clamp(44px, 6.2vw, 96px); }
.is-grand .h5-passe-liste { position: absolute; inset: 0; z-index: 2; pointer-events: none; }
.is-grand .h5-avis.h5-tk { position: absolute; left: 50%; top: 50%; pointer-events: auto; }
.is-grand .h5-avis.h5-tk:hover { z-index: 3; }
.is-flux .h5-passe-titre { position: sticky; top: 22vh; z-index: 1; }
.is-flux .h5-passe-liste { position: relative; z-index: 2; display: grid; grid-template-columns: 1fr 1fr; column-gap: 4vw; row-gap: 14vh; justify-items: center; align-items: start; padding: 26vh 40px 10vh; }
.is-flux .h5-avis.h5-tk:nth-child(even) { margin-top: 20vh; }
.is-pose .h5-passe-liste { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 34px; justify-items: center; align-items: start; padding: 70px 96px 0; }
.is-pose .h5-avis.h5-tk:nth-child(odd) { transform: rotate(-1.5deg); }
.is-pose .h5-avis.h5-tk:nth-child(even) { transform: rotate(1.5deg); }
.is-pose .h5-passe-compte { display: none; }
.h5-avis.h5-tk.is-cache { display: none; }
.h5-passe-plus { grid-column: 1 / -1; justify-self: center; height: 48px; padding: 0 18px; border: 0; background-color: #f8f0e5; color: #ff4e00; font-family: bicyclette, 'Helvetica Neue', Arial, sans-serif; font-weight: 900; font-size: 13px; letter-spacing: 0.15em; text-transform: uppercase; cursor: pointer; }
.h5-avis.h5-tk { position: relative; display: flex; flex-direction: column; justify-content: flex-start; gap: 0; width: 320px; max-width: 100%; min-height: 0; margin: 0; padding: 0; border: 1.5px solid #1a1a1a; border-radius: 10px; background-color: rgba(255, 248, 238, 0.95); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); color: #1a1a1a; box-shadow: 5px 5px 0 rgba(26, 26, 26, 0.22); }
.h5-tk-haut { position: relative; display: flex; justify-content: space-between; align-items: center; padding: 12px 18px 11px; border-bottom: 1.5px dashed rgba(26, 26, 26, 0.35); font-family: bicyclette, 'Helvetica Neue', Arial, sans-serif; font-weight: 700; font-size: 10.5px; line-height: 1; letter-spacing: 0.18em; text-transform: uppercase; }
.h5-tk-haut::before, .h5-tk-haut::after { content: ''; position: absolute; bottom: -8px; width: 7px; height: 14px; border: 1.5px solid #1a1a1a; background-color: #ff4e00; }
.h5-tk-haut::before { left: -1.5px; border-left: 0; border-radius: 0 14px 14px 0; }
.h5-tk-haut::after { right: -1.5px; border-right: 0; border-radius: 14px 0 0 14px; }
.h5-tk-note { display: flex; gap: 2px; color: #ff4e00; }
.h5-tk-note svg { width: 13px; height: 13px; fill: currentColor; }
.h5-tk-note svg circle { fill: #fff8ee; }
.h5-tk-qui { display: flex; align-items: center; gap: 24px; padding: 18px 18px 4px; }
.h5-tk-photo { position: relative; flex: none; width: 96px; padding: 5px 5px 18px; background-color: #ffffff; box-shadow: 0 3px 10px rgba(26, 26, 26, 0.18); transform: rotate(-3deg); }
.h5-tk-cadre { position: relative; width: 100%; aspect-ratio: 1 / 1; overflow: hidden; background-color: #ff4e00; }
.h5-tk-cadre img { position: absolute; left: 0; top: 0; display: block; width: 100%; height: 100%; max-width: none; object-fit: cover; }
.h5-tk-d { filter: grayscale(1) contrast(1.12) brightness(1.08); mix-blend-mode: multiply; }
.h5-tk-c { opacity: 0; transition: opacity 0.4s ease; }
.h5-tk:hover .h5-tk-c { opacity: 1; }
.h5-tk-logo { position: absolute; right: -28px; bottom: 6px; display: flex; align-items: center; height: 28px; padding: 0 8px; border: 1.5px solid #1a1a1a; border-radius: 6px; background-color: #ffffff; box-shadow: 2px 2px 0 rgba(26, 26, 26, 0.2); transform: rotate(9deg); }
.h5-tk-logo img { display: block; width: auto; height: 15px; max-width: 74px; object-fit: contain; }
.h5-tk-noms { min-width: 0; }
.h5-tk-prenom { margin: 0; font-family: antarctican-headline, cheddar-gothic-sans, 'Arial Black', sans-serif; font-weight: 800; font-size: 30px; line-height: 0.95; text-transform: uppercase; overflow-wrap: anywhere; }
.h5-tk-societe { margin: 7px 0 0; font-family: bicyclette, 'Helvetica Neue', Arial, sans-serif; font-weight: 700; font-size: 11px; line-height: 1.2; letter-spacing: 0.18em; text-transform: uppercase; color: #cc3d00; }
.h5-avis.h5-tk .h5-avis-quote { padding: 12px 18px 0; font-size: 15.5px; line-height: 1.42; color: #1a1a1a; }
.h5-tk-mark { padding: 0 1px; color: inherit; background-color: transparent; background-image: linear-gradient(transparent 55%, rgba(255, 78, 0, 0.35) 55%); background-repeat: no-repeat; background-size: 0% 100%; }
.h5-tk-mark.is-on { background-size: 100% 100%; }
.h5-tk-pied { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 14px; padding: 11px 18px 13px; border-top: 1.5px dashed rgba(26, 26, 26, 0.35); font-family: bicyclette, 'Helvetica Neue', Arial, sans-serif; font-weight: 700; font-size: 10.5px; line-height: 1; letter-spacing: 0.16em; text-transform: uppercase; color: rgba(26, 26, 26, 0.6); }
.h5-tk-voir { padding: 0; border: 0; background: none; font: inherit; letter-spacing: inherit; text-transform: inherit; color: #cc3d00; text-decoration: underline; text-underline-offset: 3px; white-space: nowrap; cursor: pointer; }
.h5-tk-cap { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
@media (hover: none) { .h5-tk-c { opacity: 1; } }
@media screen and (max-width: 991px) {
.is-natif .h5-cmp-fenetre { scroll-padding-inline: 40px; }
.is-natif .h5-cmp-bande { padding-left: 40px; padding-right: 40px; }
.is-pose .h5-passe-liste { grid-template-columns: 1fr 1fr; padding: 50px 40px 0; }
}
@media screen and (max-width: 767px) {
.h5-plat-num { left: 12px; top: 12px; }
.h5-plat-ticket { left: 12px; bottom: 12px; max-width: calc(100% - 24px); padding: 14px 52px 13px 14px; border-radius: 12px; }
.h5-plat-phrase, .h5-plat.is-petit .h5-plat-phrase { font-size: 18px; }
.h5-plat-fleche { right: 10px; top: 10px; }
.h5-plat.is-grand .h5-plat-ticket { padding: 10px 44px 10px 12px; max-width: 78%; }
.h5-plat.is-grand .h5-plat-phrase { margin: 6px 0 0; font-size: 15px; }
.h5-plat.is-grand .h5-plat-tags { display: none; }
.h5-plat.is-grand .h5-plat-fleche { width: 28px; height: 28px; font-size: 14px; right: 8px; top: 8px; }
.h5-plat.is-grand .h5-plat-num span + span { display: none; }
.h5-four-small.h5-plat { width: 86%; margin-right: auto; transform: rotate(-1deg); }
.h5-four-tall.h5-plat { width: 70%; margin-left: auto; align-self: auto; transform: rotate(1deg); }
.h5-cmp-piste { margin-top: 40px; }
.h5-cmp-tete.h5-container { justify-content: center; }
.h5-cmp-aide, .h5-cmp-pause { display: none; }
.h5-cmp-fl { width: 48px; height: 48px; }
.is-natif .h5-cmp-fenetre { scroll-padding-inline: 20px; }
.is-natif .h5-cmp-bande { padding-left: 20px; padding-right: 20px; gap: 12px; }
.is-natif .h5-cmp-carte { width: 78vw; max-width: 380px; }
.h5-passe-piste { margin-top: 100px; }
.is-flux .h5-passe-titre { top: 16vh; }
.is-flux .h5-passe-liste { grid-template-columns: 1fr; row-gap: 11vh; padding: 30vh 20px 6vh; }
.is-flux .h5-avis.h5-tk:nth-child(even) { margin-top: 0; }
.is-pose .h5-passe-liste { grid-template-columns: 1fr; padding: 40px 20px 0; }
.h5-avis.h5-tk { width: min(86vw, 360px); }
.h5-tk-prenom { font-size: 26px; }
}