/* ==========================================================================
   Viona Bloom : compléments de la maquette validée du 5 novembre 2026
   Ces règles étaient écrites dans l'en-tête de certaines pages de la maquette
   (balises <style>). Elles sont regroupées ici, à l'identique.
   Chaque règle propre à une page est limitée à cette page par la classe
   « vb-page-… » que le thème ajoute à <body>. Le sélecteur :where() ne
   compte pas dans la priorité CSS : le rendu est exactement celui de la
   maquette.
   ========================================================================== */

body { margin: 0; }

/* --- Toutes les pages : signature de marque sur deux lignes (accueil) --- */
.qe-brand__text { display: flex; flex-direction: column; align-items: flex-start; }
.qe-brand__name { display: block; }
.qe-brand__byline { display: block; font-size: 0.7em; line-height: 1.35; font-weight: 400; letter-spacing: 0.035em; }
.qe-footer__byline { display: block; font-size: 0.76em; line-height: 1.5; font-weight: 400; opacity: 0.85; }

/* --- À propos --- */
:where(.vb-page-a-propos) .qe-page-hero__visual img { object-fit: cover; object-position: center 25%; }

/* --- QuantEssence devient Viona Bloom (annonce) --- */
/* Une seule carte restante : centrée et sans espace vide */
:where(.vb-page-annonce) .qe #viona-bloom .qe-transition__cards { display: flex; justify-content: center; }
:where(.vb-page-annonce) .qe #viona-bloom .qe-transition__card { flex: 0 1 100%; max-width: 680px; }

/* --- Cercle de guidance --- */
/* Image du haut centrée au-dessus du titre d'introduction */
:where(.vb-page-cercle-de-guidance) .qe-page-hero__inner { display: block; }
:where(.vb-page-cercle-de-guidance) .qe-page-hero__inner > .qe-page-hero__text { width: 100%; max-width: 100%; }
.qe-guidance-centered-visual { display: block; width: min(100%, 660px); margin: 0 auto 2rem; text-align: center; }
.qe-guidance-centered-visual img { display: block; width: 100%; height: auto; max-height: 460px; object-fit: contain; margin: 0 auto; border-radius: 12px; }
:where(.vb-page-cercle-de-guidance) .qe-page-hero .qe-actions { display: flex; justify-content: flex-start; }

/* --- Formation QuantEssence --- */
/* Symbole violet : affichage fixe, sans animation ni effet de survol */
.qe .qe-static-violet-frame, .qe .qe-static-violet-frame:hover,
.qe .qe-static-violet-symbol, .qe .qe-static-violet-symbol:hover {
	animation: none !important; transition: none !important; transform: none !important;
	filter: none !important; perspective: none !important;
}
.qe .qe-static-violet-frame::before, .qe .qe-static-violet-frame::after { animation: none !important; transition: none !important; }

/* --- Mentorat La Voie Violette --- */
/* Mise en page du texte intégral du mentorat */
.qe-mentorat-story { padding: clamp(52px, 7vw, 100px) 24px; background: #fff; }
.qe-mentorat-story__inner { max-width: 1060px; margin: 0 auto; }
.qe-mentorat-story__content { max-width: 830px; margin: 28px auto 0; font-size: clamp(16px, 1.4vw, 18px); line-height: 1.85; }
.qe-mentorat-story__content p { margin: 0 0 1.3em; }
.qe-mentorat-story__content a { overflow-wrap: anywhere; }
.qe-mentorat-story__emphasis { font-weight: 600; }

/* Neuf dimensions du mentorat : cartes pastel sans numéros */
.qe-program-colore { padding: clamp(56px, 7vw, 100px) 22px; background: #fbf9fc; }
.qe-program-colore__inner { max-width: 1160px; margin: 0 auto; }
.qe-program-colore .qe-section-head { margin-bottom: 32px; }
.qe-program-colore__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.qe-program-colore__card { padding: clamp(24px, 2.6vw, 34px); border-radius: 18px; border: 1px solid rgba(105, 62, 137, .11); box-shadow: 0 8px 25px rgba(61, 40, 71, .06); min-height: 186px; box-sizing: border-box; }
.qe-program-colore__card:nth-child(9n+1) { background: #f16ea6; }
.qe-program-colore__card:nth-child(9n+2) { background: #ef84aa; }
.qe-program-colore__card:nth-child(9n+3) { background: #f19aa7; }
.qe-program-colore__card:nth-child(9n+4) { background: #f2b0ac; }
.qe-program-colore__card:nth-child(9n+5) { background: #f0c2ab; }
.qe-program-colore__card:nth-child(9n+6) { background: #eed1a7; }
.qe-program-colore__card:nth-child(9n+7) { background: #efe09e; }
.qe-program-colore__card:nth-child(9n+8) { background: #f0e6a2; }
.qe-program-colore__card:nth-child(9n+9) { background: #e9e39b; }
.qe-program-colore__title { margin: 0 0 13px; font-size: clamp(18px, 1.65vw, 22px); line-height: 1.35; font-weight: 650; color: #553868; }
.qe-program-colore__text { margin: 0; line-height: 1.65; color: #4e4555; font-size: 15px; }
@media (max-width: 850px) { .qe-program-colore__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .qe-program-colore__grid { grid-template-columns: 1fr; } .qe-program-colore__card { min-height: 0; } }

/* --- Échange découverte (rendez-vous) --- */
/* Visuel du lotus : proportion maîtrisée, sans rognage */
:where(.vb-page-rdv-echange-decouverte) .qe-page-hero__visual { display: flex; align-items: center; justify-content: center; }
:where(.vb-page-rdv-echange-decouverte) .qe-page-hero__visual img { display: block; width: 100%; max-width: 340px; height: auto; object-fit: contain; margin: auto; }
@media (max-width: 767px) { :where(.vb-page-rdv-echange-decouverte) .qe-page-hero__visual img { max-width: 260px; } }

/* --- Ressources et Séances : deux cartes côte à côte --- */
:where(.vb-page-ressources, .vb-page-seances) .qe-offers--2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
@media (max-width: 720px) { :where(.vb-page-ressources, .vb-page-seances) .qe-offers--2 { grid-template-columns: 1fr; } }

/* --- Sekhem --- */
/* Illustration Sekhem : centrage et dimensions maîtrisées */
.qe-prose figure:has(img[data-img="RSK-I02"]) { max-width: 560px; margin: 0 auto 2rem; text-align: center; }
.qe-prose img[data-img="RSK-I02"] { display: block; width: 100%; height: auto; object-fit: contain; margin: auto; }

/* --- Séance QuantEssence --- */
/* Netteté des images sans agrandissement excessif */
:where(.vb-page-seance-quantessence) .qe-page-hero__visual { display: flex; align-items: center; justify-content: center; }
:where(.vb-page-seance-quantessence) .qe-page-hero__visual img { display: block; width: 100%; max-width: 360px; height: auto; object-fit: contain; margin: auto; }
:where(.vb-page-seance-quantessence) .qe-prose figure img { display: block; max-width: 100%; height: auto; object-fit: contain; }
@media (max-width: 640px) { :where(.vb-page-seance-quantessence) .qe-page-hero__visual img { max-width: 290px; } }
