@font-face {
  font-family: 'NBA100K Unibet';
  src: url('../fonts/Unibet-ExtraBold.woff2') format('woff2');
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'NBA100K Unibet';
  src: url('../fonts/Unibet-Black.woff2') format('woff2');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

.nba100k {
  --green: #009052;
  --f-unibet: 'NBA100K Unibet', 'Arial Black', Impact, sans-serif;
  --f-text: 'Montserrat', Arial, Helvetica, sans-serif;
  /* 1 px de la maquette desktop (1440) : se reduit sous 1440, plafonne a 1 px au-dela */
  --u: calc(min(100cqw, 1440px) / 1440);
  /* 1 px de la maquette mobile (320) : s'agrandit jusqu'a 1.4 px (hero uniquement) */
  --k: clamp(1px, calc(100cqw / 320), 1.4px);

  container-type: inline-size;
  position: relative;
  overflow-x: clip;
  background: #000;
  color: #fff;
  font-family: var(--f-text);
  font-size: 16px;
  line-height: 1.2;
  text-align: left;
  -webkit-font-smoothing: antialiased;
  -webkit-text-size-adjust: 100%;
}
.nba100k *,
.nba100k *::before,
.nba100k *::after { box-sizing: border-box; }
.nba100k :where(h1, h2, h3, p, ul, li, figure) { margin: 0; padding: 0; }
.nba100k :where(ul) { list-style: none; }
/* Resets a specificite nulle (:where) pour ne jamais prendre le dessus sur les classes ci-dessous */
:where(.nba100k) img { display: block; height: auto; border: 0; }
:where(.nba100k) button { font: inherit; color: inherit; background: none; border: 0; padding: 0; margin: 0; cursor: pointer; }
:where(.nba100k) a { color: inherit; }
:where(.nba100k) > div { position: relative; }

.nba100k__br-d { display: none; }

/* Titres de section (Unibet Black, vert) */
.nba100k__title {
  font: 900 30px/33px var(--f-unibet);
  text-transform: uppercase;
  text-align: center;
  color: var(--green);
}

/* ==========================================================================
   Elements flottants (parallaxe) - desktop uniquement
   ========================================================================== */
.nba100k__float { display: none; position: absolute; z-index: 1; pointer-events: none; will-change: transform; }
.nba100k__float img { width: 100%; height: auto; will-change: transform; }

/* ==========================================================================
   HERO
   ========================================================================== */
.nba100k__hero {
  z-index: 3;
  height: calc(523 * var(--k));
  background: #000 url('https://cdn-media.unibet.fr/static/unibet-nba-hero-bg-mobile.jpg') center bottom / cover no-repeat;
}
.nba100k__hero-stage { position: relative; width: calc(320 * var(--k)); height: 100%; margin: 0 auto; }
.nba100k__hero-anim { position: absolute; left: calc(50.4 * var(--k)); top: calc(-23.4 * var(--k)); width: calc(217.1 * var(--k)); }
/* Image fixe (image 0) en fond pendant le chargement de l'APNG */
.nba100k__hero-anim { aspect-ratio: 561 / 742; background: url('https://cdn-media.unibet.fr/static/unibet-nba-hero-poster.png') center / 100% 100% no-repeat; }
.nba100k__hero-anim-img { width: 100%; }
.nba100k__hero-tissot { position: absolute; left: calc(30 * var(--k)); top: calc(239 * var(--k)); width: calc(259 * var(--k)); }
.nba100k__hero-banner { position: absolute; left: calc(10 * var(--k)); top: calc(317 * var(--k)); width: calc(299 * var(--k)); }

/* ==========================================================================
   INTRO
   ========================================================================== */
.nba100k__intro { z-index: 1; padding: 0 10px 50px; }
.nba100k__intro-text {
  position: relative; z-index: 2;
  width: 100%; max-width: 300px; margin: 0 auto;
  font: 400 16px/19.2px var(--f-text);
  text-align: center;
}
.nba100k__intro-text p + p { margin-top: 19.2px; }
.nba100k__intro-vs { position: relative; z-index: 2; width: 300px; max-width: 100%; margin: 40px auto 0; }

/* ==========================================================================
   3 ETAPES
   ========================================================================== */
.nba100k__steps { z-index: 1; }
.nba100k__steps-title { padding: 0 35px; margin-bottom: 20px; }
.nba100k__steps-list { display: grid; gap: 20px; }

.nba100k__step {
  height: 245px;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 4px;
  text-align: center;
  background: url('https://cdn-media.unibet.fr/static/unibet-nba-steps-bg-raw.jpg') no-repeat;
  background-size: 1440px 307px;
}
.nba100k__step--1 { background-position: -45px 0; }
.nba100k__step--2 { background-position: center top; }
.nba100k__step--3 { background-position: right top; }
.nba100k__step--1 .nba100k__step-label { width: 248px; }
.nba100k__step--2 .nba100k__step-label { width: 228px; }
.nba100k__step--3 .nba100k__step-label { width: 252px; }
.nba100k__step-date { font: 800 28px/50px var(--f-unibet); text-transform: uppercase; white-space: nowrap; color: #fff; }
.nba100k__step-text { max-width: 314px; font: 600 19px/22.8px var(--f-text); color: #fff; }
/* Ombre portee sur les textes blancs (lisibilite sur le fond photo) ; en em : suit la taille du texte */
.nba100k__step-date,
.nba100k__step-text { text-shadow: 0 .06em .12em rgba(0, 0, 0, .9), 0 0 .45em rgba(0, 0, 0, .75), 0 0 1em rgba(0, 0, 0, .5); }
.nba100k__step--2 .nba100k__step-text { max-width: 276px; }
.nba100k__step--3 .nba100k__step-text { max-width: 248px; }

/* ==========================================================================
   COMMENT GAGNER (cartes)
   ========================================================================== */
.nba100k__how { z-index: 1; padding: 18px 10px 29px; }
/* Titre anime (APNG, halo dore inclus dans l'image : ~12 px de marge autour de la boite) */
.nba100k__how-title { position: relative; z-index: 2; display: flex; justify-content: center; margin: 0 0 -2px; }
.nba100k__how-title-box { display: block; width: 316px; flex: none; aspect-ratio: 1002 / 420; background: url('https://cdn-media.unibet.fr/static/unibet-nba-ticket-poster.png') center / 100% 100% no-repeat; }
.nba100k__how-title img { width: 100%; }

.nba100k__cards { position: relative; z-index: 2; display: grid; gap: 10px; max-width: 420px; margin: 0 auto; }
.nba100k__card {
  display: flex; flex-direction: column; gap: 16px;
  padding: 10px;
  border: 1px solid #fff; border-radius: 8px;
}
.nba100k__card-visual { width: 100%; aspect-ratio: 280 / 178; object-fit: cover; border-radius: 4px; }
.nba100k__card-body { display: flex; flex-direction: column; }

/* Pastilles de dates au-dessus du titre des cartes */
.nba100k__pills { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; margin-bottom: 8px; }
.nba100k__pill { white-space: nowrap; padding: 2px 8px; border-radius: 20px; background: #303030; color: #fff; font: 400 14px/16.8px var(--f-text); }
.nba100k__pill strong { font-weight: 700; }
.nba100k__br-m { display: inline; }
.nba100k__card-title { font: 900 20px/22px var(--f-unibet); text-transform: uppercase; color: #fff; }
.nba100k__card-list { margin-top: 4px; padding-left: 21px; list-style: disc; font: 400 14px/16.8px var(--f-text); }
.nba100k__card-list li::marker { font-size: .8em; }
.nba100k__card-list ul { padding-left: 21px; list-style: disc; }

/* Bouton CTA : 3 tranches d'image (capuchon gauche / milieu etirable / capuchon droit) + texte */
.nba100k__cta {
  position: relative; isolation: isolate;
  align-self: center; margin-top: auto;
  display: inline-flex; align-items: center; justify-content: center;
  height: 55px; padding: 0 22px 5.5px;
  font: 900 18px/24px var(--f-unibet);
  text-transform: uppercase; text-decoration: none; white-space: nowrap;
  color: #000;
}
.nba100k__cta::before {
  content: ''; position: absolute; z-index: -1; inset: -25px; pointer-events: none;
  background:
    url('https://cdn-media.unibet.fr/static/unibet-nba-cta-left.png') left center / 54px 100% no-repeat,
    url('https://cdn-media.unibet.fr/static/unibet-nba-cta-right.png') right center / 48px 100% no-repeat,
    /* tranches bout a bout (pas de chevauchement : les halos translucides s'additionneraient) ;
       la largeur du bouton est arrondie a l'entier par index.js pour eviter toute couture */
    url('https://cdn-media.unibet.fr/static/unibet-nba-cta-mid.png') 54px center / calc(100% - 102px) 100% no-repeat;
}

/* Hover CTA : le bouton se souleve, s'eclaircit et son halo s'intensifie.
   Pas de scale : une echelle fractionnaire refait apparaitre des coutures entre les tranches. */
.nba100k__cta {
  transition: transform .2s ease, filter .2s ease;
}
@media (hover: hover) {
  .nba100k__cta:hover {
    transform: translateY(-3px);
    filter: brightness(1.1) saturate(1.1) drop-shadow(0 6px 14px rgba(254, 254, 16, .55));
  }
  .nba100k__cta:active {
    transform: translateY(0);
    filter: brightness(.96);
    transition-duration: .08s;
  }
}
.nba100k__cta:focus-visible {
  outline: 2px solid #fff; outline-offset: 6px; border-radius: 12px;
}

/* ==========================================================================
   COMPTE A REBOURS
   ========================================================================== */
.nba100k__cd {
  z-index: 1;
  padding: 40px 10px;
  text-align: center;
  background:
    linear-gradient(180deg, #009052 0%, rgba(0, 95, 54, 0) 48.1%, #002a18 100%),
    url('https://cdn-media.unibet.fr/static/unibet-nba-countdown-bg.jpg') center / auto 523px no-repeat #002a18;
}
.nba100k__cd-title { position: relative; z-index: 2; margin-bottom: 15px; font: 900 30px/33px var(--f-unibet); text-transform: uppercase; color: #fff; }

.nba100k__cd-card {
  position: relative; z-index: 2;
  max-width: 508px; margin: 0 auto;
  padding: 3px;
  border: 3px solid transparent; border-radius: 16px;
  background:
    linear-gradient(transparent, transparent) padding-box,
    linear-gradient(90deg, #ebaa46 0%, #f0ebc8 17%, #ffd200 30%, #ebaa46 43%, #f0ebc8 58%, #ebaa46 74%, #ffd200 86%, #f0ebc8 100%) border-box;
  background-origin: border-box;
}
.nba100k__cd-inner { padding: 7px 0 16px; border-radius: 6px; background: #fff; }
.nba100k__cd-lead { font: 900 16px/30px var(--f-unibet); text-transform: uppercase; color: var(--green); }
.nba100k__cd-digits { display: flex; justify-content: center; align-items: flex-start; margin-top: 3px; }
.nba100k__cd-col { display: flex; flex-direction: column; align-items: center; width: 46px; }
.nba100k__cd-box {
  display: flex; align-items: center; justify-content: center;
  min-width: 46px; height: 45px; padding: 0 2px;
  border-radius: 4px; background: #f3f4f6;
  font: 900 24.7px/1 var(--f-unibet); color: #000;
}
.nba100k__cd-label { margin-top: 7px; font: 300 12px/14px var(--f-text); color: #4a5565; white-space: nowrap; }
.nba100k__cd-sep { width: 49px; height: 45px; display: flex; align-items: center; justify-content: center; font: 900 24.7px/1 var(--f-unibet); color: #000; }

.nba100k__cd-star { position: absolute; z-index: 3; pointer-events: none; }
.nba100k__cd-star--a { right: -42px; top: 83px; width: 42px; }
.nba100k__cd-star--b { right: -34px; top: 104px; width: 43px; transform: rotate(180deg); }
.nba100k__cd-star--c { left: -32px; top: 28px; width: 43px; }

/* Variante sans compte a rebours */
.nba100k__cd--alt { display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 355px; }

/* ==========================================================================
   VIDEOS  SWIPE DANS LES COULISSES
   ========================================================================== */
.nba100k__videos { z-index: 1; padding: 40px 0; }
.nba100k__videos .nba100k__title { padding: 0 10px; }
.nba100k__video-list {
  display: flex; gap: 20px; margin-top: 20px; padding: 0 10px;
  overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-left: 10px;
  scrollbar-width: none; -webkit-overflow-scrolling: touch;
}
.nba100k__video-list::-webkit-scrollbar { display: none; }
.nba100k__video-list::after { content: ''; flex: 0 0 1px; }
.nba100k__video-card {
  flex: 0 0 223px; scroll-snap-align: start;
  display: flex; flex-direction: column; gap: 16px;
  padding: 16px;
  border: 1px solid #fff; border-radius: 8px;
}
.nba100k__video-title { font: 900 20px/21px var(--f-unibet); text-transform: uppercase; color: #fff; }

/* Bouton video (vignette YouTube + play) - partage avec la video vedette */
.nba100k__video {
  position: relative; display: block; width: 100%; overflow: hidden;
  aspect-ratio: 191 / 319; border-radius: 4px; background: #0d1a14;
}
.nba100k__video-thumb,
.nba100k__video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; object-fit: cover; }
.nba100k__play {
  font-size: 0; line-height: 0; color: transparent; /* contient un   (CRM) */
  position: absolute; left: 50%; top: 50%; z-index: 2;
  width: 95px; height: 95px; margin: -47.5px 0 0 -47.5px;
  border: 6px solid #fff; border-radius: 50%;
  filter: drop-shadow(0 0 12px rgba(0, 0, 0, .55));
  pointer-events: none;
  transition: transform .2s ease;
}
.nba100k__play::after {
  content: ''; position: absolute; left: 50%; top: 50%;
  width: 36px; height: 42px; margin: -21px 0 0 -14px;
  background: #fff; clip-path: polygon(0 0, 100% 50%, 0 100%);
}
.nba100k__video:hover .nba100k__play,
.nba100k__video:focus-visible .nba100k__play { transform: scale(1.08); }
.nba100k__video.is-playing .nba100k__play { display: none; }

/* ==========================================================================
   VIDEO VEDETTE
   ========================================================================== */
.nba100k__featured { z-index: 1; padding: 20px 0; }
.nba100k__featured-band { display: none; font-size: 0; line-height: 0; color: transparent; }
.nba100k__featured-video {
  position: relative; z-index: 2;
  width: min(calc(100% - 38px), 340px); margin: 0 auto;
  aspect-ratio: 282 / 420;
  border: .66px solid #fff; border-radius: 13px;
  box-shadow: 0 0 62px #009052;
  overflow: hidden;
}
.nba100k__featured-video::after {
  content: ''; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: linear-gradient(180deg, #009052 0%, rgba(0, 144, 82, 0) 20.2%, rgba(0, 144, 82, 0) 77.9%, #009052 100%);
  opacity: .3;
}
.nba100k__featured-video.is-playing::after { display: none; }

/* ==========================================================================
   N1 SUR LES COTES
   ========================================================================== */
.nba100k__n1 { z-index: 1; padding: 40px 0; }
.nba100k__n1-img { width: 100%; height: 189px; object-fit: cover; object-position: 3% 50%; }
/* CTA sous l'image */
.nba100k__n1-cta { display: flex; justify-content: center; margin-top: 20px; }
.nba100k__legal { margin-top: 20px; padding: 0 4px; font: 400 12px/13.2px var(--f-text); text-align: center; color: #fff; }

/* ==========================================================================
   DESKTOP (>= 768 px) - maquette 1440 px, mise a l'echelle fluide via --u
   ========================================================================== */
@media (min-width: 768px) {

  .nba100k__br-d { display: inline; }
  .nba100k__title { font-size: max(26px, calc(40 * var(--u))); line-height: 1.25; }

  .nba100k__float { display: block; }

  /* ----- Hero ----- */
  .nba100k__hero { height: calc(464 * var(--u)); background-image: url('https://cdn-media.unibet.fr/static/unibet-nba-hero-bg-desktop.jpg'); }
  .nba100k__hero-stage { width: calc(1440 * var(--u)); max-width: 100%; }
  .nba100k__hero-anim { left: calc(91 * var(--u)); top: calc(-70.9 * var(--u)); width: calc(524.5 * var(--u)); }
  .nba100k__hero-tissot { left: calc(898 * var(--u)); top: calc(53 * var(--u)); width: calc(330 * var(--u)); }
  .nba100k__hero-banner { left: calc(808 * var(--u)); top: calc(157 * var(--u)); width: calc(509 * var(--u)); }

  /* ----- Intro ----- */
  .nba100k__intro { padding: 80px max(20px, calc(135 * var(--u))) 110px; }
  .nba100k__intro-text { max-width: 804px; }
  .nba100k__intro-vs { width: 642px; margin-top: 40px; }
  .nba100k__float--ball-a { left: calc(-44 * var(--u)); top: calc(161 * var(--u)); width: calc(174 * var(--u)); }
  .nba100k__float--scoreboard { right: calc(-64 * var(--u)); top: calc(379 * var(--u)); width: calc(258 * var(--u)); }

  /* ----- 3 etapes ----- */
  .nba100k__steps-title { padding: 0 20px; }
  .nba100k__steps-list {
    --us: calc(100cqw / 1440); /* proportionnel a la largeur de la page, sans plafond */
    display: block; position: relative; margin-top: 20px;
    height: calc(307 * var(--us));
    background: url('https://cdn-media.unibet.fr/static/unibet-nba-steps-bg.jpg') center / 100% 100% no-repeat;
  }
  .nba100k__step { display: contents; }
  .nba100k__step-label,
  .nba100k__step-date,
  .nba100k__step-text { position: absolute; text-align: left; }
  .nba100k__step--1 .nba100k__step-label,
  .nba100k__step--2 .nba100k__step-label,
  .nba100k__step--3 .nba100k__step-label { width: auto; }

  .nba100k__step-date { font-size: calc(33.23 * var(--us)); line-height: calc(50 * var(--us)); top: calc(140 * var(--us)); }
  .nba100k__step-text { max-width: none; padding: 0; font-size: max(12px, calc(19 * var(--us))); line-height: 1.2; top: calc(194 * var(--us)); }

  .nba100k__step--2 .nba100k__step-text,
  .nba100k__step--3 .nba100k__step-text { max-width: none; } /* annule les largeurs max mobile */

  .nba100k__step--1 .nba100k__step-label { left: calc(var(--us) * 44); top: calc(67 * var(--us)); width: calc(248 * var(--us)); }
  .nba100k__step--1 .nba100k__step-date  { left: calc(var(--us) * 63); }
  .nba100k__step--1 .nba100k__step-text  { left: calc(var(--us) * 62); width: calc(314 * var(--us)); }

  .nba100k__step--2 .nba100k__step-label { left: calc(var(--us) * 534); top: calc(67 * var(--us)); width: calc(248 * var(--us)); }
  .nba100k__step--2 .nba100k__step-date  { left: calc(var(--us) * 555); }
  .nba100k__step--2 .nba100k__step-text  { left: calc(var(--us) * 555); width: calc(276 * var(--us)); }

  .nba100k__step--3 .nba100k__step-label { left: calc(var(--us) * 1034); top: calc(56 * var(--us)); width: calc(277 * var(--us)); }
  .nba100k__step--3 .nba100k__step-date  { left: calc(var(--us) * 1055); }
  .nba100k__step--3 .nba100k__step-text  { left: calc(var(--us) * 1055); width: calc(248 * var(--us)); }

  /* ----- Comment gagner ----- */
  .nba100k__how { padding: 88px 20px 100px; }
  .nba100k__how-title { margin-bottom: 8px; }
  .nba100k__how-title-box { width: 505px; }
  .nba100k__cards { grid-template-columns: 1fr 1fr; gap: 20px; max-width: 1200px; }
  .nba100k__card { gap: 16px; padding: 30px; }
  .nba100k__card-visual { aspect-ratio: 529 / 252; }
      .nba100k__pills { gap: 4px; margin-bottom: 4px; }
  .nba100k__br-m { display: none; }
  .nba100k__card-title { font-size: 30px; line-height: 33px; }
  .nba100k__card-list { padding-left: 30px; font-size: 20px; line-height: 24px; }
  .nba100k__card-list ul { padding-left: 30px; }
  .nba100k__cta { font-size: 23.35px; line-height: 31px; }

  .nba100k__float--ticket-a { left: calc(-89 * var(--u)); top: calc(-30 * var(--u)); width: calc(230 * var(--u)); }
  .nba100k__float--ticket-b { left: calc(60 * var(--u)); top: calc(166 * var(--u)); width: calc(195.5 * var(--u)); }
  .nba100k__float--ticket-c { right: calc(-62 * var(--u)); top: calc(62 * var(--u)); width: calc(282 * var(--u)); }

  /* ----- Compte a rebours ----- */
  .nba100k__cd { padding: 81px 20px 131px; background-size: auto, cover; }
  .nba100k__cd-title { font-size: 40px; line-height: 40px; margin-bottom: 15px; }
  .nba100k__cd-card { padding: 4px; }
  .nba100k__cd-inner { padding: 11px 0 25px; border-radius: 8px; }
  .nba100k__cd-lead { font-size: 27px; line-height: 50px; }
  .nba100k__cd-digits { margin-top: 13px; }
  .nba100k__cd-col { width: 68px; }
  .nba100k__cd-box { min-width: 68px; height: 63px; border-radius: 6px; font-size: 41.6px; }
  .nba100k__cd-label { margin-top: 18px; font-size: 14px; line-height: 20px; }
  .nba100k__cd-sep { width: 73px; height: 63px; font-size: 41.6px; color: #020051; }
  .nba100k__cd-star--a { right: -3px; top: 145px; width: 71px; }
  .nba100k__cd-star--b { right: 11px; top: 180px; width: 72px; }
  .nba100k__cd-star--c { left: -54px; top: 52px; width: 73px; }

  .nba100k__cd--alt { justify-content: flex-start; min-height: 523px; padding: 216px 20px 0; }
  .nba100k__cd--alt .nba100k__cd-title { margin-bottom: 0; }

  .nba100k__float--ball-b { right: calc(76 * var(--u)); top: calc(-37 * var(--u)); width: calc(170 * var(--u)); z-index: 3; }
  .nba100k__float--jersey-a { left: calc(78 * var(--u)); top: calc(321 * var(--u)); width: calc(190 * var(--u)); z-index: 3; }

  /* ----- Videos ----- */
  .nba100k__videos { padding: 80px 0; }
  .nba100k__video-list {
    gap: calc(20 * var(--u)); width: calc(100% - 40px); max-width: 1200px; margin: 20px auto 0; padding: 0;
    overflow: visible; scroll-snap-type: none;
  }
  .nba100k__video-list::after { display: none; }
  .nba100k__video-card { flex: 1 1 0; min-width: 0; padding: max(8px, calc(16 * var(--u))); gap: max(8px, calc(16 * var(--u))); }
  .nba100k__video-title { font-size: max(13px, calc(20 * var(--u))); line-height: 1.05; }

  /* ----- Video vedette ----- */
  .nba100k__featured { padding: calc(72 * var(--u)) 0 calc(57 * var(--u)); }
  .nba100k__featured-band {
    display: block; position: absolute; left: 0; right: 0; top: calc(169 * var(--u)); height: calc(445 * var(--u));
    background: url('https://cdn-media.unibet.fr/static/unibet-nba-featured-band.jpg') center / cover no-repeat;
  }
  .nba100k__featured-video {
    width: calc(430 * var(--u)); max-width: none; aspect-ratio: 430 / 640;
    border-width: 1px; border-radius: 20px; box-shadow: 0 0 94px #009052;
  }
  .nba100k__float--cap { left: calc(74 * var(--u)); top: calc(98 * var(--u)); width: calc(212 * var(--u)); z-index: 3; }
  .nba100k__float--jersey-b { right: calc(90 * var(--u)); top: calc(426 * var(--u)); width: calc(190 * var(--u)); z-index: 3; }

  /* ----- N1 ----- */
  .nba100k__n1 { padding: 80px 0; }
  .nba100k__n1-img { height: auto; aspect-ratio: 3 / 1; }
  .nba100k__legal { padding: 0 20px; }
}

/* ==========================================================================
   FADE IN UP (classes ajoutees par index.js, jamais dans le HTML)
   ========================================================================== */
.nba100k--js .nba100k__reveal {
  opacity: 0;
  transform: translate3d(0, 40px, 0);
  transition: opacity .8s cubic-bezier(.22, 1, .36, 1) var(--rv-delay, 0s),
              transform .8s cubic-bezier(.22, 1, .36, 1) var(--rv-delay, 0s);
}
.nba100k--js .nba100k__reveal.is-visible { opacity: 1; transform: none; }

/* Accessibilite : pas d'animation de parallaxe si l'utilisateur le demande */
@media (prefers-reduced-motion: reduce) {
  .nba100k__float,
  .nba100k__float img { will-change: auto; transform: none !important; }
  .nba100k__play,
  .nba100k__cta { transition: none; }
  /* animations reduites : on garde l'image fixe (fond) et on masque l'APNG */
  .nba100k__hero-anim-img,
  .nba100k__how-title img { visibility: hidden; }
}