/* Growdn — orbe WebGL (three.js) : hôtes [data-orb] et repli statique. Thème clair. */
.orb { position: absolute; pointer-events: none; z-index: 0; }
.orb canvas { display: block; width: 100%; height: 100%; }

/* Hero : l'orbe flotte derrière le titre, le texte et les cartes passent devant */
.a-hero { overflow: clip; }
.a-hero > .wrap, .a-hero-visual { position: relative; z-index: 1; }
.orb-hero { left: 50%; top: clamp(-60px, -5vw, 0px); width: min(840px, 90vw); aspect-ratio: 1; transform: translateX(-50%); }
.orb-hero::after { content: ""; position: absolute; inset: 14%; border-radius: 50%; background: radial-gradient(circle, rgba(72, 140, 255, .35), rgba(124, 58, 237, .22) 45%, transparent 72%); filter: blur(70px); z-index: -1; }
/* Lisibilité du titre : voile blanc doux sous le texte */
.a-hero > .wrap::before { content: ""; position: absolute; inset: -30px -6% 18% -6%; z-index: -1; background: radial-gradient(60% 62% at 50% 42%, rgba(255, 255, 255, .6) 0 30%, rgba(255, 255, 255, 0) 100%); pointer-events: none; } /* plateau blanc sous titre + lede, puis fondu */
.a-hero h1, .a-hero .lede, .a-hero .eyebrow { text-shadow: 0 0 18px rgba(255, 255, 255, .95), 0 0 42px rgba(255, 255, 255, .8); } /* halo blanc : le texte reste net même sur la sphère */
.a-hero h1 .sw-run, .a-hero h1 .sw-run .sw i, .a-hero h1 .accent { text-shadow: none; } /* le dégradé de texte est transparent : une ombre le délaverait */
@media (min-width: 861px) and (max-height: 920px) { .orb-hero { width: min(640px, 80vw); top: -60px; } }

/* Appel final, sur noir */
.a-cta { position: relative; overflow: hidden; }
.a-cta > .wrap { position: relative; z-index: 1; }
.orb-cta { left: 50%; top: 50%; width: min(860px, 96vw); aspect-ratio: 1; transform: translate(-50%, -50%); opacity: .5; }
.orb-cta::after { content: ""; position: absolute; inset: 15%; border-radius: 50%; background: radial-gradient(circle, rgba(72, 140, 255, .35), rgba(124, 58, 237, .25) 45%, transparent 70%); filter: blur(80px); z-index: -1; }
.a-cta .display { text-shadow: 0 2px 30px rgba(0, 0, 0, .45); }

/* Repli : sans WebGL ou en mouvement réduit, une sphère statique douce */
.orb-fallback { border-radius: 50%; background: radial-gradient(circle at 35% 30%, #cfe6ff 0%, #0071e3 30%, #7c3aed 58%, #e14b8c 80%, transparent 82%); filter: blur(2px); opacity: .5; }
.orb-fallback.orb-hero { transform: translateX(-50%) scale(.7); }
.orb-fallback.orb-cta { opacity: .3; }
.orb-fallback::after { display: none; } /* pas de halo flou en plus de la sphère de repli */

@media (max-width: 700px) { .orb-hero { top: -90px; width: 92vw; } }