/* Lanceur · fin de page : cercle « Constellation » de #rejoindre (variante « Tracé net ») + pied de page « Horizon »,
   et construction du logo Envol à sa place (assets/logo-envol.js, « Constellation en place »).
   Module isolé : constellation.css + logo-envol.js + constellation.js (variante 1 de variantes-constellation/ et
   variante 1 de variantes-logo/). L'arc se referme au milieu du liseré ; le logo au-dessus de « Sois parmi les premiers à
   lancer » (.final-mark) se construit sur place puis laisse la place au vrai fichier du logo. Le pied de page n'a pas de
   symbole.
   Variables posées par constellation.js sur .final : --kpl (allumage de la planète, 0 → 1) ; --kl (opacité du vrai
   logo : 0 pendant la construction, 1 à la fin). Voir README.md. */

/* =====================================================================
   Pied de page « Minimal sur l'horizon » (variantes-footer, n° 6)
   Le pied de page remonte sur la planète du rappel. Suppose .final-horizon { bottom: 120px } et .h-planet { top: 4px }
   (aurore.css) : liseré à 116 px du bas de #rejoindre.
   ===================================================================== */
.foot .disc { overflow-wrap: anywhere; }
.foot[data-footer="horizon"] { --mk: 64px; --ft-y: calc(var(--mk) * -.86); margin-top: calc(-116px + var(--ft-y)); padding: 0 0 44px; border-top: 0; background: transparent; z-index: 1; text-align: center; }
/* sans symbole (défaut) : le haut du pied de page est là où aurait été le bas du symbole, les liens ne bougent pas */
.foot[data-footer="horizon"]:not(.ft-h-sym) { --ft-y: calc(var(--mk) * .14); }
.foot[data-footer="horizon"]:not(.ft-h-sym) .ft-h-mark { display: none; }
.ft-h-in { display: flex; flex-direction: column; align-items: center; }
/* fondu de la planète vers la nuit, juste avant le bas de #rejoindre (qui la coupe net) : 14 px sous le liseré */
.foot[data-footer="horizon"]::before { content: ""; position: absolute; left: 0; right: 0; top: calc(14px - var(--ft-y)); height: 102px; z-index: -1; pointer-events: none; background: linear-gradient(180deg, color-mix(in srgb, var(--bg) 0%, transparent), color-mix(in srgb, var(--bg) 55%, transparent) 45%, var(--bg)); }
.ft-h-mark { display: block; width: var(--mk); height: var(--mk); border-radius: 12px; }
.ft-h-mark svg { width: 100%; height: 100%; overflow: visible; transition: transform .45s var(--ease); opacity: var(--kl, 1); }
.ft-h-mark:focus-visible svg { opacity: 1; }
.ft-h-mark:hover svg, .ft-h-mark:focus-visible svg { transform: translateY(-5px); }
.ft-h-flap, .ft-h-open { transform-box: view-box; transform-origin: 70px 64px; }
.ft-h-flap { transform: rotate(44.56deg) scaleY(1) rotate(-44.56deg); transition: transform .2s cubic-bezier(.5, 0, .9, .5) .22s; }
.ft-h-open { transform: rotate(44.56deg) scaleY(0) rotate(-44.56deg); transition: transform .22s cubic-bezier(.1, .5, .5, 1); }
.ft-h-mark:hover .ft-h-flap, .ft-h-mark:focus-visible .ft-h-flap { transform: rotate(44.56deg) scaleY(0) rotate(-44.56deg); transition-delay: 0s; }
.ft-h-mark:hover .ft-h-open, .ft-h-mark:focus-visible .ft-h-open { transform: rotate(44.56deg) scaleY(1) rotate(-44.56deg); transition: transform .26s cubic-bezier(.1, .6, .4, 1) .2s; }
.ft-h-shadow { transform-box: fill-box; transform-origin: 50% 50%; opacity: .55; transition: transform .45s var(--ease), opacity .45s; }
.ft-h-mark:hover .ft-h-shadow, .ft-h-mark:focus-visible .ft-h-shadow { transform: scaleX(.7); opacity: .3; }
.ft-h-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 26px; margin-top: 40px; }
.ft-h-links a { font-size: 13.5px; color: var(--muted); text-decoration: none; }
.ft-h-links a:hover { color: var(--text); }
.ft-h-copy { margin-top: 14px; font: 500 12px var(--f-mono); color: var(--subtle); }
.foot[data-footer="horizon"] .disc { margin: 20px auto 0; max-width: 760px; }
@media (max-width: 640px) {
  .foot[data-footer="horizon"] { --mk: 52px; }
  .ft-h-links { gap: 6px 18px; margin-top: 34px; }
}

/* =====================================================================
   Constellation : un seul SVG vectoriel sous le texte de #rejoindre (traits nets à toute densité de pixels)
   ===================================================================== */
.k-svg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: -1; pointer-events: none; overflow: hidden; shape-rendering: geometricPrecision; }
.k-svg line { fill: none; stroke-linecap: round; stroke-width: 1; }
.k-ln { stroke: color-mix(in srgb, var(--primary) 70%, #fff); }
.k-ln-arc { stroke: color-mix(in srgb, var(--primary) 45%, #fff); }
.k-ln-l { stroke: color-mix(in srgb, var(--primary) 40%, #fff); }
.k-core { fill: var(--text); }
.k-core.k-hub { fill: color-mix(in srgb, var(--a4) 50%, #fff); }
.k-ring { fill: none; stroke: color-mix(in srgb, var(--primary) 70%, #fff); stroke-width: 1; opacity: .35; }
.k-g0 { stop-color: color-mix(in srgb, var(--a4) 50%, #fff); }
.k-g1 { stop-color: var(--a3); }
.k-g2 { stop-color: var(--g2); }
.k-r1 { stop-color: var(--rv1); } .k-r2 { stop-color: var(--rv2); } .k-r3 { stop-color: var(--rv3); } .k-r4 { stop-color: var(--rv4); }

/* Logo du haut : le vrai fichier, caché pendant la construction (--kl ; 1 sans script et en mouvement réduit) */
.final.k-haut .final-mark { opacity: var(--kl, 1); }

/* La planète s'allume quand l'arc se referme (--kpl posé par le script ; 1 par défaut, sans script) */
.final.k-on .final-horizon .h-planet { opacity: calc(.2 + .8 * var(--kpl, 1)); }
.final.k-on .final-horizon .h-glow { filter: blur(28px) opacity(calc(.25 + .75 * var(--kpl, 1))); }

/* ---------- Mouvement réduit : constellation complète et logo, sans animation ---------- */
@media (prefers-reduced-motion: reduce) {
  .final-horizon .h-glow { animation: none; }
  .ft-h-mark svg, .ft-h-flap, .ft-h-open, .ft-h-shadow { transition: none; }
}
