@property --mg-bx { syntax: "<percentage>"; inherits: true; initial-value: 130%; }

.mg-heros { position: relative; isolation: isolate; container-type: inline-size; }
.mg-heros::after { content: ""; position: absolute; z-index: 0; left: 0; right: 0; top: 0; height: min(100%, 980px); pointer-events: none;
  background: radial-gradient(120% 52% at 26% 20%, #070809d1 0%, #0708099e 46%, #07080900 82%); }
.mg-grille { position: relative; z-index: 1; }
.mg { filter: drop-shadow(0 .04em .1em #00000080); }
.mg-grille { --mg-g: var(--vt-gouttiere); --mg-max: 1440px; --mg-cap: min(34cqi, 30svh); --mg-mord: .3; --mg-ecart: var(--mg-descend, 0);
  --mg-w: calc(min(100cqi, var(--mg-max)) - 2 * var(--mg-g));
  --mg-pied: min(calc(var(--mg-w) * .96 / var(--mg-der)), var(--mg-cap));
  display: grid; grid-template-columns: minmax(0, 1fr); grid-template-areas: "haut" "mot" "objet" "suite" "bas";
  width: min(100%, var(--mg-max)); margin-inline: auto; padding-inline: var(--mg-g); }
.mg-haut { grid-area: haut; min-width: 0; }
.mg-sur { margin: 12px 0 0; font: 600 clamp(20px, 5.6vw, 24px)/1.15 var(--dn-titre); letter-spacing: -.04em; }
.mg-sur > .v-plaque { padding-bottom: .2em; margin-bottom: -.2em; }
.mg-titre { grid-area: mot; min-width: 0; margin: 14px 0 0; font-family: var(--dn-titre); font-weight: 600; letter-spacing: -.05em; }
.mg-suite { position: relative; z-index: 4; display: block; margin-top: calc(18px + var(--mg-pied) * .16 * var(--mg-ecart)); font-size: clamp(24px, 6.6vw, 30px); line-height: 1.08; letter-spacing: -.045em; text-wrap: balance; }
.mg-objet { grid-area: objet; min-width: 0; margin-top: calc(var(--mg-pied) * var(--mg-mord) * -1); }
.mg-bas { grid-area: bas; position: relative; z-index: 4; min-width: 0; }
@supports (grid-template-rows: subgrid) {
  .mg-titre { grid-row: mot-start / suite-end; display: grid; grid-template-rows: subgrid; grid-template-columns: subgrid; }
  .mg-titre > .mg { grid-row: 1; }
  .mg-titre > .mg-suite { grid-row: 3; }
}

.mg { position: relative; z-index: 1; display: block; line-height: .9; white-space: nowrap; font-kerning: none; font-variant-ligatures: none; }
.mg-l { display: block; width: max-content; font-size: min(calc(var(--mg-w) * .96 / var(--mg-e)), var(--mg-cap));
  clip-path: inset(-.5em -.3em -.22em -.3em); }
.mg-o { display: contents; }
.mg-o, .mg-l { letter-spacing: -.015em; }
.mg-l + .mg-l, .mg-o + .mg-o > .mg-l:first-child { margin-top: .04em; }
.mg-l--descend + .mg-l, .mg-o:has(> .mg-l--descend:last-child) + .mg-o > .mg-l:first-child { margin-top: .12em; }
.mg-g { --mg-argent: linear-gradient(180deg, #fbfcfd 0%, #e6e9ed 26%, #bcc3ca 50%, #8d959e 63%, #c4cad1 80%, #eef1f4 100%);
  display: inline-block; padding-bottom: .2em; margin-bottom: -.2em; color: transparent; -webkit-background-clip: text; background-clip: text;
  background-image: linear-gradient(100deg, transparent calc(var(--mg-bx) - 7%), #ffffffe6 var(--mg-bx), transparent calc(var(--mg-bx) + 7%)), var(--mg-argent);
  background-size: 100% 100%; background-repeat: no-repeat; }
html.ua-samsung .mg-g { color: var(--dn-blanc); -webkit-text-fill-color: currentColor; background: none !important; -webkit-background-clip: border-box; background-clip: border-box; }

@media (min-width: 700px) {
  .mg-grille { --mg-cap: min(22svh, 240px); }
  .mg-sur { font-size: 26px; }
  .mg-suite { font-size: clamp(28px, 4vw, 38px); }
}

@media (min-width: 1100px) {
  .mg-grille { --mg-cap1: min(24svh, 230px); --mg-pied: min(calc(var(--mg-w) * .96 / var(--mg-un)), var(--mg-cap1)); --mg-ecart: var(--mg-descend-un, 0);
    grid-template-columns: minmax(0, var(--mg-col, .82fr)) minmax(0, var(--mg-col2, 1.18fr)); column-gap: clamp(24px, 3vw, 56px);
    grid-template-areas: "haut haut" "mot mot" "suite objet" "bas objet"; grid-template-rows: auto auto auto 1fr; }
  .mg-titre { grid-column: 1 / -1; }
  .mg-o { display: block; width: max-content; font-size: min(calc(var(--mg-w) * .96 / var(--mg-eo)), var(--mg-cap1)); }
  .mg-o + .mg-o { margin-top: .04em; }
  .mg-o--descend + .mg-o { margin-top: .12em; }
  .mg-l { display: inline-block; font-size: inherit; }
  .mg-l + .mg-l, .mg-o + .mg-o > .mg-l:first-child { margin-top: 0; }
  .mg-suite { margin-top: calc(clamp(16px, 2.2vh, 26px) + var(--mg-pied) * .16 * var(--mg-ecart)); font-size: clamp(28px, 2.5vw, 44px); }
  .mg-objet { align-self: start; }
  @supports (grid-template-rows: subgrid) {
    .mg-titre > .mg { grid-column: 1 / -1; }
    .mg-titre > .mg-suite { grid-row: 2; grid-column: 1; }
  }
}

.mg-col { container-type: inline-size; width: 100%; --mg-w: 100cqi; --mg-cap: min(34cqi, 30svh); --mg-ecart: var(--mg-descend, 0);
  --mg-pied: min(calc(var(--mg-w) * .96 / var(--mg-der)), var(--mg-cap)); font-family: var(--dn-titre); font-weight: 600; letter-spacing: -.05em; }
.mg-col > .mg { margin-bottom: 0; }
@media (min-width: 700px) { .mg-col { --mg-cap: min(20svh, 200px); } }
@media (min-width: 1100px) { .mg-col { --mg-cap1: min(20svh, 200px); --mg-pied: min(calc(var(--mg-w) * .96 / var(--mg-un)), var(--mg-cap1)); --mg-ecart: var(--mg-descend-un, 0); } }

@media (prefers-reduced-motion: no-preference) {
  html.v-pret .mg-g { animation: mg-leve 1.05s var(--dn-levee) calc(.08s + var(--k, 0) * .11s) backwards, mg-reflet 1.7s var(--dn-glisse) calc(.62s + var(--k, 0) * .11s) backwards; }
  html.v-pret .mg-sur, html.v-pret .mg-haut { animation: mg-pose .8s var(--dn-levee) backwards; }
  html.v-pret .mg-suite { animation: mg-pose .9s var(--dn-levee) .5s backwards; }
  html.v-pret .mg-bas { animation: mg-pose .9s var(--dn-levee) .62s backwards; }
}
@keyframes mg-leve { from { transform: translateY(125%); } }
@keyframes mg-reflet { from { --mg-bx: -20%; } to { --mg-bx: 130%; } }
@keyframes mg-pose { from { opacity: 0; translate: 0 14px; } }
