/* ==========================================================================
   margiela.css — page MARGIELA (reprise de l'ancien site Framer)
   Le menu de fin du site (le même que sur les autres pages) se pose dans le bandeau noir
   de bas de page de Framer, à la place de l'ancien menu (masqué par ui-framer.js).
   ========================================================================== */
.mg-fin { position: absolute; left: 0; right: 0; top: 0; height: 155px; z-index: 50; pointer-events: none; }
.mg-fin .fin { position: absolute; left: 50%; top: 38%; width: min(84vw, 1200px); transform: translate(-50%, -50%); background: none; padding: 0; margin: 0; }
.mg-fin .fin__menu { display: flex; align-items: center; gap: 1ch; white-space: nowrap; color: #ededea; pointer-events: auto;
  font: 400 clamp(9px, .58vw, 11px)/1 "Plex Mono", "IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace; letter-spacing: .08em; text-transform: uppercase; }
.mg-fin .fin__menu > i { flex: 1; min-width: 2ch; height: 1em; background: radial-gradient(circle, rgba(237,237,234,.35) .7px, transparent 1px) 0 60% / 5px 5px repeat-x; }
.mg-fin .fin__item { position: relative; }
.mg-fin .fin__titre { color: #ededea; background: none; border: 0; padding: 0; font: inherit; letter-spacing: inherit; text-transform: inherit; cursor: pointer; text-decoration: none; }
.mg-fin .fin__menu:has(.est-ouverte) .fin__item:not(.est-ouverte) .fin__titre { color: rgba(237,237,234,.45); }
.mg-fin .fin__sous { position: absolute; left: 0; top: 100%; white-space: nowrap; list-style: none; margin: 0; padding: 10px 0 0; min-width: 28ch; display: none; }
.mg-fin .fin__item.est-ouverte .fin__sous { display: block; }
.mg-fin .fin__item--droite .fin__sous { left: auto; right: 0; }
.mg-fin .fin__sous li { min-height: 1.8em; }
.mg-fin .fin__sous a { display: flex; white-space: pre; color: rgba(237,237,234,.55); line-height: 1.8; text-decoration: none; }
.mg-fin .fin__sous a:hover { color: #ededea; }
.mg-fin .fin__sous .sous__qte { color: #ededea; }
.mg-fin a[aria-disabled="true"] { cursor: default; pointer-events: none; }
@media (max-width: 760px) {
  .mg-fin .fin { width: 92vw; top: 30%; }
  .mg-fin .fin__menu { flex-wrap: wrap; row-gap: 12px; white-space: normal; justify-content: center; }
  .mg-fin .fin__menu > i { flex-basis: 2ch; }
}

/* la page est blanche : le lecteur et le menu ticket (clairs, faits pour les pages sombres) s'inversent selon le fond */
.ui143 .lecteur, .ui143 .ticket { mix-blend-mode: difference; }

/* l'ancien lecteur Framer (bouton rond en haut à gauche) : remplacé par celui du site */
.framer-1vrzlkd { visibility: hidden !important; pointer-events: none !important; }

/* téléphone : l'ancien menu de bas de page Framer (« MENU PHONE »), remplacé par celui du site */
.framer-1dkuxk9 { visibility: hidden !important; pointer-events: none !important; }
@media (max-width: 760px) { .mg-fin .fin { top: 50%; } .mg-fin .fin__menu { row-gap: 8px; } }

/* ---- téléphone : peinture blanche entre la vidéo et CONCEPT CAMPAIGN (margiela-scroll.js) ---- */
.mg-peint { position: fixed; inset: 0; z-index: 2147482500; pointer-events: none; visibility: hidden; overflow: hidden; }
.mg-peint.est-visible { visibility: visible; }
.mg-peint__nappe { position: absolute; left: 0; right: 0; top: 0; height: 100%; background: #fff; transform: translateY(calc(-100% - 23vw)); will-change: transform; }
.mg-peint__nappe::after { content: ""; position: absolute; left: -2%; right: -2%; top: 100%; height: 23vw; margin-top: -1px;
  background: url("../images/peinture-bord.png") center top / 100% 100% no-repeat; }
.mg-peint__nappe.est-descendue { transform: translateY(0); transition: transform .95s cubic-bezier(.55, .06, .3, 1); }
.mg-peint.est-partie { opacity: 0; transition: opacity .45s ease; }

/* ---- téléphone : CONCEPT CAMPAIGN regroupé au centre de l'écran (croix, titre, texte) ---- */
.framer-6XrOV.framer-v-vueoj0 .framer-m8oncq, .framer-6XrOV.framer-v-7csp0i .framer-m8oncq, .framer-6XrOV.framer-v-1e06qqm .framer-m8oncq,
.framer-6XrOV.framer-v-161emw2 .framer-m8oncq, .framer-6XrOV.framer-v-mgn2dy .framer-m8oncq { top: calc(50vh - 158px) !important; top: calc(50svh - 158px) !important; }
.framer-6XrOV.framer-v-vueoj0 .framer-iikgrn, .framer-6XrOV.framer-v-7csp0i .framer-iikgrn, .framer-6XrOV.framer-v-1e06qqm .framer-iikgrn,
.framer-6XrOV.framer-v-161emw2 .framer-iikgrn, .framer-6XrOV.framer-v-mgn2dy .framer-iikgrn { top: calc(50vh + 4px) !important; top: calc(50svh + 4px) !important; bottom: auto !important; }
.framer-6XrOV.framer-v-vueoj0 .framer-1u96cay-container, .framer-6XrOV.framer-v-7csp0i .framer-1u96cay-container, .framer-6XrOV.framer-v-1e06qqm .framer-1u96cay-container,
.framer-6XrOV.framer-v-161emw2 .framer-1u96cay-container, .framer-6XrOV.framer-v-mgn2dy .framer-1u96cay-container { top: calc(50vh + 30px) !important; top: calc(50svh + 30px) !important; bottom: auto !important; }
.mg-peint__vid { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
