/* ═══ EMOTION · Moment Accompagné — brouillon 28.07.2026 ══════════════════
   Parcours « traversée » : une question par écran, respirations, trace
   cliquable derrière soi, carte de toutes les étapes, reprise plus tard.
   Contrat de données inchangé : mêmes champs als_*, même payload AJAX.
   ═══════════════════════════════════════════════════════════════════════ */
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased}
body{font-family:var(--font-body);font-size:16px;line-height:1.6;font-weight:300;color:var(--cream);background:var(--ink-deep);overflow-x:hidden;min-height:100vh}
@keyframes slowIn{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:translateY(0)}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes halo{0%{transform:translateX(-50%) scale(1);opacity:.26}50%{transform:translateX(-50%) scale(1.06);opacity:.5}100%{transform:translateX(-50%) scale(1);opacity:.26}}
@media(prefers-reduced-motion:reduce){*{animation-duration:.001ms!important}}

.p-header{position:sticky;top:0;z-index:50;background:rgba(20,9,10,.9);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-bottom:1px solid var(--cream-line);padding:16px var(--pad-x);display:flex;align-items:center;justify-content:space-between;gap:16px}
.p-back{font-family:var(--font-body);font-size:.74rem;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--cream-mute);text-decoration:none;transition:color .3s}
.p-back:hover{color:var(--rose-soft)}

.stage{position:relative;min-height:74vh;overflow:hidden}
.stage__halo{position:absolute;top:-14vh;left:50%;width:min(940px,150vw);height:min(940px,150vw);border-radius:50%;background:radial-gradient(circle,rgba(196,141,118,.13),rgba(196,141,118,0) 68%);animation:halo 22s ease-in-out infinite;pointer-events:none}
.stage__in{position:relative;max-width:800px;margin:0 auto;padding:clamp(28px,6vw,72px) var(--pad-x) 40px}

.st-top{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-bottom:clamp(30px,5vw,56px)}
.st-where{font-family:var(--font-display);font-style:italic;font-size:1rem;color:var(--cream-mute);margin:0}
.st-map-btn{white-space:nowrap;display:inline-flex;align-items:center;gap:9px;font-family:var(--font-body);font-size:.63rem;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--cream-mute);background:none;border:1px solid var(--cream-line);border-radius:100px;padding:8px 15px;cursor:pointer;transition:all .3s}
.st-map-btn:hover{color:var(--rose-soft);border-color:var(--rose-faint)}
.st-dots{display:flex;gap:3px;align-items:center}
.st-dots i{width:5px;height:5px;border-radius:50%;background:rgba(237,227,216,.14);display:block}
.st-dots i.is-on{background:var(--rose)}

.p-voice{font-family:var(--font-display);font-style:italic;font-size:clamp(16px,1.8vw,19px);line-height:1.8;color:var(--rose);margin:0 0 1.2rem;max-width:44ch}
.p-ask{font-family:var(--font-display);font-weight:300;font-size:clamp(29px,4.6vw,50px);line-height:1.14;color:var(--cream);margin:0 0 1.1rem;max-width:26ch}
.p-hint{font-family:var(--font-display);font-style:italic;font-size:clamp(16px,1.8vw,19px);line-height:1.8;color:var(--cream-mid);margin:0 0 clamp(24px,4vw,40px);max-width:50ch}
.p-anim{animation:slowIn .9s var(--ease) both}

/* Respiration */
.p-breath{text-align:center;padding:clamp(18px,4vw,44px) 0}
.p-breath__text{font-family:var(--font-display);font-style:italic;font-weight:300;font-size:clamp(23px,3.8vw,38px);line-height:1.42;color:var(--cream);margin:0 auto 1.6rem;max-width:30ch}
.p-breath__sub{font-family:var(--font-display);font-style:italic;font-size:clamp(16px,1.8vw,19px);line-height:1.8;color:var(--cream-mute);margin:0 auto 2.6rem;max-width:44ch}

/* Champs */
.tags-wrap{display:flex;flex-wrap:wrap;gap:11px}
.tag{display:inline-block;flex:0 0 auto;max-width:100%;padding:12px 21px;font-family:var(--font-display);font-size:1.05rem;font-style:italic;color:var(--cream-mid);background:transparent;border:1px solid var(--cream-line);border-radius:100px;cursor:pointer;transition:all .35s var(--ease);user-select:none;-webkit-user-select:none;line-height:1.3;text-align:center}
.tag:hover{color:var(--rose-soft);border-color:var(--rose-faint);transform:translateY(-1px)}
.tag.is-on{color:var(--cream);background:var(--rose-faint);border-color:var(--rose)}
.tag--neutre{border-style:dashed;color:var(--cream-faint)}
.tag--neutre.is-on{color:var(--cream);border-style:solid}
.tags-more{flex:0 0 auto;white-space:nowrap;font-family:var(--font-body);font-size:.72rem;color:var(--cream-mute);background:none;border:1px dashed rgba(196,141,118,.35);border-radius:100px;padding:10px 17px;cursor:pointer;transition:all .3s}
.tags-more:hover{color:var(--rose-soft);border-color:var(--rose)}
.choice{flex:0 0 auto;max-width:100%;padding:14px 24px;font-family:var(--font-display);font-style:italic;font-size:1.1rem;line-height:1.3;text-align:center;color:var(--cream-mid);background:transparent;border:1px solid var(--cream-line);border-radius:100px;cursor:pointer;transition:all .35s var(--ease)}
.choice:hover{color:var(--rose-soft);border-color:var(--rose-faint);transform:translateY(-1px)}
.choice.is-on{color:var(--cream);background:var(--rose-faint);border-color:var(--rose)}
.choice--neutre{border-style:dashed;color:var(--cream-faint)}
.choice--neutre.is-on{border-style:solid;color:var(--cream)}

.uni-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(212px,100%),1fr));gap:14px}
.uni{text-align:left;padding:0;border-radius:16px;overflow:hidden;cursor:pointer;border:1px solid var(--cream-line);background:var(--ink);color:var(--cream);transition:border-color .45s var(--ease),transform .45s var(--ease)}
.uni:hover{transform:translateY(-2px);border-color:var(--rose-faint)}
.uni.is-on{border-color:var(--rose)}
.uni__sky{display:block;height:78px;position:relative}
.uni__bars{position:absolute;left:14px;bottom:10px;display:flex;gap:3px;align-items:flex-end;height:34px}
.uni__bars i{width:3px;background:rgba(237,227,216,.65);border-radius:2px;display:block}
.uni__body{display:block;padding:14px 16px 16px}
.uni__name{font-family:var(--font-display);font-style:italic;font-size:1.12rem;color:var(--cream)}
.uni__mark{font-family:var(--font-body);font-size:.58rem;letter-spacing:.14em;text-transform:uppercase;color:var(--rose);opacity:0;transition:opacity .3s}
.uni.is-on .uni__mark{opacity:1}
.uni__desc{display:block;font-family:var(--font-body);font-size:.8rem;line-height:1.6;color:var(--cream-mid);margin-top:6px}
.uni__feel{display:block;font-family:var(--font-display);font-style:italic;font-size:.86rem;color:var(--cream-mute);margin-top:8px}

.field-label{font-family:var(--font-body);font-size:.64rem;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--rose);margin:0 0 6px;display:block}
.field-input,.field-select,.field-textarea{background:var(--ink-soft);border:1px solid rgba(196,141,118,.3);border-radius:14px;padding:15px 18px;font-family:var(--font-body);font-size:.95rem;font-weight:300;color:var(--cream);-webkit-text-fill-color:var(--cream);caret-color:var(--rose);outline:none;width:100%;transition:border-color .3s,box-shadow .3s;appearance:none;-webkit-appearance:none}
.field-input:focus,.field-select:focus,.field-textarea:focus{border-color:var(--rose);box-shadow:0 0 0 3px var(--rose-faint)}
.field-input::placeholder,.field-textarea::placeholder{color:var(--cream-faint)!important;-webkit-text-fill-color:var(--cream-faint)!important;opacity:1;font-style:italic}
.field-input:-webkit-autofill,.field-input:-webkit-autofill:focus{-webkit-box-shadow:0 0 0 1000px var(--ink-soft) inset!important;-webkit-text-fill-color:var(--cream)!important}
.field-select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='7' viewBox='0 0 12 7'%3E%3Cpath d='M1 1l5 4 5-4' stroke='%23C48D76' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 15px center;padding-right:42px;cursor:pointer;background-color:var(--ink-soft)!important;color:var(--cream)!important}
.field-select option{background:var(--ink-deep)!important;color:var(--cream)!important}
.field-textarea{resize:vertical;min-height:130px;line-height:1.7;font-family:var(--font-display);font-style:italic;font-size:1.08rem}
.ta-foot{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:8px;flex-wrap:wrap}
.ta-ex{font-family:var(--font-body);font-size:.68rem;letter-spacing:.06em;color:var(--rose-soft);background:var(--rose-faint);border:1px solid rgba(196,141,118,.25);border-radius:100px;padding:8px 15px;cursor:pointer;transition:all .3s}
.ta-ex:hover{border-color:var(--rose)}
.ta-count{font-family:var(--font-body);font-size:.7rem;color:var(--cream-faint)}
.field-row{display:flex;flex-wrap:wrap;gap:12px}
.field-row>div{flex:1 1 215px}

.cadeau-block{display:none;margin-top:16px;padding:18px 20px;background:rgba(196,141,118,.06);border-left:3px solid var(--rose);border-radius:0 12px 12px 0}
.cadeau-block.is-on{display:block;animation:fadeIn .4s var(--ease) both}

/* Actions d'étape */
.st-actions{display:flex;gap:12px;align-items:center;margin-top:clamp(24px,4vw,38px);flex-wrap:wrap}
.btn-next{font-family:var(--font-body);font-size:.74rem;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--cream);background:var(--rose-faint);border:1px solid var(--rose);border-radius:100px;padding:16px 34px;cursor:pointer;transition:all .4s var(--ease)}
.btn-next:hover{background:var(--copper);border-color:var(--copper);transform:translateY(-2px)}
.btn-soft{white-space:nowrap;font-family:var(--font-body);font-size:.66rem;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--cream-mute);background:none;border:1px dashed rgba(196,141,118,.35);border-radius:100px;padding:13px 19px;cursor:pointer;transition:all .3s}
.btn-soft:hover{color:var(--rose-soft);border-color:var(--rose)}

/* Trace derrière soi */
.trail{margin-top:clamp(34px,6vw,64px);padding-top:22px;border-top:1px solid var(--cream-soft)}
.trail__lbl{font-family:var(--font-display);font-style:italic;font-size:.94rem;color:var(--cream-faint);margin:0 0 .9rem}
.trail__row{display:flex;flex-wrap:wrap;gap:8px}
.trail__item{display:inline-flex;align-items:baseline;gap:9px;padding:8px 15px;border-radius:100px;background:none;border:1px solid var(--cream-line);cursor:pointer;transition:all .3s;max-width:100%}
.trail__item:hover{border-color:var(--rose-faint);opacity:1!important}
.trail__k{font-family:var(--font-body);font-size:.59rem;font-weight:500;letter-spacing:.13em;text-transform:uppercase;color:var(--rose);white-space:nowrap}
.trail__v{font-family:var(--font-display);font-style:italic;font-size:.88rem;color:var(--cream-mid);max-width:24ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* Barre basse */
.p-bottom{position:sticky;bottom:0;z-index:40;background:rgba(20,9,10,.92);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-top:1px solid var(--cream-soft);padding:13px var(--pad-x);display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}
.p-bottom__back{white-space:nowrap;font-family:var(--font-body);font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--cream-mute);background:none;border:none;cursor:pointer;padding:8px 0;transition:color .3s}
.p-bottom__back:hover{color:var(--rose-soft)}
.p-bottom__note{font-family:var(--font-display);font-style:italic;font-size:.9rem;color:var(--cream-faint);margin:0;flex:1 1 200px;text-align:center}
.p-bottom__later{white-space:nowrap;font-family:var(--font-body);font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--rose-soft);background:none;border:1px solid rgba(196,141,118,.35);border-radius:100px;padding:9px 17px;cursor:pointer;transition:all .3s}
.p-bottom__later:hover{border-color:var(--rose);background:var(--rose-faint)}

/* Carte des étapes */
.p-map{position:fixed;inset:0;z-index:80;background:rgba(20,9,10,.94);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);overflow-y:auto;padding:clamp(24px,5vw,60px) var(--pad-x);display:none;animation:fadeIn .4s var(--ease) both}
.p-map.is-on{display:block}
.p-map__in{max-width:720px;margin:0 auto}
.p-map__head{display:flex;align-items:baseline;justify-content:space-between;gap:14px;margin-bottom:1.4rem;flex-wrap:wrap}
.p-map__title{font-family:var(--font-display);font-weight:300;font-style:italic;font-size:clamp(23px,3.2vw,32px);color:var(--cream);margin:0}
.p-map__lead{font-family:var(--font-display);font-style:italic;font-size:1rem;line-height:1.8;color:var(--cream-mute);margin:0 0 1.6rem;max-width:52ch}
.p-map__row{width:100%;display:flex;align-items:baseline;gap:14px;text-align:left;padding:13px 4px;background:none;border:none;border-bottom:1px solid var(--cream-soft);cursor:pointer;transition:padding-left .3s}
.p-map__row:hover{padding-left:10px}
.p-map__dot{flex:0 0 8px;width:8px;height:8px;border-radius:50%;background:rgba(237,227,216,.14);margin-top:7px}
.p-map__dot.is-on{background:var(--rose)}
.p-map__q{display:block;font-family:var(--font-display);font-size:1.1rem;color:var(--cream)}
.p-map__v{display:block;font-family:var(--font-display);font-style:italic;font-size:.9rem;color:var(--cream-mid);margin-top:3px}
.p-map__v.is-todo{color:#E8B86A}

/* Bloc final */
.p-card{padding:clamp(20px,3vw,30px);background:var(--ink);border:1px solid var(--cream-line);border-radius:18px;margin-top:26px}
.p-card__lbl{font-family:var(--font-body);font-size:.68rem;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--rose);margin:0 0 1.1rem}
.format-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:640px){.format-grid{grid-template-columns:1fr}}
.format-card{position:relative;padding:24px;background:var(--ink-soft);border:1px solid var(--cream-line);border-radius:16px;cursor:pointer;transition:all .4s var(--ease);text-align:left;width:100%}
.format-card:hover{border-color:var(--rose-faint);transform:translateY(-2px)}
.format-card.is-active{border-color:var(--rose);background:linear-gradient(135deg,var(--ink-soft),rgba(92,36,36,.25))}
.format-card__name{font-family:var(--font-display);font-style:italic;font-weight:500;font-size:1.3rem;color:var(--cream);margin:0 0 .3rem}
.format-card__price{font-family:var(--font-display);font-weight:500;font-size:1.08rem;color:var(--rose);margin:0 0 .8rem}
.format-card__desc{font-family:var(--font-body);font-size:.87rem;line-height:1.65;color:var(--cream-mid);margin:0 0 .9rem}
.format-card__tag{font-family:var(--font-body);font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--cream-faint)}
.format-card__dot{position:absolute;top:16px;right:16px;width:16px;height:16px;border-radius:50%;border:1px solid var(--cream-line);transition:all .3s}
.format-card.is-active .format-card__dot{background:var(--rose);border-color:var(--rose)}
.is-hidden{display:none!important}

.p-check{display:flex;align-items:flex-start;gap:12px;padding:14px 16px;background:var(--cream-soft);border:1px solid var(--cream-line);border-radius:12px;cursor:pointer;margin-bottom:10px}
.p-check input[type="checkbox"]{width:18px;height:18px;flex-shrink:0;cursor:pointer;accent-color:var(--rose);margin-top:2px}
.p-check__text{font-family:var(--font-body);font-size:.84rem;line-height:1.6;color:var(--cream-mid)}
.p-check__text strong{color:var(--cream);font-weight:500}
.p-check__text a{color:var(--rose)}

.btn-defer{width:100%;font-family:var(--font-body);font-size:.68rem;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--rose-soft);background:none;border:1px dashed rgba(196,141,118,.35);border-radius:100px;padding:13px 16px;cursor:pointer;margin:16px 0 12px;transition:all .3s}
.btn-defer:hover{border-color:var(--rose);background:var(--rose-faint)}
.btn-pay{font-family:var(--font-body);font-size:.76rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;padding:18px;border-radius:999px;border:none;cursor:pointer;width:100%;background:var(--bordeaux);color:var(--cream);transition:all .4s var(--ease)}
.btn-pay:not(:disabled):hover{background:var(--copper);transform:translateY(-2px);box-shadow:0 16px 32px -10px rgba(184,88,56,.5)}
.btn-pay:disabled{opacity:.35;cursor:not-allowed;transform:none;box-shadow:none}
.pay-note{font-family:var(--font-display);font-style:italic;font-size:.9rem;color:var(--cream-faint);text-align:center;line-height:1.6;margin:12px 0 0}
.recap-list{background:var(--ink-soft);border:1px solid var(--cream-line);border-radius:14px;padding:4px 20px;margin-top:16px}
.recap__row{width:100%;display:flex;justify-content:space-between;gap:14px;align-items:flex-start;text-align:left;padding:11px 0;border:none;border-bottom:1px solid var(--cream-line);background:none;cursor:pointer}
.recap__row:last-child{border-bottom:none}
.recap__k{font-family:var(--font-body);font-size:.62rem;font-weight:500;letter-spacing:.13em;text-transform:uppercase;color:var(--rose);flex:0 0 auto;white-space:nowrap;padding-top:3px}
.recap__v{font-family:var(--font-display);font-style:italic;font-size:.94rem;text-align:right;line-height:1.45;color:var(--cream);flex:1 1 auto;min-width:0;overflow-wrap:anywhere}
.recap__v.is-todo{color:#E8B86A}
#als-submit-error-acc{margin:14px 0;padding:13px 16px;background:rgba(139,58,58,.15);border:1px solid rgba(139,58,58,.4);border-radius:8px;font-family:var(--font-display);font-style:italic;font-size:.92rem;color:#e89090;line-height:1.6;display:none}
#als-missing-acc{margin:12px 0;padding:12px 15px;background:rgba(139,88,58,.12);border:1px solid rgba(196,141,118,.25);border-radius:8px;font-family:var(--font-body);font-size:.82rem;color:var(--cream-mid);line-height:1.7;display:none}

.f-slim{background:#1A080B;border-top:1px solid var(--cream-line);padding:26px var(--pad-x)}
.f-slim__in{max-width:1180px;margin:0 auto;display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}
.f-slim__copy{font-family:var(--font-body);font-size:.72rem;color:var(--cream-faint);letter-spacing:.04em}
.f-slim__legals{display:flex;gap:18px;flex-wrap:wrap}
.f-slim__legals a{font-family:var(--font-body);font-size:.72rem;color:var(--cream-mute);text-decoration:none;transition:color .3s}
.f-slim__legals a:hover{color:var(--rose-soft)}

/* Passage d'un chemin a l'autre */
.path-switch{max-width:1180px;margin:0 auto;padding:12px var(--pad-x) 0;font-family:var(--font-body);font-weight:300;font-size:.82rem;line-height:1.6;color:var(--cream-faint);text-align:center}
.path-switch a{color:var(--rose);text-decoration:none;border-bottom:1px solid rgba(196,141,118,.3);padding-bottom:1px;transition:color .25s var(--ease-soft),border-color .25s var(--ease-soft)}
.path-switch a:hover{color:var(--rose-soft);border-color:var(--rose-soft)}

/* ═══ LE CIEL — 31.07.2026 ═══════════════════════════════════════════════════
   Même mécanisme que les pages V6. Ce qui est propre à cette page (halos,
   respirations, ouvertures de chapitre) n'est pas touché.
   Couche fixe en z-index -1 : posée après le fond de page, avant tout le
   contenu — jamais par-dessus un texte, et elle ne capte aucun clic. */
.brief-ciel{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.brief-ciel span{position:absolute;border-radius:50%}
@keyframes brief-scintille{0%,100%{opacity:.18}50%{opacity:.95}}
@media (prefers-reduced-motion: reduce){
  .brief-ciel span{animation:none!important;opacity:.28!important}
}
