/* Film du logo, milieu de l'accueil (oct. 2026, v2 : poursuites, étincelles, éclat, logo vivant).
   Fichier autonome : retirer la section .jf26-sec + film.css/js = retour arrière. */
.jf26-sec{padding-block:clamp(24px,5vh,64px)}
.jf26{position:relative;aspect-ratio:16/9;overflow:hidden;border-radius:30px;isolation:isolate;container-type:inline-size;
  transform:scale(.86);transition:transform .9s cubic-bezier(.2,.7,.2,1),border-radius .9s;background:#12352B;cursor:pointer}
.jf26.big{transform:none;border-radius:14px}
@media (max-width:900px){.jf26,.jf26.big{transform:none;border-radius:16px}}
.jf26>*{position:absolute;inset:0}
.jf26 .jf-bg{background:linear-gradient(135deg,#0D2A21 0%,#1D4A3B 48%,#24604A 100%);overflow:hidden}
.jf26 .jf-bg i{position:absolute;border-radius:50%;filter:blur(60px)}
.jf26 .jf-bg .b1{width:62%;height:90%;left:-12%;top:-30%;background:radial-gradient(circle,rgba(242,164,11,.42),transparent 65%);animation:jfB1 14s ease-in-out infinite alternate}
.jf26 .jf-bg .b2{width:55%;height:80%;right:-15%;bottom:-35%;background:radial-gradient(circle,rgba(63,185,196,.30),transparent 65%);animation:jfB2 17s ease-in-out infinite alternate}
.jf26 .jf-bg .b3{width:40%;height:60%;left:35%;top:30%;background:radial-gradient(circle,rgba(233,201,121,.18),transparent 65%);animation:jfB1 11s ease-in-out infinite alternate-reverse}
@keyframes jfB1{to{transform:translate(28%,22%) scale(1.15)}}
@keyframes jfB2{to{transform:translate(-30%,-18%) scale(1.2)}}
.jf26 .jf-light{background:radial-gradient(80% 90% at 50% 40%,#FFFFFF 0%,#FBF8EF 60%,#F3F1E6 100%)}
.jf26 .jf-svg{width:100%;height:100%;display:block}
.jf26 .tl-rot,.jf26 .lk-leaf,.jf26 .lk-sh,.jf26 .lk-rip,.jf26 .lk-drop,.jf26 .wm{transform-box:fill-box}

.jf26 .tl path{fill:rgba(29,74,59,.055)}
.jf26 .tl-rot{transform-origin:center;animation:jfSpin 60s linear infinite}
@keyframes jfSpin{to{transform:rotate(360deg)}}
.jf26 .gc,.jf26 .wm,.jf26 .gd,.jf26 .lk-out,.jf26 .lk-rip,.jf26 .jf-tag{opacity:0}
.jf26 .lk-txt{fill:#16382B}
.jf26 .lk-base{fill:#8A6216;font:500 16.7px "JetBrains Mono",Consolas,monospace;text-anchor:middle}
.jf26 .gd *{stroke-dasharray:1 1}
.jf26 .lk-out,.jf26 .lk-in{stroke-dasharray:1 1}
.jf26 .lk-sh,.jf26 .lk-rip{transform-origin:center}
.jf26 .lk-drop{transform-origin:50% 100%}
.jf26 .lk-leaf{transform-origin:center}
.jf26 .wm{transform-origin:center}

.jf26.play .wg{animation:jfRise .8s calc(.35s + var(--n)*.035s) cubic-bezier(.22,1.3,.36,1) both}
.jf26.play .wm{animation:jfWm .7s 2.7s cubic-bezier(.6,0,.4,1) both}
.jf26.play .gc{animation:jfGc 6.2s 3s linear both}
.jf26.play .jf-tag{animation:jfTag .6s 7.5s ease-in both}
.jf26.play .jf-tag i{animation:jfLine .85s calc(3.35s + var(--k)*.12s) cubic-bezier(.2,.8,.2,1) both}
.jf26.play .gd{animation:jfGd 3.7s 8.2s ease-out both}
.jf26.play .gd *{animation:jfDash 1.1s 8.2s cubic-bezier(.65,0,.35,1) both}
.jf26.play .lk-out{animation:jfOut 2.2s 8.6s ease-in-out both}
.jf26.play .lk-fill{animation:jfFade .8s 10.1s ease-out both}
.jf26.play .lk-sh{animation:jfPud .8s 10.2s cubic-bezier(.34,1.56,.64,1) both}
.jf26.play .lk-in{animation:jfDashO .9s 10.5s cubic-bezier(.65,0,.35,1) both}
.jf26.play .tl{animation:jfFade 1.4s 10.8s ease-out both}
.jf26.play .tl path{animation:jfTlInk 1s 16.4s ease both}
.jf26.play .lk-leaf{animation:jfLeaf 1.2s 11.8s cubic-bezier(.7,0,.25,1) both}
.jf26.play .lg{animation:jfRiseL .8s calc(12.5s + var(--n)*.035s) cubic-bezier(.22,1.3,.36,1) both}
.jf26.play .lc{animation:jfTrack 1.2s 13.4s cubic-bezier(.16,.84,.3,1) both}
.jf26.play .lk-drop{animation:jfDrop .8s 14.3s both}
.jf26.play .lk-rip{animation:jfRip .9s 14.75s ease-out both}
.jf26.play .lk-sheen{animation:jfSheen 1.1s 15.1s cubic-bezier(.45,0,.2,1) both}
.jf26.play .jf-light{animation:jfFade 1.1s 16.4s ease both}
.jf26.play .lk-txt{animation:jfInk 1s 16.4s ease both}
.jf26.play .lk-base{animation:jfGold 1s 16.4s ease both}
.jf26.play .jf-sig{animation:jfSig 1s 17.4s cubic-bezier(.2,.8,.2,1) both}

@keyframes jfRise{from{transform:translateY(34px);opacity:0}to{transform:none;opacity:1}}
@keyframes jfRiseL{from{transform:translateY(40px);opacity:0}to{transform:none;opacity:1}}
@keyframes jfWm{from{opacity:1;transform:none}to{opacity:0;transform:scale(.93)}}
@keyframes jfGc{0%{transform:translateX(1500px);opacity:0}10%{opacity:.09}88%{opacity:.09}100%{transform:translateX(-1600px);opacity:0}}
@keyframes jfTag{from{opacity:1;transform:none}to{opacity:0;transform:translateY(-5%)}}
@keyframes jfLine{from{transform:translateY(115%)}to{transform:none}}
@keyframes jfGd{0%{opacity:.85}75%{opacity:.85}100%{opacity:0}}
@keyframes jfDashO{0%{stroke-dashoffset:1;opacity:0}3%{opacity:1}100%{stroke-dashoffset:0;opacity:1}}
@keyframes jfDash{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes jfOut{0%{opacity:1;stroke-dashoffset:1}65%{opacity:1;stroke-dashoffset:0}100%{opacity:0;stroke-dashoffset:0}}
@keyframes jfFade{from{opacity:0}to{opacity:1}}
@keyframes jfPud{from{transform:scaleX(0);opacity:0}to{transform:none;opacity:.8}}
@keyframes jfLeaf{from{transform:translate(125px,19px) scale(1.6)}to{transform:none}}
@keyframes jfTrack{0%{opacity:0;transform:translateX(var(--dx))}35%{opacity:.6}100%{opacity:1;transform:none}}
@keyframes jfDrop{0%{transform:translateY(-70px);opacity:0;animation-timing-function:cubic-bezier(.55,0,1,.45)}12%{opacity:1}55%{transform:none;animation-timing-function:ease-out}66%{transform:scale(1.25,.75)}82%{transform:translateY(-2px) scale(.94,1.06)}100%{transform:none;opacity:1}}
@keyframes jfRip{0%{transform:scale(.3);opacity:.9}100%{transform:scale(2.6);opacity:0}}
@keyframes jfSheen{from{transform:translateX(0)}to{transform:translateX(270px)}}
@keyframes jfInk{from{fill:#FFFFFF}to{fill:#16382B}}
@keyframes jfGold{from{fill:#E9C979}to{fill:#8A6216}}
@keyframes jfTlInk{from{fill:rgba(255,255,255,.07)}to{fill:rgba(29,74,59,.055)}}
@keyframes jfSig{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}

.jf26 .jf-tag{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#fff;
  font-family:'Instrument Sans','Poppins',system-ui,sans-serif;text-transform:uppercase;letter-spacing:.02em;line-height:1.02;pointer-events:none}
.jf26 .jf-tag span{display:block;overflow:hidden;padding-block:.06em}
.jf26 .jf-tag i{display:block;font-style:normal;font-size:5.3cqw}
.jf26 .jf-tag .lt i{font-weight:400}
.jf26 .jf-tag .bd i{font-weight:700}
.jf26 .jf-tag .or i{color:#F2B44A}
.jf26 .jf-sig{inset:auto 0 6% 0;margin:0;text-align:center;font:italic 400 2.9cqw/1.1 'Instrument Serif','Serif secours',Georgia,serif;color:#1D4A3B;pointer-events:none}
.jf26 .jf-btn{inset:auto 18px 18px auto;width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.4);background:rgba(10,30,24,.35);
  color:#fff;font:600 11px/1 'Instrument Sans','Poppins',sans-serif;cursor:pointer;backdrop-filter:blur(6px);display:grid;place-items:center;z-index:5;transition:background .2s}
.jf26 .jf-btn:hover{background:rgba(10,30,24,.6)}
.jf26 .jf-btn:focus-visible{outline:2px solid #E9C979;outline-offset:3px}
.jf26 .jf-btn svg{width:14px;height:14px}
.jf26.paused,.jf26.paused *{animation-play-state:paused!important}

.jf26 .jf-fx{pointer-events:none;z-index:4;width:100%;height:100%}
.jf26 .jf-svg{transform-origin:50% 50%}
.jf26.play .jf-svg{animation:jfCam 19s cubic-bezier(.3,0,.3,1) both}
@keyframes jfCam{0%{transform:scale(1.06)}60%{transform:scale(1)}100%{transform:scale(1.015)}}
.jf26 .jf-beams{pointer-events:none;z-index:3;overflow:hidden;opacity:0}
.jf26 .jf-beams i{position:absolute;top:-12%;width:36%;height:150%;transform-origin:50% 0;mix-blend-mode:screen;filter:blur(10px);
  background:linear-gradient(to bottom,rgba(255,238,200,0),rgba(255,238,200,.20) 55%,rgba(255,238,200,.34));clip-path:polygon(46% 0,54% 0,100% 100%,0 100%)}
.jf26 .jf-beams .l{left:-4%}.jf26 .jf-beams .r{right:-4%}
.jf26.play .jf-beams{animation:jfBeams 3.4s .1s ease both}
.jf26.play .jf-beams .l{animation:jfBeamL 3.4s .1s cubic-bezier(.45,0,.55,1) both}
.jf26.play .jf-beams .r{animation:jfBeamR 3.4s .1s cubic-bezier(.45,0,.55,1) both}
@keyframes jfBeams{0%{opacity:0}12%{opacity:1}22%{opacity:.6}28%{opacity:1}80%{opacity:1}100%{opacity:0}}
@keyframes jfBeamL{from{transform:rotate(38deg)}to{transform:rotate(-26deg)}}
@keyframes jfBeamR{from{transform:rotate(-38deg)}to{transform:rotate(22deg)}}
.jf26 .jf-flare{pointer-events:none;z-index:5;opacity:0;mix-blend-mode:screen}
.jf26 .jf-flare::before{content:"";position:absolute;left:-30%;right:-30%;top:calc(50% - 1px);height:2px;background:linear-gradient(90deg,transparent,rgba(255,236,190,.0) 20%,rgba(255,240,205,.95) 50%,rgba(255,236,190,0) 80%,transparent);filter:blur(1px)}
.jf26 .jf-flare::after{content:"";position:absolute;left:50%;top:50%;width:46%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,rgba(255,240,205,.55),rgba(242,180,74,.18) 35%,transparent 65%)}
.jf26.play .jf-flare{animation:jfFlare 1.3s 12.9s cubic-bezier(.3,0,.2,1) both}
@keyframes jfFlare{0%{opacity:0;transform:translateX(-40%) scaleY(.6)}35%{opacity:1}100%{opacity:0;transform:translateX(40%) scaleY(1)}}
.jf26 .jf-bloom{pointer-events:none;z-index:6;opacity:0;background:radial-gradient(circle at 50% 46%,#FFFDF6 0%,rgba(255,250,235,.95) 22%,rgba(255,245,220,0) 60%);transform-origin:50% 46%}
.jf26.play .jf-bloom{animation:jfBloom 1.6s 15.9s cubic-bezier(.4,0,.2,1) both}
@keyframes jfBloom{0%{opacity:0;transform:scale(.15)}35%{opacity:1}60%{opacity:1;transform:scale(2.6)}100%{opacity:0;transform:scale(3)}}
.jf26.play .jf-light{animation:jfFade .6s 16.5s ease both}
.jf26.play .lk-txt{animation:jfInk .6s 16.5s ease both}
.jf26.play .lk-base{animation:jfGold .6s 16.5s ease both}
.jf26.play .tl path{animation:jfTlInk .6s 16.5s ease both}
.jf26.play .jf-tag .or i{animation:jfLine .85s calc(3.35s + var(--k)*.12s) cubic-bezier(.2,.8,.2,1) both,jfShim 2.2s 4.2s linear both}
.jf26 .jf-tag .or i{background:linear-gradient(100deg,#F2B44A 0%,#F2B44A 38%,#FFF1C9 50%,#F2B44A 62%,#E99D30 100%);background-size:280% 100%;background-position:100% 0;-webkit-background-clip:text;background-clip:text;color:transparent}
@keyframes jfShim{from{background-position:100% 0}to{background-position:0 0}}
.jf26.play .gc{animation:jfGc 6.2s 3s linear both,jfBlur 6.2s 3s ease both}
@keyframes jfBlur{0%{filter:blur(6px)}30%{filter:blur(0)}100%{filter:blur(2px)}}
.jf26.play .lk-fill{animation:jfFillFlash 1.1s 10.1s ease-out both}
@keyframes jfFillFlash{0%{opacity:0;filter:brightness(1.4)}35%{opacity:1;filter:brightness(1.15)}100%{opacity:1;filter:none}}
.jf26.live{cursor:crosshair}
.jf26 .jf-hint{inset:auto 0 2.4% 0;text-align:center;pointer-events:none;z-index:6;font:500 1.05cqw/1 "JetBrains Mono",Consolas,monospace;letter-spacing:.14em;text-transform:uppercase;color:#5C6B64;opacity:0;transition:opacity .8s}
.jf26.live .jf-hint{opacity:1}
.jf26.live .jf-sig{bottom:7.5%}
.jf26 .pv{will-change:transform}
.jf26 .pv-leaf{transform-box:fill-box;transform-origin:50% 100%}

@media (prefers-reduced-motion:reduce){.jf26 .jf-beams,.jf26 .jf-flare,.jf26 .jf-bloom,.jf26 .jf-fx{display:none}.jf26,.jf26 *{animation:none!important;transition:none!important}.jf26{transform:none}.jf26 .jf-btn{display:none}}

@media (max-width:700px){.jf26 .jf-btn{width:32px;height:32px;right:10px;bottom:10px}.jf26 .jf-btn svg{width:11px;height:11px}.jf26 .jf-sig{font-size:3.6cqw;bottom:4%}.jf26.live .jf-sig{bottom:8%}.jf26 .jf-hint{font-size:2cqw}}
