/* LUMEROME : sections après l'accueil, toutes claires. */

/* Parcours : la lumière de l'aube continue en haut de section */
.parcours { --h1x: 72%; --h1y: 0%; --h2x: 6%; --h2y: 70%; }
.manifesto { margin: 0 0 clamp(3rem, 6vw, 5.5rem); max-width: 980px; }
.manifesto p { text-wrap: balance; font: 380 clamp(1.55rem, 1rem + 1.9vw, 2.5rem)/1.25 var(--font-display); letter-spacing: -0.015em; font-variation-settings: "opsz" 72; }
.manifesto footer { margin-top: 1.25rem; color: var(--accent-ink); font-weight: 600; }
.parcours-grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(2rem, 6vw, 6rem); align-items: start; }
.portrait { margin: 0; position: sticky; top: calc(var(--header-h) + 2rem); }
.portrait img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; border-radius: 999px 999px var(--radius) var(--radius); box-shadow: var(--shadow); }
.portrait figcaption { margin-top: .9rem; font-size: .95rem; color: var(--ink-soft); }
.parcours-story h2 { margin-bottom: 2.5rem; }
.timeline { position: relative; display: grid; gap: 2.5rem; padding-left: 2.25rem; }
.timeline::before { content: ""; position: absolute; left: 5px; top: .6rem; bottom: .6rem; width: 2px; background: var(--line); }
.timeline-line { position: absolute; left: 5px; top: .6rem; bottom: .6rem; width: 2px; background: linear-gradient(var(--gold), var(--accent)); transform-origin: top; }
.timeline li:not(.timeline-line) { position: relative; }
.timeline li:not(.timeline-line)::before {
  content: ""; position: absolute; left: -2.25rem; top: .5rem; width: 12px; height: 12px; border-radius: 50%;
  background: var(--bg); border: 2px solid var(--accent); box-shadow: 0 0 0 5px rgb(var(--halo) / .25);
}
.timeline h3 { margin-bottom: .5rem; }
.timeline p { color: var(--ink-soft); max-width: 58ch; }
@media (max-width: 767px) {
  .parcours-grid { grid-template-columns: 1fr; }
  .portrait { position: static; max-width: 340px; }
}

/* ThetaHealing : le cube de Metatron du client, en grand, qui se trace couche par couche */
.theta { background: var(--bg-alt); --h1x: 50%; --h1y: 45%; --h2x: 92%; --h2y: 12%; }
.theta-intro { display: grid; gap: 1.25rem; max-width: 62ch; }
.theta-intro h2 { margin-bottom: .5rem; }
.levels {
  --cube: min(780px, 86vh, 64vw);
  position: relative; margin-top: clamp(2.5rem, 5vw, 4rem); min-height: calc(var(--cube) + 2rem);
  display: grid; align-items: center;
}
.cube { position: absolute; left: 50%; top: 50%; width: var(--cube); aspect-ratio: 1; translate: -50% -50%; color: var(--gold); }
.cube-halo {
  position: absolute; inset: 6%; border-radius: 50%; opacity: .6;
  background: radial-gradient(closest-side, rgb(255 238 200 / .95), rgb(255 214 150 / .45) 45%, rgb(255 205 140 / 0));
}
.metatron { position: relative; display: block; width: 100%; height: auto; overflow: visible; }
.metatron .mt-c { fill: rgb(255 246 226 / .35); }
.metatron .mt-center { fill: rgb(255 240 208 / .75); }
/* Les 4 niveaux occupent les coins vides du carré du cube (le Metatron est un hexagone). */
.levels-list {
  position: relative; display: grid; grid-template-columns: 1fr var(--cube) 1fr;
  grid-template-rows: 1fr 1fr; height: var(--cube);
}
.level { display: grid; gap: .45rem; align-content: start; position: relative; z-index: 1; }
.level:nth-child(1), .level:nth-child(3) { grid-column: 1; text-align: right; justify-items: end; margin-right: calc(var(--cube) * -.34); }
.level:nth-child(2), .level:nth-child(4) { grid-column: 3; margin-left: calc(var(--cube) * -.34); }
.level:nth-child(1), .level:nth-child(2) { grid-row: 1; align-self: start; }
.level:nth-child(3), .level:nth-child(4) { grid-row: 2; align-self: end; }
.level h3 { font-size: clamp(1.5rem, 1.1rem + 1vw, 2.1rem); font-weight: 420; transition: color .5s; white-space: nowrap; }
.level p { color: var(--ink-soft); max-width: 22ch; }
.level::after { content: ""; width: 3rem; height: 2px; background: var(--gold); opacity: .35; transition: opacity .5s, width .5s; }
.has-motion .level h3 { color: var(--ink-soft); }
.has-motion .level.is-active h3 { color: var(--accent-ink); }
.has-motion .level.is-active::after { opacity: 1; width: 4.5rem; }
.levels-outro { margin: clamp(2rem, 4vw, 3rem) auto 0; max-width: 58ch; text-align: center; font-size: 1.2rem; }

@media (max-width: 1099px) {
  .levels { --cube: min(92vw, 560px); min-height: 0; display: block; }
  .cube { position: relative; left: auto; top: auto; translate: none; margin-inline: auto; }
  .levels-list { grid-template-columns: 1fr 1fr; grid-template-rows: auto; height: auto; row-gap: 2rem; column-gap: 1.5rem; margin-top: 2rem; }
  .level:nth-child(n) { grid-area: auto; align-self: start; margin: 0; text-align: left; justify-items: start; }
  .level h3 { white-space: normal; }
  /* Avec mouvement : un seul niveau à la fois sous le cube, qui change au défilement. */
  .has-motion .levels-list { grid-template-columns: 1fr; margin-top: 1.5rem; }
  .has-motion .level:nth-child(n) { grid-area: 1 / 1; text-align: center; justify-items: center; opacity: 0; transition: opacity .45s; }
  .has-motion .level.is-active { opacity: 1; }
  .has-motion .level p { max-width: 30ch; }
}
@media (max-width: 560px) { .levels-list { grid-template-columns: 1fr; } }

/* Schémas : fils d'or emmêlés qui se dénouent au défilement ; liste simple en mobile */
.patterns { margin-top: clamp(3rem, 6vw, 5rem); display: grid; gap: 1.5rem; }
.patterns-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: end; gap: 1rem 3rem; }
.patterns-head h3 { font-size: clamp(2rem, 1.3rem + 2vw, 3rem); font-weight: 400; }
.patterns-head .note { max-width: 34ch; }
.patterns-threads { width: 100%; height: auto; overflow: visible; }
.thread { fill: none; stroke: var(--gold); stroke-width: 1.4; stroke-linecap: round; opacity: .8; }
.thread-text { font: 420 28px var(--font-display); letter-spacing: -.005em; fill: var(--ink); }
/* La liste reste pour les lecteurs d'écran ; les fils sont décoratifs. */
.patterns-list { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.patterns-threads--m { display: none; }
@media (max-width: 900px) {
  .patterns { gap: 1rem; }
  .patterns-head h3 { font-size: 1.85rem; }
  .patterns-head .note { font-size: .9rem; }
  .patterns-threads { display: none; }
  .patterns-threads--m { display: block; width: 100%; height: auto; overflow: visible; }
  .patterns-threads--m .thread-text { font-size: 18px; }
}

/* Séance : chemin de lumière (courbe dorée, 3 étapes, soleil des bienfaits) */
.session { margin-top: clamp(3rem, 6vw, 5rem); }
.session-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: .4rem 1.25rem; }
.session-head h3 { font-size: clamp(2rem, 1.3rem + 2vw, 3rem); font-weight: 400; }
.session-head p { color: var(--ink-soft); font-size: 1.1rem; }
.nw { white-space: nowrap; }
.benefits { display: grid; gap: .7rem; }
.benefits li { position: relative; padding-left: 1.3rem; }
.benefits li::before { content: ""; position: absolute; left: 0; top: .62em; width: 7px; height: 7px; border-radius: 50%; background: var(--gold); }
.session-path { position: relative; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); padding-top: 150px; margin-top: clamp(2rem, 4vw, 3rem); }
.session-curve { position: absolute; left: 0; top: 0; width: 100%; height: 120px; overflow: visible; }
.session-curve path { fill: none; stroke: var(--gold); stroke-width: 1.5; stroke-linecap: round; }
.session-steps { grid-column: 1 / 4; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.session-steps li { position: relative; display: grid; justify-items: center; align-content: start; gap: .45rem; text-align: center; padding-inline: 1rem; }
.session-steps li::before {
  content: ""; position: absolute; left: 50%; top: calc(var(--ny) - 150px - 7px); width: 14px; height: 14px; margin-left: -7px; border-radius: 50%;
  background: #fffaf0; box-shadow: 0 0 0 2px var(--gold), 0 0 22px 8px rgb(var(--halo) / .7);
}
.session-steps li:nth-child(1) { --ny: 40px; }
.session-steps li:nth-child(2) { --ny: 88px; }
.session-steps li:nth-child(3) { --ny: 36px; }
.session-n { font: 500 .9rem/1 var(--font-display); letter-spacing: .08em; color: var(--gold); }
.session-steps h4 { font-size: clamp(1.45rem, 1rem + 1vw, 2rem); font-weight: 420; letter-spacing: -0.015em; }
.session-steps p { color: var(--ink-soft); max-width: 22ch; }
.session-sun { position: relative; display: grid; gap: 1rem; align-content: start; padding-inline: 1rem; }
/* Halo du soleil : vrai élément, pour que le script puisse l'animer */
.session-glow {
  position: absolute; z-index: -1; left: 50%; top: -90px; width: 300px; height: 300px; translate: -50% -50%; border-radius: 50%; pointer-events: none;
  background: radial-gradient(closest-side, #fffdf7 0 13%, rgb(255 238 200 / .95) 22%, rgb(255 216 152 / .5) 45%, rgb(255 205 140 / .14) 70%, rgb(255 205 140 / 0));
}
.session-sun h4 { font-size: 1.35rem; font-weight: 500; }
.session-sun .benefits { font-size: 1.02rem; }
.session-disclaimer { margin-top: 2.5rem; }
@media (max-width: 900px) {
  .session-path { grid-template-columns: 1fr; padding: 0 0 0 2.6rem; gap: 2.4rem; }
  .session-steps { position: relative; }
  /* Ligne verticale dorée qui remplace la courbe sur mobile */
  .session-steps::before { content: ""; position: absolute; left: calc(-2.6rem + 7px); top: .6rem; bottom: calc(-2.4rem - .8rem); width: 1.5px; background: linear-gradient(var(--gold), rgb(var(--halo))); transform: scaleY(var(--line, 1)); transform-origin: top; }
  .session-curve { display: none; }
  .session-steps { grid-column: auto; grid-template-columns: 1fr; gap: 2.2rem; }
  .session-steps li { justify-items: start; text-align: left; padding-inline: 0; }
  .session-steps li::before { left: calc(-2.6rem + 1px); top: .3rem; margin-left: 0; }
  .session-sun { padding-inline: 0; }
  .session-glow { left: calc(-2.6rem + 8px); top: .8rem; width: 200px; height: 200px; }
}

/* Magnétisme : photo en arche + texte, puis ruban du déroulement */
.magnetisme { --h1x: 90%; --h1y: 30%; --h2x: 10%; --h2y: 90%; }
.magnetisme-grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(2rem, 6vw, 6rem); align-items: start; }
.magnetisme-photo { margin: 0; position: sticky; top: calc(var(--header-h) + 2rem); }
.magnetisme-photo img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; border-radius: var(--radius) var(--radius) 999px 999px; box-shadow: var(--shadow); }
.magnetisme-copy { display: grid; gap: 1.5rem; }
.magnetisme-copy > p:not(.lead) { color: var(--ink-soft); max-width: 62ch; }
.relief { margin-top: 1rem; display: grid; gap: 1.25rem; }
.relief-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem 2.5rem; padding-top: 1.25rem; border-top: 1px solid var(--line); }
.relief h4 { color: var(--accent-ink); margin-bottom: .6rem; }
.relief li { padding-block: .3rem; }
.fire {
  margin-top: 1rem; padding: clamp(1.5rem, 3vw, 2.25rem); border-radius: var(--radius);
  background: linear-gradient(150deg, #fbeadf, #f6dccd); border: 1px solid rgb(164 88 74 / .25);
  display: grid; gap: .75rem;
}
.ribbon { margin-top: clamp(4rem, 8vw, 6.5rem); }
.ribbon h3 { display: flex; flex-wrap: wrap; align-items: baseline; gap: .4rem 1rem; margin-bottom: 2.25rem; }
.ribbon h3 .muted { font: 400 1rem/1.4 var(--font-body); }
.ribbon-track { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.5rem; position: relative; }
.ribbon-track::before { content: ""; position: absolute; top: 7px; left: 0; right: 0; height: 2px; background: linear-gradient(90deg, var(--gold), rgb(164 88 74 / .2)); }
.ribbon-track li { position: relative; padding-top: 2.25rem; display: grid; gap: .5rem; align-content: start; }
.ribbon-track li::before { content: ""; position: absolute; top: 0; left: 0; width: 16px; height: 16px; border-radius: 50%; background: var(--bg); border: 2px solid var(--accent); }
.ribbon-track li:nth-child(3)::before { background: var(--accent); box-shadow: 0 0 0 6px rgb(var(--halo) / .35); }
.ribbon-track p { color: var(--ink-soft); font-size: 1.02rem; }
@media (max-width: 1023px) {
  .ribbon-track { grid-template-columns: 1fr 1fr; row-gap: 2.5rem; }
  .ribbon-track::before { display: none; }
}
@media (max-width: 767px) {
  .magnetisme-grid { grid-template-columns: 1fr; }
  .magnetisme-photo { position: static; max-width: 360px; }
  .relief-cols, .ribbon-track { grid-template-columns: 1fr; }
}

/* Tarifs : carte de soins claire, à la lueur des bougies */
.tarifs {
  --h2x: 50%; --h2y: 100%;
  background: var(--bg) url("../img/bougies-1920.webp") center bottom / cover no-repeat;
}
.tarifs::before {
  width: auto; height: auto; inset: 0; left: 0; top: 0; translate: none; border-radius: 0; animation: none;
  background: linear-gradient(180deg, rgb(248 241 229 / .9) 0%, rgb(248 241 229 / .62) 45%, rgb(248 241 229 / .2) 100%);
}
/* Fondu bas : les bougies se fondent dans la section suivante, sans coupure nette. */
.tarifs::after {
  width: auto; height: 240px; inset: auto 0 0; left: 0; top: auto; translate: none; border-radius: 0; animation: none;
  background: linear-gradient(180deg, rgb(248 241 229 / 0), var(--bg));
}
.menu-head { display: grid; justify-items: center; text-align: center; gap: .7rem; margin-bottom: clamp(2.5rem, 5vw, 4rem); }
.menu-head p { color: var(--ink-soft); }
.menu-mark { width: 60px; height: 60px; --enso-color: var(--accent); --tree-color: var(--tree); }
.menu { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 6vw, 6rem); max-width: 1000px; margin-inline: auto; }
.menu-col h3 { font: 600 .95rem/1.3 var(--font-body); letter-spacing: .16em; text-transform: uppercase; color: var(--accent-ink); }
.menu-sub { margin-top: .35rem; color: var(--ink-soft); font-size: 1rem; }
.menu-list { margin-top: 1.25rem; display: grid; gap: 1.05rem; }
.price-row { display: flex; align-items: baseline; gap: .8rem; }
.row-name { font: 400 1.3rem/1.3 var(--font-display); }
.row-name small { display: block; margin-top: .15rem; font: 400 .95rem/1.3 var(--font-body); color: var(--ink-soft); }
.leader { flex: 1; min-width: 1.5rem; border-bottom: 2px dotted rgb(168 117 46 / .6); translate: 0 -.3em; }
.row-price { font: 500 1.45rem/1 var(--font-display); color: var(--accent-ink); white-space: nowrap; }
.menu-divider { display: grid; place-items: center; margin: clamp(2.5rem, 5vw, 3.5rem) auto; color: var(--gold); }
.menu-divider svg { width: 46px; height: 46px; }
.tarifs-cta { margin-top: clamp(2.5rem, 5vw, 3.5rem); display: grid; justify-items: center; gap: 1rem; text-align: center; }
.tarifs-cta p { font-size: 1.15rem; }
@media (max-width: 800px) { .menu { grid-template-columns: 1fr; } }

/* Contact */
.contact { --h1x: 85%; --h1y: 55%; --h2x: 4%; --h2y: 75%; }
.contact-grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(2rem, 6vw, 6rem); align-items: center; }
.contact-main { display: grid; gap: 1.25rem; justify-items: start; }
.phone-big { font: 360 clamp(2.4rem, 1.2rem + 5vw, 5rem)/1 var(--font-display); letter-spacing: -0.02em; text-decoration: none; color: var(--accent-ink); font-variation-settings: "opsz" 96; }
.phone-big:hover { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 8px; }
.contact-list { display: grid; gap: .8rem; margin-top: .75rem; }
.contact-list li { display: flex; gap: .8rem; align-items: flex-start; }
.contact-list .icon { margin-top: .2rem; color: var(--accent-ink); }
.contact-list address { font-style: normal; }
.link-arrow { display: inline-flex; gap: .4rem; align-items: center; font-weight: 600; text-underline-offset: 5px; }
.contact-photo { margin: 0; }
.contact-photo img { border-radius: var(--radius); box-shadow: var(--shadow); width: 100%; aspect-ratio: 1; object-fit: cover; }
@media (max-width: 767px) {
  .contact-grid { grid-template-columns: 1fr; }
  .contact-photo { max-width: 360px; }
}

/* Pied de page */
.site-footer { border-top: 1px solid var(--line); padding-block: 3rem; font-size: 1rem; color: var(--ink-soft); background: var(--bg-alt); }
.footer-grid { display: grid; grid-template-columns: auto 1fr; gap: 1.5rem 3rem; align-items: start; }
.footer-brand { display: flex; gap: .9rem; align-items: center; color: var(--ink); }
.footer-brand .mark { width: 48px; height: 48px; }
.footer-note { align-self: center; }
.legal { grid-column: 1 / -1; }
.legal summary { cursor: pointer; font-weight: 600; color: var(--ink); width: fit-content; }
.legal-body { display: grid; gap: .6rem; margin-top: 1rem; max-width: 80ch; }
.copyright { grid-column: 1 / -1; font-size: .9rem; }
@media (max-width: 767px) { .footer-grid { grid-template-columns: 1fr; } }
.tva-note { margin-top: 1.5rem; text-align: center; font-size: .95rem; color: var(--ink-soft); }

/* Contenu modifiable : bandeau d'annonce, témoignages, horaires */
.annonce { position: fixed; inset: 0 0 auto; z-index: 30; margin: 0; padding: .55rem 1rem; text-align: center; font-size: .92rem; background: var(--ink); color: var(--bg); }
.annonce[hidden], .temoignages[hidden], [data-edit-wrap][hidden] { display: none; }
.has-annonce .site-header { top: var(--annonce-h, 0); }
.contact address { white-space: pre-line; }
.temoignages-liste { display: grid; gap: 1.5rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr)); margin-top: 1.5rem; }
.temoignage { margin: 0; padding: 1.5rem; background: var(--surface); border-radius: var(--radius); box-shadow: var(--shadow); }
.temoignage blockquote { margin: 0; font-family: var(--font-display); font-size: 1.15rem; line-height: 1.45; white-space: pre-line; }
.temoignage figcaption { margin-top: 1rem; color: var(--accent-ink); font-weight: 600; }
