.hero-demo{--tilt-x:0deg;--tilt-y:0deg;position:relative;margin:0;overflow:hidden;isolation:isolate;aspect-ratio:2/3;max-height:650px;background:#071029;cursor:pointer;outline:none;transform-style:preserve-3d;transition:transform .45s ease,box-shadow .45s ease;-webkit-touch-callout:none;user-select:none}.hero-demo:focus-visible{box-shadow:0 0 0 3px rgba(20,192,255,.55),0 30px 85px rgba(32,49,255,.24)}.hero-demo img{display:block;width:100%;height:100%;object-fit:cover;border-radius:20px;transform:scale(1.01);transform-origin:50% 60%;will-change:transform,filter}.hero-result-video{position:absolute;z-index:1;inset:12px;width:calc(100% - 24px);height:calc(100% - 24px);object-fit:cover;object-position:center 54%;border-radius:18px;opacity:0;transform:scale(1.055);transform-origin:center;clip-path:inset(2.4% 2.4% round 16px);transition:opacity .55s ease;background:#020613}.hero-demo.video-ready:is(:hover,.is-playing) .hero-result-video{opacity:1}.hero-demo.video-ready:is(:hover,.is-playing) img{animation:none;transform:scale(1.01)}.hero-demo::after{content:"";position:absolute;z-index:2;inset:12px;border-radius:18px;background:linear-gradient(180deg,transparent 34%,rgba(2,6,18,.9));pointer-events:none}.hero-demo figcaption{position:absolute;z-index:3;left:50%;bottom:29px;transform:translateX(-50%);width:84%;display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;color:white}.hero-demo .demo-play{display:grid;place-items:center;width:54px;height:54px;margin-bottom:5px;border:1px solid rgba(255,255,255,.22);border-radius:17px;background:linear-gradient(135deg,rgba(9,190,234,.85),rgba(28,102,255,.9),rgba(139,55,255,.9));box-shadow:0 13px 35px rgba(38,55,255,.35);padding-left:3px;transition:transform .3s}.hero-demo figcaption strong{font:700 18px Manrope,sans-serif}.hero-demo figcaption small{color:rgba(223,230,247,.75);font-size:9px}.motion-glow{position:absolute;z-index:1;inset:-25%;opacity:0;background:linear-gradient(105deg,transparent 35%,rgba(34,196,255,.2) 49%,transparent 63%);transform:translateX(-40%);pointer-events:none}.demo-prompt{width:100%;min-height:55px;margin:8px 0 0;padding:9px 11px;border:1px solid rgba(126,154,225,.24);border-radius:10px;background:rgba(3,8,22,.78);backdrop-filter:blur(10px);text-align:left;font-size:9px;line-height:1.45;color:rgba(242,246,255,.9);opacity:0;transform:translateY(10px);transition:opacity .35s,transform .35s}.demo-prompt b{display:block;margin-bottom:3px;color:#78d9ff;text-transform:uppercase;letter-spacing:.12em;font-size:7px}.demo-prompt span{display:inline}.demo-prompt i{display:inline-block;width:1px;height:1em;margin-left:2px;background:white;vertical-align:-2px;animation:cursor-blink .8s steps(1) infinite}.hero-demo:is(:hover,.is-playing){transform:perspective(900px) rotateY(var(--tilt-y,-1.8deg)) rotateX(var(--tilt-x,1deg)) translateY(-7px);box-shadow:0 42px 100px rgba(0,0,0,.48),0 0 65px rgba(53,59,255,.15)}.hero-demo:is(:hover,.is-playing) img{animation:cinematic-pan 7s ease-in-out infinite alternate}.hero-demo:is(:hover,.is-playing) .motion-glow{opacity:1;animation:light-sweep 3.2s ease-in-out infinite}.hero-demo:is(:hover,.is-playing) .demo-play{transform:scale(.86)}.hero-demo:is(:hover,.is-playing) .demo-prompt{opacity:1;transform:translateY(0)}.hero-demo:is(:hover,.is-playing) .demo-hint{opacity:0;position:absolute}@keyframes cinematic-pan{0%{transform:scale(1.03)}50%{transform:scale(1.105) translate3d(-1.4%,-1.6%,0);filter:saturate(1.08)}100%{transform:scale(1.15) translate3d(1.2%,-3%,0);filter:saturate(1.12)}}@keyframes light-sweep{0%{transform:translateX(-45%)}65%,100%{transform:translateX(55%)}}@keyframes cursor-blink{50%{opacity:0}}
.motion-enabled .landing-nav,.motion-enabled .landing-hero>div>*{opacity:0;transform:translateY(18px)}.motion-enabled .landing-preview{opacity:0;transform:translate3d(34px,18px,0) rotate(3deg) scale(.96)}.motion-enabled.motion-ready .landing-nav{animation:reveal-down .65s cubic-bezier(.2,.75,.25,1) both}.motion-enabled.motion-ready .landing-hero>div>*{animation:reveal-up .72s cubic-bezier(.2,.75,.25,1) both}.motion-enabled.motion-ready .landing-hero>div>:nth-child(2){animation-delay:.08s}.motion-enabled.motion-ready .landing-hero>div>:nth-child(3){animation-delay:.16s}.motion-enabled.motion-ready .landing-hero>div>:nth-child(4){animation-delay:.24s}.motion-enabled.motion-ready .landing-hero>div>:nth-child(5){animation-delay:.3s}.motion-enabled.motion-ready .landing-preview{animation:reveal-preview .9s .16s cubic-bezier(.16,.8,.25,1) both}.motion-reveal{opacity:0;transform:translateY(28px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.75,.25,1)}.motion-reveal.is-visible{opacity:1;transform:translateY(0)}.steps-grid .motion-reveal:nth-child(2),.public-offers .motion-reveal:nth-child(2){transition-delay:.1s}.steps-grid .motion-reveal:nth-child(3),.public-offers .motion-reveal:nth-child(3){transition-delay:.2s}.steps-grid article,.offer-card{transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease}.landing-cta .button{transition:transform .25s ease,box-shadow .25s ease}.landing-cta .button:hover{transform:translateY(-3px)}@keyframes reveal-down{from{opacity:0;transform:translateY(-16px)}to{opacity:1;transform:none}}@keyframes reveal-up{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}@keyframes reveal-preview{from{opacity:0;transform:translate3d(34px,18px,0) rotate(3deg) scale(.96)}to{opacity:1;transform:rotate(1deg)}}
/* Balayage lumineux du titre, inspiré de la référence Mantia. */
.landing-hero .animated-gradient-text{background-image:linear-gradient(90deg,#fff 0% 38%,#c67cff 48% 52%,#fff 62% 100%);background-size:200% 100%;background-position:-100% 0;animation:title-color-sweep 4s linear infinite;will-change:background-position;-webkit-text-fill-color:transparent}
@keyframes title-color-sweep{from{background-position:-100% 0}to{background-position:200% 0}}
.motion-enabled.motion-ready .landing-hero>div>.animated-gradient-text{animation:reveal-up .72s .08s cubic-bezier(.2,.75,.25,1) both,title-color-sweep 4s .8s linear infinite}
@media(max-width:700px){.hero-demo figcaption{bottom:24px}.demo-prompt{font-size:8px}.landing-nav{align-items:center;gap:12px}.landing-nav .brand{gap:8px;font-size:12px;white-space:nowrap}.landing-nav .brand-mark{width:34px;height:34px;flex-basis:34px}.landing-nav .brand>span:last-child{display:inline;letter-spacing:.09em}.landing-nav nav{min-width:0}.landing-nav nav .button{padding:10px 12px;font-size:11px;white-space:nowrap}.landing-hero{min-height:auto;padding:48px 18px 64px;gap:42px}.landing-hero h1{font-size:clamp(42px,13vw,58px);line-height:1;overflow-wrap:anywhere}.landing-hero>div>p:not(.eyebrow){font-size:15px;line-height:1.65}.landing-preview{width:min(360px,94vw)}}@media(max-width:390px){.landing-nav{padding-inline:12px}.landing-nav .brand-mark{width:30px;height:30px;flex-basis:30px}.landing-nav .brand{font-size:11px}.landing-nav nav .button{padding:9px 10px;font-size:10px}}
@media(prefers-reduced-motion:reduce){.hero-demo,.hero-demo img,.motion-glow,.demo-prompt,.landing-nav,.landing-hero>div>*,.landing-preview,.motion-reveal{animation:none!important;transition:none!important}.motion-enabled .landing-nav,.motion-enabled .landing-hero>div>*,.motion-enabled .landing-preview,.motion-reveal{opacity:1!important;transform:none!important}.demo-prompt i{animation:none}.landing-hero .animated-gradient-text{animation:title-color-sweep 4s linear infinite!important}}
