/* 28/09/2026 — « mirage » : un écran d'ordinateur portable qui apparaît au loin dans l'espace, près de la
   planète, et montre le dernier post EducForm31 (LinkedIn ou X). Données : /social/dernier-post.json.
   Visible sur l'écran d'arrivée seulement ; disparaît dès que le voyage commence. */
.ef-mirage{position:fixed;z-index:4;left:41%;top:11.5%;width:min(25vw,330px);opacity:0;transform:perspective(1100px) rotateY(-9deg) rotateX(4deg) translateY(8px) scale(.97);transform-origin:60% 50%;
  transition:opacity 900ms var(--ease-out,cubic-bezier(.23,1,.32,1)),transform 900ms var(--ease-out,cubic-bezier(.23,1,.32,1));pointer-events:none;
  filter:drop-shadow(0 0 22px #4cafe533)}
.ef-mirage.is-visible{opacity:.78;transform:perspective(1100px) rotateY(-9deg) rotateX(4deg);pointer-events:auto;animation:mirageFloat 9s ease-in-out infinite alternate}.ef-mirage:hover{opacity:.95}
.ef-mirage a{display:block;color:inherit;text-decoration:none}
.ef-mirage .lid{position:relative;border:1.5px solid #9ed6ee55;border-bottom:none;border-radius:12px 12px 0 0;background:linear-gradient(160deg,#0b2b3ce0,#071a29d8);
  padding:5%;box-shadow:inset 0 0 40px #4cafe512,0 24px 60px #01091666}
.ef-mirage .lid:before{content:'';position:absolute;top:6px;left:50%;width:6px;height:6px;margin-left:-3px;border-radius:50%;background:#9ed6ee66}
.ef-mirage .screen{position:relative;overflow:hidden;border-radius:6px;background:#061120;aspect-ratio:16/10;font-size:clamp(9px,.85vw,12.5px);line-height:1.45;color:#e2f2fa}
.ef-mirage .screen:after{content:'';position:absolute;inset:0;background:linear-gradient(115deg,#ffffff0e 0%,#ffffff00 32%,#ffffff00 60%,#9ed6ee10 100%);pointer-events:none}
.ef-mirage .base{height:9px;border:1.5px solid #9ed6ee55;border-top:none;border-radius:0 0 14px 14px;background:linear-gradient(#0b2b3ce0,#071a29d8);margin:0 -3%}
.ef-mirage .base:after{content:'';display:block;width:14%;height:3px;margin:0 auto;background:#9ed6ee33;border-radius:0 0 4px 4px}
.ef-mirage .post{position:absolute;inset:0;padding:6% 7%;display:flex;flex-direction:column;gap:.6em}
.ef-mirage .who{display:flex;align-items:center;gap:.7em;font-weight:700}
.ef-mirage .who i{width:2.2em;height:2.2em;border-radius:50%;background:radial-gradient(circle at 30% 30%,#ffc19b,#ff8a3d);display:grid;place-items:center;color:#061120;font-style:normal;font-size:.9em;letter-spacing:0}
.ef-mirage .who small{display:block;font-weight:400;color:#a9c9d8;font-size:.85em}
.ef-mirage .txt{display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden;color:#d7e9f3}
.ef-mirage .pic{margin-top:auto;height:38%;border-radius:4px;background:#0f2a3c center/cover no-repeat;border:1px solid #9ed6ee22}
.ef-mirage .net{position:absolute;right:7%;top:6%;font-size:.8em;color:#9ed6ee;letter-spacing:.12em;text-transform:uppercase}
.ef-mirage .cta{position:absolute;right:7%;bottom:6%;font-size:.8em;color:#ffb77e}
@keyframes mirageFloat{from{transform:perspective(1100px) rotateY(-9deg) rotateX(4deg) translateY(0)}to{transform:perspective(1100px) rotateY(-7deg) rotateX(3deg) translateY(-7px)}}
@media (max-width:1500px){.ef-mirage{left:47%;top:10%;width:min(22vw,290px)}}
@media (max-width:1100px){.ef-mirage{left:auto;right:4%;width:min(28vw,280px)}}
@media (max-width:760px),(max-height:620px){.ef-mirage{display:none}}
.motion-reduced .ef-mirage,.reduced-motion .ef-mirage{animation:none!important;transition:opacity 300ms!important;transform:none!important}
body:not([data-step=earth]) .ef-mirage,body.portal-open .ef-mirage{opacity:0;pointer-events:none;transition:opacity 350ms var(--ease-out,cubic-bezier(.23,1,.32,1))}
/* écrans de téléphone sur les côtés, pour les autres canaux (logos officiels clonés depuis l'en-tête) */
.ef-mirage-canaux{position:fixed;inset:0;z-index:4;pointer-events:none}
.ef-phone{position:absolute;display:flex;box-sizing:border-box;width:min(11vw,150px);aspect-ratio:9/17;border:1.5px solid #9ed6ee55;border-radius:18px;background:linear-gradient(160deg,#0b2b3ce0,#071a29d8);
  box-shadow:inset 0 0 30px #4cafe510,0 18px 46px #01091666;padding:7px;color:#e2f2fa;text-decoration:none;opacity:0;pointer-events:none;
  transform:perspective(900px) rotateY(var(--ry,0deg)) translateY(10px) scale(.96);transition:opacity 900ms var(--ease-out,cubic-bezier(.23,1,.32,1)),transform 900ms var(--ease-out,cubic-bezier(.23,1,.32,1));filter:drop-shadow(0 0 16px #4cafe52e)}
.ef-phone.is-visible{opacity:.74;pointer-events:auto;transform:perspective(900px) rotateY(var(--ry,0deg));animation:phoneFloat var(--dur,10s) ease-in-out infinite alternate}
.ef-phone:hover{opacity:.95}
.ef-phone .ph-notch{position:absolute;top:7px;left:50%;width:34%;height:5px;margin-left:-17%;border-radius:4px;background:#9ed6ee44}
.ef-phone .ph-screen{position:relative;display:flex;flex-direction:column;gap:.45em;width:100%;height:100%;box-sizing:border-box;border-radius:10px;background:#061120;padding:16% 8% 8%;font-size:clamp(8px,.72vw,11px);line-height:1.35;overflow:hidden}
.ef-phone .ph-screen:after{content:'';position:absolute;inset:0;background:linear-gradient(115deg,#ffffff0d,#ffffff00 35%,#9ed6ee0e);pointer-events:none}
.ef-phone .ph-net{display:flex;align-items:center;gap:.5em;font-weight:700;letter-spacing:.06em;text-transform:uppercase;font-size:.85em;color:#cfe6f2}
.ef-phone .ph-net svg{width:1.6em;height:1.6em;flex:none;background:#fff;border-radius:50%;padding:.22em;box-sizing:border-box}
.ef-phone .ph-pic{display:block;aspect-ratio:16/9;border-radius:5px;background:#0f2a3c center/cover no-repeat;border:1px solid #9ed6ee22}
.ef-phone .ph-titre{font-weight:700;color:#fff;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.ef-phone .ph-txt{color:#a9c9d8;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.ef-phone .ph-date{color:#7f9fb0;font-size:.85em}
.ef-phone .ph-cta{margin-top:auto;color:#ffb77e;font-size:.9em}
.ef-phone[data-pos="1"]{right:3%;top:12%;--ry:-12deg;--dur:11s}
.ef-phone[data-pos="2"]{right:2.5%;top:53%;--ry:-9deg;--dur:9s}
.ef-phone[data-pos="3"]{left:50%;top:60%;--ry:10deg;--dur:12s}
@keyframes phoneFloat{from{transform:perspective(900px) rotateY(var(--ry,0deg)) translateY(0)}to{transform:perspective(900px) rotateY(calc(var(--ry,0deg) + 2deg)) translateY(-8px)}}
@media (max-width:1500px){.ef-phone{width:min(11vw,135px)}.ef-phone[data-pos="3"]{left:55.5%;top:61%}}
@media (max-width:1100px),(max-height:620px){.ef-mirage-canaux{display:none}}
.motion-reduced .ef-phone,.reduced-motion .ef-phone{animation:none!important;transition:opacity 300ms!important;transform:none!important}
body:not([data-step=earth]) .ef-mirage-canaux,body.portal-open .ef-mirage-canaux{opacity:0;pointer-events:none;transition:opacity 350ms var(--ease-out,cubic-bezier(.23,1,.32,1))}