/* 8 — Retours à la ligne équilibrés (pas de mot seul en fin de titre) */
main h1, main h2, main h3, main .h1, main .h2, main .h3,
main .fqt, main .founder-testimonial__quote { text-wrap: balance; }
main p, main li { text-wrap: pretty; }

/* 6 — Casse et taille des titres pilotées par le CSS */
main p.h1 { text-transform: none; }                                  /* « Beyond the competition » */
[id$="__related_products"] .h2 { text-transform: none; }               /* « You may also like » */

@media (max-width: 699.98px) {
  /* 2 — Marge latérale mobile uniforme à 24 px (dégage l'onglet Free Skin Scan) */
  :root { --container-gutter: 1.5rem; }
  .shopify-section .fch.fch, .shopify-section .fcp.fcp, .shopify-section .fqt.fqt,
  .shopify-section .ffs__inner.ffs__inner, .shopify-section .fsr__inner.fsr__inner,
  .shopify-section .fcm__main.fcm__main, .shopify-section .fst__head.fst__head,
  .shopify-section .fug__ctawrap.fug__ctawrap { padding-left: 24px; padding-right: 24px; }
  .shopify-section .fbc.is-live .fbc__copy.fbc__copy { left: 24px; right: 24px; }

  /* 2 — Onglet Free Skin Scan masqué sur la fiche produit (la pastille d'achat occupe déjà ce rôle) */
  body:has(.product-marketing-title) .fs-scan-tab { display: none; }
  /* 2 — Ailleurs : l'onglet se replie au bord quand on descend (ne recouvre plus le texte), revient quand on remonte */
  .fs-scan-tab {
    transition: background-color .18s cubic-bezier(.2,.7,.2,1), color .18s cubic-bezier(.2,.7,.2,1),
      border-color .18s cubic-bezier(.2,.7,.2,1), box-shadow .18s cubic-bezier(.2,.7,.2,1),
      translate .4s cubic-bezier(.2,.7,.2,1), opacity .4s cubic-bezier(.2,.7,.2,1);
  }
  html.fx-scan-tuck .fs-scan-tab { translate: -14px 0; opacity: .55; }

  /* 3 — Titre de la fiche produit */
  .product-marketing-title .h1-line1 { font-size: 28px; line-height: 1.1; }
  .product-marketing-title .hero-title .h1-line2 {
    display: block; margin-top: 8px; font-size: 15px; line-height: 1.4;
    text-transform: none; letter-spacing: 0; font-weight: 500;
  }
  .product-marketing-title h1 br { display: none; }
  /* 3 — Fil d'Ariane : règles déplacées dans snippets/breadcrumbs.liquid (V25, une seule ligne sur tous les écrans) */

  /* 6 — Titres trop petits */
  .shopify-section .ffs__title.ffs__title { font-size: 30px; line-height: 1.15; }
  .shopify-section[id$="__related_products"] .h2 { font-size: 28px; }

  /* 7 — Blocs de plus de 3 lignes : alignés à gauche en mobile */
  .fqt, .fqt * { text-align: left; }
  [id$="__rich_text_tgPD3W"] .prose, [id$="__rich_text_tgPD3W"] .prose * { text-align: left; }
  [class*="before-after-title-"], [class*="before-after-text-"] { text-align: left; }
  .founder-testimonial__content, .founder-testimonial__quote, .founder-testimonial__text { text-align: left; }
}

@media (min-width: 700px) {
  /* 3 — Titre de la fiche produit, tablette et ordinateur */
  .product-marketing-title .h1-line1 { font-size: clamp(32px, 2.6vw, 38px); line-height: 1.1; }
  .product-marketing-title .hero-title .h1-line2 {
    display: block; margin-top: 8px; font-size: 16px; line-height: 1.4;
    text-transform: none; letter-spacing: 0; font-weight: 500;
  }
  .product-marketing-title h1 br { display: none; }
}
@media (prefers-reduced-motion: reduce) { .fs-scan-tab { transition: none; } }
/* Audit mobile du 24 oct. 2026 (soir) — CSS seulement. Retour arrière = retirer ce bloc. */
/* Carrousels : la 1re carte ne colle plus au bord gauche (marge de défilement = marge intérieure) */
.fcs__three { scroll-padding-inline: 16px; }
.fcm__swipe { scroll-padding-inline: 20px; }
/* Pont : la pastille centrale ne recouvre plus « Wellness » ni « Skincare » aux extrémités de l'axe */
.fbc.is-live .fbc__pill { left: clamp(62px, calc(var(--p, 0) * 100%), calc(100% - 62px)); }
@media (max-width: 749px) {
  /* En-tête : le logo ne touche plus le drapeau du sélecteur de pays */
  .header__logo-image { width: 124px !important; max-width: 124px !important; height: auto !important; }
  .fbc.is-live .fbc__pill { left: clamp(46px, calc(var(--p, 0) * 100%), calc(100% - 46px)); }
  /* Pont, intro : texte sous la vidéo (plus de chevauchement ni de grand vide noir en bas) */
  .fbc.is-live .fbc__blk--intro { top: 0; bottom: auto; transform: translateY(16px); }
  .fbc.is-live .fbc__blk--intro.is-on { transform: none; }
}
/* ===== V19 (25 oct. 2026, GO Ritchie) — 2e passe mise en page ===== */

/* 4 — Cartes Beta Testers : photo en haut (visage visible), texte en dessous sur fond noir, plus de texte sur les visages */
.shopify-section [class^="ai-marquee-track-"] > [class^="ai-card-"] {
  height: auto; display: flex; flex-direction: column; background: #010101;
}
.shopify-section [class^="ai-marquee-track-"] > [class^="ai-card-"] > img {
  flex: none; width: 100%; height: 170px; object-fit: cover; object-position: center 12%;
}
.shopify-section [class^="ai-marquee-track-"] > [class^="ai-card-"] > [class^="ai-card-shadow-"] { display: none; }
.shopify-section [class^="ai-marquee-track-"] > [class^="ai-card-"] > [class^="ai-card-content-"] {
  position: static; height: auto; flex: 1;
}

/* 5 — Fiches bundles : titre « … essentials. One ritual. » en casse normale (le réglage global du thème le forçait en majuscules) */
.shopify-section[id$="__rich_text_LhCKwz"] .h2 { text-transform: none; }

/* 9 — Tuiles de confiance du pied de page : 2 x 2 sur mobile au lieu de 4 colonnes écrasées */
@media (max-width: 699.98px) {
  :is(#shopify-section-ft2-scope, .shopify-section--footer) .ft2__trust.ft2__trust { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 12px; }
}

/* 10 — Hero de l'accueil en tablette 600-768 px (iPad portrait) : titre 40 px, bouton 420 px max (au lieu de 30 px et pleine largeur) */
@media (min-width: 600px) and (max-width: 768px) {
  [id*="ss_hero_26"] [class^="hero-content-"] > [class^="hero-heading-"] h1 { font-size: 40px !important; line-height: 1.1 !important; }
  [id*="ss_hero_26"] [class^="hero-content-"] > a[class^="hero-button-"] { max-width: 420px !important; }
}

/* 3 — Hero de l'accueil en ordinateur : voile plus dense derrière le texte (lisibilité sur la main et l'appareil blancs) */
@media (min-width: 1024px) {
  [id*="ss_hero_26"] [class^="hero-bg-"]::after {
    background:
      linear-gradient(90deg, rgba(1,1,1,.80) 0%, rgba(1,1,1,.62) 32%, rgba(1,1,1,.30) 56%, rgba(1,1,1,0) 74%),
      linear-gradient(0deg, rgba(1,1,1,.55) 0%, rgba(1,1,1,0) 38%) !important;
  }
  [id*="ss_hero_26"] [class^="hero-content-"] { text-shadow: 0 2px 18px rgba(0,0,0,.45); max-width: min(520px, 38vw) !important; }
}

/* V20 (25 oct. 2026, GO Ritchie) — Espacements mobiles homogènes : 56 px en haut et en bas de chaque bande à fond propre.
   Avant : citation 40, presse 48, ensembles 64, témoignages 64/40 (Compare et Stats étaient déjà à 56). Mobile seulement. Retour arrière = retirer ce bloc. */
@media (max-width: 699.98px) {
  .shopify-section .fqt.fqt,
  .shopify-section .fpq.fpq,
  .shopify-section .fst.fst,
  .shopify-section .fcm__main.fcm__main { padding-top: 56px; padding-bottom: 56px; }
}

/* V25 (26 oct. 2026, GO Ritchie) — Fiches produit : la lueur bleue animée de la section produit (::before, top:-10 %)
   débordait d'environ 130 px vers le haut et teintait en violet le fil d'Ariane. Coupée aux bords de la section, effet intact
   à l'intérieur. overflow-y:clip (et non hidden) : les éléments sticky de la fiche continuent de fonctionner (vérifié). */
.shopify-section[id$="__main"]:has(.product-info) > .color-scheme { overflow-y: clip; }

/* V25 (26 oct. 2026, GO Ritchie) — FAQ : le bloc « Tous les avis » de Klaviyo arrive tard (39-555 px puis 1 700-2 090 px)
   et poussait le bas de page (badges, pied de page) : decalage mesure jusqu'a 1,0. Place reservee a ~95 % de la hauteur finale
   mesuree le 26 oct. (telephone ~2 060, tablette ~1 920, ordinateur ~1 700 px). Si le nombre d'avis change beaucoup, ajuster ces 3 valeurs.
   Retour arriere : retirer ce bloc. */
[id*="klaviyo_reviews_all_reviews"] { min-height: 1950px; }
@media (min-width: 700px) { [id*="klaviyo_reviews_all_reviews"] { min-height: 1820px; } }
@media (min-width: 1024px) { [id*="klaviyo_reviews_all_reviews"] { min-height: 1620px; } }

/* V25 (26 oct. 2026, GO Ritchie) — Fiche Harmony : photos Avant/Apres sans dimensions -> la section passait de 406 a 628 px
   au chargement des photos (decalage de page mesure 0,12-0,16 en mobile). Place reservee au format exact des 2 photos
   (1282 x 968), aucun recadrage. Si les photos changent de format, mettre le nouveau ratio ici. Retour arriere : retirer ce bloc. */
[id$="__ss_before_after_5_pjfae7"] [class^="before-after-image-relative-"] { aspect-ratio: 1282 / 968; }

/* V26 (27 oct. 2026, GO Ritchie) — Survol des onglets, pastilles et liens qui n'avaient aucun retour visuel (souris seulement ;
   l'etat actif et le tactile sont inchanges). Couleurs tirees de la couleur du texte : marche sur fond clair et fond sombre.
   Fiche Harmony (onglets Steam/Cold/Aroma, onglets video, miniatures), How it works et accueil (etapes), The Science (pastilles,
   boutons Shop Harmony du bas et Full specifications), Shop all (lignes « Par ou commencer » : la fleche glisse). Retour arriere : retirer ce bloc. */
@media (hover: hover) and (pointer: fine) {
  .fxrt__tab:not([aria-current="true"]):hover { opacity: 1; background-color: color-mix(in srgb, currentColor 8%, transparent); }
  .fxt__tab:not(.is-on):hover { color: rgba(250,250,250,.72); }
  .product-gallery__thumbnail:not([aria-current="true"]):hover { border-color: color-mix(in srgb, currentColor 50%, transparent); }
  .ffs__step:not([aria-current="true"]):hover { border-color: currentColor; }
  .fex__pill[aria-expanded="false"]:hover { border-color: #8e8e8b; color: #fafafa; }
  /* V30 : survol des boutons Shop Harmony / Full specifications retire ici, remplace par snippets/fx-buttons (systeme commun). */
  .fcs__row > i { display: inline-block; transition: transform .25s cubic-bezier(.2,.7,.2,1); }
  .fcs__row:hover > i { transform: translateX(4px); }
}
@media (prefers-reduced-motion: reduce) { .fcs__row:hover > i { transform: none; } }

/* V31c (27 oct. 2026, GO Ritchie, point 16) : bloc V30 des places reservees (prix, etoiles, Sezzle, preuve sociale) retire ici :
   copie exacte du bloc 5 de snippets/frosteam-head-cls, rendu dans le <head> sur toutes les pages (valeurs mesurees identiques). */