/* Scène « bons cadeaux », refaite le 24 septembre au format validé par
   Théo : Chrome chez celle qui offre (le bon se compose et se règle), un
   carton « Cinq mois plus tard » en plein cadre, puis l'iPhone du comptoir
   de Lucie (le bon est reconnu, décompté, puis refusé à la seconde
   présentation). Textes lisibles une fois la scène réduite (10 px minimum
   sur la toile), gestes à la courbe d'iOS, aucun changement en coupure. Le
   rideau de fin et le curseur viennent du kit.

   LE MINUTAGE, en pourcentages d'une boucle de 12 secondes :
    4,1 %  clic sur « Dîner pour deux » ; le bon prend 70,00 €
    7,2 %  clic dans « Pour » ; « Léa » s'écrit (8 à 9 %)
    9,8 %  le petit mot s'écrit, sur le champ et sur le bon (jusqu'à 13,8 %)
   16,1 %  clic sur « Régler 70,00 € » ; la référence s'inscrit sur le bon
   20,5 %  Chrome sort, le carton « Cinq mois plus tard » entre (26 %)
     31 %  le carton sort, l'iPhone du comptoir entre (36,5 %)
   38,8 %  Lucie tape 0, 4, 1, 7 (jusqu'à 41,5 %) ; le pavé descend
   47,4 %  elle touche « Décompter 70,00 € » ; il reste 11,00 €
     52 %  l'heure passe à 21:14 ; elle touche le champ, retape 0417
   58,8 %  la feuille « Bon déjà utilisé » monte (jusqu'à 60,6 %)
   60,6 %  plus rien ne bouge ; fondu au blanc à 95 %, retour au début sous
           le blanc, entre 98,4 et 99,9 %

   LA TOILE : 520 x 612, ROGNÉE à ses bords. Chrome : 520 x 570, sa vue
   commence en (1, 65). L'iPhone : 232 x 484 posé en (123, 6) à l'échelle
   1,18 ; un point (x, y) de son écran tombe en (123 + (6 + x) x 1,18,
   6 + (6 + y) x 1,18) ; l'outil commence à y = 30. Légende de 584 à 610.

   LES CIBLES, CALCULÉES :
     curseur (pointe, moins (4, 2)) :
       « Dîner pour deux »   vue (145, 149) → toile (146, 214) → (142, 212)
       le champ « Pour »     vue (145, 290) → toile (146, 355) → (142, 353)
       « Régler 70,00 € »    vue (145, 397) → toile (146, 462) → (142, 460)
     doigt de Lucie (centre, moins 11) :
       « Décompter »         écran (110, 402) → toile (260, 487) → (249, 476)
       le champ              écran (110, 136) → toile (260, 174) → (249, 163) */
.fn-scene--cadeaux {
  overflow: hidden;
  --sc-haut: 612px;
  --line: #E5E5E5; --line-ios: #D1D1D6; --line-chrome: #E3E6EA; --line-b: #EDEDED;
  line-height: 1.35;
}
.fn-scene--cadeaux svg { display: block; }
.fn-scene--cadeaux i { font-style: normal; }
.sc-cadeaux-pile { display: inline-grid; }
.sc-cadeaux-pile > * { grid-area: 1 / 1; }

/* ═══ 1. CHROME : LA PAGE DE VENTE ════════════════════════════════════ */
.sc-cadeaux-chrome {
  position: absolute; top: 0; left: 0; z-index: 1;
  display: flex; flex-direction: column;
  width: 520px; height: 570px; overflow: hidden;
  border: 1px solid #C7CCD4; border-radius: 8px;
  background: #FFFFFF; color: #0A0A0A;
  box-shadow: 0 12px 30px rgba(31, 36, 46, .14);
}
.sc-cadeaux-c-onglets { position: relative; flex: none; height: 30px; background: #DEE3EA; }
.sc-cadeaux-c-onglet {
  position: absolute; top: 5px; left: 8px;
  display: flex; align-items: center; gap: 6px;
  width: 170px; height: 25px; padding: 0 8px 0 10px;
  border-radius: 8px 8px 0 0; background: #FFFFFF; color: #1F1F1F;
}
.sc-cadeaux-c-onglet > svg { width: 10px; height: 10px; flex: none; color: #474747; }
.sc-cadeaux-c-logo { display: grid; place-items: center; flex: none; width: 12px; height: 12px; border-radius: 3px; background: #0A0A0A; color: #FFFFFF; font-size: 8px; font-weight: 800; line-height: 1; }
.sc-cadeaux-c-titre { flex: 1; min-width: 0; overflow: hidden; white-space: nowrap; font-size: 0.59375rem; }
.sc-cadeaux-c-plus { position: absolute; top: 9px; left: 196px; color: #474747; }
.sc-cadeaux-c-plus svg { width: 12px; height: 12px; }
.sc-cadeaux-fen { position: absolute; top: 0; right: 0; display: flex; height: 100%; }
.sc-cadeaux-fen i { display: grid; place-items: center; width: 34px; height: 100%; color: #1F1F1F; }
.sc-cadeaux-fen svg { width: 10px; height: 10px; }
.sc-cadeaux-c-outils { display: flex; align-items: center; gap: 2px; flex: none; height: 34px; padding: 0 6px; border-bottom: 1px solid var(--line-chrome); color: #474747; }
.sc-cadeaux-c-outils > i { display: grid; place-items: center; width: 24px; height: 24px; }
.sc-cadeaux-c-outils > i svg { width: 14px; height: 14px; }
.sc-cadeaux-c-off { color: #C4C7C5; }
.sc-cadeaux-c-outils > .sc-cadeaux-c-profil svg { width: 16px; height: 16px; padding: 1px; border-radius: 50%; background: #E3E3E3; color: #5F6368; }
.sc-cadeaux-c-adresse {
  display: flex; align-items: center; gap: 8px; flex: 1; min-width: 0;
  height: 26px; margin: 0 6px; padding: 0 10px;
  border-radius: 13px; background: #EDF1F7;
  font-size: 0.65625rem; color: #1F1F1F; white-space: nowrap;
}
.sc-cadeaux-c-adresse > svg { width: 13px; height: 13px; flex: none; }
.sc-cadeaux-c-chemin { color: #5F6368; }
.sc-cadeaux-c-etoile { margin-left: auto; }
.sc-cadeaux-c-etoile svg { width: 13px; height: 13px; }
.sc-cadeaux-vue { position: relative; flex: 1; overflow: hidden; }
.sc-cadeaux-vue > * { position: absolute; }

/* Le site de Chez Lucie. */
.sc-cadeaux-s-tete { top: 0; left: 0; right: 0; height: 46px; border-bottom: 1px solid var(--line-b); }
.sc-cadeaux-s-tete > * { position: absolute; top: 0; height: 46px; display: flex; align-items: center; }
.sc-cadeaux-s-marque { left: 20px; gap: 8px; font-size: 0.75rem; font-weight: 800; }
.sc-cadeaux-s-marque i { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 6px; background: #0A0A0A; color: #FFFFFF; font-size: 0.6875rem; font-weight: 800; line-height: 1; }
.sc-cadeaux-s-nav { right: 20px; gap: 18px; font-size: 0.625rem; color: #525252; }
.sc-cadeaux-s-actif { color: #0A0A0A; font-weight: 700; text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: 5px; }
.sc-cadeaux-s-titre { top: 62px; left: 20px; font-size: 1.125rem; font-weight: 800; letter-spacing: -.01em; line-height: 22px; }
.sc-cadeaux-s-sous { top: 88px; left: 20px; font-size: 0.625rem; line-height: 13px; color: #737373; }
.sc-cadeaux-lab { left: 20px; font-size: 0.625rem; font-weight: 600; line-height: 13px; color: #525252; }
.sc-cadeaux-lab--f { top: 114px; }
.sc-cadeaux-lab--p { top: 258px; }
.sc-cadeaux-lab--m { top: 316px; }

.sc-cadeaux-f { left: 20px; width: 250px; height: 34px; border: 1px solid var(--line); border-radius: 10px; background-color: #FFFFFF; white-space: nowrap; }
.sc-cadeaux-f > * { position: absolute; }
.sc-cadeaux-f--1 { top: 132px; }
.sc-cadeaux-f--2 { top: 172px; }
.sc-cadeaux-f--3 { top: 212px; }
.sc-cadeaux-radio {
  top: 9px; left: 11px; width: 14px; height: 14px; border-radius: 50%;
  border: 1.5px solid #A3A3A3;
  background: radial-gradient(circle, #0A0A0A 0 3px, transparent 3.5px) center / 0 0 no-repeat;
}
.sc-cadeaux-f b { top: 0; left: 34px; font-size: 0.6875rem; font-weight: 700; line-height: 32px; }
.sc-cadeaux-f span { top: 0; right: 12px; font-size: 0.625rem; font-weight: 600; line-height: 32px; color: #525252; }

.sc-cadeaux-champ { left: 20px; width: 250px; height: 32px; border: 1px solid var(--line); border-radius: 9px; background: #FFFFFF; }
.sc-cadeaux-champ > * { position: absolute; }
.sc-cadeaux-champ--p { top: 274px; }
.sc-cadeaux-champ--m { top: 332px; }
.sc-cadeaux-ph { top: 0; left: 12px; font-size: 0.625rem; line-height: 30px; color: #A3A3A3; white-space: nowrap; }
.sc-cadeaux-frappe { top: 7px; left: 12px; height: 16px; white-space: nowrap; }
.sc-cadeaux-txt { display: block; font-size: 0.6875rem; font-weight: 600; line-height: 16px; clip-path: inset(0 100% 0 0); }
.sc-cadeaux-caret { position: absolute; top: 0; left: 0; width: 1.5px; height: 16px; background: #3F7BFF; opacity: 0; }

.sc-cadeaux-regler {
  top: 378px; left: 20px; width: 250px; height: 38px;
  display: grid; place-items: center;
  border-radius: 10px; background: #E5E5E5; color: #737373;
  font-size: 0.6875rem; font-weight: 700;
}
.sc-cadeaux-rb { grid-area: 1 / 1; display: flex; align-items: center; gap: 6px; white-space: nowrap; }
.sc-cadeaux-rb svg { width: 13px; height: 13px; stroke-width: 2; }
.sc-cadeaux-s-note { top: 426px; left: 20px; display: flex; align-items: center; gap: 5px; font-size: 0.625rem; line-height: 13px; color: #737373; }
.sc-cadeaux-s-note svg { width: 11px; height: 11px; }

/* Le bon, dessiné comme un ticket, avec ses deux encoches. */
.sc-cadeaux-bon {
  top: 114px; left: 290px; width: 212px; height: 262px; overflow: hidden;
  border: 1px solid var(--line); border-radius: 14px; background: #FFFFFF;
  box-shadow: 0 10px 24px rgba(31, 36, 46, .10);
}
.sc-cadeaux-bon > * { position: absolute; left: 14px; right: 14px; white-space: nowrap; }
.sc-cadeaux-bon > .sc-cadeaux-bon-photo { top: 0; left: 0; right: auto; width: 212px; height: 84px; object-fit: cover; }
.sc-cadeaux-bon-maison { top: 94px; font-size: 0.625rem; font-weight: 700; line-height: 13px; color: #525252; }
.sc-cadeaux-bon-attente { color: #A3A3A3; font-weight: 500; }
.sc-cadeaux-bon-montant { top: 110px; height: 32px; align-items: end; }
.sc-cadeaux-bm--av { font-size: 0.75rem; line-height: 24px; }
.sc-cadeaux-bm--ap { font-size: 1.5rem; font-weight: 800; letter-spacing: -.02em; line-height: 30px; }
.sc-cadeaux-bon-formule { top: 144px; font-size: 0.625rem; line-height: 14px; color: #404040; }
.sc-cadeaux-bon-pour { top: 164px; font-size: 0.75rem; line-height: 16px; }
.sc-cadeaux-bon-pour b { font-weight: 800; }
.sc-cadeaux-bp--ap,
.sc-cadeaux-bmot--ap { clip-path: inset(0 100% 0 0); }
.sc-cadeaux-bon-mot { top: 184px; font-size: 0.625rem; line-height: 14px; color: #404040; }
.sc-cadeaux-encoche { top: 199px; width: 16px; height: 16px; border-radius: 50%; border: 1px solid var(--line); background: #FFFFFF; }
.sc-cadeaux-bon > .sc-cadeaux-encoche--g { left: -9px; right: auto; }
.sc-cadeaux-bon > .sc-cadeaux-encoche--d { left: auto; right: -9px; }
.sc-cadeaux-bon > .sc-cadeaux-bon-ref {
  top: 207px; left: 0; right: 0; height: 30px; padding: 0 14px;
  display: flex; align-items: center; gap: 5px;
  border-top: 1px dashed var(--line);
  font-size: 0.625rem; color: #525252;
}
.sc-cadeaux-bon-ref b { font-size: 0.75rem; font-weight: 800; color: #0A0A0A; }
.sc-cadeaux-bon-fin { top: 238px; font-size: 0.59375rem; line-height: 12px; color: #737373; }

/* ═══ 2. LE CARTON : CINQ MOIS PLUS TARD ══════════════════════════════ */
.sc-cadeaux-carton {
  position: absolute; top: 0; left: 0; z-index: 2;
  width: 520px; height: 570px;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px;
  background: #FFFFFF; color: #0A0A0A; text-align: center;
  transform: translateX(560px);
}
.sc-cadeaux-k-kicker { font-size: 0.75rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #3F7BFF; }
.sc-cadeaux-k-date { font-size: 2.25rem; font-weight: 800; letter-spacing: -.025em; line-height: 1.1; }
.sc-cadeaux-k-dit { font-size: 0.8125rem; color: #525252; }

/* ═══ 3. L'IPHONE DU COMPTOIR ═════════════════════════════════════════ */
.sc-cadeaux-tel {
  position: absolute; top: 0; left: 0; z-index: 3;
  width: 232px; height: 484px; padding: 6px;
  border-radius: 36px; background: #0A0A0A;
  box-shadow: 0 16px 34px rgba(31, 36, 46, .22);
  transform-origin: 0 0;
  transform: translate(686px, 6px) scale(1.18);
}
.sc-cadeaux-ecran { position: relative; height: 472px; overflow: hidden; border-radius: 30px; background: #FFFFFF; color: #0A0A0A; }
.sc-cadeaux-ilot { position: absolute; top: 7px; left: 77px; z-index: 9; width: 66px; height: 19px; border-radius: 10px; background: #0A0A0A; }
.sc-cadeaux-statut {
  position: absolute; top: 0; left: 0; right: 0; z-index: 8;
  display: flex; align-items: center; justify-content: space-between;
  height: 30px; margin: 0; padding: 2px 16px 0 26px;
  font-size: 0.625rem; line-height: 1; color: #000000;
}
.sc-cadeaux-heures { display: grid; }
.sc-cadeaux-h { grid-area: 1 / 1; font-weight: 600; }
.sc-cadeaux-statut-d { display: flex; align-items: center; gap: 4px; }
.sc-cadeaux-reseau { display: flex; align-items: flex-end; gap: 1px; height: 8px; }
.sc-cadeaux-reseau i { display: block; width: 2.5px; border-radius: 1px; background: currentColor; }
.sc-cadeaux-reseau i:nth-child(1) { height: 3px; }
.sc-cadeaux-reseau i:nth-child(2) { height: 4.5px; }
.sc-cadeaux-reseau i:nth-child(3) { height: 6px; }
.sc-cadeaux-reseau i:nth-child(4) { height: 8px; }
.sc-cadeaux-wifi { width: 11px; height: 8px; }
.sc-cadeaux-pile-i { display: block; width: 18px; height: 9px; padding: 1px; border: 1px solid rgba(31, 31, 31, .4); border-radius: 3px; }
.sc-cadeaux-pile-i i { display: block; width: 64%; height: 100%; border-radius: 1.5px; background: currentColor; }
.sc-cadeaux-maison { position: absolute; bottom: 6px; left: 70px; z-index: 9; width: 80px; height: 3.5px; border-radius: 2px; background: #0A0A0A; }

/* L'outil de Lucie, écran « Contrôler un bon ». */
.sc-cadeaux-app { position: absolute; top: 30px; left: 0; right: 0; bottom: 0; overflow: hidden; border-radius: 0 0 30px 30px; }
.sc-cadeaux-app > span,
.sc-cadeaux-app > b { position: absolute; }
.sc-cadeaux-a-tete { top: 0; left: 0; right: 0; height: 40px; }
.sc-cadeaux-a-tete > * { position: absolute; }
.sc-cadeaux-a-tete > i:first-child { top: 9px; left: 12px; display: grid; place-items: center; width: 22px; height: 22px; border-radius: 6px; background: #0A0A0A; color: #FFFFFF; font-size: 0.6875rem; font-weight: 800; line-height: 1; }
.sc-cadeaux-a-tete b { top: 12px; left: 42px; font-size: 0.6875rem; font-weight: 800; line-height: 16px; }
.sc-cadeaux-a-tete .sc-cadeaux-a-ava { top: 9px; right: 12px; display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: linear-gradient(135deg, #3F7BFF, #5BC4E8); color: #FFFFFF; font-size: 0.625rem; font-weight: 700; }
.sc-cadeaux-a-retour { top: 42px; left: 6px; display: flex; align-items: center; gap: 1px; font-size: 0.625rem; line-height: 16px; color: #2B5DD9; }
.sc-cadeaux-a-retour svg { width: 12px; height: 12px; stroke-width: 1.8; }
.sc-cadeaux-a-titre { top: 60px; left: 12px; font-size: 1rem; font-weight: 800; letter-spacing: -.01em; line-height: 20px; }
.sc-cadeaux-a-champ {
  top: 88px; left: 10px; right: 10px; height: 36px; padding: 0 12px;
  display: flex; align-items: center;
  border: 1px solid #3F7BFF; border-radius: 10px; background: #FFFFFF;
  font-size: 0.875rem; font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap;
}
/* Chiffres à chasse fixe pour que la frappe avance d'un chiffre par pas ;
   pas le préfixe, dont le tiret s'élargirait. */
.sc-cadeaux-a-prefixe { color: #A3A3A3; font-variant-numeric: normal; }
.sc-cadeaux-a-frappe { position: relative; height: 18px; }
.sc-cadeaux-a-txt { display: block; line-height: 18px; clip-path: inset(0 100% 0 0); }
.sc-cadeaux-a-caret { position: absolute; top: 0; left: 0; width: 1.5px; height: 18px; background: #3F7BFF; }
.sc-cadeaux-a-aide { top: 132px; left: 12px; right: 12px; font-size: 0.5625rem; line-height: 12px; color: #737373; }

.sc-cadeaux-a-carte { top: 132px; left: 10px; right: 10px; height: 118px; border: 1px solid var(--line); border-radius: 12px; background: #FFFFFF; }
.sc-cadeaux-a-carte > * { position: absolute; white-space: nowrap; }
.sc-cadeaux-a-ref { top: 12px; left: 12px; font-size: 0.75rem; font-weight: 800; line-height: 16px; }
.sc-cadeaux-a-etat { top: 10px; right: 10px; justify-items: end; }
.sc-cadeaux-a-e { display: flex; align-items: center; gap: 3px; height: 20px; padding: 0 7px; border-radius: 7px; font-size: 0.5625rem; font-weight: 700; transform-origin: 100% 50%; }
.sc-cadeaux-a-e svg { width: 10px; height: 10px; stroke-width: 2; }
.sc-cadeaux-a-e--1 { background: #E8F6EE; color: #15803D; }
.sc-cadeaux-a-e--2 { background: #F5F5F3; color: #525252; }
.sc-cadeaux-a-montant { top: 34px; left: 12px; }
.sc-cadeaux-a-m { display: flex; align-items: baseline; gap: 6px; font-size: 1.375rem; font-weight: 800; letter-spacing: -.02em; line-height: 26px; }
.sc-cadeaux-a-m span { font-size: 0.5625rem; font-weight: 500; letter-spacing: 0; color: #737373; }
.sc-cadeaux-a-carte > .sc-cadeaux-a-pour { top: 70px; left: 12px; right: 12px; padding-top: 8px; border-top: 1px dashed var(--line); font-size: 0.5625rem; line-height: 12px; color: #525252; }
.sc-cadeaux-a-valide { top: 96px; left: 12px; font-size: 0.5625rem; line-height: 12px; color: #737373; }

.sc-cadeaux-a-addition { top: 260px; left: 10px; right: 10px; height: 82px; }
.sc-cadeaux-a-addition > * { position: absolute; left: 0; right: 0; }
.sc-cadeaux-a-lab { top: 0; left: 2px; font-size: 0.5625rem; font-weight: 700; line-height: 12px; color: #525252; }
.sc-cadeaux-a-l {
  height: 22px; padding: 0 6px;
  display: flex; align-items: center; justify-content: space-between;
  border-top: 1px dashed var(--line); border-radius: 6px;
  font-size: 0.625rem; white-space: nowrap;
}
.sc-cadeaux-a-l--1 { top: 16px; }
.sc-cadeaux-a-l--2 { top: 38px; }
.sc-cadeaux-a-l--3 { top: 60px; font-size: 0.6875rem; font-weight: 800; }
.sc-cadeaux-a-l b { font-weight: 700; font-variant-numeric: tabular-nums; justify-items: end; }
.sc-cadeaux-a-l--3 b { font-weight: 800; }
.sc-cadeaux-a-v--2a { color: #A3A3A3; font-weight: 500; }
.sc-cadeaux-a-bouton {
  top: 352px; left: 10px; right: 10px; height: 40px;
  display: grid; place-items: center;
  border-radius: 12px; background: #0A0A0A; color: #FFFFFF;
  font-size: 0.6875rem; font-weight: 700;
}
.sc-cadeaux-ab { grid-area: 1 / 1; display: flex; align-items: center; gap: 6px; white-space: nowrap; }
.sc-cadeaux-ab svg { width: 13px; height: 13px; stroke-width: 2; }

/* Le pavé numérique d'iOS. */
.sc-cadeaux-app > .sc-cadeaux-pave {
  top: 228px; left: 0; right: 0; bottom: 0; z-index: 3;
  display: grid; grid-template-columns: repeat(3, 1fr); grid-auto-rows: 42px; gap: 6px;
  padding: 6px 6px 0;
  border-radius: 0 0 30px 30px; background: #D1D3D9;
}
.sc-cadeaux-t {
  display: grid; place-items: center;
  border-radius: 6px; background-color: #FCFCFE;
  box-shadow: 0 1px 0 rgba(0, 0, 0, .28);
  font-size: 1.25rem; font-weight: 400; line-height: 1; color: #000000;
}
.sc-cadeaux-t--vide,
.sc-cadeaux-t--eff { background-color: transparent; box-shadow: none; }
.sc-cadeaux-t--eff svg { width: 20px; height: 20px; }

/* La feuille du refus : un voile neutre, et la feuille qui monte. */
.sc-cadeaux-app > .sc-cadeaux-voile { inset: 0; z-index: 4; background: rgba(10, 10, 10, .28); opacity: 0; }
.sc-cadeaux-app > .sc-cadeaux-feuille {
  left: 0; right: 0; bottom: 0; z-index: 5; height: 216px;
  border-radius: 18px 18px 30px 30px; background: #FFFFFF;
  transform: translateY(100%);
}
.sc-cadeaux-feuille > * { position: absolute; left: 14px; right: 14px; text-align: center; }
.sc-cadeaux-feuille > .sc-cadeaux-fe-ico { top: 18px; left: 50%; right: auto; width: 40px; height: 40px; margin-left: -20px; display: grid; place-items: center; border-radius: 50%; background: #FEF3F2; color: #B42318; }
.sc-cadeaux-fe-ico svg { width: 22px; height: 22px; stroke-width: 2; }
.sc-cadeaux-fe-titre { top: 66px; font-size: 0.875rem; font-weight: 800; line-height: 18px; }
.sc-cadeaux-fe-dit { top: 90px; font-size: 0.625rem; line-height: 14px; color: #404040; }
.sc-cadeaux-fe-refus { top: 126px; font-size: 0.625rem; font-weight: 700; line-height: 14px; color: #B42318; }
.sc-cadeaux-fe-note { top: 146px; font-size: 0.5625rem; line-height: 12px; color: #737373; }

/* ═══ LA LÉGENDE, fixe en bas de la toile ═════════════════════════════ */
.sc-cadeaux-legende { position: absolute; top: 584px; left: 14px; right: 14px; z-index: 2; display: grid; height: 26px; margin: 0; }
.sc-cadeaux-leg {
  grid-area: 1 / 1;
  display: flex; align-items: center; gap: 9px;
  font-size: 0.625rem; font-weight: 700; line-height: 1; color: #0A0A0A; white-space: nowrap;
  opacity: 0;
}
.sc-cadeaux-leg--a { opacity: 1; }
.sc-cadeaux-leg i { display: grid; place-items: center; flex: none; width: 26px; height: 26px; border: 1px solid var(--line); border-radius: 8px; background: #FFFFFF; color: #525252; }
.sc-cadeaux-leg i svg { width: 13px; height: 13px; }
.sc-cadeaux-leg img { flex: none; width: 22px; height: 22px; margin: 0 2px; border-radius: 50%; }

/* Le doigt : le rond gris des captures d'écran d'iPhone. */
.sc-cadeaux-doigt {
  position: absolute; top: 0; left: 0; z-index: 4;
  width: 22px; height: 22px; border-radius: 50%;
  border: 1.5px solid rgba(255, 255, 255, .9);
  background: rgba(10, 10, 10, .24);
  opacity: 0; pointer-events: none;
}

/* Ce qui n'est pas là au début de la boucle. */
.sc-cadeaux-bm--ap,
.sc-cadeaux-bf--ap,
.sc-cadeaux-br--ap,
.sc-cadeaux-rb--2,
.sc-cadeaux-rb--3,
.sc-cadeaux-h--2,
.sc-cadeaux-a-carte,
.sc-cadeaux-a-addition,
.sc-cadeaux-a-bouton,
.sc-cadeaux-a-e--2,
.sc-cadeaux-a-m--2,
.sc-cadeaux-a-v--2b,
.sc-cadeaux-a-v--3b,
.sc-cadeaux-ab--2 { opacity: 0; }

/* Ce qui bouge en grand passe sur son propre calque. */
.sc-cadeaux-chrome,
.sc-cadeaux-carton,
.sc-cadeaux-tel,
.sc-cadeaux-pave,
.sc-cadeaux-feuille { will-change: transform, opacity; }

/* ═══ LES NOMS D'ANIMATION ════════════════════════════════════════════ */
.sc-cur      { animation-name: sc-cur-cadeaux; }
.sc-cur-onde { animation-name: sc-cadeaux-onde; }
.sc-fin      { animation-name: sc-conclure; }

.sc-cadeaux-chrome   { animation-name: sc-cadeaux-chrome; }
.sc-cadeaux-carton   { animation-name: sc-cadeaux-carton; }
.sc-cadeaux-tel      { animation-name: sc-cadeaux-tel; }
.sc-cadeaux-doigt    { animation-name: sc-cadeaux-doigt; }

.sc-cadeaux-f--1     { animation-name: sc-cadeaux-f1; }
.sc-cadeaux-f--1 .sc-cadeaux-radio { animation-name: sc-cadeaux-radio; }
.sc-cadeaux-bm--av,
.sc-cadeaux-bf--av   { animation-name: sc-cadeaux-sort-1; }
.sc-cadeaux-bm--ap,
.sc-cadeaux-bf--ap   { animation-name: sc-cadeaux-entre-1; }
.sc-cadeaux-regler   { animation-name: sc-cadeaux-regler; }
.sc-cadeaux-rb--1    { animation-name: sc-cadeaux-rb1; }
.sc-cadeaux-rb--2    { animation-name: sc-cadeaux-rb2; }
.sc-cadeaux-rb--3    { animation-name: sc-cadeaux-rb3; }
.sc-cadeaux-champ--p { animation-name: sc-cadeaux-focus-p; }
.sc-cadeaux-champ--m { animation-name: sc-cadeaux-focus-m; }
.sc-cadeaux-ph--p,
.sc-cadeaux-bp--av   { animation-name: sc-cadeaux-sort-p; }
.sc-cadeaux-txt--p,
.sc-cadeaux-bp--ap   { animation-name: sc-cadeaux-frappe-p; }
.sc-cadeaux-caret--p { animation-name: sc-cadeaux-caret-p; }
.sc-cadeaux-ph--m,
.sc-cadeaux-bmot--av { animation-name: sc-cadeaux-sort-m; }
.sc-cadeaux-txt--m,
.sc-cadeaux-bmot--ap { animation-name: sc-cadeaux-frappe-m; }
.sc-cadeaux-caret--m { animation-name: sc-cadeaux-caret-m; }
.sc-cadeaux-br--av   { animation-name: sc-cadeaux-br-av; }
.sc-cadeaux-br--ap   { animation-name: sc-cadeaux-br-ap; }
.sc-cadeaux-bon > .sc-cadeaux-bon-ref { animation-name: sc-cadeaux-ref-eclaire; }

.sc-cadeaux-h--1     { animation-name: sc-cadeaux-h1; }
.sc-cadeaux-h--2     { animation-name: sc-cadeaux-h2; }
.sc-cadeaux-a-champ  { animation-name: sc-cadeaux-a-focus; }
.sc-cadeaux-a-txt    { animation-name: sc-cadeaux-a-frappe; }
.sc-cadeaux-a-caret  { animation-name: sc-cadeaux-a-caret; }
.sc-cadeaux-a-aide   { animation-name: sc-cadeaux-a-aide; }
.sc-cadeaux-pave     { animation-name: sc-cadeaux-pave; }
.sc-cadeaux-t--0     { animation-name: sc-cadeaux-t0; }
.sc-cadeaux-t--4     { animation-name: sc-cadeaux-t4; }
.sc-cadeaux-t--1     { animation-name: sc-cadeaux-t1; }
.sc-cadeaux-t--7     { animation-name: sc-cadeaux-t7; }
.sc-cadeaux-a-carte  { animation-name: sc-cadeaux-a-carte; }
.sc-cadeaux-a-addition { animation-name: sc-cadeaux-a-bas; }
.sc-cadeaux-a-bouton { animation-name: sc-cadeaux-a-bas, sc-cadeaux-a-bouton; }
.sc-cadeaux-ab--1,
.sc-cadeaux-a-e--1,
.sc-cadeaux-a-v--2a  { animation-name: sc-cadeaux-sort-2; }
.sc-cadeaux-ab--2,
.sc-cadeaux-a-v--2b  { animation-name: sc-cadeaux-entre-2; }
.sc-cadeaux-a-e--2   { animation-name: sc-cadeaux-a-e2; }
.sc-cadeaux-a-m--1   { animation-name: sc-cadeaux-a-m1; }
.sc-cadeaux-a-m--2   { animation-name: sc-cadeaux-a-m2; }
.sc-cadeaux-a-v--3a  { animation-name: sc-cadeaux-a-v3a; }
.sc-cadeaux-a-v--3b  { animation-name: sc-cadeaux-a-v3b; }
.sc-cadeaux-a-l--3   { animation-name: sc-cadeaux-a-l3; }
.sc-cadeaux-voile    { animation-name: sc-cadeaux-voile; }
.sc-cadeaux-feuille  { animation-name: sc-cadeaux-feuille; }

.sc-cadeaux-leg--a   { animation-name: sc-cadeaux-leg-a; }
.sc-cadeaux-leg--b   { animation-name: sc-cadeaux-leg-b; }
.sc-cadeaux-leg--c   { animation-name: sc-cadeaux-leg-c; }
.sc-cadeaux-leg--d   { animation-name: sc-cadeaux-leg-d; }

/* ═══ LES MOUVEMENTS ══════════════════════════════════════════════════ */

/* LES GLISSEMENTS : trois écrans côte à côte, Chrome, le carton, l'iPhone,
   qui passent de droite à gauche en 660 ms. */
@keyframes sc-cadeaux-chrome {
  0%, 20.5%    { transform: none; animation-timing-function: cubic-bezier(.65, 0, .35, 1); }
  26%, 98.4%   { transform: translateX(-560px); }
  99.9%, 100%  { transform: none; }
}
@keyframes sc-cadeaux-carton {
  0%, 20.5%    { transform: translateX(560px); animation-timing-function: cubic-bezier(.65, 0, .35, 1); }
  26%, 31%     { transform: none; animation-timing-function: cubic-bezier(.65, 0, .35, 1); }
  36.5%, 98.4% { transform: translateX(-560px); }
  99.9%, 100%  { transform: translateX(560px); }
}
@keyframes sc-cadeaux-tel {
  0%, 31%      { transform: translate(686px, 6px) scale(1.18); animation-timing-function: cubic-bezier(.65, 0, .35, 1); }
  36.5%, 98.4% { transform: translate(123px, 6px) scale(1.18); }
  99.9%, 100%  { transform: translate(686px, 6px) scale(1.18); }
}

/* 1. LE BON SE COMPOSE. La formule s'enfonce sous le clic et se coche ;
   le bon prend son montant, le bouton s'allume. */
@keyframes sc-cadeaux-f1 {
  0%, 4%       { transform: none; border-color: #E5E5E5; background-color: #FFFFFF; }
  4.2%         { transform: scale(.98); border-color: #E5E5E5; background-color: #F5F5F3; }
  4.7%         { transform: none; border-color: #0A0A0A; background-color: #FAFAFA; }
  5.4%, 98.4%  { transform: none; border-color: #0A0A0A; background-color: #FAFAFA; }
  99.9%, 100%  { transform: none; border-color: #E5E5E5; background-color: #FFFFFF; }
}
@keyframes sc-cadeaux-radio {
  0%, 4.5%     { border-color: #A3A3A3; background-size: 0 0; }
  5.1%, 98.4%  { border-color: #0A0A0A; background-size: 100% 100%; }
  99.9%, 100%  { border-color: #A3A3A3; background-size: 0 0; }
}
@keyframes sc-cadeaux-sort-1 { 0%, 4.8% { opacity: 1; } 5.3%, 98.4% { opacity: 0; } 99.9%, 100% { opacity: 1; } }
@keyframes sc-cadeaux-entre-1 {
  0%, 5.3%     { opacity: 0; transform: translateY(4px); animation-timing-function: cubic-bezier(.32, .72, 0, 1); }
  6.1%, 98.4%  { opacity: 1; transform: none; }
  99.9%, 100%  { opacity: 0; transform: translateY(4px); }
}
@keyframes sc-cadeaux-regler {
  0%, 5%       { transform: none; background-color: #E5E5E5; color: #737373; }
  5.8%, 16%    { transform: none; background-color: #0A0A0A; color: #FFFFFF; }
  16.2%        { transform: scale(.97); background-color: #26272E; color: #FFFFFF; }
  16.7%        { transform: none; background-color: #26272E; color: #FFFFFF; }
  17.5%, 98.4% { transform: none; background-color: #15803D; color: #FFFFFF; }
  99.9%, 100%  { transform: none; background-color: #E5E5E5; color: #737373; }
}
@keyframes sc-cadeaux-rb1 { 0%, 5% { opacity: 1; } 5.4%, 98.4% { opacity: 0; } 99.9%, 100% { opacity: 1; } }
@keyframes sc-cadeaux-rb2 { 0%, 5.4% { opacity: 0; } 6%, 16.6% { opacity: 1; } 17.1%, 100% { opacity: 0; } }
@keyframes sc-cadeaux-rb3 {
  0%, 17.1%    { opacity: 0; transform: scale(.92); animation-timing-function: cubic-bezier(.32, .72, 0, 1); }
  17.9%, 98.4% { opacity: 1; transform: none; }
  99.9%, 100%  { opacity: 0; transform: scale(.92); }
}

/* Les deux champs : le clic donne le focus, « Léa » s'écrit en trois pas,
   le petit mot en vingt-trois, en même temps sur le champ et sur le bon.
   Le pas est posé dans les étapes : la règle commune du kit l'emporterait
   sur une règle de classe. */
@keyframes sc-cadeaux-focus-p { 0%, 7.2% { border-color: #E5E5E5; } 7.5%, 9.2% { border-color: #3F7BFF; } 9.5%, 100% { border-color: #E5E5E5; } }
@keyframes sc-cadeaux-focus-m { 0%, 9.2% { border-color: #E5E5E5; } 9.5%, 14% { border-color: #3F7BFF; } 14.3%, 100% { border-color: #E5E5E5; } }
@keyframes sc-cadeaux-sort-p { 0%, 7.6% { opacity: 1; } 8%, 98.4% { opacity: 0; } 99.9%, 100% { opacity: 1; } }
@keyframes sc-cadeaux-sort-m { 0%, 9.4% { opacity: 1; } 9.8%, 98.4% { opacity: 0; } 99.9%, 100% { opacity: 1; } }
@keyframes sc-cadeaux-frappe-p {
  0%, 8%       { clip-path: inset(0 100% 0 0); animation-timing-function: steps(3, end); }
  9%, 98.4%    { clip-path: inset(0 0 0 0); }
  99.9%, 100%  { clip-path: inset(0 100% 0 0); }
}
@keyframes sc-cadeaux-caret-p {
  0%, 7.5%     { left: 0; opacity: 0; }
  7.6%, 8%     { left: 0; opacity: 1; animation-timing-function: steps(3, end); }
  9%, 9.2%     { left: 100%; opacity: 1; }
  9.3%, 100%   { left: 100%; opacity: 0; }
}
@keyframes sc-cadeaux-frappe-m {
  0%, 9.8%     { clip-path: inset(0 100% 0 0); animation-timing-function: steps(23, end); }
  13.8%, 98.4% { clip-path: inset(0 0 0 0); }
  99.9%, 100%  { clip-path: inset(0 100% 0 0); }
}
@keyframes sc-cadeaux-caret-m {
  0%, 9.3%     { left: 0; opacity: 0; }
  9.4%, 9.8%   { left: 0; opacity: 1; animation-timing-function: steps(23, end); }
  13.8%, 14%   { left: 100%; opacity: 1; }
  14.1%, 100%  { left: 100%; opacity: 0; }
}

/* Le règlement : la référence s'inscrit sur le bon, éclairée en jaune. */
@keyframes sc-cadeaux-br-av { 0%, 17.2% { opacity: 1; } 17.7%, 98.4% { opacity: 0; } 99.9%, 100% { opacity: 1; } }
@keyframes sc-cadeaux-br-ap {
  0%, 17.7%    { opacity: 0; transform: translateY(3px); animation-timing-function: cubic-bezier(.32, .72, 0, 1); }
  18.5%, 98.4% { opacity: 1; transform: none; }
  99.9%, 100%  { opacity: 0; transform: translateY(3px); }
}
@keyframes sc-cadeaux-ref-eclaire {
  0%, 17.4%    { background-color: rgba(254, 247, 224, 0); }
  18%, 20%     { background-color: #FEF7E0; }
  22%, 100%    { background-color: rgba(254, 247, 224, 0); }
}

/* 3. AU COMPTOIR. Lucie tape 0, 4, 1, 7 : chaque touche s'assombrit au
   moment où son chiffre s'écrit. Le pavé descend, le bon apparaît. */
@keyframes sc-cadeaux-a-focus { 0%, 42% { border-color: #3F7BFF; } 42.4%, 54.8% { border-color: #E5E5E5; } 55.2%, 58.8% { border-color: #3F7BFF; } 59.2%, 98.4% { border-color: #E5E5E5; } 99.9%, 100% { border-color: #3F7BFF; } }
@keyframes sc-cadeaux-a-frappe {
  0%, 37.9%    { clip-path: inset(0 100% 0 0); opacity: 1; animation-timing-function: steps(4, end); }
  41.5%, 55%   { clip-path: inset(0 0 0 0); opacity: 1; }
  55.4%        { clip-path: inset(0 0 0 0); opacity: 0; }
  55.5%        { clip-path: inset(0 100% 0 0); opacity: 0; }
  55.6%        { clip-path: inset(0 100% 0 0); opacity: 1; animation-timing-function: steps(4, end); }
  58.4%, 98.4% { clip-path: inset(0 0 0 0); opacity: 1; }
  99.9%, 100%  { clip-path: inset(0 100% 0 0); opacity: 1; }
}
@keyframes sc-cadeaux-a-caret {
  0%, 37.9%    { left: 0; opacity: 1; animation-timing-function: steps(4, end); }
  41.5%, 42%   { left: 100%; opacity: 1; }
  42.2%, 54.9% { left: 100%; opacity: 0; }
  55%          { left: 0; opacity: 0; }
  55.4%, 55.6% { left: 0; opacity: 1; animation-timing-function: steps(4, end); }
  58.4%, 58.8% { left: 100%; opacity: 1; }
  59%, 98.4%   { left: 100%; opacity: 0; }
  99.9%, 100%  { left: 0; opacity: 1; }
}
@keyframes sc-cadeaux-a-aide { 0%, 42% { opacity: 1; } 42.6%, 98.4% { opacity: 0; } 99.9%, 100% { opacity: 1; } }
@keyframes sc-cadeaux-pave {
  0%, 42%      { transform: none; animation-timing-function: cubic-bezier(.32, .72, 0, 1); }
  43.4%, 55%   { transform: translateY(100%); animation-timing-function: cubic-bezier(.32, .72, 0, 1); }
  56.2%, 58.8% { transform: none; animation-timing-function: cubic-bezier(.32, .72, 0, 1); }
  60.2%, 98.4% { transform: translateY(100%); }
  99.9%, 100%  { transform: none; }
}
@keyframes sc-cadeaux-t0 { 0%, 38.6% { background-color: #FCFCFE; } 38.8% { background-color: #BFC3CA; } 39.3%, 56.1% { background-color: #FCFCFE; } 56.3% { background-color: #BFC3CA; } 56.8%, 100% { background-color: #FCFCFE; } }
@keyframes sc-cadeaux-t4 { 0%, 39.5% { background-color: #FCFCFE; } 39.7% { background-color: #BFC3CA; } 40.2%, 56.8% { background-color: #FCFCFE; } 57% { background-color: #BFC3CA; } 57.5%, 100% { background-color: #FCFCFE; } }
@keyframes sc-cadeaux-t1 { 0%, 40.4% { background-color: #FCFCFE; } 40.6% { background-color: #BFC3CA; } 41.1%, 57.5% { background-color: #FCFCFE; } 57.7% { background-color: #BFC3CA; } 58.2%, 100% { background-color: #FCFCFE; } }
@keyframes sc-cadeaux-t7 { 0%, 41.3% { background-color: #FCFCFE; } 41.5% { background-color: #BFC3CA; } 42%, 58.2% { background-color: #FCFCFE; } 58.4% { background-color: #BFC3CA; } 58.9%, 100% { background-color: #FCFCFE; } }
@keyframes sc-cadeaux-a-carte {
  0%, 42.4%    { opacity: 0; transform: translateY(6px); animation-timing-function: cubic-bezier(.32, .72, 0, 1); }
  43.8%, 98.4% { opacity: 1; transform: none; }
  99.9%, 100%  { opacity: 0; transform: translateY(6px); }
}
@keyframes sc-cadeaux-a-bas {
  0%, 42.8%    { opacity: 0; transform: translateY(6px); animation-timing-function: cubic-bezier(.32, .72, 0, 1); }
  44.2%, 98.4% { opacity: 1; transform: none; }
  99.9%, 100%  { opacity: 0; transform: translateY(6px); }
}

/* LE DÉCOMPTE : le doigt touche « Décompter », le bouton passe au vert au
   relâché, l'état, le montant et le reste à régler changent à la suite. */
@keyframes sc-cadeaux-doigt {
  0%, 45.6%    { transform: translate(249px, 476px) scale(.6); opacity: 0; animation-timing-function: cubic-bezier(.32, .72, 0, 1); }
  46.6%        { transform: translate(249px, 476px); opacity: 1; }
  47.4%        { transform: translate(249px, 476px) scale(.8); opacity: 1; }
  48.2%        { transform: translate(249px, 476px); opacity: 1; }
  49.4%        { transform: translate(249px, 476px) scale(1.1); opacity: 0; }
  52.8%        { transform: translate(249px, 163px) scale(.6); opacity: 0; animation-timing-function: cubic-bezier(.32, .72, 0, 1); }
  53.8%        { transform: translate(249px, 163px); opacity: 1; }
  54.4%        { transform: translate(249px, 163px) scale(.8); opacity: 1; }
  55%          { transform: translate(249px, 163px); opacity: 1; }
  56.2%, 100%  { transform: translate(249px, 163px) scale(1.1); opacity: 0; }
}
@keyframes sc-cadeaux-a-bouton {
  0%, 47.3%    { scale: 1; background-color: #0A0A0A; }
  47.5%        { scale: .97; background-color: #26272E; }
  48.2%        { scale: 1; background-color: #26272E; }
  49%, 98.4%   { scale: 1; background-color: #15803D; }
  99.9%, 100%  { scale: 1; background-color: #0A0A0A; }
}
@keyframes sc-cadeaux-sort-2 { 0%, 48.3% { opacity: 1; } 48.8%, 98.4% { opacity: 0; } 99.9%, 100% { opacity: 1; } }
@keyframes sc-cadeaux-entre-2 {
  0%, 48.8%    { opacity: 0; transform: scale(.92); animation-timing-function: cubic-bezier(.32, .72, 0, 1); }
  49.6%, 98.4% { opacity: 1; transform: none; }
  99.9%, 100%  { opacity: 0; transform: scale(.92); }
}
@keyframes sc-cadeaux-a-e2 {
  0%, 48.9%    { opacity: 0; transform: scale(.85); animation-timing-function: cubic-bezier(.32, .72, 0, 1); }
  49.8%, 98.4% { opacity: 1; transform: none; }
  99.9%, 100%  { opacity: 0; transform: scale(.85); }
}
@keyframes sc-cadeaux-a-m1 { 0%, 48.6% { opacity: 1; } 49.2%, 98.4% { opacity: 0; } 99.9%, 100% { opacity: 1; } }
@keyframes sc-cadeaux-a-m2 { 0%, 49.2% { opacity: 0; } 50%, 98.4% { opacity: 1; } 99.9%, 100% { opacity: 0; } }
@keyframes sc-cadeaux-a-v3a { 0%, 49.8% { opacity: 1; } 50.4%, 98.4% { opacity: 0; } 99.9%, 100% { opacity: 1; } }
@keyframes sc-cadeaux-a-v3b { 0%, 50.4% { opacity: 0; } 51.2%, 98.4% { opacity: 1; } 99.9%, 100% { opacity: 0; } }
@keyframes sc-cadeaux-a-l3 {
  0%, 50.2%    { background-color: rgba(254, 247, 224, 0); }
  50.8%, 53%   { background-color: #FEF7E0; }
  55.4%, 100%  { background-color: rgba(254, 247, 224, 0); }
}

/* CINQ MINUTES PLUS TARD : l'heure change, le même bon revient. Le pavé
   remonte, les quatre chiffres se retapent, la feuille du refus monte. */
@keyframes sc-cadeaux-h1 { 0%, 52% { opacity: 1; } 52.5%, 98.4% { opacity: 0; } 99.9%, 100% { opacity: 1; } }
@keyframes sc-cadeaux-h2 { 0%, 52.5% { opacity: 0; } 53.2%, 98.4% { opacity: 1; } 99.9%, 100% { opacity: 0; } }
@keyframes sc-cadeaux-voile { 0%, 58.8% { opacity: 0; } 60.2%, 98.4% { opacity: 1; } 99.9%, 100% { opacity: 0; } }
@keyframes sc-cadeaux-feuille {
  0%, 58.8%    { transform: translateY(100%); animation-timing-function: cubic-bezier(.32, .72, 0, 1); }
  60.6%, 98.4% { transform: none; }
  99.9%, 100%  { transform: translateY(100%); }
}

/* La légende : l'ancienne sort, puis la nouvelle entre. */
@keyframes sc-cadeaux-leg-a { 0%, 22% { opacity: 1; } 22.6%, 98.4% { opacity: 0; } 99.9%, 100% { opacity: 1; } }
@keyframes sc-cadeaux-leg-b { 0%, 22.6% { opacity: 0; } 23.4%, 48.6% { opacity: 1; } 49.2%, 100% { opacity: 0; } }
@keyframes sc-cadeaux-leg-c { 0%, 49.2% { opacity: 0; } 50%, 59.2% { opacity: 1; } 59.8%, 100% { opacity: 0; } }
@keyframes sc-cadeaux-leg-d { 0%, 59.8% { opacity: 0; } 60.6%, 98.4% { opacity: 1; } 99.9%, 100% { opacity: 0; } }

/* LE CURSEUR de celle qui offre : la formule, le prénom, le règlement. */
@keyframes sc-cur-cadeaux {
  0%, 1%       { transform: translate(430px, 560px); opacity: 0; }
  1.8%         { transform: translate(400px, 520px); opacity: 1; }
  3.6%         { transform: translate(142px, 212px); opacity: 1; }
  4.1%         { transform: translate(142px, 212px) scale(.84); opacity: 1; }
  4.6%, 5.2%   { transform: translate(142px, 212px); opacity: 1; }
  6.8%         { transform: translate(142px, 353px); opacity: 1; }
  7.2%         { transform: translate(142px, 353px) scale(.84); opacity: 1; }
  7.6%, 14%    { transform: translate(142px, 353px); opacity: 1; }
  15.6%        { transform: translate(142px, 460px); opacity: 1; }
  16.1%        { transform: translate(142px, 460px) scale(.84); opacity: 1; }
  16.6%, 18.4% { transform: translate(142px, 460px); opacity: 1; }
  19.8%, 100%  { transform: translate(260px, 560px); opacity: 0; }
}
@keyframes sc-cadeaux-onde {
  0%, 4%       { transform: scale(.4); opacity: 0; }
  4.1%         { transform: scale(.4); opacity: .9; }
  5.7%         { transform: scale(2.2); opacity: 0; }
  5.8%, 7.1%   { transform: scale(.4); opacity: 0; }
  7.2%         { transform: scale(.4); opacity: .9; }
  8.8%         { transform: scale(2.2); opacity: 0; }
  8.9%, 16%    { transform: scale(.4); opacity: 0; }
  16.1%        { transform: scale(.4); opacity: .9; }
  17.7%        { transform: scale(2.2); opacity: 0; }
  17.8%, 100%  { transform: scale(.4); opacity: 0; }
}

/* Moins de mouvement : l'arrivée, le bon refusé à la seconde présentation. */
@media (prefers-reduced-motion: reduce) {
  .sc-cadeaux-chrome { transform: translateX(-560px); }
  .sc-cadeaux-carton { transform: translateX(-560px); }
  .sc-cadeaux-tel { transform: translate(123px, 6px) scale(1.18); }
  .sc-cadeaux-pave { transform: translateY(100%); }
  .sc-cadeaux-feuille { transform: none; }
  .sc-cadeaux-voile,
  .sc-cadeaux-a-carte,
  .sc-cadeaux-a-addition,
  .sc-cadeaux-a-bouton,
  .sc-cadeaux-a-e--2,
  .sc-cadeaux-a-m--2,
  .sc-cadeaux-a-v--2b,
  .sc-cadeaux-a-v--3b,
  .sc-cadeaux-ab--2,
  .sc-cadeaux-h--2,
  .sc-cadeaux-leg--d { opacity: 1; transform: none; }
  .sc-cadeaux-a-e--1,
  .sc-cadeaux-a-m--1,
  .sc-cadeaux-a-v--2a,
  .sc-cadeaux-a-v--3a,
  .sc-cadeaux-ab--1,
  .sc-cadeaux-h--1,
  .sc-cadeaux-a-aide,
  .sc-cadeaux-a-caret,
  .sc-cadeaux-leg--a { opacity: 0; }
  .sc-cadeaux-a-txt { clip-path: none; }
  .sc-cadeaux-a-bouton { background: #15803D; }
  .sc-cadeaux-a-champ { border-color: #E5E5E5; }
}
