/* Hero animé de la page d'accueil (BYZ-3606) : byzance face à la gestion passive et à un
   fonds diversifié grand public, depuis janvier 2007, en échelle dynamique. Chaque décision en deux
   temps : le signal externe (ligne verticale grise) puis la réaction du moteur (point violet).
   Classes préfixées ha-. Source et données : docs/maquettes/hero-anime/. */
.ouverture.ouverture-anime{--ha-vert:#0f9f6e;--ha-halo:#fff;--ha-halo-doux:rgba(255,255,255,.96);--ha-mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  height:100svh;min-height:620px;max-height:1060px;overflow:hidden;background:radial-gradient(110% 80% at 62% 100%,#f3f1fd 0%,#fff 62%)}
.ha-toile{position:absolute;inset:0;width:100%;height:100%;display:block;transition:opacity 1s ease;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 9%,#000 100%);mask-image:linear-gradient(90deg,transparent 0,#000 9%,#000 100%)}
.ha-toile.ha-efface{opacity:0}
.ha-couche{position:absolute;inset:0;z-index:1;pointer-events:none;transition:opacity 1s ease;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 9%,#000 100%);mask-image:linear-gradient(90deg,transparent 0,#000 9%,#000 100%)}
.ha-texte{position:relative;z-index:2;padding:calc(77px + clamp(28px,6.5vh,84px)) var(--gouttiere) 0;text-align:center;pointer-events:none}
.ha-texte::before{content:"";position:absolute;left:50%;top:40px;width:min(1100px,96vw);height:calc(100% + 30px);transform:translateX(-50%);background:radial-gradient(50% 50% at 50% 50%,var(--ha-halo-doux) 40%,transparent 100%);z-index:-1}
.ouverture-anime h1{margin:0 auto;font-size:clamp(34px,3.6vw,56px);line-height:1.1;text-wrap:balance}
.ouverture-anime h1>span{margin:18px auto 0;font-size:clamp(17px,1.6vw,23px);max-width:46ch}
.ouverture-anime .actions{justify-content:center;margin-top:30px;pointer-events:auto}
.ha-nom{position:absolute;transform:translate(12px,-50%);font:400 10.5px var(--ha-mono);letter-spacing:.12em;text-transform:uppercase;white-space:nowrap;transition:color .4s}
.ha-nom.ha-patrimoine,.ha-nom.ha-valor{white-space:normal;width:150px;line-height:1.35}
.ha-nom.ha-byzance{font:600 13px var(--sans);letter-spacing:-.01em;text-transform:none;color:var(--accent)}
.ha-pop{position:absolute;width:max-content;max-width:none;text-align:right;opacity:0;transform:translateY(6px);transition:opacity .7s ease,transform .8s cubic-bezier(.2,.8,.2,1);
  text-shadow:0 0 2px var(--ha-halo),0 0 6px var(--ha-halo),0 0 12px var(--ha-halo),0 0 18px var(--ha-halo)}
.ha-pop.visible{opacity:1;transform:none}
.ha-pop::before{content:"";position:absolute;inset:-12px -18px;z-index:-1;border-radius:50%;background:radial-gradient(closest-side,var(--ha-halo-doux) 55%,transparent);pointer-events:none}
.ha-pop-source{display:flex;align-items:center;justify-content:flex-end;gap:6px;font:500 9.5px var(--ha-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--encre-3);white-space:nowrap;margin:0}
.ha-rond{flex:none;width:18px;height:18px;border-radius:50%;display:grid;place-items:center;color:#fff;font:600 7.5px var(--sans);letter-spacing:0;text-shadow:none;background:linear-gradient(140deg,#7a6cf0,#3b2fa8);overflow:hidden;position:relative}
.ha-rond img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ha-pop-action{margin:3px 0 0;font-size:13.5px;font-weight:450;line-height:1.3;color:var(--encre);white-space:nowrap}
.ha-pop-action strong{margin-left:6px;font-weight:550;color:var(--ha-vert);font-variant-numeric:tabular-nums}
.ha-pop-logos{display:flex;justify-content:flex-end;align-items:center;gap:7px;margin:4px 0 0}
.ha-pop-logos svg{width:13px;height:13px;display:block}
.ha-pop-logos em{font-style:normal;font-weight:700;font-size:9.5px;letter-spacing:-.01em;white-space:nowrap}
/* Étiquettes des signaux et des réactions (variante du 19/10, publiée) */
.ha-etiquette{position:absolute;width:max-content;max-width:min(540px,calc(100vw - 150px));display:flex;align-items:flex-start;justify-content:flex-end;gap:8px;text-align:right;
  opacity:0;transform:translateY(6px);transition:opacity .6s ease,transform .7s cubic-bezier(.2,.8,.2,1);
  text-shadow:0 0 2px var(--ha-halo),0 0 6px var(--ha-halo),0 0 12px var(--ha-halo),0 0 18px var(--ha-halo)}
.ha-etiquette.visible{opacity:1;transform:none}
.ha-etiquette-texte{font-size:13.5px;line-height:1.3;letter-spacing:-.01em;text-wrap:balance}
.ha-etiquette.ha-signal{max-width:min(340px,calc(100vw - 150px))}
.ha-etiquette.ha-reaction{max-width:250px}
.ha-etiquette.ha-signal .ha-etiquette-texte{color:var(--encre-2)}
.ha-etiquette.ha-signal b{font-weight:550;color:var(--encre)}
.ha-etiquette.ha-signal i{font-style:normal;font-weight:600;color:var(--encre)}
.ha-etiquette-rond{flex:none;margin-top:-1px;width:18px;height:18px;border-radius:50%;display:grid;place-items:center;border:1px solid #b9b5c6;background:#fff;color:var(--encre-2);font:600 7.5px var(--sans);letter-spacing:0;text-shadow:none}
.ha-etiquette-rond.ha-indicateur{font-size:10px}
.ha-etiquette.ha-droite{flex-direction:row-reverse;text-align:left}
.ha-etiquette.ha-centre{justify-content:center;text-align:center}
.ha-etiquette.ha-reaction .ha-etiquette-texte{color:var(--encre)}
.ha-etiquette.ha-reaction b{font-weight:600;color:#5b46ed}
.ha-etiquette.ha-reaction strong{margin-left:6px;font-weight:600;color:var(--ha-vert);font-variant-numeric:tabular-nums}
.ha-soustitre{display:none}
.ouverture-anime .pause{z-index:3;top:auto;bottom:14px}
@media (max-width:760px){
  .ha-texte{padding-top:calc(65px + 28px)}
  .ouverture-anime h1>span{margin-top:12px}
  .ouverture-anime .actions{margin-top:20px}
  .ha-pop{max-width:calc(100vw - 120px)}.ha-pop-action{font-size:12.5px;white-space:normal}
  .ha-nom{font-size:9px}.ha-nom.ha-patrimoine,.ha-nom.ha-valor{width:100px}.ha-nom.ha-byzance{font-size:12px}
  .ha-etiquette{align-items:flex-start}.ha-etiquette.ha-signal{max-width:170px}.ha-etiquette.ha-reaction{max-width:130px}.ha-etiquette-texte{font-size:12px}
  }
@media (prefers-reduced-motion:reduce){.ha-pop,.ha-etiquette,.ha-toile{transition:none}}

/* Les événements occupent une bande séparée, au-dessus du rectangle des courbes. */
#ha-hero{--ha-events-height:96px;min-height:800px}
#ha-hero .ha-texte{text-align:left}
#ha-hero .pause{bottom:4px}
#ha-hero h1{margin-left:0;margin-right:auto;max-width:980px}
#ha-hero h1>span{margin-left:0;margin-right:auto}
#ha-hero .actions{justify-content:flex-start;align-items:flex-start}
#ha-hero .ha-events{transform:translateY(calc(-100% - 12px));position:absolute;left:var(--gouttiere);right:var(--gouttiere);z-index:2;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;pointer-events:none}
#ha-hero .ha-event-card{min-width:0;display:flex;flex-direction:column;gap:12px}
#ha-hero .ha-events .ha-etiquette{position:relative;inset:auto;max-width:none;width:100%;text-align:left;justify-content:flex-start;text-shadow:none}
#ha-hero .ha-events .ha-etiquette-texte{min-width:0;text-wrap:pretty;line-height:1.4;font-size:13.5px}
#ha-hero .ha-events .ha-signal{flex-direction:row-reverse}
#ha-hero .ha-events .ha-signal .ha-etiquette-texte{flex:1}
#ha-hero .ha-events [hidden]{display:none!important}
@media(min-width:760px) and (max-width:1099px){#ha-hero{--ha-events-height:112px}#ha-hero .ha-events{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}}
@media(max-width:759px){#ha-hero{--ha-events-height:130px;min-height:900px}#ha-hero .ha-events{grid-template-columns:minmax(0,1fr)}#ha-hero .ha-events .ha-etiquette-texte{font-size:13px}#ha-hero .actions{align-items:flex-start}}

#ha-hero .ha-couche .ha-reaction{max-width:250px;text-shadow:0 0 2px #fff,0 0 6px #fff,0 0 12px #fff,0 0 18px #fff}
#ha-hero .ha-couche .ha-reaction[hidden]{display:none!important}
@media(max-width:759px){#ha-hero .ha-couche .ha-reaction{max-width:140px}}

/* Les signaux défilent avec les traits gris, dans la marge au-dessus du tracé. */
#ha-hero .ha-events{left:0;right:0;display:block;height:0}
#ha-hero .ha-events .ha-event-card{position:absolute;bottom:0}

/* La réaction garde toujours le même ancrage par rapport à son point. */
#ha-hero .ha-couche .ha-reaction{transform:translate(-100%,0);background:transparent;border-radius:4px;padding:4px 6px;text-shadow:none;transition:opacity .6s ease}

/* Tous les signaux partagent le même niveau ; les collisions sont résolues sur X. */
#ha-hero .ha-events .ha-event-card{top:-48px;bottom:auto}
@media(max-width:759px){#ha-hero .ha-events .ha-event-card{top:-108px}}

/* Cadrage laptop : privilégier les courbes en réduisant les espaces périphériques. */
#ha-hero .ha-texte{text-align:center}
#ha-hero h1,#ha-hero h1>span{margin-left:auto;margin-right:auto}
#ha-hero h1{margin-top:24px}
#ha-hero .actions{justify-content:center;align-items:center}
@media(min-width:760px){
  #ha-hero{--ha-events-height:64px;--ha-plot-gap:20px;--ha-bottom-gap:28px;min-height:min(620px,100svh)}
  #ha-hero .ha-texte{padding-top:calc(77px + clamp(16px,3vh,32px))}
  #ha-hero h1>span{margin-top:12px}
  #ha-hero .actions{margin-top:18px}
  #ha-hero .ha-events{transform:translateY(-8px)}
  #ha-hero .ha-events .ha-etiquette-texte{font-size:13px;line-height:1.3}
}
@media(min-width:760px) and (max-height:700px){
  #ha-hero .ha-texte{padding-top:93px}
  #ha-hero h1{font-size:clamp(32px,3.4vw,44px)}
  #ha-hero h1>span{font-size:18px;margin-top:10px}
  #ha-hero .actions{margin-top:14px}
}