/* ==========================================================================
   QUÉBEC HD — pages/test-iptv-gratuit.css
   Styles spécifiques à la page « Test IPTV gratuit » (slug
   « test-iptv-gratuit », ID 46). Une feuille par page, jamais par section.
   Les composants réutilisables (typographie, boutons, focus) restent dans
   general.css.

   Namespaces utilisés ici :
   - .qhd-trial-hero-*      (section sections/test-hero.php)
   - .qhd-trial-benefits-*, .qhd-trial-benefit-*,
     .qhd-trial-steps-*, .qhd-trial-step-*
                            (section sections/test-avantages.php)
   - .qhd-trial-form-*, .qhd-trial-info-*
                            (section sections/test-formulaire.php)
   - .qhd-trial-final-*     (section sections/test-final.php)
   ========================================================================== */

/* ==========================================================================
   Section 01 « hero » (sections/test-hero.php)
   --------------------------------------------------------------------------
   Texte à gauche (≈ 52 %, pour un H1 en trois lignes), image à droite
   (≈ 48 %, élargie vers le bord droit) dès 1025 px ; une colonne en
   dessous (texte, puis image).
   Fond : même système que les pages Contact, Revendeur et Signalement DMCA
   — base #06070B, halo bleu à gauche, halo magenta à droite, mêmes teintes
   et intensités, sur ::before / ::after qui « respirent » très lentement.
   Animations (toutes en CSS, coupées par prefers-reduced-motion) :
   - halos : dérive de quelques pour cent, 16 s et 19 s, alternate ;
   - apparition au chargement : texte, puis image ;
   - pulses brefs et décalés : bouton (10 s), lueur autour des appareils
     (11 s), icônes des repères (une à la fois, 9 s).
   ========================================================================== */

/* Pleine largeur : la section sort de son conteneur Elementor. 100vw inclut
   la barre de défilement verticale : le surplus est coupé au niveau de la
   page (clip ne crée pas de conteneur de défilement).
   Règle limitée à cette page : la feuille n'est chargée que sur cette page. */
body.qhd-theme {
  overflow-x: clip;
}

.qhd-trial-hero {
  --qhd-trial-pink: #f24a67;
  --qhd-trial-blue: #2294ff;
  --qhd-trial-pulse-rest: 0 0 5px rgb(34 148 255 / 16%);
  --qhd-trial-pulse-peak: 0 0 12px rgb(34 148 255 / 45%);
  position: relative;
  isolation: isolate;
  overflow: hidden;
  inline-size: 100vw;
  max-inline-size: 100vw;
  margin-inline: calc(50% - 50vw);
  padding-block: clamp(2rem, 1.25rem + 2vw, 3.5rem) clamp(2rem, 1.25rem + 2vw, 3rem); /* 32 → 56 / 32 → 48 px */
  background-color: #06070b;
}

/* Halos : mêmes teintes et intensités que les autres pages. Débordent de
   6 % pour que la dérive ne découvre jamais un bord ; fondu en bas. */
.qhd-trial-hero::before,
.qhd-trial-benefits::before,
.qhd-trial-form::before,
.qhd-trial-final::before,
.qhd-trial-hero::after,
.qhd-trial-benefits::after,
.qhd-trial-form::after,
.qhd-trial-final::after {
  content: "";
  position: absolute;
  inset: -6%;
  z-index: -1;
  pointer-events: none;
  -webkit-mask-image: linear-gradient(180deg, #000 0, #000 82%, transparent 96%);
  mask-image: linear-gradient(180deg, #000 0, #000 82%, transparent 96%);
  will-change: transform, opacity;
}

.qhd-trial-hero::before,
.qhd-trial-benefits::before,
.qhd-trial-form::before,
.qhd-trial-final::before {
  background-image:
    radial-gradient(30% 60% at 3% 42%, rgb(37 99 235 / 42%), rgb(37 99 235 / 10%) 45%, transparent 75%),
    radial-gradient(22% 34% at 2% 92%, rgb(37 99 235 / 22%), transparent 72%);
  animation: qhd-trial-halo-blue 16s ease-in-out infinite alternate;
}

.qhd-trial-hero::after,
.qhd-trial-benefits::after,
.qhd-trial-form::after,
.qhd-trial-final::after {
  background-image:
    radial-gradient(30% 55% at 97% 26%, rgb(214 36 120 / 38%), rgb(214 36 120 / 9%) 45%, transparent 75%);
  animation: qhd-trial-halo-pink 19s ease-in-out infinite alternate;
}

@keyframes qhd-trial-halo-blue {
  0% { transform: translate(0, 0) scale(1); opacity: 0.85; }
  100% { transform: translate(2.5%, -3%) scale(1.05); opacity: 1; }
}

@keyframes qhd-trial-halo-pink {
  0% { transform: translate(0, 0) scale(1.04); opacity: 1; }
  100% { transform: translate(-2.5%, 3%) scale(1); opacity: 0.82; }
}

/* Une colonne : texte, image (ordre du HTML). */
.qhd-trial-hero__inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 36px;
  width: min(100% - (var(--qhd-gutter) * 2), 1240px);
}

.qhd-trial-hero__content {
  min-inline-size: 0;
  animation: qhd-trial-rise 0.7s ease-out both;
}

/* --- Fil d'Ariane ---------------------------------------------------------- */

.qhd-trial-hero__breadcrumb ol {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 10px;
  margin: 0;
  padding: 0;
  list-style: none;
  font-size: 0.9375rem;
  line-height: 1.4;
}

.qhd-trial-hero__breadcrumb li {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin: 0;
  color: #ffffff;
}

/* Séparateur « › » dessiné, non lu par les lecteurs d'écran. */
.qhd-trial-hero__breadcrumb li + li::before {
  content: "›";
  color: #6f7c96;
  font-size: 1.1em;
}

.qhd-trial-hero .qhd-trial-hero__breadcrumb a {
  color: #c8cfd8;
  text-decoration: none;
}

.qhd-trial-hero .qhd-trial-hero__breadcrumb a:hover {
  color: #ffffff;
  text-decoration: underline;
  text-underline-offset: 0.18em;
}

/* --- Label, titre, texte --------------------------------------------------- */

.qhd-trial-hero__eyebrow {
  display: flex;
  align-items: center;
  gap: 16px;
  margin: 24px 0 0;
  font-size: 0.875rem;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--qhd-trial-pink);
}

.qhd-trial-hero__eyebrow::before {
  content: "";
  flex: 0 0 auto;
  inline-size: 44px;
  block-size: 3px;
  border-radius: 3px;
  background-color: var(--qhd-trial-pink);
}

.qhd-trial-hero__title {
  margin: 14px 0 0;
  font-family: var(--qhd-font-title);
  font-size: clamp(2.375rem, 1.6rem + 2.4vw, 3.375rem); /* 38 → 54 px */
  font-weight: 800;
  line-height: 1.08;
  letter-spacing: -0.035em;
  color: #f7f7f8;
}

.qhd-trial-hero__accent {
  color: var(--qhd-trial-pink);
}

.qhd-trial-hero__description {
  max-inline-size: 620px;
  margin: 24px 0 0;
  font-size: clamp(1.0625rem, 1rem + 0.25vw, 1.1875rem); /* 17 → 19 px */
  line-height: 1.6;
  color: #cbd2dd;
}

/* --- Bouton ---------------------------------------------------------------- */

.qhd-trial-hero__cta {
  gap: 12px;
  inline-size: 100%;
  max-inline-size: 400px;
  min-block-size: 58px;
  margin-block-start: 30px;
  padding: 10px 36px;
  border: 0;
  background-image: linear-gradient(90deg, #e92376, #ff3d67);
  font-size: 1.1875rem; /* 19 px gras : texte « grand » au sens WCAG */
  font-weight: 700;
  box-shadow: 0 12px 30px rgb(242 74 103 / 26%);
  transition: transform 0.25s ease, filter 0.25s ease;
  animation: qhd-trial-cta-pulse 10s ease-in-out 3s infinite;
}

/* Le thème parent souligne et colore les liens du contenu. */
.qhd-trial-hero a.qhd-trial-hero__cta {
  color: #ffffff;
  text-decoration: none;
}

.qhd-trial-hero__cta-icon,
.qhd-trial-hero__cta-arrow {
  flex: 0 0 auto;
}

.qhd-trial-hero__cta-arrow {
  transition: transform var(--qhd-duration) var(--qhd-ease);
}

.qhd-trial-hero .qhd-trial-hero__cta:focus-visible,
.qhd-trial-hero .qhd-trial-hero__breadcrumb a:focus-visible {
  outline: 3px solid var(--qhd-cyan);
  outline-offset: 3px;
}

@media (hover: hover) {
  .qhd-trial-hero a.qhd-trial-hero__cta:hover {
    color: #ffffff;
    transform: translateY(-2px);
    filter: brightness(1.08);
  }

  .qhd-trial-hero a.qhd-trial-hero__cta:hover .qhd-trial-hero__cta-arrow {
    transform: translateX(3px);
  }
}

@keyframes qhd-trial-cta-pulse {
  0%, 78%, 100% { box-shadow: 0 12px 30px rgb(242 74 103 / 26%); }
  81% { box-shadow: 0 12px 30px rgb(242 74 103 / 26%), 0 0 26px rgb(242 74 103 / 45%); }
  84% { box-shadow: 0 12px 30px rgb(242 74 103 / 26%); }
}

/* --- Repères --------------------------------------------------------------- */

.qhd-trial-hero__trust {
  display: flex;
  flex-direction: column;
  gap: 14px;
  margin: 30px 0 0;
  padding: 0;
  list-style: none;
}

.qhd-trial-hero__trust-item {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0;
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.3;
  color: #e6e9ef;
}

.qhd-trial-hero__trust-icon {
  flex: 0 0 auto;
  inline-size: 34px;
  block-size: 34px;
  color: var(--qhd-trial-blue);
  filter: drop-shadow(var(--qhd-trial-pulse-rest));
  animation: qhd-trial-soft-blink 9s ease-in-out 1s infinite;
}

.qhd-trial-hero__trust-item:nth-child(2) .qhd-trial-hero__trust-icon { animation-delay: 4s; }
.qhd-trial-hero__trust-item:nth-child(3) .qhd-trial-hero__trust-icon { animation-delay: 7s; }

/* --- Image ----------------------------------------------------------------- */

.qhd-trial-hero__media {
  position: relative;
  min-inline-size: 0;
  animation: qhd-trial-slide 0.75s ease-out 0.1s both;
}

/* Lumière bleue autour des appareils, pulse occasionnel. */
.qhd-trial-hero__media::before {
  content: "";
  position: absolute;
  inset: 5% 8%;
  z-index: -1;
  pointer-events: none;
  background-image:
    radial-gradient(45% 45% at 35% 55%, rgb(37 99 235 / 26%), transparent 70%),
    radial-gradient(35% 40% at 80% 40%, rgb(214 36 120 / 16%), transparent 70%);
  opacity: 0.8;
  animation: qhd-trial-glow 11s ease-in-out 5s infinite;
}

@keyframes qhd-trial-glow {
  0%, 76%, 100% { opacity: 0.8; }
  79% { opacity: 1; }
  82% { opacity: 0.85; }
}

.qhd-trial-hero__image {
  display: block;
  inline-size: 100%;
  block-size: auto;
  object-fit: contain;
  /* Bords gauche, droit et bas fondus dans le fond (fichier non modifié). */
  -webkit-mask-image:
    linear-gradient(90deg, transparent 0, #000 12%, #000 94%, transparent 100%),
    linear-gradient(180deg, #000 0, #000 86%, transparent 100%);
  -webkit-mask-composite: source-in;
  mask-image:
    linear-gradient(90deg, transparent 0, #000 12%, #000 94%, transparent 100%),
    linear-gradient(180deg, #000 0, #000 86%, transparent 100%);
  mask-composite: intersect;
  filter:
    drop-shadow(0 20px 50px rgb(0 110 255 / 18%))
    drop-shadow(0 0 35px rgb(242 30 105 / 12%));
}

/* --- Animations ------------------------------------------------------------ */

@keyframes qhd-trial-rise {
  from { opacity: 0; translate: 0 15px; }
  to { opacity: 1; translate: 0 0; }
}

@keyframes qhd-trial-slide {
  from { opacity: 0; translate: 20px 0; }
  to { opacity: 1; translate: 0 0; }
}

/* Pulse occasionnel : repos, puis un éclat doux (≈ 300 ms). */
@keyframes qhd-trial-soft-blink {
  0%, 74%, 100% {
    opacity: 0.88;
    filter: drop-shadow(var(--qhd-trial-pulse-rest));
  }
  77.5% {
    opacity: 1;
    filter: drop-shadow(var(--qhd-trial-pulse-peak));
  }
  81% {
    opacity: 0.88;
    filter: drop-shadow(var(--qhd-trial-pulse-rest));
  }
}

/* --- 600 px : repères sur une ligne, séparés ------------------------------- */

@media (min-width: 600px) {
  .qhd-trial-hero__cta {
    inline-size: auto;
  }

  .qhd-trial-hero__trust {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 12px 0;
  }

  .qhd-trial-hero__trust-item {
    padding-inline: 18px;
  }

  .qhd-trial-hero__trust-item:first-child {
    padding-inline-start: 0;
  }

  .qhd-trial-hero__trust-item + .qhd-trial-hero__trust-item {
    border-inline-start: 1px solid rgb(255 255 255 / 14%);
  }
}

/* --- 1025 px : deux colonnes ≈ 45 / 55 ------------------------------------- */

@media (min-width: 1025px) {
  .qhd-trial-hero__inner {
    grid-template-columns: minmax(0, 52fr) minmax(0, 48fr);
    align-items: center;
    gap: clamp(1.5rem, 0rem + 2.5vw, 3rem); /* 24 → 48 px */
  }

  /* L'image déborde légèrement à droite ; la section coupe le surplus. */
  .qhd-trial-hero__image {
    inline-size: calc(100% + clamp(0rem, 3vw, 3rem));
    max-inline-size: none;
  }

  /* Les trois garanties restent sur une seule ligne. */
  .qhd-trial-hero__trust {
    flex-wrap: nowrap;
  }

  .qhd-trial-hero__trust-item {
    gap: 10px;
    padding-inline: clamp(10px, -18px + 2.2vw, 18px);
    font-size: 0.9375rem;
    white-space: nowrap;
  }

  .qhd-trial-hero__trust-icon {
    inline-size: 28px;
    block-size: 28px;
  }

  .qhd-trial-hero__trust-item:first-child {
    padding-inline-start: 0;
  }

  .qhd-trial-hero__trust-item:last-child {
    padding-inline-end: 0;
  }
}

@media (min-width: 1025px) and (max-width: 1119px) {
  .qhd-trial-hero__trust-item {
    gap: 8px;
    font-size: 0.8125rem;
  }

  .qhd-trial-hero__trust-icon {
    inline-size: 24px;
    block-size: 24px;
  }
}

@media (min-width: 1280px) {
  .qhd-trial-hero__trust-item {
    font-size: 1rem;
  }

  .qhd-trial-hero__trust-icon {
    inline-size: 32px;
    block-size: 32px;
  }
}

/* --- Mobile : halos plus doux, pulses plus discrets ------------------------ */

@media (max-width: 767px) {
  .qhd-trial-hero {
    --qhd-trial-pulse-rest: 0 0 4px rgb(34 148 255 / 12%);
    --qhd-trial-pulse-peak: 0 0 8px rgb(34 148 255 / 30%);
  }

  .qhd-trial-hero::before,
  .qhd-trial-benefits::before,
  .qhd-trial-form::before,
  .qhd-trial-final::before,
  .qhd-trial-hero::after,
  .qhd-trial-benefits::after,
  .qhd-trial-form::after,
  .qhd-trial-final::after {
    animation-name: qhd-trial-halo-fade;
  }

  .qhd-trial-hero::before,
  .qhd-trial-benefits::before,
  .qhd-trial-form::before,
  .qhd-trial-final::before {
    background-image:
      radial-gradient(60% 28% at 0% 22%, rgb(37 99 235 / 32%), rgb(37 99 235 / 7%) 45%, transparent 75%),
      radial-gradient(50% 18% at 0% 90%, rgb(37 99 235 / 18%), transparent 72%);
  }

  .qhd-trial-hero::after,
  .qhd-trial-benefits::after,
  .qhd-trial-form::after,
  .qhd-trial-final::after {
    background-image:
      radial-gradient(60% 24% at 100% 8%, rgb(214 36 120 / 30%), rgb(214 36 120 / 7%) 45%, transparent 75%);
  }

  /* Libellé du bouton sur une seule ligne (texte gardé à 19 px). */
  .qhd-trial-hero__cta {
    gap: 10px;
    padding-inline: 18px;
  }
}

@media (max-width: 419px) {
  .qhd-trial-hero__cta-arrow {
    display: none;
  }
}

@keyframes qhd-trial-halo-fade {
  from { opacity: 0.8; }
  to { opacity: 1; }
}

/* Mouvement réduit : design statique, contenu entièrement visible. */
@media (prefers-reduced-motion: reduce) {
  .qhd-trial-hero::before,
  .qhd-trial-benefits::before,
  .qhd-trial-form::before,
  .qhd-trial-final::before,
  .qhd-trial-hero::after,
  .qhd-trial-benefits::after,
  .qhd-trial-form::after,
  .qhd-trial-final::after,
  .qhd-trial-hero__content,
  .qhd-trial-hero__media,
  .qhd-trial-hero__media::before,
  .qhd-trial-hero__trust-icon,
  .qhd-trial-hero__cta {
    animation: none;
  }

  .qhd-trial-hero__cta,
  .qhd-trial-hero__cta-arrow {
    transition: none;
  }

  .qhd-trial-hero a.qhd-trial-hero__cta:hover,
  .qhd-trial-hero a.qhd-trial-hero__cta:hover .qhd-trial-hero__cta-arrow {
    transform: none;
  }
}

/* ==========================================================================
   Section 02 « avantages + étapes » (sections/test-avantages.php)
   --------------------------------------------------------------------------
   Quatre avantages (1 colonne, 2 dès 768 px, 4 dès 1025 px), puis
   « Comment obtenir votre essai gratuit ? » : trois étapes (1 colonne
   reliée par un trait, 3 colonnes reliées par des flèches dès 1025 px).
   Fond : règles partagées avec le hero (plus haut) ; fondu haut et bas.
   Animations (coupées par prefers-reduced-motion) :
   - icônes des avantages : qhd-trial-soft-blink (hero), une à la fois ;
   - flèches : glissement de 3 px, 3,5 s ;
   - cartes : apparition décalée à l'entrée dans l'écran (CSS).
   ========================================================================== */

.qhd-trial-benefits {
  --qhd-trial-pink: #f24a67;
  --qhd-trial-pulse-rest: 0 0 7px rgb(242 74 103 / 18%);
  --qhd-trial-pulse-peak: 0 0 14px rgb(242 74 103 / 44%);
  --qhd-trial-steps-gap: 40px;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  inline-size: 100vw;
  max-inline-size: 100vw;
  margin-inline: calc(50% - 50vw);
  padding-block: clamp(1.5rem, 1rem + 1.5vw, 2.5rem) clamp(2rem, 1.25rem + 2vw, 3.5rem); /* 24 → 40 / 32 → 56 px */
  background-color: #06070b;
}

/* Halos du hero, fondus en haut (raccord) et en bas. */
.qhd-trial-benefits::before,
.qhd-trial-form::before,
.qhd-trial-final::before,
.qhd-trial-benefits::after,
.qhd-trial-form::after,
.qhd-trial-final::after {
  -webkit-mask-image: linear-gradient(180deg, transparent 0, transparent 6%, #000 20%, #000 82%, transparent 95%);
  mask-image: linear-gradient(180deg, transparent 0, transparent 6%, #000 20%, #000 82%, transparent 95%);
}

.qhd-trial-benefits__inner {
  width: min(100% - (var(--qhd-gutter) * 2), 1240px);
}

/* --- Avantages ------------------------------------------------------------- */

.qhd-trial-benefits__cards {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 18px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.qhd-trial-benefit {
  display: flex;
  flex-direction: column;
  margin: 0;
  padding: 26px 24px;
  border: 1px solid rgb(30 120 210 / 42%);
  border-radius: 16px;
  background-color: rgb(5 20 34 / 88%);
  transition: transform 0.25s ease, border-color 0.25s ease;
}

.qhd-trial-benefit__icon {
  inline-size: 50px;
  block-size: 50px;
  color: var(--qhd-trial-pink);
  filter: drop-shadow(var(--qhd-trial-pulse-rest));
  animation: qhd-trial-soft-blink 10s ease-in-out 1s infinite;
}

.qhd-trial-benefit:nth-child(2) .qhd-trial-benefit__icon { animation-delay: 3.5s; }
.qhd-trial-benefit:nth-child(3) .qhd-trial-benefit__icon { animation-delay: 6s; }
.qhd-trial-benefit:nth-child(4) .qhd-trial-benefit__icon { animation-delay: 8.5s; }

.qhd-trial-benefit__title {
  margin: 18px 0 0;
  font-family: var(--qhd-font-title);
  font-size: clamp(1.25rem, 1.18rem + 0.25vw, 1.4375rem); /* 20 → 23 px */
  font-weight: 700;
  line-height: 1.25;
  color: #ffffff;
}

.qhd-trial-benefit__text {
  margin: 10px 0 0;
  font-size: clamp(0.9375rem, 0.9rem + 0.15vw, 1.0625rem); /* 15 → 17 px */
  line-height: 1.6;
  color: #c5ccd8;
}

@media (hover: hover) and (min-width: 1025px) {
  .qhd-trial-benefit:hover {
    transform: translateY(-3px);
    border-color: rgb(242 74 103 / 40%);
  }
}

/* --- Étapes : en-tête ------------------------------------------------------ */

.qhd-trial-steps {
  margin-block-start: clamp(3rem, 2.25rem + 2vw, 4.5rem); /* 48 → 72 px */
}

.qhd-trial-steps__eyebrow {
  display: flex;
  align-items: center;
  gap: 16px;
  margin: 0;
  font-size: 0.875rem;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--qhd-trial-pink);
}

.qhd-trial-steps__eyebrow::before {
  content: "";
  flex: 0 0 auto;
  inline-size: 44px;
  block-size: 3px;
  border-radius: 3px;
  background-color: var(--qhd-trial-pink);
}

.qhd-trial-steps__title {
  margin: 12px 0 0;
  font-family: var(--qhd-font-title);
  font-size: clamp(1.875rem, 1.4rem + 1.8vw, 2.875rem); /* 30 → 46 px */
  font-weight: 800;
  line-height: 1.15;
  letter-spacing: -0.03em;
  color: #ffffff;
  text-wrap: balance;
}

.qhd-trial-steps__accent {
  color: var(--qhd-trial-pink);
}

.qhd-trial-steps__intro {
  max-inline-size: 720px;
  margin: 12px 0 0;
  font-size: clamp(1rem, 0.95rem + 0.2vw, 1.125rem); /* 16 → 18 px */
  line-height: 1.6;
  color: #c8cfd9;
}

/* --- Étapes : cartes ------------------------------------------------------- */

.qhd-trial-steps__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--qhd-trial-steps-gap);
  margin: clamp(1.75rem, 1.5rem + 0.8vw, 2.25rem) 0 0;
  padding: 0;
  list-style: none;
}

/* Numéro et icône en haut, puis titre et texte. */
.qhd-trial-step {
  position: relative;
  display: grid;
  grid-template-columns: auto auto minmax(0, 1fr);
  align-items: center;
  align-content: start;
  column-gap: 14px;
  margin: 0;
  padding: 24px 22px;
  border: 1px solid rgb(30 120 210 / 42%);
  border-radius: 14px;
  background-color: rgb(5 20 34 / 90%);
  transition: transform 0.25s ease, border-color 0.25s ease;
}

.qhd-trial-step__number {
  display: grid;
  place-items: center;
  inline-size: 46px;
  block-size: 46px;
  border-radius: 50%;
  background-color: var(--qhd-trial-pink);
  box-shadow: 0 0 16px rgb(242 74 103 / 30%);
  font-family: var(--qhd-font-title);
  font-size: 1.25rem; /* 20 px gras : texte « grand » au sens WCAG */
  font-weight: 800;
  line-height: 1;
  color: #ffffff;
}

.qhd-trial-step__icon {
  inline-size: 42px;
  block-size: 42px;
  color: var(--qhd-trial-pink);
}

.qhd-trial-step__title,
.qhd-trial-step__text {
  grid-column: 1 / -1;
}

.qhd-trial-step__title {
  margin: 18px 0 0;
  font-family: var(--qhd-font-title);
  font-size: clamp(1.1875rem, 1.12rem + 0.25vw, 1.375rem); /* 19 → 22 px */
  font-weight: 700;
  line-height: 1.3;
  color: #ffffff;
}

.qhd-trial-step__text {
  margin: 8px 0 0;
  font-size: clamp(0.9375rem, 0.9rem + 0.15vw, 1.0625rem); /* 15 → 17 px */
  line-height: 1.6;
  color: #c5ccd8;
}

/* Liaison en une colonne : trait vertical discret entre deux étapes. */
.qhd-trial-step + .qhd-trial-step::before {
  content: "";
  position: absolute;
  inset-block-end: calc(100% + 8px);
  inset-inline-start: calc(22px + 22px);
  inline-size: 2px;
  block-size: calc(var(--qhd-trial-steps-gap) - 16px);
  border-radius: 2px;
  background-color: rgb(242 74 103 / 55%);
}

.qhd-trial-step__arrow {
  display: none;
}

@keyframes qhd-trial-arrow-flow {
  0%, 100% { translate: 0 0; opacity: 0.65; }
  50% { translate: 3px 0; opacity: 1; }
}

@media (hover: hover) and (min-width: 1025px) {
  .qhd-trial-step:hover {
    transform: translateY(-3px);
    border-color: rgb(242 74 103 / 40%);
  }
}

/* --- 768 px : avantages 2 × 2 ---------------------------------------------- */

@media (min-width: 768px) {
  .qhd-trial-benefits__cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* --- 1025 px : 4 avantages, 3 étapes reliées par des flèches --------------- */

@media (min-width: 1025px) {
  .qhd-trial-benefits {
    --qhd-trial-steps-gap: 54px;
  }

  .qhd-trial-benefits__cards {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
  }

  .qhd-trial-benefit {
    min-block-size: 220px;
    padding: 28px 26px;
  }

  .qhd-trial-benefit__icon {
    inline-size: 56px;
    block-size: 56px;
  }

  .qhd-trial-steps__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .qhd-trial-step {
    padding: 28px 26px;
  }

  .qhd-trial-step + .qhd-trial-step::before {
    content: none;
  }

  /* Centrée verticalement, dans l'espace qui sépare deux étapes. */
  .qhd-trial-step__arrow {
    display: block;
    position: absolute;
    inset-block-start: 50%;
    inset-inline-start: calc(100% + (var(--qhd-trial-steps-gap) - 30px) / 2);
    inline-size: 30px;
    block-size: 30px;
    margin-block-start: -15px;
    color: var(--qhd-trial-pink);
    filter: drop-shadow(0 0 6px rgb(242 74 103 / 30%));
    animation: qhd-trial-arrow-flow 3.5s ease-in-out infinite;
  }
}

/* --- Apparition à l'entrée dans l'écran ------------------------------------ */

@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    .qhd-trial-benefit,
    .qhd-trial-step {
      animation: qhd-trial-rise linear both;
      animation-timeline: view();
      animation-range: entry 0% entry 50%;
    }

    .qhd-trial-benefit:nth-child(2),
    .qhd-trial-step:nth-child(2) { animation-range: entry 5% entry 55%; }

    .qhd-trial-benefit:nth-child(3),
    .qhd-trial-step:nth-child(3) { animation-range: entry 10% entry 60%; }

    .qhd-trial-benefit:nth-child(4) { animation-range: entry 15% entry 65%; }
  }
}

/* --- Mobile : pulse plus discret ------------------------------------------- */

@media (max-width: 767px) {
  .qhd-trial-benefits {
    --qhd-trial-pulse-rest: 0 0 5px rgb(242 74 103 / 12%);
    --qhd-trial-pulse-peak: 0 0 9px rgb(242 74 103 / 28%);
  }

  .qhd-trial-benefit,
  .qhd-trial-step {
    padding: 22px 20px;
  }

  .qhd-trial-step + .qhd-trial-step::before {
    inset-inline-start: calc(20px + 22px);
  }
}

/* Mouvement réduit : design statique, contenu entièrement visible. */
@media (prefers-reduced-motion: reduce) {
  .qhd-trial-benefit__icon,
  .qhd-trial-step__arrow {
    animation: none;
  }

  .qhd-trial-benefit,
  .qhd-trial-step {
    transition: none;
  }

  .qhd-trial-benefit:hover,
  .qhd-trial-step:hover {
    transform: none;
  }
}

/* ==========================================================================
   Section 03 « formulaire » (sections/test-formulaire.php)
   --------------------------------------------------------------------------
   Panneau formulaire (≈ 62 %) et panneau « Avant de commencer » (≈ 38 %)
   dès 1025 px ; empilés en dessous. Champs deux par ligne dès 768 px.
   Fond : règles partagées avec les sections 01 et 02 (plus haut).
   Le thème parent stylise input / select / textarea / button (bordures,
   couleurs de survol) : sélecteurs à deux classes pour reprendre la main.
   Animations (coupées par prefers-reduced-motion) :
   - bouton d'envoi : lueur « respirante » brève toutes les 10 s ;
   - panneaux puis cartes d'information : apparition à l'entrée dans
     l'écran (CSS, décalée).
   ========================================================================== */

.qhd-trial-form {
  --qhd-trial-pink: #f3277b;
  --qhd-trial-cyan: #19a0ff;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  inline-size: 100vw;
  max-inline-size: 100vw;
  margin-inline: calc(50% - 50vw);
  padding-block: clamp(3rem, 1.75rem + 3vw, 5.25rem) clamp(3.5rem, 2rem + 3.5vw, 6rem); /* 48 → 84 / 56 → 96 px */
  background-color: #06070b;
}

.qhd-trial-form__inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 24px;
  width: min(100% - (var(--qhd-gutter) * 2), 1280px);
}

/* --- Panneau formulaire ---------------------------------------------------- */

.qhd-trial-form__panel {
  min-inline-size: 0;
  padding: 28px 20px;
  border: 1px solid rgb(20 130 255 / 35%);
  border-radius: 20px;
  background-color: rgb(4 16 30 / 88%);
  box-shadow: 0 10px 40px rgb(0 0 0 / 25%);
}

.qhd-trial-form__eyebrow {
  display: flex;
  align-items: center;
  gap: 16px;
  margin: 0;
  font-size: 0.875rem;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--qhd-trial-pink);
}

.qhd-trial-form__eyebrow::before {
  content: "";
  flex: 0 0 auto;
  inline-size: 44px;
  block-size: 3px;
  border-radius: 3px;
  background-color: var(--qhd-trial-pink);
}

.qhd-trial-form__heading {
  margin: 12px 0 0;
  font-family: var(--qhd-font-title);
  font-size: clamp(2rem, 1.45rem + 2vw, 3.25rem); /* 32 → 52 px */
  font-weight: 800;
  line-height: 1.1;
  letter-spacing: -0.03em;
  color: #f8f8fa;
  text-wrap: balance;
}

.qhd-trial-form__intro {
  margin: 14px 0 0;
  font-size: clamp(1.0625rem, 1rem + 0.25vw, 1.25rem); /* 17 → 20 px */
  line-height: 1.55;
  color: #c7d0db;
}

/* Message de statut. */
.qhd-trial-form__status {
  display: grid;
  gap: 6px;
  margin-block-start: 22px;
  padding: 14px 18px;
  border: 1px solid rgb(34 148 255 / 55%);
  border-radius: 12px;
  background-color: rgb(6 27 48 / 85%);
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.5;
  color: #f4f6f9;
}

.qhd-trial-form__status[hidden] {
  display: none;
}

.qhd-trial-form__status p {
  margin: 0;
}

.qhd-trial-form__status--success {
  border-color: rgb(37 211 102 / 65%);
  background-color: rgb(8 40 26 / 70%);
}

.qhd-trial-form__status--error {
  border-color: rgb(243 39 123 / 70%);
  background-color: rgb(60 8 32 / 40%);
}

.qhd-trial-form .qhd-trial-form__status-link {
  color: #ffffff;
  text-decoration: underline;
  text-underline-offset: 0.18em;
}

.qhd-trial-form__status:focus-visible {
  outline: 3px solid var(--qhd-cyan);
  outline-offset: 3px;
}

/* --- Champs ---------------------------------------------------------------- */

.qhd-trial-form__form {
  margin-block-start: clamp(1.75rem, 1.5rem + 0.6vw, 2.125rem); /* 28 → 34 px */
}

.qhd-trial-form__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 18px;
}

.qhd-trial-form__field {
  display: grid;
  gap: 8px;
  margin: 0;
  min-inline-size: 0;
}

.qhd-trial-form__label {
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.3;
  color: #eaf2ff;
}

.qhd-trial-form__required {
  color: var(--qhd-trial-pink);
}

/* Icône discrète à gauche du champ. */
.qhd-trial-form__control {
  position: relative;
  display: block;
}

.qhd-trial-form__field-icon {
  position: absolute;
  inset-block-start: 50%;
  inset-inline-start: 18px;
  z-index: 1;
  inline-size: 20px;
  block-size: 20px;
  margin-block-start: -10px;
  color: #9ab6e5;
  pointer-events: none;
}

.qhd-trial-form__field-icon--top {
  inset-block-start: 28px;
}

.qhd-trial-form .qhd-trial-form__input,
.qhd-trial-form .qhd-trial-form__select,
.qhd-trial-form .qhd-trial-form__textarea {
  inline-size: 100%;
  margin: 0;
  border: 1px solid rgb(24 132 255 / 55%);
  border-radius: 14px;
  background-color: rgb(8 25 44 / 92%);
  font-family: var(--qhd-font-body);
  font-size: 1rem;
  line-height: 1.4;
  color: #eaf2ff;
  box-shadow: none;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.qhd-trial-form .qhd-trial-form__input,
.qhd-trial-form .qhd-trial-form__select {
  block-size: 60px;
  padding: 0 18px 0 50px;
}

.qhd-trial-form .qhd-trial-form__textarea {
  display: block;
  min-block-size: 140px;
  padding: 16px 18px 16px 50px;
  resize: vertical;
}

/* Flèche du menu déroulant, dessinée (même rendu partout). */
.qhd-trial-form .qhd-trial-form__select {
  padding-inline-end: 48px;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23eaf2ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 16px center;
  background-size: 20px 20px;
  cursor: pointer;
}

.qhd-trial-form .qhd-trial-form__select option {
  background-color: #0a1a2e;
  color: #ffffff;
}

.qhd-trial-form .qhd-trial-form__input::placeholder,
.qhd-trial-form .qhd-trial-form__textarea::placeholder {
  color: #8fa2bd;
  opacity: 1;
}

.qhd-trial-form .qhd-trial-form__input:hover,
.qhd-trial-form .qhd-trial-form__select:hover,
.qhd-trial-form .qhd-trial-form__textarea:hover {
  border-color: rgb(40 150 255 / 75%);
}

/* Focus : bordure cyan et anneau net, bien visible. */
.qhd-trial-form .qhd-trial-form__input:focus,
.qhd-trial-form .qhd-trial-form__select:focus,
.qhd-trial-form .qhd-trial-form__textarea:focus {
  border-color: var(--qhd-trial-cyan);
  outline: none;
  box-shadow: 0 0 0 3px rgb(25 160 255 / 35%);
}

.qhd-trial-form .qhd-trial-form__input[aria-invalid="true"],
.qhd-trial-form .qhd-trial-form__select[aria-invalid="true"] {
  border-color: var(--qhd-trial-pink);
}

.qhd-trial-form__error {
  display: block;
  font-size: 0.875rem;
  font-weight: 600;
  line-height: 1.4;
  color: #ff8ab8;
}

.qhd-trial-form__note {
  margin: 16px 0 0;
  font-size: 0.875rem;
  line-height: 1.5;
  color: #9aa6b8;
}

/* Piège à robots : hors écran, jamais visible. */
.qhd-trial-form__trap {
  position: absolute;
  inset-inline-start: -9999px;
  inline-size: 1px;
  block-size: 1px;
  overflow: hidden;
}

/* --- Bouton d'envoi -------------------------------------------------------- */

.qhd-trial-form .qhd-trial-form__submit {
  gap: 14px;
  inline-size: 100%;
  min-block-size: 68px;
  margin: 22px 0 0;
  padding: 10px 24px;
  border: 0;
  border-radius: 999px;
  background-color: #ff006a;
  background-image: linear-gradient(90deg, #ff006a 0%, #ff2d7a 100%);
  color: #ffffff;
  font-size: 1.25rem; /* 20 px, très gras : texte « grand » au sens WCAG */
  font-weight: 800;
  box-shadow: 0 12px 30px rgb(255 0 106 / 22%);
  transition: transform 0.25s ease, filter 0.25s ease;
  animation: qhd-trial-submit-glow 10s ease-in-out 3s infinite;
}

.qhd-trial-form .qhd-trial-form__submit:hover,
.qhd-trial-form .qhd-trial-form__submit:focus {
  background-color: #ff006a;
  color: #ffffff;
  filter: brightness(1.06);
}

.qhd-trial-form .qhd-trial-form__submit:focus-visible {
  outline: 3px solid var(--qhd-cyan);
  outline-offset: 3px;
}

.qhd-trial-form__submit-icon,
.qhd-trial-form__submit-arrow {
  flex: 0 0 auto;
}

.qhd-trial-form__submit-arrow {
  transition: transform var(--qhd-duration) var(--qhd-ease);
}

@media (hover: hover) {
  .qhd-trial-form .qhd-trial-form__submit:hover {
    transform: translateY(-2px);
  }

  .qhd-trial-form .qhd-trial-form__submit:hover .qhd-trial-form__submit-arrow {
    transform: translateX(3px);
  }
}

/* Lueur « respirante » : repos, puis montée et retour doux. */
@keyframes qhd-trial-submit-glow {
  0%, 70%, 100% { box-shadow: 0 12px 30px rgb(255 0 106 / 22%); }
  78% { box-shadow: 0 12px 30px rgb(255 0 106 / 22%), 0 0 24px rgb(255 0 106 / 38%); }
  86% { box-shadow: 0 12px 30px rgb(255 0 106 / 22%); }
}

/* Mention légale. */
.qhd-trial-form__legal {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 16px 0 0;
  font-size: 0.875rem;
  line-height: 1.6;
  color: #b7c3d6;
}

.qhd-trial-form__legal-icon {
  flex: 0 0 auto;
  margin-block-start: 0.15em;
  color: var(--qhd-trial-cyan);
}

.qhd-trial-form .qhd-trial-form__legal-link {
  color: #eaf2ff;
  text-decoration: underline;
  text-underline-offset: 0.18em;
}

.qhd-trial-form .qhd-trial-form__legal-link:focus-visible,
.qhd-trial-form .qhd-trial-form__status-link:focus-visible {
  outline: 3px solid var(--qhd-cyan);
  outline-offset: 2px;
}

/* --- Panneau « Avant de commencer » --------------------------------------- */

.qhd-trial-info {
  align-self: stretch;
  padding: 26px 20px;
  border: 1px solid rgb(20 130 255 / 35%);
  border-radius: 20px;
  background-color: rgb(6 18 34 / 88%);
}

.qhd-trial-info__header {
  display: flex;
  align-items: center;
  gap: 14px;
}

.qhd-trial-info__header-icon {
  flex: 0 0 auto;
  inline-size: 30px;
  block-size: 30px;
  color: #3ec5ff;
  filter: drop-shadow(0 0 8px rgb(62 197 255 / 45%));
}

.qhd-trial-info__title {
  margin: 0;
  font-family: var(--qhd-font-title);
  font-size: clamp(1.75rem, 1.55rem + 0.6vw, 2.125rem); /* 28 → 34 px */
  font-weight: 800;
  line-height: 1.2;
  color: #d7f0ff;
}

.qhd-trial-info__intro {
  margin: 12px 0 0;
  font-size: clamp(1rem, 0.97rem + 0.12vw, 1.0625rem); /* 16 → 17 px */
  line-height: 1.55;
  color: #bdd0e7;
}

.qhd-trial-info__list {
  display: grid;
  gap: 16px;
  margin: 20px 0 0;
  padding: 0;
  list-style: none;
}

.qhd-trial-info__card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  grid-template-rows: auto 1fr;
  column-gap: 16px;
  margin: 0;
  padding: 20px;
  border: 1px solid rgb(16 128 255 / 36%);
  border-radius: 16px;
  background-color: rgb(8 22 40 / 96%);
}

.qhd-trial-info__icon {
  grid-row: 1 / -1;
  inline-size: 40px;
  block-size: 40px;
  color: #ff0a74;
  filter: drop-shadow(0 0 6px rgb(255 10 116 / 25%));
}

.qhd-trial-info__card-title {
  margin: 0;
  font-family: var(--qhd-font-title);
  font-size: 1.0625rem;
  font-weight: 700;
  line-height: 1.3;
  color: #ffffff;
}

.qhd-trial-info__card-text {
  margin: 6px 0 0;
  font-size: 0.9375rem;
  line-height: 1.55;
  color: #bdd0e7;
}

/* --- 768 px : champs deux par ligne ---------------------------------------- */

@media (min-width: 768px) {
  .qhd-trial-form__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px 22px;
  }

  .qhd-trial-form__field--full {
    grid-column: 1 / -1;
  }

  .qhd-trial-form__panel {
    padding: 36px;
  }

  .qhd-trial-info {
    padding: 30px;
  }
}

/* --- 1025 px : 62 / 38 ----------------------------------------------------- */

@media (min-width: 1025px) {
  .qhd-trial-form__inner {
    grid-template-columns: minmax(0, 62fr) minmax(0, 38fr);
    align-items: stretch;
  }

  .qhd-trial-form__panel {
    padding: 40px;
  }
}

/* --- Apparition à l'entrée dans l'écran ------------------------------------ */

@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    .qhd-trial-form__panel,
    .qhd-trial-info {
      animation: qhd-trial-rise-18 linear both;
      animation-timeline: view();
      animation-range: entry 0% entry 35%;
    }

    .qhd-trial-info {
      animation-range: entry 5% entry 40%;
    }

    .qhd-trial-info__card {
      animation: qhd-trial-rise-18 linear both;
      animation-timeline: view();
      animation-range: entry 0% entry 60%;
    }

    .qhd-trial-info__card:nth-child(2) { animation-range: entry 6% entry 66%; }
    .qhd-trial-info__card:nth-child(3) { animation-range: entry 12% entry 72%; }
    .qhd-trial-info__card:nth-child(4) { animation-range: entry 18% entry 78%; }
  }
}

@keyframes qhd-trial-rise-18 {
  from { opacity: 0; translate: 0 18px; }
  to { opacity: 1; translate: 0 0; }
}

/* --- Mobile ---------------------------------------------------------------- */

@media (max-width: 767px) {
  .qhd-trial-form .qhd-trial-form__submit {
    gap: 10px;
    padding-inline: 16px;
    font-size: 1.1875rem;
  }

  .qhd-trial-info__card {
    padding: 18px 16px;
  }
}

@media (max-width: 419px) {
  .qhd-trial-form__submit-arrow {
    display: none;
  }
}

/* Mouvement réduit : design statique, contenu entièrement visible. */
@media (prefers-reduced-motion: reduce) {
  .qhd-trial-form .qhd-trial-form__submit {
    animation: none;
  }

  .qhd-trial-form .qhd-trial-form__submit,
  .qhd-trial-form__submit-arrow {
    transition: none;
  }

  .qhd-trial-form .qhd-trial-form__submit:hover,
  .qhd-trial-form .qhd-trial-form__submit:hover .qhd-trial-form__submit-arrow {
    transform: none;
  }
}

/* ==========================================================================
   Section 04 « après votre essai » (sections/test-final.php)
   --------------------------------------------------------------------------
   Texte à gauche et deux boutons à droite dès 1025 px (empilés en
   dessous), filet, puis trois repères de confiance (1 colonne, 3 séparées
   par un filet vertical dès 768 px).
   Fond : règles partagées avec les sections 01 à 03 (plus haut).
   Animations (coupées par prefers-reduced-motion) :
   - bouton principal : lueur brève toutes les 10 s ;
   - icônes des repères : qhd-trial-soft-blink (hero), une à la fois ;
   - bloc principal, boutons puis repères : apparition à l'entrée dans
     l'écran (CSS, décalée).
   ========================================================================== */

.qhd-trial-final {
  --qhd-trial-pink: #f24a67;
  --qhd-trial-pulse-rest: 0 0 6px rgb(242 74 103 / 16%);
  --qhd-trial-pulse-peak: 0 0 13px rgb(242 74 103 / 44%);
  position: relative;
  isolation: isolate;
  overflow: hidden;
  inline-size: 100vw;
  max-inline-size: 100vw;
  margin-inline: calc(50% - 50vw);
  padding-block: clamp(3rem, 1.75rem + 3vw, 5.25rem) clamp(3.5rem, 2rem + 3.5vw, 5.5rem); /* 48 → 84 / 56 → 88 px */
  background-color: #06070b;
}

.qhd-trial-final__inner {
  width: min(100% - (var(--qhd-gutter) * 2), 1240px);
}

/* --- Bloc principal -------------------------------------------------------- */

.qhd-trial-final__top {
  display: flex;
  flex-direction: column;
  gap: 28px;
}

.qhd-trial-final__content {
  min-inline-size: 0;
}

.qhd-trial-final__label {
  display: flex;
  align-items: center;
  gap: 16px;
  margin: 0;
  font-size: 0.875rem;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--qhd-trial-pink);
}

.qhd-trial-final__label::before {
  content: "";
  flex: 0 0 auto;
  inline-size: 44px;
  block-size: 3px;
  border-radius: 3px;
  background-color: var(--qhd-trial-pink);
}

.qhd-trial-final__title {
  margin: 12px 0 0;
  font-family: var(--qhd-font-title);
  font-size: clamp(1.875rem, 1.4rem + 1.9vw, 3rem); /* 30 → 48 px */
  font-weight: 800;
  line-height: 1.15;
  letter-spacing: -0.03em;
  color: #ffffff;
  text-wrap: balance;
}

.qhd-trial-final__accent {
  color: var(--qhd-trial-pink);
}

.qhd-trial-final__description {
  max-inline-size: 650px;
  margin: 16px 0 0;
  font-size: clamp(1.0625rem, 1rem + 0.25vw, 1.1875rem); /* 17 → 19 px */
  line-height: 1.6;
  color: #c8d2e0;
}

/* --- Boutons --------------------------------------------------------------- */

.qhd-trial-final__actions {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.qhd-trial-final__cta {
  gap: 12px;
  inline-size: 100%;
  min-block-size: 56px;
  padding: 10px 38px;
  font-size: 1.1875rem; /* 19 px gras : texte « grand » au sens WCAG */
  font-weight: 700;
  white-space: nowrap;
  transition: transform 0.25s ease, border-color 0.25s ease, color 0.25s ease, box-shadow 0.25s ease;
}

.qhd-trial-final__cta-arrow {
  flex: 0 0 auto;
  transition: transform var(--qhd-duration) var(--qhd-ease);
}

/* Le thème parent souligne et colore les liens du contenu. */
.qhd-trial-final a.qhd-trial-final__cta {
  text-decoration: none;
}

.qhd-trial-final a.qhd-trial-final__cta--primary {
  border: 0;
  background-image: linear-gradient(90deg, #e92376, #ff3d67);
  color: #ffffff;
  box-shadow: 0 12px 30px rgb(242 74 103 / 24%);
  animation: qhd-trial-final-pulse 10s ease-in-out 3s infinite;
}

.qhd-trial-final a.qhd-trial-final__cta--secondary {
  border: 1px solid rgb(25 150 255 / 85%);
  background-color: transparent;
  color: #159bff;
}

.qhd-trial-final .qhd-trial-final__cta:focus-visible {
  outline: 3px solid var(--qhd-cyan);
  outline-offset: 3px;
}

@media (hover: hover) {
  .qhd-trial-final a.qhd-trial-final__cta:hover {
    transform: translateY(-2px);
  }

  .qhd-trial-final a.qhd-trial-final__cta--primary:hover {
    color: #ffffff;
    box-shadow: 0 0 25px rgb(242 30 105 / 25%);
  }

  .qhd-trial-final a.qhd-trial-final__cta--primary:hover .qhd-trial-final__cta-arrow {
    transform: translateX(3px);
  }

  .qhd-trial-final a.qhd-trial-final__cta--secondary:hover {
    border-color: var(--qhd-trial-pink);
    color: #ffffff;
  }
}

@keyframes qhd-trial-final-pulse {
  0%, 78%, 100% { box-shadow: 0 12px 30px rgb(242 74 103 / 24%); }
  81% { box-shadow: 0 12px 30px rgb(242 74 103 / 24%), 0 0 24px rgb(242 74 103 / 40%); }
  84% { box-shadow: 0 12px 30px rgb(242 74 103 / 24%); }
}

/* --- Repères de confiance -------------------------------------------------- */

.qhd-trial-final__trust {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 22px;
  margin: 45px 0 0;
  padding: 35px 0 0;
  border-block-start: 1px solid rgb(30 120 210 / 25%);
  list-style: none;
}

/* Icône à gauche, titre et texte à droite. */
.qhd-trial-final__trust-item {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  grid-template-rows: auto 1fr;
  align-items: center;
  column-gap: 20px;
  margin: 0;
}

.qhd-trial-final__trust-icon {
  grid-row: 1 / -1;
  inline-size: 48px;
  block-size: 48px;
  color: var(--qhd-trial-pink);
  filter: drop-shadow(var(--qhd-trial-pulse-rest));
  animation: qhd-trial-soft-blink 10s ease-in-out 1.5s infinite;
  transition: filter 0.25s ease;
}

.qhd-trial-final__trust-item:nth-child(2) .qhd-trial-final__trust-icon { animation-delay: 4.8s; }
.qhd-trial-final__trust-item:nth-child(3) .qhd-trial-final__trust-icon { animation-delay: 8.1s; }

@media (hover: hover) {
  .qhd-trial-final__trust-item:hover .qhd-trial-final__trust-icon {
    animation-play-state: paused;
    filter: drop-shadow(0 0 12px rgb(242 74 103 / 45%));
  }
}

.qhd-trial-final__trust-title {
  align-self: end;
  margin: 0;
  font-family: var(--qhd-font-title);
  font-size: clamp(1.125rem, 1.08rem + 0.2vw, 1.25rem); /* 18 → 20 px */
  font-weight: 700;
  line-height: 1.3;
  color: #ffffff;
}

.qhd-trial-final__trust-text {
  align-self: start;
  margin: 6px 0 0;
  font-size: clamp(0.9375rem, 0.92rem + 0.1vw, 1rem); /* 15 → 16 px */
  line-height: 1.5;
  color: #bfc9d8;
}

/* --- 600 px : boutons côte à côte ------------------------------------------ */

@media (min-width: 600px) {
  .qhd-trial-final__actions {
    flex-direction: row;
    flex-wrap: wrap;
  }

  .qhd-trial-final__cta {
    inline-size: auto;
  }
}

/* --- 768 px : repères sur trois colonnes, séparés -------------------------- */

@media (min-width: 768px) {
  .qhd-trial-final__trust {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0;
  }

  .qhd-trial-final__trust-item {
    padding-inline: 20px;
  }

  .qhd-trial-final__trust-item:first-child {
    padding-inline-start: 0;
  }

  .qhd-trial-final__trust-item + .qhd-trial-final__trust-item {
    border-inline-start: 1px solid rgb(30 120 210 / 25%);
  }
}

/* Repères plus étroits sur tablette : icône au-dessus du texte. */
@media (min-width: 768px) and (max-width: 1024px) {
  .qhd-trial-final__trust-item {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: none;
  }

  .qhd-trial-final__trust-icon {
    grid-row: auto;
    margin-block-end: 12px;
  }
}

/* --- 1025 px : texte et boutons sur une ligne ------------------------------ */

@media (min-width: 1025px) {
  .qhd-trial-final__top {
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    gap: 40px;
  }

  .qhd-trial-final__actions {
    flex: 0 0 auto;
    flex-wrap: nowrap;
  }

  .qhd-trial-final__trust-item {
    padding-inline: 32px;
  }

  .qhd-trial-final__trust-icon {
    inline-size: 54px;
    block-size: 54px;
  }
}

/* --- Apparition à l'entrée dans l'écran ------------------------------------ */

@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    .qhd-trial-final__content {
      animation: qhd-trial-final-rise linear both;
      animation-timeline: view();
      animation-range: entry 0% entry 45%;
    }

    .qhd-trial-final__actions {
      animation: qhd-trial-final-rise linear both;
      animation-timeline: view();
      animation-range: entry 8% entry 55%;
    }

    .qhd-trial-final__trust-item {
      animation: qhd-trial-rise linear both;
      animation-timeline: view();
      animation-range: entry 5% entry 55%;
    }

    .qhd-trial-final__trust-item:nth-child(2) { animation-range: entry 10% entry 60%; }
    .qhd-trial-final__trust-item:nth-child(3) { animation-range: entry 15% entry 65%; }
  }
}

@keyframes qhd-trial-final-rise {
  from { opacity: 0; translate: 0 20px; }
  to { opacity: 1; translate: 0 0; }
}

/* --- Mobile ---------------------------------------------------------------- */

@media (max-width: 767px) {
  .qhd-trial-final {
    --qhd-trial-pulse-rest: 0 0 5px rgb(242 74 103 / 12%);
    --qhd-trial-pulse-peak: 0 0 9px rgb(242 74 103 / 28%);
  }

  .qhd-trial-final__cta {
    padding-inline: 20px;
  }
}

/* Mouvement réduit : design statique, contenu entièrement visible. */
@media (prefers-reduced-motion: reduce) {
  .qhd-trial-final a.qhd-trial-final__cta--primary,
  .qhd-trial-final__trust-icon {
    animation: none;
  }

  .qhd-trial-final__cta,
  .qhd-trial-final__cta-arrow,
  .qhd-trial-final__trust-icon {
    transition: none;
  }

  .qhd-trial-final a.qhd-trial-final__cta:hover,
  .qhd-trial-final a.qhd-trial-final__cta--primary:hover .qhd-trial-final__cta-arrow {
    transform: none;
  }
}

/* ==========================================================================
   Section 05 « questions fréquentes » (sections/test-faq.php)
   --------------------------------------------------------------------------
   Label, H2 et introduction centrés, puis accordéons natifs <details> sur
   une colonne (820 px max). Question dans <summary>, signe « + » qui pivote
   en « × » à l'ouverture. Fond uni, sans halo ni animation d'arrière-plan.
   ========================================================================== */

.qhd-trial-faq {
  --qhd-trial-pink: #f24a67;
  --qhd-trial-blue: #2294ff;
  position: relative;
  inline-size: 100vw;
  max-inline-size: 100vw;
  margin-inline: calc(50% - 50vw);
  padding-block: clamp(3rem, 1.75rem + 3vw, 5rem) clamp(3.5rem, 2rem + 3.5vw, 5.5rem); /* 48 → 80 / 56 → 88 px */
  background-color: #06070b;
  border-block-start: 1px solid rgb(34 148 255 / 14%);
}

.qhd-trial-faq__inner {
  width: min(100% - (var(--qhd-gutter) * 2), 820px);
}

.qhd-trial-faq__header {
  text-align: center;
}

.qhd-trial-faq__label {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  margin: 0;
  font-size: 0.875rem;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--qhd-trial-pink);
}

.qhd-trial-faq__label::before,
.qhd-trial-faq__label::after {
  content: "";
  inline-size: 32px;
  block-size: 3px;
  border-radius: 3px;
  background-color: var(--qhd-trial-pink);
}

.qhd-trial-faq__title {
  margin: 12px 0 0;
  font-family: var(--qhd-font-title);
  font-size: clamp(1.875rem, 1.4rem + 1.9vw, 3rem); /* 30 → 48 px */
  font-weight: 800;
  line-height: 1.15;
  letter-spacing: -0.03em;
  text-wrap: balance;
  color: #ffffff;
}

.qhd-trial-faq__accent {
  color: var(--qhd-trial-pink);
}

.qhd-trial-faq__intro {
  max-inline-size: 620px;
  margin: 16px auto 0;
  font-size: clamp(1.0625rem, 1rem + 0.25vw, 1.1875rem); /* 17 → 19 px */
  line-height: 1.6;
  color: #c8d2e0;
}

.qhd-trial-faq__list {
  display: grid;
  gap: 12px;
  margin-block-start: clamp(28px, 1.25rem + 1.5vw, 40px);
}

.qhd-trial-faq__item {
  border: 1px solid rgb(34 148 255 / 26%);
  border-radius: 16px;
  background-color: rgb(12 18 32 / 85%);
  transition: border-color 0.25s ease, box-shadow 0.25s ease;
}

.qhd-trial-faq__item[open] {
  border-color: rgb(242 74 103 / 55%);
  box-shadow: 0 0 0 1px rgb(242 74 103 / 18%), 0 16px 40px rgb(0 0 0 / 30%);
}

.qhd-trial-faq .qhd-trial-faq__question {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-block-size: 60px;
  padding: 16px 20px;
  border-radius: 16px;
  font-family: var(--qhd-font-title);
  font-size: clamp(1rem, 0.96rem + 0.2vw, 1.125rem); /* 16 → 18 px */
  font-weight: 700;
  line-height: 1.4;
  color: #ffffff;
  list-style: none;
  cursor: pointer;
}

/* Marqueur natif retiré : le signe « + » le remplace. */
.qhd-trial-faq__question::-webkit-details-marker {
  display: none;
}

.qhd-trial-faq .qhd-trial-faq__question:hover {
  color: #ffffff;
  background-color: rgb(34 148 255 / 8%);
}

.qhd-trial-faq .qhd-trial-faq__question:focus-visible {
  outline: 3px solid var(--qhd-cyan);
  outline-offset: 2px;
}

.qhd-trial-faq__question > span {
  min-inline-size: 0;
  overflow-wrap: anywhere;
}

.qhd-trial-faq__icon {
  flex: 0 0 auto;
  inline-size: 34px;
  block-size: 34px;
  padding: 6px;
  border: 1px solid rgb(34 148 255 / 40%);
  border-radius: 50%;
  color: var(--qhd-trial-blue);
  transition: transform 0.25s ease, color 0.25s ease, border-color 0.25s ease;
}

.qhd-trial-faq__item[open] .qhd-trial-faq__icon {
  transform: rotate(45deg);
  border-color: rgb(242 74 103 / 55%);
  color: var(--qhd-trial-pink);
}

.qhd-trial-faq__answer {
  padding: 0 20px 18px;
}

.qhd-trial-faq__answer p {
  margin: 0;
  font-size: 1rem;
  line-height: 1.7;
  color: #c8d2e0;
}

.qhd-trial-faq__answer p + p {
  margin-block-start: 10px;
}

.qhd-trial-faq .qhd-trial-faq__link,
.qhd-trial-faq .qhd-trial-faq__link:visited {
  color: #7cc4ff;
  text-decoration: underline;
  text-underline-offset: 0.18em;
}

.qhd-trial-faq .qhd-trial-faq__link:hover {
  color: #ffffff;
}

.qhd-trial-faq .qhd-trial-faq__link:focus-visible {
  outline: 3px solid var(--qhd-cyan);
  outline-offset: 2px;
  border-radius: 2px;
}

@media (prefers-reduced-motion: reduce) {
  .qhd-trial-faq__item,
  .qhd-trial-faq__icon {
    transition: none;
  }
}