/* ===========================================================================
   v3.3 — appareils dessinés en CSS (_assets/device.css) et finitions.
   Chargé après v31.css et v32.css : ces règles l'emportent à spécificité égale.
   Aucune ombre lourde, aucun masque ni recadrage autour des appareils.
   ======================================================================== */

/* Les deux appareils restent côte à côte sur ordinateur et tablette.
   Sur téléphone, la capture mobile conserve sa taille et son comportement. */
.tr-device-duo { width: min(1200px, 100%); margin-inline: auto; }
@media (min-width: 721px) {
  .tr-device-duo { display: grid; grid-template-columns: minmax(0, 1fr) minmax(190px, 23%); align-items: center; gap: 32px; }
  .tr-device-duo > .tr-tour { min-width: 0; }
  .tr-device-duo .dv--laptop { --dv-w: 100%; width: 100%; }
  .tr-device-duo > .dv--phone { position: relative; right: auto; bottom: auto; width: 100%; margin: 0; }
}
@media (max-width: 720px) {
  .tr-device-duo > .dv--phone { position: relative; right: auto; bottom: auto; width: min(74vw, 290px, 100%); margin-inline: auto; }
}

/* Révélation : l'ordinateur entier, centré, à 1040 px au plus. */
.reveal__title { margin-bottom: var(--space-5); }
@media (max-width: 720px) {
  /* v32.css retirait la marge latérale pour l'ancienne image pleine largeur :
     le téléphone, lui, se centre dans la marge normale de la page. */
  .reveal .container { padding-inline: var(--gutter); }
  .reveal__title { padding-inline: 0; margin-bottom: var(--space-4); }
}

/* « Ce que vous obtenez » : titre et atouts à gauche, téléphone à droite. */
.obtenez {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-areas: "head device" "perks device";
  column-gap: 112px;
  max-width: 1000px;
  margin-inline: auto;
}
.obtenez__head {
  grid-area: head;
  align-self: end;
  max-width: 480px;
  margin: 0;
  text-align: left;
}
.obtenez__device { grid-area: device; width: 300px; }
/* Reflet de sol visible sur le fond gris : chaque .dv isole désormais son
   empilement dans le kit, l'ancien « isolation » de la page est retiré. */
.obtenez .perks {
  grid-area: perks;
  align-self: start;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-2);
  margin-top: var(--space-5);
}
@media (max-width: 900px) {
  .obtenez {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "head" "device" "perks";
  }
  .obtenez__head { align-self: auto; margin: 0 auto var(--space-5); text-align: center; }
  .obtenez__device { width: auto; }
  .obtenez .perks { align-items: center; margin-top: var(--space-6); }
  .obtenez .perks li { width: 292px; }
}

/* Offres : les trois prix occupent la même hauteur (44 px, posés sur leur ligne
   de base), les listes s'alignent d'une carte à l'autre malgré le prix plus
   grand de la carte Pro. */
.plan__price {
  display: grid;
  grid-auto-flow: column;
  justify-content: start;
  align-items: baseline;
  align-content: end;
  height: 44px;
  line-height: 1;
}
/* Le badge « Pour un usage régulier » a un filet de 1 px : les badges fantômes
   des deux autres cartes réservent exactement la même hauteur. */
.plan__badge--ghost { border: 1px solid transparent; }
/* Sur mobile, les offres sont empilées (voir « correction après critique ») :
   plus de réserve de badge ni d'invitation à glisser. */

/* Tablette (721–1024 px) : base.css passe les grilles à 3 colonnes sur 2, ce
   qui laissait une carte seule sur sa ligne (offres, durées, guides). Les trois
   cartes restent côte à côte, un peu plus serrées. */
@media (min-width: 721px) and (max-width: 1024px) {
  .plans.grid-3,
  .keep-row.grid-3,
  .guides-row.grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-2); }
  .plan { padding: var(--space-2); }
  .plan--featured { padding: calc(var(--space-2) - 1px); }
  .plan__price { font-size: 30px; }
  .plan--featured .plan__price { font-size: 38px; }
  .plan .ticks { font-size: 14px; }
  .guides-row .guide-card__body { padding: var(--space-2); }
  .guides-row .guide-card__title { font-size: 17px; }
}
/* Titres des guides jamais tronqués : réglé par base.css (boucle 3), copie locale retirée. */

/* Lignes équilibrées : plus de mot seul en fin de paragraphe court
   (« bancaire. », « l’offre », « transcrire. »). Boucle 3 : le titre de la
   zone de dépôt aussi (à 360 px, « … audio ou / vidéo ici » séparait les deux
   termes de l'alternative ; équilibré : « Déposez un fichier / audio ou vidéo ici »). */
.lead,
.section-head p,
.drop__title,
.drop__formats,
.drop__account,
.bigfacts__l,
.gcap__s,
.who__lead,
.faq summary,
.guide-card__title,
.final__note,
.speech__note { text-wrap: balance; }

/* Usages sur mobile : les deux photos côte à côte sous la grande, entières,
   au lieu d'une rangée à faire glisser dont la seconde carte était coupée
   au bord de l'écran (« Cours et… »). */
@media (max-width: 720px) {
  .gallery {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-inline: 0;
    padding: 0;
    overflow: visible;
    scroll-snap-type: none;
  }
  .gcard { flex: none; }
  .gcard__media { aspect-ratio: 1 / 1; border-radius: 16px; }
  .gcap__t { margin-top: 12px; font-size: 16px; }
  .gcap__s { font-size: 14px; line-height: 1.45; }
}

/* « Pour qui » sur mobile : quatre onglets en deux rangées, chacun avec son
   filet, le trait bleu de l'onglet actif reste collé à son libellé. */
@media (max-width: 720px) {
  .who__tabs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0 8px;
    border-bottom: 0;
  }
  .who__tabs [role="tab"] {
    margin-bottom: 0;
    padding-inline: 8px;
    border-bottom: 1px solid var(--line);
  }
}

/* Synthèse vocale : la réserve de 56 px sous la zone accueille les boutons
   Pause / Rejouer du parcours guidé ; sans animation, ils n'existent pas. */
@media (prefers-reduced-motion: reduce) {
  .speech-zone { padding-bottom: var(--space-3); }
}
@media (prefers-reduced-motion: reduce) and (max-width: 720px) {
  .speech-zone { padding-bottom: var(--space-2); }
}

/* Parcours guidé : l'info-bulle et le curseur gardent une ombre à peine
   visible, comme les menus (v31.css), au lieu de l'ombre portée de motion.css. */
.speech-zone .tour__label { box-shadow: 0 1px 2px rgba(17, 24, 39, .05); }
.speech-zone .tour__cursor { filter: drop-shadow(0 1px 2px rgba(17, 24, 39, .22)); }

/* Bande des outils en animations réduites : la règle est désormais dans
   _assets/transcriptor/v31.css, chargée par les quatre pages. */

/* ===========================================================================
   v3.3 — correction après critique (reprise du 23/09)
   ======================================================================== */

/* Une seule colonne de lecture de 1000 px pour les blocs alignés à gauche
   (« Ce que vous obtenez », « Pour qui », la synthèse vocale et l'appel final) :
   titres et cartes partent du même bord (x = 220 à 1440 px). */
.obtenez { max-width: calc(1000px + 2 * var(--gutter)); }
.who,
.aside-head,
.speech-zone { max-width: 1000px; }
@media (min-width: 901px) {
  .final--visual .final__split { max-width: calc(1000px + 2 * var(--gutter)); }
}

/* En-tête d'app figé dans les téléphones qui défilent : dans l'app, la barre
   « Transcription + » est collante (sticky, 64 px avec son filet). On pose
   par-dessus la capture le haut de cette même capture : le texte glisse sous
   la barre, comme dans l'app, au lieu de passer sous la barre d'état. */
/* Boucle 4 : min-height: 0 explicite. Sans lui, WebKit (Safari, iPhone)
   applique le minimum automatique d'une boîte à aspect-ratio (la hauteur du
   contenu) : le bandeau prenait toute la hauteur de la capture (1 384 et
   1 190 px d'app au lieu de 64) et recouvrait le défilement. Sur iPhone, les
   deux téléphones restaient figés sur le haut de l'écran, la barre d'accueil
   sur la ligne « Durée ». Mesuré : 64 px d'app dans Chromium et WebKit. */
.dv-appbar {
  position: absolute;
  inset: 0 0 auto;
  z-index: 1;
  aspect-ratio: 960 / 192; /* 24/09 : captures prises à 320 px de large (texte lisible) */
  min-height: 0;
  overflow: hidden;
  background: #FFF;
  pointer-events: none;
}
.dv-appbar img { display: block; width: 100%; height: auto; }

/* Sur mobile et tablette, les deux téléphones de la page ne montrent pas le
   même haut d'écran en animation : celui de « Ce que vous obtenez » s'ouvre
   sur la fin du texte brut, les détails et les six formats d'export. Au repos
   (mouvement réduit), il montre l'onglet Texte brut et les détails, cadrés
   bord à bord (boucle 3, voir plus bas) : la capture s'arrête trop tôt pour
   cadrer « Détails » et « Exporter » entiers sans une bande vide de 240 px. */
@media (max-width: 1024px) {
  /* Phase décalée par la variable du kit (--dv-scroll-delay, cf. DEVICE.md) :
     -9 s sur 18 s = milieu du cycle, palier bas. Boucle 3 : jusqu'à 1024 px,
     puisque la tablette montre aussi deux téléphones. */
  .obtenez .dv { --dv-scroll-delay: -9s; }
}

/* Boucle 3 — paliers et repos des deux téléphones (kit : --dv-scroll-top,
   --dv-scroll-stop, --dv-scroll-rest). La vue fait 794 px d'app de haut, dont
   64 px d'en-tête figé ; la barre d'accueil est à 780–785 px. Chaque arrêt
   commence dans un blanc de l'app et finit hors de toute ligne de texte, et
   la barre d'accueil ne tombe jamais sur un bouton ni sur une ligne
   (bords de cartes mesurés sur les captures : TESTS-V33.md, § 9).
   Révélation (capture de 1 384 px) : palier haut et repos à 131,5 px d'app,
   juste sous la pastille « Terminée » (qui finit à 194 px) : la carte
   « Transcription » entière (onglet Horodaté, six segments), puis le
   haut, encore vide, de la carte « Détails » ; palier bas entre les segments
   00:22 et 00:31, la barre d'accueil sous la carte « Exporter ».
   Ce que vous obtenez (1 190 px) : palier haut et repos à 136,5 px (voir plus bas), les cartes
   « Transcription » (Texte brut) et « Détails » entières, la barre d'accueil
   dans le blanc qui les sépare d'« Exporter » ; palier bas entre deux lignes.
   (Jusqu'à la boucle 3, fractions différentes en mouvement réduit, où le kit
   ne pose pas la marge de fin --dv-scroll-end ; voir la boucle 4 plus bas.)
   Boucle 3, critique 9,2 : à 132,5 px, la barre d'accueil touchait presque le
   bas de la carte « Détails » (5 px d'app) et semblait la souligner. Palier
   haut et repos descendus à 136,5 px d'app : la barre (779,4 à 784,8 px de la
   vue, device.css) est centrée dans le blanc de 24 px entre « Détails » (filet
   à 906) et « Exporter » (filet à 930), à 10 et 8 px des deux filets ; la vue
   s'arrête juste sous le filet haut d'« Exporter », et le filet haut de la
   carte « Transcription » (218) reste visible sous l'en-tête figé (qui finit
   à 200,5). Les valeurs .337 / .358 proposées (142 px) collaient la barre au
   filet d'« Exporter » (3 px) : mesuré sur device.css et à l'écran.
   Boucle 4 : réglages en px d'app du kit (data-dv-top, data-dv-stop,
   data-dv-rest sur chaque .dv, DEVICE.md), identiques en mouvement normal et
   réduit ; les fractions de la page (--dv-scroll-top/-stop/-rest, qui
   différaient selon le mode) sont retirées. Révélation : 131,5 / 601,5 /
   131,5 ; Ce que vous obtenez : 136,5 / 408,5 / 136,5. Mêmes positions
   au dixième de pixel dans Chromium et WebKit (corps du téléphone corrigé
   par le kit). */
/* Le second téléphone démarre sur sa pause basse (décalage de -9 s) : avant
   son premier cycle, il est déjà posé sur cette pause, et non sur la pause
   haute du kit, sinon la capture sautait de 136 à 408 px d'app au moment où
   il devient visible à moitié. */
@media (max-width: 1024px) and (prefers-reduced-motion: no-preference) {
  .obtenez .dv--scrollable:not(.is-scrolling) .dv__scroller {
    transform: translateY(calc(var(--dv-scroll-to, 0px) * var(--dv-scroll-stop, 1)));
  }
}

/* Synthèse vocale sur mobile : la bulle du parcours est de retour (boucle 3).
   Elle passait sur deux lignes et masquait « Écouter » ; le kit la garde
   désormais sur une ligne, et le script de la page la pose à côté de ce
   qu'elle montre (voir « Parcours de la synthèse vocale » plus bas). */
/* Mouvement réduit : le kit retire lui-même le calque du parcours (état final,
   ni curseur ni bulle, cf. MOTION.md) ; l'ancienne règle locale est retirée. */
/* Pause / Rejouer alignés sur la marge intérieure de la carte (bord droit du
   bouton « Écouter »), plus à 12 px du bord. */
.speech-zone .tour__controls { right: var(--space-3); bottom: var(--space-2); }
@media (max-width: 720px) {
  .speech-zone .tour__controls { right: var(--space-2); }
}

/* Offres sur mobile : empilées, comme sur la page Tarifs (plus de rangée à
   faire glisser dont les cartes voisines étaient coupées en pleine lettre). */
@media (max-width: 720px) {
  .plans--snap {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-2);
    margin-inline: 0;
    padding: 0;
    overflow: visible;
    scroll-snap-type: none;
  }
  .plans--snap > .plan { flex: none; height: auto; }
  .plans--snap .plan__badge--ghost { display: none; }
  .snap-hint { display: none; }
}
/* Coches des offres : plus de mot seul en dernière ligne (« PDF », « JSON »). */
.plan .ticks li { text-wrap: pretty; }

/* « Pour qui » sur mobile : le trait bleu de l'onglet actif recouvre
   exactement le filet gris de l'onglet, sur toute sa largeur. */
@media (max-width: 720px) {
  .who__tabs .autocycle__bar { left: 0; right: 0; bottom: -1px; }
}

/* Formats d'export : alignés à gauche sous la ligne corrigée ; « selon
   l'offre » est une note, pas un septième format. */
#formats { justify-content: flex-start; }
.formats__note {
  align-self: center;
  padding-inline: 4px;
  font-size: 13px;
  color: var(--muted);
}

/* Vos données sur tablette : les trois engagements en colonne, de même largeur,
   au lieu d'un 2 + 1 avec « Aucun entraînement de modèle » seul. */
@media (min-width: 721px) and (max-width: 1024px) {
  #donnees .pledges { flex-direction: column; align-items: center; gap: var(--space-2); }
  #donnees .pledges li { width: 320px; }
}

/* Appel final entre 721 et 900 px : même ordre que sur mobile (photo puis
   texte), texte centré comme tous les titres de section. */
@media (max-width: 900px) {
  .final--visual .final__inner { text-align: center; }
  .final--visual .actions { justify-content: center; }
  .final--visual .final__wrap { order: -1; width: 100%; max-width: 520px; margin-inline: auto; }
}

/* La FAQ suit la même colonne de 1000 px : elle précède l'appel final, qui
   part lui aussi de x = 220 à 1440 px. */
.faq { max-width: 1000px; margin-inline: auto; }

/* Panneau du menu mobile : la marque et le bouton Fermer restent posés sur la
   marque et le burger de la barre — règle désormais dans base.css (boucle 3),
   la copie locale est retirée. */

/* ===========================================================================
   v3.3 — boucle 2 (contre-critique 9,1/10)
   ======================================================================== */

/* Fin de défilement des téléphones : le kit ajoute --dv-scroll-end (6cqi) sous
   la capture ; la bande prend le gris-bleu du bas des deux captures (#FAFCFE),
   pas le blanc de la barre d'état, pour qu'aucun raccord ne se voie. La carte
   « Exporter » s'arrête ainsi bien au-dessus de la barre d'accueil. */
.dv--phone[data-dv-scroll] { --dv-scroll-end-bg: #FAFCFE; }

/* Zone de dépôt, mobile : deux lignes nettes, « Créer mon compte » puis
   « Compte requis pour transcrire. » (plus de « Compte » séparé de « requis »). */
.drop__req { white-space: nowrap; }
@media (max-width: 720px) {
  .drop__sep { display: none; }
  .drop__req { display: block; }
}

/* Parcours de la synthèse vocale (toutes largeurs). Boucle 3 : le kit place maintenant
   la bulle sous le champ de texte (sur l'onde), puis au-dessus du bouton sur
   tablette ; les anciens décalages CSS de la page s'y ajoutaient et la
   poussaient hors de la carte (768) ou sur Pause / Rejouer (1024, 1440).
   Le script de la page lit la place choisie par le kit et la corrige par la
   propriété « translate », étape par étape, à côté de ce qu'elle montre :
   1. à droite du curseur, dans le blanc du champ, sous la ligne saisie ;
   2. sous le bouton « Écouter » (alignée sur son bord droit au-dessus de 900 px,
      sur son bord gauche en dessous, ou au-dessus du bouton si Pause / Rejouer
      n'en laissent pas la place, à 360 px) ;
   3. sous l'onde au-dessus de 900 px ; sur l'onde, à droite du curseur, sur
      tablette et téléphone (le bouton est dessous). */
.speech-zone .tour__label {
  transition: transform 600ms var(--motion-ease), translate 600ms var(--motion-ease), opacity 220ms var(--motion-ease);
}

/* ===========================================================================
   v3.3 — boucle 3 : section ambiance (kit _assets/ambiance.*)
   ======================================================================== */

/* Réglages de l'outil (AMBIANCE.md) : fond relevé sur le mur bleu de la vidéo,
   bouton blanc au bleu vif de Transcriptor. Espacement : 48 px sous
   l'ordinateur de la révélation (96 px d'air au total, comme entre deux
   sections), rien en bas (la section suivante porte déjà ses 96 px). */
.amb--tr {
  --amb-bg: #185AD5;
  --amb-ink: #2365EB;
  --amb-pos: 66% 50%;
  /* Téléphone : cadrage calé à droite, comme la prise de vue. Les deux
     personnes restent entières (à 70 %, le visage de l'homme était coupé
     au bord), le micro tombe au centre. */
  --amb-pos-m: 100% 50%;
  padding-block: var(--space-6) 0;
}
/* Boucle 4 : plafond du titre par la variable du kit (--amb-title-max, même
   courbe 4,1vw) au lieu de la copie locale du clamp. Au-delà de 1 220 px, le
   titre du kit (52 px) finissait trop près du dossier du fauteuil gris
   (1440 px) ; à 50 px, « vous. » est à 75 px du fauteuil à 1440 et 1920 px,
   sans saut de taille, et rien ne change en dessous de 1 220 px. */
.amb--tr { --amb-title-max: 50px; }
/* Bouton de l'ambiance au rayon des boutons de l'outil (12 px), plus en pilule. */
.amb--tr .amb__btn { border-radius: 12px; }
/* Ordinateur, texte sur le mur (≥ 961 px) : la phrase reste sur le mur bleu
   uni, sans passer sur le fauteuil gris (« le texte » y perdait son contraste
   à 1024 et 1440). */
@media (min-width: 961px) {
  .amb--tr .amb__lead { max-width: 16.5em; }
}
/* Boucle 4 : le kit empile désormais texte et vidéo jusqu'à 900 px (vidéo en
   16:10, fondue en haut) ; la copie locale de cette mise en page entre 721 et
   900 px est retirée. Elle reste prolongée jusqu'à 960 px, avec les valeurs
   du kit : entre 901 et 960 px, le mur bleu uni ne fait que 250 à 330 px de
   large, le titre touchait les cheveux de la personne de gauche et la phrase
   venait buter sur son fauteuil (7 px d'écart à 901 px). Au-delà de 960 px,
   la phrase finit à plus de 20 px du fauteuil. */
@media (min-width: 901px) and (max-width: 960px) {
  .amb--tr .amb__panel { flex-direction: column; align-items: stretch; min-height: 0; }
  .amb--tr .amb__text { order: 0; width: auto; max-width: 640px; padding: 40px 40px 12px; }
  .amb--tr .amb__title { font-size: 44px; }
  .amb--tr .amb__btn { margin-top: 22px; }
  .amb--tr .amb__media { position: relative; order: 1; z-index: 0; inset: auto; aspect-ratio: var(--amb-ratio-t, 16 / 10); }
  .amb--tr .amb__media video,
  .amb--tr .amb__media img { object-position: var(--amb-pos-t, var(--amb-pos-m)); }
  .amb--tr .amb__media::before {
    content: "";
    position: absolute;
    z-index: 1;
    inset: 0 0 auto;
    height: 30%;
    background: linear-gradient(var(--amb-bg), transparent);
  }
}
@media (max-width: 720px) {
  .amb--tr { padding-block: var(--space-3) 0; }
}

/* ===========================================================================
   v3.3 — boucle 4 (contre-critique 3, 9,3/10)
   ======================================================================== */

/* Premier écran mobile (≤ 720 px) : la démo vivante (bouton, minuteur, onde
   qui avance, mots surlignés) tombait sous la ligne de flottaison (832 px à
   390 × 844) ; seul le haut de la carte « Exemple de transcription » dépassait.
   Sur-titre, H1 et chapô ne bougent pas : on resserre la zone de dépôt
   (marge 32 px, 24 px de rembourrage vertical), on retire « ou cliquez pour
   choisir un fichier », redondant au doigt avec le bouton « Choisir un
   fichier », et la pastille « Exemple » remonte sur la ligne du titre de la
   carte. Le lecteur et l'onde entrent dans le premier écran. */
@media (max-width: 720px) {
  .drop { margin-top: var(--space-4); padding-block: var(--space-3); }
  .drop__hint { display: none; }
  .demo { margin-top: var(--space-2); }
  .demo__head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    column-gap: 12px;
    row-gap: 4px;
    align-items: center;
  }
  .demo__head > div { display: contents; }
  .demo__title { grid-column: 1; grid-row: 1; }
  .demo__sub { grid-column: 1 / -1; grid-row: 2; }
  .demo__head .chip { grid-column: 2; grid-row: 1; margin: 0; }
}

/* ===========================================================================
   Boucle 5 — appareils vivants : parcours du kit motion posés SUR l'ordinateur
   de la révélation et sur le téléphone de « Ce que vous obtenez ». Les écrans
   sont de vraies captures (une par état, prises en cliquant dans l'app) ;
   cibles invisibles en % au-dessus de la capture, dans .dv__view.
   ======================================================================== */
.tr-tour { position: relative; }
.tr-hit { position: absolute; display: block; }
.tour .tr-hit.is-tour-hover,
.tour .tr-hit.is-tour-active { outline: 0; box-shadow: none; transform: none; }
/* curseur caché tant qu'il n'a pas rejoint sa première cible (pas de flèche en 0,0) */
.tr-tour .tour__cursor:not([style*="translate"]) { opacity: 0; }
/* Pause / Rejouer sous l'appareil, dans le flux : rien n'est recouvert */
.tr-tour__ctrls { margin-top: var(--space-4, 16px); }
.tr-tour__ctrls:empty { display: none; }
/* téléphone : point de toucher à la place de la flèche, même sur ordinateur */
.tr-tour--touch .tour__cursor svg { display: none; }
.tr-tour--touch .tour__cursor::before {
  content: "";
  display: block;
  width: 26px;
  height: 26px;
  margin: -13px 0 0 -13px;
  border-radius: 50%;
  background: rgba(17, 24, 39, .28);
  box-shadow: 0 0 0 2px rgba(255, 255, 255, .9);
}
/* fond de la vue = gris de l'app (la vue mesure 792 à 795 px d'app, la capture 792) */
.obtenez .dv--phone .dv__view { background: #FAFCFE; }

/* Boucle 5 : appel final, nouvel objet (micro et casque blancs sur fond bleu vif,
   image carrée non détourée) à la place du micro argent et du casque noir.
   Image pleine dans le cadre arrondi, sans marge teintée ni multiply. */
.final__media.seat--photo { padding: 0; }
.seat--photo img { object-fit: cover; object-position: 50% 55%; mix-blend-mode: normal; }

/* 24/09 5 h — contre-vérification */
/* « Pour qui » : les 4 panneaux dans la même cellule, hauteur = le plus grand. */
.who { display: grid; }
.who > .who__tabs { grid-row: 1; }
.who > .who__panel { grid-row: 2; grid-column: 1; }
.who > .who__panel[hidden] { display: block !important; visibility: hidden; }
/* Zone de dépôt : libellé selon le pointeur, message après choix. */
.drop { cursor: pointer; }
.drop__t-touch { display: none; }
@media (hover: none) { .drop__t-hover { display: none; } .drop__t-touch { display: inline; } }
.drop label.btn { cursor: pointer; }
.drop__msg:empty { display: none; }
.drop__msg { font-size: 15px; font-weight: 600; color: var(--accent); }
/* Téléphone « Ce que vous obtenez » : une capture haute qui défile vraiment.
   24/09 : reprise à 320 × 650 @3 (texte de l'app à ~12 px à l'écran au lieu de ~9,5 px) :
   Texte brut 960 × 4080 ; décalages relevés dans l'app : 168 px d'app en haut
   (= capture Texte brut), 710 px en bas (= capture Exporter), sur 1 360. Barre de l'app fixe. */
.tour-screens > .tr-scr { aspect-ratio: 960 / 1950; overflow: hidden; }
.tr-scr__img { display: block; width: 100%; height: auto; max-width: none; transform: translateY(-12.3529%); transition: transform 800ms cubic-bezier(.45, 0, .55, 1); }
.tr-scr.is-down .tr-scr__img { transform: translateY(-52.2059%); }
.tr-scr__bar { position: absolute; top: 0; left: 0; width: 100%; height: auto; max-width: none; }
@media (prefers-reduced-motion: reduce) { .tr-scr__img { transition: none; } }

/* 24/09 5 h : contraste AA des petits textes gris (#6B7280) : fond plus blanc, gris gardé. */
.switch { background: #F7F8F9; }
.out__t, .formats .chip, .chip.chip--neutral { background: #FFF; box-shadow: inset 0 0 0 1px var(--line); }
@media (min-width: 721px) { .pnode__s { white-space: nowrap; } }