/** Shopify CDN: Minification failed

Line 335:0 Unexpected "}"

**/
/* Créateur de routine — styles (téléphone d'abord).
 * Toutes les règles sont préfixées .ry- pour ne pas toucher au reste du thème.
 * Charte du site (13/10/2026, relevée dans le thème 206406123845) : tout passe par les variables --ry-*,
 * pour suivre plus tard les réglages du thème où le créateur sera installé. Accent et couleur de choix :
 * réglages de la section ; police des titres : réglage de la section (Funnel Display par défaut). */

.ry-racine {
  /* Palette du site uniquement (précision de la direction du 13/10/2026) : aucune autre couleur. */
  --ry-encre: #636C79;            /* titres */
  --ry-corps: #5C5F68;            /* textes */
  --ry-encre-douce: #73757C;      /* textes secondaires */
  --ry-fond: #FFFFFF;             /* surfaces */
  --ry-fond-doux: #e8f6f6;        /* teinte dérivée de l'accent */
  --ry-ligne: #D4D4D4;            /* filets */
  --ry-accent: #22B1B4;
  --ry-accent-fonce: #1E8A8D;
  --ry-accent-texte: #FFFFFF;
  --ry-violet: #562894;           /* fin du dégradé accent */
  --ry-degrade: linear-gradient(150deg, #23AFB3, #562894);
  --ry-matin: #e8f6f6;
  --ry-soir: #f0ebf6;
  --ry-choisi: #e8f6f6;
  --ry-alerte-fond: #FFFFFF;
  --ry-alerte-ligne: #562894;
  --ry-danger: #562894;
  --ry-rayon: 10px;               /* coins 8 px × 1,25 pour les cartes */
  --ry-rayon-petit: 8px;
  --ry-coin-signature: 8px 8px 8px 0;
  --ry-titres: "Funnel Display", system-ui, -apple-system, "Segoe UI", sans-serif;
  --ry-texte: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --ry-ombre: none;

  color: var(--ry-corps);
  background: var(--ry-fond);
  font-family: var(--ry-texte);
  font-size: 16px;
  line-height: 1.5;
}

.ry-racine *, .ry-racine *::before, .ry-racine *::after { box-sizing: border-box; }
.ry-app { max-width: 760px; margin: 0 auto; padding: 0 16px 48px; }
.ry-sans-js { padding: 24px 16px; text-align: center; }

/* Progression */
.ry-progression { position: sticky; top: 0; z-index: 2; height: 4px; margin: 0 -16px 24px;
  background: var(--ry-fond-doux); }
.ry-progression span { display: block; height: 100%; background: var(--ry-accent); transition: width .3s ease; }

/* Titres et textes */
.ry-entete { margin-bottom: 20px; }
.ry-surtitre { margin: 0 0 6px; font-size: 13px; letter-spacing: .08em; text-transform: uppercase; color: var(--ry-encre-douce); }
.ry-titre { margin: 0 0 8px; font-size: 24px; line-height: 1.25; font-weight: 600; outline: none; }
.ry-titre--grand { font-size: 28px; }
.ry-sous-titre { margin: 24px 0 10px; font-size: 18px; font-weight: 600; }
.ry-aide { margin: 0 0 12px; color: var(--ry-encre-douce); }
.ry-aide--petite { font-size: 14px; }
.ry-encadre { margin: 20px 0; padding: 14px 16px; border-radius: var(--ry-rayon); background: var(--ry-fond-doux); font-size: 15px; }
.ry-alerte { margin: 16px 0; padding: 14px 16px; border-left: 4px solid var(--ry-alerte-ligne);
  border-radius: 6px; background: var(--ry-alerte-fond); }
.ry-chargement { padding: 48px 0; text-align: center; color: var(--ry-encre-douce); }

/* Accueil */
.ry-accueil { padding-top: 8px; }
.ry-accueil__points { margin: 20px 0; padding: 0; list-style: none; }
.ry-accueil__points li { display: flex; gap: 10px; margin: 10px 0; }
.ry-coche-petite { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px;
  border-radius: 50%; font-size: 13px; background: var(--ry-accent); color: var(--ry-accent-texte); }

/* Boutons */
.ry-bouton { display: inline-flex; align-items: center; justify-content: center; min-height: 48px;
  padding: 12px 22px; border: 2px solid var(--ry-accent); border-radius: 999px; font: inherit;
  font-weight: 600; text-decoration: none; cursor: pointer; transition: background .15s, color .15s; }
.ry-bouton--principal { background: var(--ry-accent); color: var(--ry-accent-texte); }
.ry-bouton--principal:hover { opacity: .9; }
.ry-bouton--secondaire { background: transparent; color: var(--ry-accent); }
.ry-bouton--discret { border-color: transparent; background: transparent; color: var(--ry-encre-douce); padding-left: 0; }
.ry-bouton--large { width: 100%; }
.ry-bouton:disabled { opacity: .4; cursor: not-allowed; }
.ry-bouton:focus-visible, .ry-option:focus-visible, .ry-puce:focus-visible, .ry-lien:focus-visible,
.ry-case:focus-within { outline: 3px solid var(--ry-alerte-ligne); outline-offset: 2px; }
.ry-lien { display: block; margin: 16px auto 0; padding: 8px; border: 0; background: none; font: inherit;
  color: var(--ry-encre); text-decoration: underline; cursor: pointer; }
.ry-lien--plus { margin: 4px 0 0 auto; font-size: 15px; text-decoration: none; font-weight: 600; }
.ry-lien--plus:hover { text-decoration: underline; }
.ry-lien--petit { display: inline; margin: 0; padding: 4px; font-size: 14px; }

.ry-pied { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 28px; }
.ry-pied--seul { justify-content: center; }
.ry-pied .ry-bouton--principal { flex: 0 1 auto; }

/* Options à choix unique : grandes cases contrastées */
.ry-options { display: grid; gap: 10px; }
.ry-options--ligne { grid-template-columns: repeat(3, 1fr); }
.ry-options--grille { grid-template-columns: repeat(2, 1fr); }
.ry-option { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; width: 100%;
  min-height: 56px; padding: 14px 16px; border: 2px solid var(--ry-ligne); border-radius: var(--ry-rayon);
  background: var(--ry-fond); color: var(--ry-encre); font: inherit; text-align: left; cursor: pointer; }
@media (hover: hover) { .ry-option:hover { border-color: var(--ry-encre); } }
.ry-option.est-choisi { border-color: var(--ry-accent); background: var(--ry-choisi); box-shadow: inset 0 0 0 1px var(--ry-accent); }
.ry-option.est-desactive { opacity: .45; cursor: not-allowed; }
.ry-option__nom { font-weight: 600; }
.ry-option__aide { font-size: 14px; color: var(--ry-encre-douce); }
.ry-options--ligne .ry-option { align-items: center; text-align: center; padding: 12px 8px; }
.ry-options--grille .ry-option { padding: 10px; }

.ry-vignette { display: block; width: 100%; aspect-ratio: 1 / 1; margin-bottom: 8px; border-radius: 10px; object-fit: cover; }
.ry-vignette--vide { display: flex; align-items: center; justify-content: center; font-size: 28px;
  color: var(--ry-encre-douce); background: linear-gradient(135deg, var(--ry-fond-doux), var(--ry-choisi)); }

/* Cases à cocher */
.ry-cases { display: grid; gap: 10px; }
.ry-case { display: flex; align-items: flex-start; gap: 12px; padding: 14px 16px; border: 2px solid var(--ry-ligne);
  border-radius: var(--ry-rayon); cursor: pointer; background: var(--ry-fond); }
.ry-case.est-choisi { border-color: var(--ry-accent); background: var(--ry-choisi); }
.ry-case input { flex: none; width: 22px; height: 22px; margin: 1px 0 0; accent-color: var(--ry-accent); }
.ry-case__texte { display: flex; flex-direction: column; }

/* Puces (marques) */
.ry-puces { display: flex; flex-wrap: wrap; gap: 8px; }
.ry-puce { min-height: 40px; padding: 8px 14px; border: 2px solid var(--ry-ligne); border-radius: 999px;
  background: var(--ry-fond); color: var(--ry-encre); font: inherit; font-size: 14px; cursor: pointer; }
.ry-puce.est-choisi { border-color: var(--ry-accent); background: var(--ry-accent); color: var(--ry-accent-texte); }
.ry-bloc { margin-top: 24px; }

.ry-resume-format { margin-top: 20px; padding: 14px 16px; border-radius: var(--ry-rayon); background: var(--ry-fond-doux); }
.ry-resume-format:empty { display: none; }
.ry-resume-format p { margin: 4px 0; }

/* Cartes produit */
.ry-cartes { display: grid; gap: 14px; margin: 8px 0 16px; }
.ry-carte { display: grid; grid-template-columns: 64px 1fr; gap: 14px; padding: 14px; border: 1px solid var(--ry-ligne);
  border-radius: var(--ry-rayon); background: var(--ry-fond); box-shadow: var(--ry-ombre); }
.ry-carte.est-choisi { border: 2px solid var(--ry-accent); background: var(--ry-choisi); }
.ry-carte__image { width: 64px; height: 64px; border-radius: 10px; object-fit: cover; background: var(--ry-fond-doux); }
.ry-carte__image--vide { display: flex; align-items: center; justify-content: center; font-size: 26px; color: var(--ry-encre-douce); }
.ry-carte__corps { min-width: 0; }
.ry-badge { display: inline-block; margin-bottom: 6px; padding: 2px 10px; border-radius: 999px; font-size: 12px;
  font-weight: 600; background: var(--ry-accent); color: var(--ry-accent-texte); }
.ry-carte__marque { margin: 0; font-size: 13px; text-transform: uppercase; letter-spacing: .06em; color: var(--ry-encre-douce); }
.ry-carte__titre { margin: 2px 0 6px; font-size: 17px; line-height: 1.3; font-weight: 600; }
.ry-carte__titre a { color: inherit; text-decoration: none; }
.ry-carte__titre a:hover { text-decoration: underline; }
.ry-carte--premiere { border: 2px solid var(--ry-accent); }
.ry-carte__repere { margin: 0 0 8px; font-size: 13px; color: var(--ry-encre-douce); }
.ry-carte__pourquoi { margin: 0; font-size: 13px; font-weight: 600; }
.ry-carte__compat { margin: 6px 0; font-size: 14px; font-weight: 600; color: var(--ry-accent-fonce); }
.ry-carte__rang { margin-top: 8px; font-size: 14px; }
.ry-carte__rang summary { cursor: pointer; text-decoration: underline; min-height: 32px; }
.ry-carte__rang ul { margin: 4px 0 0; padding-left: 18px; }
.ry-bouton--panier { flex-direction: column; gap: 2px; padding-top: 14px; padding-bottom: 14px; border-radius: 18px; }
.ry-bouton__ligne { font-size: 17px; }
.ry-bouton__detail { font-size: 14px; font-weight: 400; opacity: .9; }
.ry-carte__phrase { margin: 0 0 6px; font-size: 15px; }
.ry-carte__actifs { margin: 0 0 6px; font-size: 13px; color: var(--ry-encre-douce); }
.ry-carte__bas { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 10px; }
.ry-carte__prix { font-weight: 600; white-space: nowrap; }
.ry-carte__bas .ry-bouton { white-space: nowrap; padding-left: 18px; padding-right: 18px; }
.ry-precaution { margin: 8px 0 0; padding: 8px 10px; border-radius: 8px; font-size: 14px;
  background: var(--ry-alerte-fond); border-left: 3px solid var(--ry-alerte-ligne); }

/* Soins retirés */
.ry-retires { margin-top: 20px; padding: 14px 16px; border: 1px solid var(--ry-ligne); border-radius: var(--ry-rayon); background: var(--ry-fond-doux); }
.ry-retires__titre { margin: 0 0 6px; font-size: 16px; }
.ry-retires__resume { margin: 0; font-size: 14px; color: var(--ry-encre-douce); }
.ry-retires summary { padding: 10px 0 0; font-weight: 600; text-decoration: underline; cursor: pointer; min-height: 40px; }
.ry-retires__contenu { padding: 4px 0 0; }
.ry-retires__groupe h4 { margin: 12px 0 6px; font-size: 15px; }
.ry-retires ul { margin: 0; padding-left: 18px; font-size: 14px; }
.ry-retires li { margin: 6px 0; }
.ry-retires li ul { padding-left: 0; list-style: none; color: var(--ry-encre-douce); }
.ry-etiquette { display: inline-block; margin-right: 6px; padding: 0 8px; border-radius: 999px; font-size: 12px; font-weight: 600; }
.ry-retires__detail { display: block; margin-top: 2px; }
.ry-etiquette--forte { background: var(--ry-danger); color: #fff; }

/* Transition matin → soir */
.ry-transition { text-align: center; padding-top: 16px; }
.ry-coche { width: 64px; height: 64px; margin: 0 auto 12px; border-radius: 50%; display: flex; align-items: center;
  justify-content: center; font-size: 30px; background: var(--ry-accent); color: var(--ry-accent-texte); }
.ry-transition .ry-routine { text-align: left; margin: 20px 0; }

/* Liste de routine */
.ry-routine { margin: 0; padding: 0; list-style: none; }
.ry-routine__ligne { display: flex; align-items: center; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--ry-ligne); }
.ry-routine__num { flex: none; width: 28px; height: 28px; border-radius: 50%; display: flex; align-items: center;
  justify-content: center; font-size: 14px; font-weight: 600; background: var(--ry-fond-doux); }
.ry-routine__texte { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.ry-routine__etape { font-size: 13px; text-transform: uppercase; letter-spacing: .06em; color: var(--ry-encre-douce); }
.ry-routine__produit { font-weight: 600; }
.ry-routine__usage { font-size: 13px; color: var(--ry-encre-douce); }
.ry-routine__modifier { align-self: flex-start; margin-top: 2px; padding: 4px 0; min-height: 32px; }
.ry-reprise { margin: 20px 0 16px; padding: 16px; border-radius: var(--ry-rayon); border: 2px solid var(--ry-accent); }
.ry-reprise__texte { margin: 0 0 12px; font-weight: 600; }
.ry-alerte .ry-bouton { margin-top: 8px; }
.ry-routine__prix { flex: none; max-width: 92px; font-size: 14px; text-align: right; }

/* Récapitulatif */
.ry-recap__colonnes { display: grid; gap: 8px; }
.ry-avertissements { margin-top: 24px; padding: 4px 16px 12px; border-radius: var(--ry-rayon); background: var(--ry-alerte-fond); }
.ry-avertissements ul { margin: 0; padding-left: 18px; }
.ry-avertissements li { margin: 8px 0; }
.ry-total { margin-top: 24px; padding: 16px; border-radius: var(--ry-rayon); border: 2px solid var(--ry-accent); }
.ry-total p { display: flex; justify-content: space-between; gap: 12px; margin: 4px 0; }
.ry-total p.ry-aide { display: block; margin-top: 8px; }
.ry-total__prix { align-items: baseline; }
.ry-total__barre { color: var(--ry-encre-douce); }
.ry-total__final { font-size: 22px; font-weight: 700; }
.ry-total__avantage { display: block !important; margin: 8px 0 0 !important; font-weight: 700; }
.ry-total__economie { display: block !important; margin-top: 6px !important; font-weight: 600; color: var(--ry-accent-fonce); }
.ry-presque { margin-top: 14px; padding: 14px; border-radius: 10px; background: var(--ry-alerte-fond); }
.ry-presque__titre { display: block !important; margin: 0 0 8px !important; font-weight: 700; }
.ry-presque__jauge { height: 8px; border-radius: 99px; background: #fff; overflow: hidden; }
.ry-presque__jauge span { display: block; height: 100%; background: var(--ry-accent); }
.ry-presque .ry-aide { margin: 6px 0 10px; }
.ry-recap__resume { margin: 0 0 8px; padding: 0; list-style: none; font-weight: 600; }
.ry-recap__resume li { margin: 2px 0; }
.ry-garanties { margin: 0; padding: 0; list-style: none; font-size: 15px; }
.ry-garanties li { display: flex; gap: 10px; margin: 6px 0; }
.ry-panneau__total { display: flex; justify-content: space-between; margin: 16px 0 0; font-size: 18px; }

/* Barre « Ma routine » collée en bas */
.ry-app.avec-barre { padding-bottom: 120px; }
.ry-barre { position: fixed; left: 0; right: 0; bottom: 0; z-index: 900; display: flex; align-items: center; justify-content: space-between;
  gap: 12px; padding: 10px 16px calc(10px + env(safe-area-inset-bottom)); background: var(--ry-fond);
  border-top: 1px solid var(--ry-ligne); box-shadow: none; }
.ry-barre__texte { display: flex; flex-direction: column; min-width: 0; line-height: 1.25; }
.ry-barre__titre { font-size: 14px; color: var(--ry-encre-douce); }
.ry-barre__prix { font-size: 18px; font-weight: 700; }
.ry-barre__remise { font-size: 13px; color: var(--ry-encre-douce); }
.ry-barre__remise.est-debloquee { font-weight: 700; color: var(--ry-accent-fonce); }
.ry-barre__bouton { flex: none; min-height: 44px; padding: 8px 16px; }
.ry-barre.est-cachee { display: none; }

/* Page du créateur uniquement (cette feuille n'est chargée que par sa section) :
 * - la fenêtre « −10 % » de Shopify Forms et son onglet ne recouvrent plus le questionnaire ni la vidéo ;
 *   le reste du site garde la fenêtre ;
 * - marge basse pour que les badges fixés en bas (avis, Google) ne cachent jamais « ← Retour ». */
shopify-forms-embed { display: none !important; }
.ry-app { padding-bottom: 104px; }
.ry-pied--haut { margin: 4px 0 18px; }
.ry-actions { display: grid; gap: 12px; margin-top: 20px; }

/* Fenêtre (encarts) */
.ry-modale { position: fixed; inset: 0; z-index: 1000; display: flex; align-items: flex-end; justify-content: center;
  padding: 16px; background: rgba(99, 108, 121, .55); }
.ry-modale__boite { width: 100%; max-width: 520px; max-height: 90vh; overflow: auto; padding: 24px 20px;
  border-radius: var(--ry-rayon); background: var(--ry-fond); color: var(--ry-encre); }
.ry-modale__titre { margin: 0 0 12px; font-size: 20px; }
.ry-modale__texte p { margin: 0 0 10px; }
.ry-modale__choix { display: grid; gap: 10px; margin-top: 18px; }

@media (min-width: 750px) {
  .ry-titre { font-size: 30px; }
  .ry-titre--grand { font-size: 36px; }
  .ry-options--grille { grid-template-columns: repeat(4, 1fr); }
  .ry-cases--deux { grid-template-columns: repeat(2, 1fr); }
  .ry-carte__haut { grid-template-columns: 72px 1fr; }
  .ry-carte .ry-carte__image { width: 72px; height: 72px; }
  .ry-recap__colonnes { grid-template-columns: 1fr 1fr; gap: 32px; }
  .ry-recap__colonnes--une { grid-template-columns: 1fr; }
  .ry-modale { align-items: center; }
  .ry-actions { grid-template-columns: 1fr 1fr; }
  .ry-actions > .ry-aide, .ry-actions > .ry-lien, .ry-actions > .ry-bouton--panier, .ry-actions > .ry-garanties { grid-column: 1 / -1; }
  .ry-barre { left: 50%; right: auto; width: min(760px, 100%); transform: translateX(-50%); border: 1px solid var(--ry-ligne); border-bottom: 0; border-radius: 14px 14px 0 0; }
}

@media (prefers-reduced-motion: reduce) {
  .ry-progression span, .ry-bouton { transition: none; }
}

/* Analyse en cours (confiance) */
.ry-analyse__liste { margin: 8px 0 24px; padding: 0; list-style: none; }
.ry-analyse__ligne { display: flex; gap: 12px; align-items: flex-start; padding: 12px 0; border-bottom: 1px solid var(--ry-fond-doux);
  font-size: 16px; opacity: .25; transform: translateY(4px); transition: opacity .4s ease, transform .4s ease; }
.ry-analyse__ligne.est-fait { opacity: 1; transform: none; }

/* Carte compacte (retour de test du 11/10/2026) : photo + nom, puis « Vérifié · prix · Choisir ». */
.ry-carte { display: block; padding: 12px; }
.ry-carte__haut { display: grid; grid-template-columns: 56px 1fr; gap: 12px; align-items: start; }
.ry-carte .ry-carte__image { width: 56px; height: 56px; }
.ry-carte .ry-carte__titre { margin: 0; font-size: 16px; }
.ry-carte .ry-badge { margin-bottom: 4px; }
.ry-carte .ry-carte__phrase { margin: 8px 0 0; font-size: 14px; color: var(--ry-encre-douce); }
.ry-carte .ry-carte__bas { margin-top: 10px; gap: 8px; }
.ry-carte__bascule { flex: 1; min-width: 0; min-height: 40px; padding: 0; border: 0; background: none; text-align: left;
  font: inherit; font-size: 14px; cursor: pointer; color: var(--ry-encre-douce); }
.ry-carte__verifie { font-weight: 600; color: var(--ry-accent-fonce); }
.ry-carte__choisir { min-height: 40px; }
.ry-carte__detail { margin-top: 8px; font-size: 14px; }
.ry-verifie { margin: 6px 0 8px; padding: 10px 12px; list-style: none; border-radius: 10px; background: var(--ry-matin); border: 1px solid var(--ry-ligne); }
.ry-verifie li { display: flex; gap: 8px; align-items: flex-start; margin: 4px 0; font-size: 14px; line-height: 1.4; }
.ry-verifie .ry-coche-petite { width: 18px; height: 18px; font-size: 11px; }
.ry-encadre--doux { margin-top: 0; }

/* Guide d'utilisation */
.ry-guide-encart { padding: 16px; border-radius: var(--ry-rayon); background: var(--ry-fond-doux); }
.ry-guide-encart .ry-sous-titre { margin-top: 0; }
.ry-guide__document { padding-bottom: 8px; }
.ry-guide__partie { margin: 22px 0; }
.ry-guide__titre { margin: 0 0 8px; font-size: 18px; font-weight: 600; }
.ry-guide__partie h4 { margin: 14px 0 6px; font-size: 15px; font-weight: 600; }
.ry-guide__liste { margin: 0; padding-left: 20px; }
.ry-guide__liste li { margin: 6px 0; }
.ry-guide__moments { display: grid; gap: 4px; }
.ry-guide__moment ol { margin: 0 0 8px; padding-left: 22px; }
.ry-guide__moment li { margin: 8px 0; }
.ry-guide__usage { display: block; font-size: 14px; color: var(--ry-encre-douce); }
.ry-guide__calendrier { margin: 0 0 8px; padding-left: 22px; }
.ry-guide__calendrier li { margin: 6px 0; }
.ry-guide__actions { display: grid; gap: 14px; margin-top: 16px; }

/* Inscription e-mail */
.ry-email { padding: 16px; border: 1px solid var(--ry-ligne); border-radius: var(--ry-rayon); }
.ry-email .ry-sous-titre { margin-top: 0; }
.ry-email__label { display: block; margin: 12px 0 6px; font-weight: 600; }
.ry-champ { width: 100%; min-height: 48px; padding: 10px 14px; border: 1px solid var(--ry-ligne); border-radius: 10px;
  font: inherit; color: var(--ry-encre); background: var(--ry-fond); }
.ry-champ:focus { outline: 2px solid var(--ry-accent); outline-offset: 1px; }
.ry-email__accord { margin: 12px 0; }
.ry-email__merci { margin: 0; font-weight: 600; color: var(--ry-accent-fonce); }

@media (min-width: 750px) {
  .ry-guide__moments { grid-template-columns: 1fr 1fr; gap: 24px; }
}

@media (prefers-reduced-motion: reduce) {
  .ry-analyse__ligne { transition: none; opacity: 1; transform: none; }
}

/* Impression / PDF : seul le guide est imprimé. */
}

/* Guide : ton éditorial, paragraphes courts (retour du 11/10/2026) */
.ry-guide__texte { margin: 0 0 10px; }
.ry-guide__signature { margin: 4px 0 0; font-style: italic; }

/* ------------------------------------------------------------------
 * Guide en 2 pages (modèle visuel du 13/10/2026 : Utilisation__Modele.pdf)
 * Écran : lecture verticale sur téléphone ; impression : 2 pages A4.
 * Couleurs pleines uniquement (pas de texte en dégradé : mal rendu à l'impression).
 * ------------------------------------------------------------------ */
.ry-guide { --g-texte: #636C79; --g-gris: #9A9DA3; --g-filet: #D4D4D4; --g-turq: #2BA6B9; --g-bleu: #3E6DB5; --g-matin: #5FC3C5;
  --g-matin-fond: #DDF4F8; --g-matin-nom: #1BA3B5; --g-soir: #562894; --g-soir-fond: #E6DCF2; --g-bilan: #E3F2F4; --g-rouge: #E52222;
  --g-num: linear-gradient(150deg, #5CA5F3, #410659); --g-tip: linear-gradient(150deg, #23AFB3, #562894); color: var(--g-texte); }
.ry-g-page { margin: 0 0 32px; display: flex; flex-direction: column; }
.ry-g-entete { display: flex; justify-content: space-between; align-items: center; gap: 12px; border-bottom: 2px solid var(--g-filet);
  padding-bottom: 10px; margin-bottom: 12px; }
.ry-g-marque { display: flex; flex-direction: column; gap: 3px; flex: none; }
.ry-g-marque img { height: 26px; width: auto; display: block; align-self: flex-start; }
.ry-g-gratuit { font-weight: 700; font-size: 11px; letter-spacing: .02em; text-transform: uppercase; color: var(--g-bleu); }
.ry-g-titre { margin: 0; text-align: right; font-family: var(--ry-titres); line-height: 1.05; }
.ry-g-titre span { display: block; font-size: 19px; font-weight: 600; color: var(--g-turq); }
.ry-g-titre strong { display: block; font-size: 25px; font-weight: 700; color: var(--g-bleu); }
.ry-g-titre--p2 span { font-size: 23px; color: var(--g-bleu); }
.ry-g-titre:focus { outline: none; }
/* Le thème de la boutique met ses titres en capitales : le guide garde la casse du modèle. */
.ry-guide h2, .ry-guide h3, .ry-guide h4, .ry-guide h5 { text-transform: none; letter-spacing: normal; }
.ry-g-cols { display: grid; gap: 16px; }
.ry-g-col { display: flex; flex-direction: column; }
.ry-g-moment { margin: 0 0 6px; font-family: var(--ry-titres); font-weight: 600; font-size: 22px; }
.ry-g-moment--matin { color: var(--g-matin); }
.ry-g-moment--soir { color: var(--g-soir); }
.ry-g-cartes { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.ry-g-carte { position: relative; flex: 1; border-radius: 8px; padding: 9px 10px 10px; break-inside: avoid; }
.ry-g-carte--matin { background: var(--g-matin-fond); }
.ry-g-carte--soir { background: var(--g-soir-fond); }
.ry-g-nom { display: block; padding-right: 24px; margin-bottom: 6px; font-weight: 800; font-size: 13px; line-height: 1.2; text-transform: uppercase; }
.ry-g-carte--matin .ry-g-nom, .ry-g-carte--matin .ry-g-ico { color: var(--g-matin-nom); }
.ry-g-carte--soir .ry-g-nom, .ry-g-carte--soir .ry-g-ico { color: var(--g-soir); }
.ry-g-ico { position: absolute; top: 7px; right: 10px; font-size: 18px; line-height: 1; }
.ry-g-corps { display: flex; gap: 10px; align-items: flex-start; }
.ry-g-prod { position: relative; flex: none; width: 76px; height: 76px; }
.ry-g-prod img, .ry-g-prod__vide { width: 76px; height: 76px; object-fit: cover; border-radius: 8px; display: block; background: #FFFFFF; }
.ry-g-num { position: absolute; right: -4px; bottom: -4px; width: 22px; height: 24px; border-radius: 5px 5px 5px 0; background: var(--g-num);
  color: #FFFFFF; font-size: 14px; display: flex; align-items: center; justify-content: center; }
.ry-g-usage { flex: 1; min-width: 0; font-size: 14px; line-height: 1.35; color: var(--g-texte); }
.ry-g-puissant { display: block; margin-top: 4px; color: #73757C; }
.ry-g-vid { flex: none; width: 74px; text-align: center; text-decoration: none; cursor: pointer; }
.ry-g-vid__img { position: relative; display: block; width: 74px; height: 74px; border-radius: 8px; overflow: hidden; background: var(--g-tip); }
.ry-g-vid__img img { width: 74px; height: 74px; object-fit: cover; display: block; }
.ry-g-vid__lecture { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 28px; height: 20px; border-radius: 5px;
  background: var(--g-rouge); color: #FFFFFF; font-size: 10px; display: flex; align-items: center; justify-content: center; }
.ry-g-vid__texte { display: block; margin-top: 3px; white-space: nowrap; font-size: 9px; font-weight: 800; letter-spacing: .03em;
  text-transform: uppercase; color: var(--g-rouge); }
.ry-g-vid:focus-visible { outline: 2px solid var(--ry-accent-fonce); outline-offset: 2px; border-radius: 8px; }
.ry-g-option { display: flex; gap: 10px; align-items: center; margin-top: 10px; padding: 9px 10px; border: 1px solid var(--g-filet);
  border-radius: 8px; font-size: 14px; }
.ry-g-option p { flex: 1; margin: 0; }
.ry-g-tips { display: grid; gap: 10px; margin-top: 14px; }
.ry-g-tip { background: var(--g-tip); color: #FFFFFF; border-radius: 8px; padding: 9px 11px; font-size: 14px; line-height: 1.35; }
.ry-g-tip b { display: block; font-size: 15px; margin-bottom: 2px; }
.ry-g-garder { margin: 12px 0 0; text-align: center; font-weight: 700; font-size: 13px; color: var(--g-gris); }
.ry-g-aide { margin: 3px 0 0; text-align: center; font-size: 12px; color: var(--g-gris); }
.ry-g-prec { display: flex; align-items: center; gap: 10px; margin: 4px 0 6px; font-family: var(--ry-titres); font-weight: 600; font-size: 21px; color: var(--g-bleu); }
.ry-g-prec::after { content: ""; flex: 1; border-top: 2px solid var(--g-filet); }
.ry-g-deux { display: grid; gap: 0 22px; font-size: 14px; }
.ry-g-deux p { margin: 0 0 8px; }
.ry-g-filet { border: 0; border-top: 2px solid var(--g-filet); margin: 8px 0 14px; width: 100%; }
.ry-g-trois { display: grid; gap: 14px; }
.ry-g-b { padding-left: 10px; font-size: 14px; }
.ry-g-b p { margin: 0; }
.ry-g-b--gris { border-left: 3px solid #8D8D8D; }
.ry-g-b--turq { border-left: 3px solid var(--g-matin); }
.ry-g-b--viol { border-left: 3px solid var(--g-soir); }
.ry-g-b h4 { margin: 0 0 5px; font-family: var(--ry-titres); font-weight: 700; font-size: 17px; line-height: 1.1; color: var(--g-texte); }
.ry-g-bilan { background: var(--g-bilan); border-radius: 10px; padding: 12px 14px; margin: 16px 0; }
.ry-g-bilan h3 { margin: 0 0 8px; font-family: var(--ry-titres); font-weight: 700; font-size: 19px; color: var(--g-matin); }
.ry-g-bilan h5 { margin: 0 0 3px; font-size: 14px; color: var(--g-texte); }
.ry-g-bilan p { margin: 0; font-size: 13px; }
.ry-g-ligne { display: block; height: 18px; border-bottom: 1px solid #9FD6D7; }
.ry-g-email { position: relative; display: block; min-height: 190px; border-radius: 10px; overflow: hidden; text-decoration: none; background: #EEF1F6; }
.ry-g-email img { position: absolute; right: 0; top: 0; height: 100%; width: 62%; object-fit: cover; object-position: 72% 30%; }
.ry-g-email::before { content: ""; position: absolute; inset: 0; z-index: 1;
  background: linear-gradient(90deg, #F2F3F8 40%, rgba(242, 243, 248, .6) 50%, rgba(242, 243, 248, 0) 62%); }
.ry-g-email__texte { position: relative; z-index: 2; display: block; width: 60%; padding: 16px 0 16px 16px; color: #272B36; }
.ry-g-email__texte strong { display: block; font-family: var(--ry-titres); font-size: 24px; font-weight: 700; line-height: 1.05; color: var(--g-bleu); }
.ry-g-email__texte em { display: block; margin: 3px 0 10px; font-style: normal; font-family: var(--ry-titres); font-size: 18px; color: #3D8FBE; }
.ry-g-email__texte span { display: block; font-size: 14px; line-height: 1.35; }
.ry-g-sig { margin: 14px 0 0; text-align: center; font-size: 12px; color: var(--g-gris); }
.ry-geste-btn { margin-top: 6px; min-height: 36px; padding: 6px 12px; border: 1px solid var(--ry-accent-fonce); border-radius: 999px;
  background: #fff; color: var(--ry-accent-fonce); font: inherit; font-size: 13px; font-weight: 600; cursor: pointer; }
.ry-video { width: 100%; max-height: 60vh; border-radius: 12px; background: var(--ry-corps); display: block; }
.ry-video__legende { margin: 10px 0 0; font-size: 15px; }

@media (min-width: 750px) {
  .ry-g-cols { grid-template-columns: 1fr 1fr; }
  .ry-g-tips, .ry-g-trois { grid-template-columns: repeat(3, 1fr); }
  .ry-g-deux { grid-template-columns: 1fr 1fr; }
  .ry-g-email__texte { width: 56%; padding: 20px 0 20px 22px; }
  .ry-g-email__texte strong { font-size: 30px; }
}
@media (max-width: 380px) {
  .ry-g-entete { flex-direction: column; align-items: flex-start; }
  .ry-g-titre { text-align: left; }
  .ry-g-email img { opacity: .35; width: 60%; }
  .ry-g-email__texte { width: 88%; }
}

/* Impression / PDF : seul le guide, en 2 pages A4, tailles du modèle (propositions/guide-pdf-exemple.py). */
@media print {
  @page { size: A4; margin: 12mm 13mm; }
  /* Seul le guide est imprimé. Le reste de la page (en-tête, pied de page, boutons…) est RETIRÉ (display: none) :
   * simplement invisible, il gardait sa hauteur et ajoutait des pages blanches (constat de la direction, 14/10/2026). */
  body *:not(:has(.ry-guide__document)):not(.ry-guide__document):not(.ry-guide__document *) { display: none !important; }
  html, body, body *:has(.ry-guide__document) { min-height: 0 !important; height: auto !important; margin: 0 !important;
    padding: 0 !important; position: static !important; transform: none !important; overflow: visible !important;
    border: 0 !important; box-shadow: none !important; background: none !important; }
  body * { visibility: hidden !important; }
  .ry-guide__document, .ry-guide__document * { visibility: visible !important; }
  .ry-guide__document { position: static; width: 100%; }
  .ry-progression, .ry-guide__actions, .ry-geste-btn, .ry-g-aide { display: none !important; }
  .ry-guide { font-size: 9.4pt; line-height: 1.4; }
  /* Hauteur minimale d’une page A4 (les cartes s’étirent) ; si le contenu est plus long, il passe sur la page suivante : jamais coupé. */
  .ry-g-page { margin: 0; min-height: 270mm; break-after: page; }
  .ry-g-page:last-child { break-after: auto; }
  .ry-g-entete { flex-direction: row; align-items: center; padding-bottom: 9px; margin-bottom: 9px; }
  .ry-g-titre { text-align: right; }
  .ry-g-marque img { height: 30px; }
  .ry-g-gratuit { font-size: 9pt; }
  .ry-g-titre span { font-size: 19pt; }
  .ry-g-titre strong { font-size: 24pt; }
  .ry-g-titre--p2 span { font-size: 22pt; }
  .ry-g-titre--p2 { max-width: 46%; }
  .ry-g-cols { grid-template-columns: 1fr 1fr; gap: 12px; flex: 1; }
  .ry-g-moment { font-size: 17pt; }
  .ry-g-nom { font-size: 9.3pt; }
  .ry-g-ico { font-size: 13pt; }
  .ry-g-num { font-size: 11pt; width: 20px; height: 22px; }
  .ry-g-usage { font-size: 8.8pt; }
  .ry-g-vid__texte { font-size: 6pt; }
  .ry-g-vid__lecture { width: 24px; height: 17px; font-size: 8pt; }
  .ry-g-options { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 6px; }
  .ry-g-options .ry-g-option { margin-top: 0; }
  .ry-g-option { font-size: 8pt; padding: 5px 7px; margin-top: 6px; gap: 7px; }
  .ry-g-option .ry-g-prod, .ry-g-option .ry-g-prod img, .ry-g-option .ry-g-prod__vide { width: 46px; height: 46px; }
  .ry-g-option .ry-g-vid, .ry-g-option .ry-g-vid__img, .ry-g-option .ry-g-vid__img img { width: 46px; }
  .ry-g-option .ry-g-vid__img, .ry-g-option .ry-g-vid__img img { height: 46px; }
  .ry-g-option .ry-g-vid { width: 54px; }
  .ry-g-option .ry-g-vid__texte { font-size: 5pt; letter-spacing: 0; }
  .ry-g-tips, .ry-g-tip, .ry-g-bilan, .ry-g-trois, .ry-g-options { break-inside: avoid; }
  .ry-g-tips { grid-template-columns: repeat(3, 1fr); margin-top: 6px; }
  .ry-g-tip { font-size: 8.6pt; padding: 8px 10px; }
  .ry-g-tip b { font-size: 10pt; }
  .ry-g-garder { font-size: 8.6pt; margin-top: 9px; }
  .ry-g-prec { font-size: 15pt; }
  .ry-g-deux { grid-template-columns: 1fr 1fr; font-size: 8.8pt; }
  .ry-g-deux p { margin-bottom: 7px; }
  .ry-g-filet { margin: 6px 0 10px; }
  .ry-g-trois { grid-template-columns: repeat(3, 1fr); gap: 16px; }
  .ry-g-b { font-size: 8.6pt; padding-left: 9px; }
  .ry-g-b h4 { font-size: 11pt; }
  .ry-g-bilan { padding: 11px 14px; margin: 12px 0; }
  .ry-g-bilan h3 { font-size: 13pt; }
  .ry-g-bilan h5 { font-size: 9.4pt; }
  .ry-g-bilan p { font-size: 8.4pt; }
  .ry-g-ligne { height: 16px; }
  .ry-g-email { height: auto; min-height: 56mm; }
  .ry-g-email img { opacity: 1; width: 62%; }
  .ry-g-email__texte { width: 58%; padding: 16px 0 16px 18px; }
  .ry-g-email__texte strong { font-size: 21pt; }
  .ry-g-email__texte em { font-size: 16pt; }
  .ry-g-email__texte span { font-size: 10.5pt; }
  .ry-g-sig { margin-top: auto; font-size: 7.4pt; }
  .ry-g-carte, .ry-g-option, .ry-g-b, .ry-g-bilan, .ry-g-email { break-inside: avoid; }
  .ry-g-carte, .ry-g-num, .ry-g-vid__img, .ry-g-vid__lecture, .ry-g-tip, .ry-g-bilan, .ry-g-email, .ry-g-email::before {
    -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}

/* ------------------------------------------------------------------
 * Charte du site (13/10/2026) — appliquée par-dessus les règles ci-dessus.
 * ------------------------------------------------------------------ */
.ry-titre, .ry-sous-titre, .ry-carte__titre, .ry-modale__titre { font-family: var(--ry-titres); color: var(--ry-encre); }
.ry-bouton { border-radius: var(--ry-rayon-petit); }
.ry-bouton--principal { background: var(--ry-degrade); border-color: transparent; color: var(--ry-accent-texte); }
.ry-bouton--secondaire { border-color: var(--ry-accent); color: var(--ry-accent-fonce); }
.ry-bouton--panier { border-radius: var(--ry-rayon); }
.ry-lien { color: var(--ry-accent-fonce); }
.ry-coche-petite, .ry-coche { background: var(--ry-degrade); color: #fff; }
.ry-progression span { background: var(--ry-degrade); }
.ry-badge { background: var(--ry-degrade); color: #fff; border-radius: var(--ry-coin-signature); }
.ry-carte__verifie, .ry-email__merci { color: var(--ry-accent-fonce); }
.ry-verifie { background: var(--ry-matin); border-color: var(--ry-ligne); border-radius: var(--ry-rayon); }
.ry-carte--premiere, .ry-carte.est-choisi { border-color: var(--ry-accent); }
.ry-routine__num { background: var(--ry-degrade); color: #fff; border-radius: var(--ry-coin-signature); }
.ry-geste-btn { border-color: var(--ry-accent); color: var(--ry-accent-fonce); border-radius: var(--ry-rayon-petit); }
.ry-bouton:focus-visible, .ry-option:focus-visible, .ry-puce:focus-visible, .ry-lien:focus-visible,
.ry-case:focus-within, .ry-geste-btn:focus-visible { outline-color: var(--ry-accent-fonce); }


/* ------------------------------------------------------------------
 * Harmonisation avec le site du site (exigence de la direction du 14/10/2026).
 * Les valeurs viennent des variables du thème du thème (--display, --accent, --grad-accent, --ink, --text-2,
 * --accent-font, --fs-xs, --radius, --surface, --divider…) : si la charte change dans le thème, le créateur suit.
 * Les valeurs entre parenthèses sont celles du site au 14/10/2026, utilisées seulement si le thème ne les fournit pas.
 * Le guide et son PDF gardent le modèle validé (couleurs pleines).
 * ------------------------------------------------------------------ */
.ry-racine {
  --ry-titres: var(--display, "Funnel Display", sans-serif);
  --ry-texte: var(--body, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif);
  --ry-encre: var(--h-title, #16181F);
  --ry-corps: var(--h-title, #16181F);
  --ry-encre-douce: var(--text-2, #5C5F68);
  --ry-encre-legere: var(--text-3, #73757C);
  --ry-accent: var(--accent, #22B1B4);
  --ry-degrade: var(--grad-accent, linear-gradient(150deg, #23AFB3, #562894));
  --ry-gris-bouton: var(--ink, #636C79);
  --ry-fond: var(--surface, #FFFFFF);
  --ry-ligne: var(--divider, #D6CFBF);
  --ry-ligne-champ: var(--input-border, #C9C4B8);
  --ry-rayon-petit: var(--radius, 8px);
  --ry-police-bouton: var(--accent-font, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif);
  --ry-taille-bouton: var(--fs-xs, .8rem);
  background: transparent;
}
/* Surtitre = « eyebrow » du site : petites capitales turquoise, graisse 700, icône ✧. */
.ry-surtitre { display: inline-flex; align-items: center; gap: .5em; font-family: var(--ry-police-bouton);
  font-size: var(--ry-taille-bouton); font-weight: 700; letter-spacing: .22em; text-transform: uppercase; color: var(--ry-accent); }
.ry-surtitre::before { content: "✧"; font-size: 1.15em; letter-spacing: 0; }
/* Titres = titres du site : Funnel Display 900, encre foncée ; la fin du titre d'accueil en italique dégradé. */
.ry-titre { font-family: var(--ry-titres); font-weight: 900; color: var(--ry-encre); letter-spacing: -.01em; line-height: 1.1; text-wrap: balance; }
.ry-titre--grand { font-size: 34px; }
.ry-titre em { font-style: italic; font-weight: 800; background: var(--ry-degrade); -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent; padding-right: .06em; }
.ry-sous-titre, .ry-carte__titre, .ry-modale__titre { font-family: var(--ry-titres); font-weight: 800; color: var(--ry-encre); }
.ry-aide { color: var(--ry-encre-douce); }
/* Boutons = boutons du site : petites capitales, graisse 800, espacement .12em, coins 8 px, bordure 2 px. */
.ry-bouton { font-family: var(--ry-police-bouton); font-size: var(--ry-taille-bouton); font-weight: 800; letter-spacing: .12em;
  text-transform: uppercase; line-height: 1.2; border: 2px solid transparent; border-radius: var(--ry-rayon-petit); gap: .5em; }
.ry-bouton--principal { background: var(--ry-degrade); color: var(--on-accent, #FFFFFF); border-color: transparent; }
.ry-bouton--principal:not(.ry-bouton--panier)::after { content: "→"; font-weight: 400; letter-spacing: 0; }
.ry-bouton--principal:hover { opacity: 1; filter: brightness(1.07); }
.ry-bouton--secondaire { background: transparent; color: var(--ry-gris-bouton); border-color: var(--ry-gris-bouton); }
.ry-bouton--secondaire:hover { background: var(--ry-gris-bouton); color: var(--ry-fond); }
.ry-bouton--discret { font-size: var(--ry-taille-bouton); color: var(--ry-encre-douce); }
.ry-bouton--panier .ry-bouton__ligne { letter-spacing: .1em; }
.ry-bouton--panier .ry-bouton__detail { text-transform: none; letter-spacing: 0; font-weight: 600; }
.ry-bouton--panier { border-radius: var(--ry-rayon-petit); }
.ry-geste-btn { font-family: var(--ry-police-bouton); font-size: var(--ry-taille-bouton); font-weight: 800; letter-spacing: .12em; text-transform: uppercase;
  border: 2px solid var(--ry-gris-bouton); color: var(--ry-gris-bouton); border-radius: var(--ry-rayon-petit); }
/* Cartes, choix et cases = cartes du site : surface blanche, filet 1 px, coins 10 px. */
.ry-option, .ry-case, .ry-carte, .ry-encadre, .ry-verifie { background: var(--ry-fond); border-color: var(--ry-ligne); }
.ry-option, .ry-case { border-width: 1px; }
@media (hover: hover) { .ry-option:hover, .ry-case:hover { border-color: var(--ry-gris-bouton); } }
.ry-option.est-choisi, .ry-option[aria-pressed="true"], .ry-case.est-choisi { border-color: var(--ry-accent); box-shadow: 0 0 0 1px var(--ry-accent); }
.ry-encadre { border: 1px solid var(--ry-ligne); }
/* Puces = filtres du site : coins 8 px, bordure de champ, graisse 600. */
.ry-puce { border-width: 1.5px; border-color: var(--ry-ligne-champ); border-radius: var(--ry-rayon-petit); font-weight: 600; color: var(--ry-encre); background: var(--ry-fond); }
.ry-puce.est-choisi, .ry-puce[aria-pressed="true"] { border-color: var(--ry-accent); }
/* Barre collante : même surface que le site. */
.ry-barre { background: var(--ry-fond); border-top-color: var(--ry-ligne); }
.ry-barre__prix { font-family: var(--ry-titres); font-weight: 900; color: var(--ry-encre); }
@media (min-width: 750px) {
  .ry-titre { font-size: 34px; }
  .ry-titre--grand { font-size: 48px; }
}
@media (min-width: 750px) {
  .ry-pied--haut { justify-content: flex-start; }
  .ry-pied--haut .ry-bouton--large { width: auto; min-width: 260px; padding: 16px 32px; }
}
/* Certains thèmes mettent leurs titres en capitales : le créateur garde la casse du site du site. */
.ry-racine h1, .ry-racine h2, .ry-racine h3, .ry-racine h4, .ry-racine h5 { text-transform: none; }
.ry-pied-lien { margin: 10px 0 0; text-align: right; }

/* Cartes de réponse uniformes (relecture du 19/10) : même hauteur dans une liste, rond de sélection
 * à gauche, titres et explications alignés, choix = bordure turquoise + fond teinté (sans effet en plus).
 * Listes en une colonne et sans vignette seulement. */
.ry-options:not(.ry-options--ligne):not(.ry-options--grille) { grid-auto-rows: 1fr; }
.ry-options:not(.ry-options--ligne):not(.ry-options--grille) > .ry-option:not(:has(.ry-vignette)) {
  position: relative; justify-content: center; min-height: 64px; padding: 14px 16px 14px 52px; }
.ry-options:not(.ry-options--ligne):not(.ry-options--grille) > .ry-option:not(:has(.ry-vignette))::before {
  content: ""; position: absolute; left: 18px; top: 50%; width: 20px; height: 20px; margin-top: -10px;
  border: 2px solid var(--ry-ligne); border-radius: 50%; background: var(--ry-fond); box-sizing: border-box; }
.ry-options:not(.ry-options--ligne):not(.ry-options--grille) > .ry-option.est-choisi:not(:has(.ry-vignette))::before {
  border-color: var(--ry-accent); background: radial-gradient(circle, var(--ry-accent) 0 4px, var(--ry-fond) 5px); }
.ry-option.est-choisi { box-shadow: none; }

/* Moins de vide sous « ← Retour » : la réserve pour les badges fixés en bas est réduite. */
.ry-app { padding-bottom: 56px; }

/* Sur téléphone, dans le créateur : bandeau d'annonce compact (seule la promesse de livraison reste),
 * pour laisser la place à la question et aux réponses. */
@media (max-width: 749px) {
  .kb-announce__inner { padding-top: 5px; padding-bottom: 5px; }
  .kb-announce__text { font-size: 0; line-height: 1.3; }
  .kb-announce__text em { font-size: 11px; letter-spacing: .03em; }
}

/* Petits téléphones (≤ 380 px) : marges des cartes un peu réduites ; taille du texte inchangée
 * (on accepte le défilement plutôt que de réduire la lisibilité). */
@media (max-width: 380px) {
  .ry-options:not(.ry-options--ligne):not(.ry-options--grille) > .ry-option:not(:has(.ry-vignette)) {
    min-height: 56px; padding: 10px 12px 10px 46px; }
  .ry-options:not(.ry-options--ligne):not(.ry-options--grille) > .ry-option:not(:has(.ry-vignette))::before { left: 14px; }
  .ry-options { gap: 8px; }
}

/* PDF enregistré depuis un iPhone (contrôle du 19/10) : l'impression iOS (Safari et Chrome) affiche le guide
 * plus grand que sur ordinateur. Résultat : la page 1 débordait (« Conseils et tips » coupés), la signature
 * partait seule en page 4, et les textes gris clair ressortaient presque invisibles.
 * Les images du guide ne sont plus chargées « à la demande » (sinon le bandeau d'inscription sortait en noir). */
@media print {
  /* Pas de hauteur imposée : Safari ajoute titre, date et adresse en haut et en bas de chaque page,
   * la place réelle varie ; une hauteur fixe faisait passer la dernière ligne sur une page de plus. */
  .ry-g-page { min-height: 0 !important; }
  .ry-g-sig { margin-top: 12px !important; }
  .ry-g-cols .ry-g-prod, .ry-g-cols .ry-g-prod img, .ry-g-cols .ry-g-prod__vide { width: 62px; height: 62px; }
  .ry-g-cols .ry-g-vid { width: 62px; }
  .ry-g-cols .ry-g-vid__img, .ry-g-cols .ry-g-vid__img img { width: 62px; height: 62px; }
  .ry-g-garder, .ry-g-sig { color: #636C79 !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .ry-g-tips, .ry-g-tip { break-inside: avoid; page-break-inside: avoid; }
  /* Le fondu transparent entre texte et photo s'imprime en NOIR avec le moteur de Safari/iPhone :
   * à l'impression, pas de fondu ; la photo occupe seulement la partie droite, à côté du texte. */
  .ry-g-email::before { display: none !important; }
  .ry-g-email { background: #EEF1F6 !important; }
  .ry-g-email img { width: 40% !important; }
  .ry-g-email { min-height: 42mm !important; page-break-inside: avoid; break-inside: avoid-page; }
  .ry-g-email__texte { padding: 12px 0 12px 16px !important; }
  .ry-g-email__texte strong { font-size: 18pt !important; }
  .ry-g-email__texte em { font-size: 13pt !important; margin-bottom: 6px !important; }
  .ry-g-email__texte span { font-size: 9.5pt !important; }
  .ry-g-bilan { margin: 10px 0 !important; }
  @supports (-webkit-touch-callout: none) {
    .ry-guide__document { zoom: .86; }
  }
}