/* Champ de lumiere des couvertures.
   Source unique : cette feuille est chargee par index.html, les trois pages
   profil et simulation.html. Ne pas recopier ces regles ailleurs.

   Le principe : une source lumineuse suit le pointeur, la surface reflechissante
   est le bord droit de la couverture, et le titre porte une ombre portee qui
   s'eloigne de la source. Rien ici ne decrit un mecanisme : c'est de la lumiere
   sur une page, pas une piece.

   L'element porteur doit avoir la classe .light-hero et l'attribut
   data-hero-light. Le titre a eclairer porte data-hero-title. */

.light-hero{position:relative;overflow:hidden}

/* La lueur ambiante vit sur le champ lui-meme, pas sur un ::before du parent :
   les couvertures profil utilisent deja ::before pour leur cercle decoratif,
   et deux regles ::before sur le meme element se melangent au lieu de se
   remplacer — l'anneau se retrouvait etire sur toute la largeur. */
.hero-light-field{position:absolute;inset:0;z-index:3;overflow:hidden;pointer-events:none;mix-blend-mode:screen;background:radial-gradient(circle at var(--hero-sun-x,55%) var(--hero-sun-y,24%),rgba(255,206,59,.1),transparent 25%)}
.hero-sun{position:absolute;left:var(--hero-sun-x,55%);top:var(--hero-sun-y,24%);width:22px;height:22px;border-radius:50%;background:#ffce3b;box-shadow:0 0 0 10px rgba(255,206,59,.025),0 0 48px 14px rgba(255,206,59,.17);transform:translate(-50%,-50%)}
.hero-energy-surface{position:absolute;inset:0;pointer-events:none;background-size:180% 180%}
.hero-energy-surface--incoming{clip-path:polygon(var(--hero-sun-x,55%) var(--hero-sun-y,24%),100% calc(var(--hero-mirror-y,42%) - 118px),100% calc(var(--hero-mirror-y,42%) + 118px));background-image:linear-gradient(108deg,transparent 20%,rgba(255,206,59,.02) 45%,rgba(255,244,196,.09) 76%,rgba(255,244,196,.14));filter:blur(24px);opacity:calc(var(--hero-reflection-strength,0) * .48);transition:opacity .12s linear}
.hero-energy-surface--reflected{inset:auto;left:var(--hero-mirror-x,100%);top:var(--hero-mirror-y,42%);width:min(58vw,620px);height:min(44vw,420px);border-radius:50%;background:radial-gradient(ellipse at 100% 50%,rgba(255,244,196,.22),rgba(255,206,59,.075) 32%,rgba(255,206,59,.018) 55%,transparent 74%);filter:blur(17px);opacity:calc(var(--hero-reflection-strength,0) * .58);transform:translate(-100%,-50%);transition:opacity .12s linear}

/* Le contenu passe devant le champ de lumiere. */
.light-hero > .shell,.light-hero > .hero-grid{position:relative;z-index:4}

[data-hero-title]{position:relative;text-shadow:var(--hero-shadow-near-x,-2px) var(--hero-shadow-near-y,2px) 2px rgba(2,10,7,.22),var(--hero-shadow-x,-10px) var(--hero-shadow-y,10px) 28px rgba(2,10,7,.55);transition:text-shadow .16s linear}

@media(pointer:coarse){
  .hero-energy-surface{display:none}
}

@media(max-width:640px){
  .hero-sun{width:18px;height:18px}
  .hero-energy-surface--reflected{width:72vw;height:54vw}
}

@media(prefers-reduced-motion:reduce){
  .hero-energy-surface,[data-hero-title]{transition:none}
}