.animation-scene{position:absolute;inset:0;width:100%;height:100%;isolation:isolate;display:grid;place-items:center;padding-left:44%}.an-backdrop{position:absolute;inset:0;z-index:-2;background:#031025 url('/assets/home-animation/background-lossless.webp') center/cover no-repeat}.an-backdrop::after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at center,transparent 15%,rgba(0,4,15,.12) 70%)}.an-logo-wrap{position:relative;width:min(72vw,1060px);aspect-ratio:748.3/238.6;opacity:0;transform:scale(.12);will-change:transform,opacity}.an-logo{display:block;position:relative;width:100%;height:100%;z-index:2;filter:drop-shadow(0 0 4px rgba(229,249,255,.45))}.an-halo{position:absolute;inset:9% 10%;z-index:0;background:radial-gradient(ellipse,rgba(255,255,255,.5),rgba(213,243,255,.23) 24%,rgba(201,231,255,.05) 60%,transparent 73%);filter:blur(25px);opacity:0;transform:scale(.9)}.an-arrival-light{position:absolute;inset:0;z-index:-1;opacity:0;background:radial-gradient(ellipse at 40% 50%,rgba(255,255,255,.9),rgba(171,223,255,.55) 3%,rgba(6,94,185,.16) 19%,transparent 48%)}.an-shine{position:absolute;inset:0;z-index:3;background:linear-gradient(105deg,transparent 47%,rgba(255,255,255,.85) 49.5%,#fff 50%,transparent 53%);-webkit-mask:url('/assets/home-animation/jmtec-logo-white-tec.svg') center/contain no-repeat;mask:url('/assets/home-animation/jmtec-logo-white-tec.svg') center/contain no-repeat;opacity:0;pointer-events:none;background-repeat:no-repeat;background-size:300% 100%}.an-star{position:absolute;left:100%;top:40.4%;width:clamp(36px,5vw,90px);aspect-ratio:1;transform:translate(-50%,-50%) scale(0);opacity:0;z-index:4;background:radial-gradient(circle,#fff 0 5%,rgba(255,255,255,.85) 7%,rgba(196,231,255,.28) 23%,transparent 65%);filter:drop-shadow(0 0 12px #fff)}.an-star::before,.an-star::after{content:'';position:absolute;inset:47% 2%;background:linear-gradient(90deg,transparent,#fff,transparent);border-radius:50%}.an-star::after{transform:rotate(90deg)}.an-replay{position:fixed;bottom:20px;right:20px;width:42px;height:42px;display:grid;place-items:center;border:1px solid #ffffff26;border-radius:50%;background:#04132788;color:#fff;opacity:0;cursor:pointer;transition:opacity .3s}.an-replay svg{width:20px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.an-replay:focus-visible{outline:2px solid #fff;outline-offset:4px}.an-ended .an-replay,.an-replay:focus-visible{opacity:.65}.an-replay:hover{opacity:1}.an-playing .an-logo-wrap{animation:arrival 2s cubic-bezier(.16,.82,.24,1) both}.an-playing .an-arrival-light{animation:light-arrival 2s ease-out both}.an-playing .an-logo{animation:none}.an-playing .an-halo{animation:none;opacity:.2;transform:scale(.94)}.an-playing .an-shine{animation:shimmer 2s ease-in-out 12s both}.an-playing .an-star{animation:star-flash 1s ease-out 14s both}@keyframes arrival{0%{opacity:0;transform:scale(.12);filter:blur(15px)}28%{opacity:1}70%{filter:blur(0)}100%{opacity:1;transform:scale(1);filter:blur(0)}}@keyframes light-arrival{0%{opacity:0}25%{opacity:1}65%{opacity:.7}100%{opacity:0}}@keyframes heartbeat{0%,100%{opacity:.2;transform:scale(.94)}12%{opacity:.65;transform:scale(1.035)}24%{opacity:.26;transform:scale(.97)}38%{opacity:.48;transform:scale(1.01)}58%,85%{opacity:.2;transform:scale(.94)}}@keyframes logo-heartbeat{0%,100%{filter:drop-shadow(0 0 4px #ffffff66)}12%{filter:drop-shadow(0 0 9px #ffffffcc) drop-shadow(0 0 24px #ffffff66)}24%{filter:drop-shadow(0 0 5px #ffffff66)}38%{filter:drop-shadow(0 0 7px #ffffffaa) drop-shadow(0 0 17px #ffffff55)}58%,85%{filter:drop-shadow(0 0 4px #ffffff66)}}@keyframes shimmer{0%{opacity:0;background-position:100% 0}15%{opacity:1}85%{opacity:1}100%{opacity:0;background-position:0% 0}}@keyframes star-flash{0%{opacity:0;transform:translate(-50%,-50%) scale(.15)}12%{opacity:1;transform:translate(-50%,-50%) scale(1.15)}30%{opacity:1;transform:translate(-50%,-50%) scale(.85)}75%{opacity:.8;transform:translate(-50%,-50%) scale(.65)}100%{opacity:0;transform:translate(-50%,-50%) scale(0)}}@media(max-width:600px){.an-logo-wrap{width:88vw}.an-backdrop{background-position:58% center}.an-halo{filter:blur(16px)}}@media(prefers-reduced-motion:reduce){.an-playing .an-logo-wrap{animation:soft-appear 1.5s ease-out both}.an-playing .an-arrival-light,.an-playing .an-halo,.an-playing .an-shine,.an-playing .an-star,.an-playing .an-logo{animation:none}.an-logo{filter:drop-shadow(0 0 16px #ffffff66)}@keyframes soft-appear{from{opacity:0;transform:scale(1)}to{opacity:1;transform:scale(1)}}}

/* Animate the existing constellation and DNA independently, using the supplied texture. */
.an-backdrop { inset:0; background:radial-gradient(ellipse at 42% 48%,#092a52 0%,#051932 40%,#020b1c 100%); }
.an-constellation-layer,.an-dna-layer { position:absolute; inset:0; z-index:-2; pointer-events:none; will-change:transform; }
.an-scene-texture { position:absolute; left:50%; top:50%; width:max(104vw,184.8vh); height:max(104vh,58.55vw); transform:translate(-50%,-50%); background:url('/assets/home-animation/background-lossless.webp') center/100% 100% no-repeat; }
.an-constellation-layer .an-scene-texture { -webkit-mask-image:linear-gradient(90deg,#000 0%,#000 38%,transparent 66%); mask-image:linear-gradient(90deg,#000 0%,#000 38%,transparent 66%); }
.an-dna-layer .an-scene-texture { -webkit-mask-image:linear-gradient(90deg,transparent 38%,#000 66%,#000 100%); mask-image:linear-gradient(90deg,transparent 38%,#000 66%,#000 100%); }
.an-constellation-layer { transform-origin:22% 48%; animation:constellation-orbit 15s ease-in-out infinite alternate; }
.an-dna-layer { transform-origin:83% 50%; animation:dna-sway 10s ease-in-out infinite alternate; }
.an-background-spark { position:absolute; width:5px; height:5px; margin:-2.5px; border-radius:50%; background:#fff; box-shadow:0 0 6px 2px #e8f5ff,0 0 20px 5px #428dff; animation:point-twinkle 6.166666s ease-in-out var(--spark-delay,0s) infinite; }
.an-dna-layer .an-background-spark { box-shadow:0 0 6px 2px #fff,0 0 20px 5px #b787ff; animation-duration:7.166666s; }
@keyframes constellation-orbit { from { transform:translate(-1.5%,-1%) rotate(-1.8deg); } to { transform:translate(1.5%,1%) rotate(1.8deg); } }
@keyframes dna-sway { from { transform:translate(-1%,-2.5%) scaleX(.88) rotate(-1.7deg); } to { transform:translate(1%,2.5%) scaleX(1.08) rotate(1.7deg); } }
@keyframes point-twinkle { 0%,100% { opacity:.12; transform:scale(.5); } 45% { opacity:1; transform:scale(1.5); } 65% { opacity:.3; transform:scale(.8); } }
@media(prefers-reduced-motion:reduce) { .an-constellation-layer,.an-dna-layer,.an-background-spark { animation:none; transform:none; } .an-background-spark { opacity:.4; } }

/* Lossless texture and a restrained edge filter improve the existing background. */
.an-render-filters { position:absolute; pointer-events:none; }
.an-scene-texture { filter:url(#home-scene-sharp) contrast(1.2) brightness(1.18); }

/* Replay remains available during the indefinitely repeated sequence. */
.an-playing .an-replay{opacity:.65}

.animation-scene .an-logo-wrap{width:min(42vw,720px)}
.home-hero-cinema.home-animation-trial .home-hero-shade{background:linear-gradient(90deg,rgba(3,15,31,.55),rgba(3,15,31,.08) 65%),linear-gradient(0deg,rgba(4,17,33,.35),transparent 35%)}
@media(max-width:1100px){.animation-scene{padding:0 0 130px;align-items:end}.animation-scene .an-logo-wrap{width:min(70vw,650px)}}
@media(max-width:560px){.animation-scene{padding-bottom:130px}.animation-scene .an-logo-wrap{width:88vw}.home-animation-trial{min-height:760px}}

/* Desktop composition: vector logo at the exact centre of the hero. */
@media(min-width:1101px){
 body[data-page="home"] .home-animation-trial{min-height:clamp(720px,calc(100svh - 94px),920px);padding:0}
 .home-animation-trial .animation-scene{padding:0;place-items:center}
 .home-animation-trial .animation-scene .an-logo-wrap{width:min(64vw,900px)}
 body[data-page="home"] .home-animation-trial>.home-hero-content{position:absolute;inset:0;width:100%;max-width:none;margin:0;padding:0;pointer-events:none}
 body[data-page="home"] .home-animation-trial .home-hero-copy{position:absolute;top:36px;left:0;right:0;width:calc(100% - 96px);max-width:none;margin:auto;text-align:center}
 body[data-page="home"] .home-animation-trial .home-hero-copy h1{margin:0;font-size:clamp(2rem,3vw,3.1rem);line-height:1.08;text-align:center}
 body[data-page="home"] .home-animation-trial .home-hero-details{position:absolute;bottom:118px;left:0;right:0;width:fit-content;max-width:none;margin:auto;pointer-events:auto}
 .home-animation-trial .hero-actions{justify-content:center;margin:0}
 body[data-page="home"] .home-animation-trial>.home-proof-position{left:24px;right:24px;bottom:24px;width:calc(100% - 48px)}
 .home-animation-trial .home-proof-position .hero-proof{justify-content:center}
 .home-hero-cinema.home-animation-trial .home-hero-shade{background:linear-gradient(180deg,rgba(3,15,31,.3),transparent 25%,transparent 68%,rgba(3,15,31,.4))}
}

/* Logo and heading form one centred composition; actions sit to its right. */
.home-logo-caption{position:absolute;top:calc(100% + 22px);left:-10%;width:120%;text-align:center;color:#fff}
body[data-page="home"] .home-animation-trial .home-logo-caption h1{margin:0;font-size:clamp(2rem,3vw,3.1rem);line-height:1.12;text-align:center}
@media(min-width:1101px){
 .home-animation-trial .animation-scene{padding:0 0 130px;place-items:center}
 .home-animation-trial .animation-scene .an-logo-wrap{width:min(52vw,760px)}
 body[data-page="home"] .home-animation-trial .home-hero-details{top:50%;bottom:auto;left:auto;right:clamp(24px,3vw,48px);width:220px;margin:0;transform:translateY(-50%)}
 .home-animation-trial .hero-actions{display:flex;flex-direction:column;align-items:stretch;gap:1rem}
 .home-animation-trial .hero-actions .button{text-align:center;justify-content:center}
}
@media(max-width:1100px){
 .home-hero-cinema.home-animation-trial{min-height:760px;padding:0}
 .home-animation-trial .animation-scene{padding:0 0 210px;place-items:center}
 body[data-page="home"] .home-animation-trial>.home-hero-content{position:absolute;inset:0;width:100%;margin:0;padding:0;pointer-events:none}
 body[data-page="home"] .home-animation-trial .home-hero-details{position:absolute;left:16px;right:16px;bottom:165px;width:calc(100% - 32px);max-width:none;margin:0;pointer-events:auto}
 .home-animation-trial .hero-actions{justify-content:flex-end}
 body[data-page="home"] .home-animation-trial .home-logo-caption h1{font-size:clamp(1.6rem,5vw,2.7rem)}
}

/* One-line white caption and a shared baseline for proof points and actions. */
body[data-page="home"] .home-animation-trial .home-logo-caption h1{color:#fff;white-space:nowrap;overflow-wrap:normal}
body[data-page="home"] .home-animation-trial>.home-proof-position{display:flex;align-items:center;justify-content:space-between;gap:32px}
body[data-page="home"] .home-animation-trial .home-proof-position .home-hero-details{position:static;inset:auto;width:auto;max-width:none;margin:0;transform:none;flex-shrink:0;pointer-events:auto}
.home-animation-trial .home-proof-position .hero-actions{display:flex;flex-direction:row;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:12px;margin:0}
.home-animation-trial .home-proof-position .hero-proof{justify-content:flex-start;margin:0}
@media(min-width:1101px){
 .home-animation-trial .home-proof-position .hero-proof{padding:0;border-top:0;gap:clamp(16px,1.6vw,26px);flex-wrap:nowrap}
 .home-animation-trial .home-proof-position .hero-proof strong{font-size:clamp(1.3rem,1.65vw,2rem)}
 .home-animation-trial .home-proof-position .hero-proof span{font-size:clamp(.95rem,1.15vw,1.25rem)}
 .home-animation-trial .home-proof-position .hero-proof li+li{padding-left:clamp(16px,1.6vw,26px)}
}
@media(max-width:1100px){
 body[data-page="home"] .home-animation-trial>.home-proof-position{flex-direction:column;align-items:stretch;gap:24px}
 .home-animation-trial .home-logo-caption{left:0;width:100%}
 body[data-page="home"] .home-animation-trial .home-logo-caption h1{font-size:clamp(1rem,4.2vw,2.5rem)}
 .home-animation-trial .home-proof-position .hero-actions{justify-content:flex-end}
}

/* Permanent central identity with real photographed parts moving around it. */
.animation-scene .an-logo-wrap,.animation-scene.an-playing .an-logo-wrap{opacity:1;transform:scale(1);filter:none;animation:none;z-index:2}
.animation-scene .an-arrival-light,.animation-scene.an-playing .an-arrival-light{opacity:0;animation:none}
@media(min-width:1101px){.home-animation-trial .animation-scene{padding-bottom:190px}}
@media(max-width:1100px){
 .home-animation-trial .animation-scene{padding-bottom:250px}
}


/* Test: the hero's animated atmosphere extends behind the entire FR homepage. */
body.home-extended-scene .site-backdrop{display:block;position:fixed;inset:0;height:100lvh;overflow:hidden;z-index:0;background:#020b1c;isolation:isolate}
body.home-extended-scene .site-backdrop::after{display:none}
body.home-extended-scene .site-backdrop .an-backdrop{z-index:-2}
body.home-extended-scene .dna-field,body.home-extended-scene .constellation-field{display:none}
body.home-extended-scene main>.section:not(.section-dark){--ink:#f4f8ff;--muted:#d5e5f5;--line:rgba(198,224,255,.24);color:#f4f8ff;background:rgba(3,17,36,.34)}
body.home-extended-scene main>.section:not(.section-dark)::before{display:none}
body.home-extended-scene main>.section:not(.section-dark)>.section-inner{position:relative;z-index:2}
body.home-extended-scene main>.section:not(.section-dark) .kicker{color:#c0e3ff;--title-ink:#c0e3ff;--title-glow:rgba(111,188,255,.3)}
body.home-extended-scene .metrics strong,body.home-extended-scene .metrics span{color:#f4f8ff}
body.home-extended-scene .history-timeline{color:#e4effc}
body.home-extended-scene .history-caption h3{color:#9dcfff}
body.home-extended-scene .history-timeline::before,body.home-extended-scene .history-step::after{background:#86bfff}
body.home-extended-scene .history-step::before{border-color:#86bfff}
body.home-extended-scene .history-scroll-hint,body.home-extended-scene .direct-call{color:#c1e4ff}
body.home-extended-scene.motion-paused :is(.an-constellation-layer,.an-dna-layer,.an-background-spark){animation-play-state:paused}
@media(forced-colors:active){body.home-extended-scene .site-backdrop{display:none}body.home-extended-scene main>.section:not(.section-dark){background:Canvas;color:CanvasText;--ink:CanvasText;--muted:CanvasText}}
@media print{body.home-extended-scene .site-backdrop{display:none}body.home-extended-scene main>.section:not(.section-dark){background:#fff;color:#000;--ink:#000;--muted:#333}}

/* Transparent hero: show the existing continuous page atmosphere behind the logo. */
.home-hero-cinema.home-animation-trial,.home-hero-cinema.home-animation-trial .home-hero-media{background:transparent}
.home-hero-cinema.home-animation-trial .home-hero-shade{background:none}
.home-animation-trial .animation-scene>.an-backdrop,.home-animation-trial .animation-scene>.an-constellation-layer,.home-animation-trial .animation-scene>.an-dna-layer{display:none}
body[data-page="home"] .home-animation-trial .home-logo-caption h1{color:#fff;text-shadow:0 2px 12px #03102555}

/* JMTEC en bref uses the Quality navy veil, with its opacity reduced by 30%. */
body.home-extended-scene[data-page="home"] main>.section.home-about:not(.section-dark){background:rgba(9,30,62,.658)}
@media(forced-colors:active){body.home-extended-scene[data-page="home"] main>.section.home-about:not(.section-dark){background:Canvas}}
@media print{body.home-extended-scene[data-page="home"] main>.section.home-about:not(.section-dark){background:#fff}}

/* Deep navy to black veils, preserving the same opacity for all three bands. */
body.home-extended-scene[data-page="home"] main>.section.home-about:not(.section-dark),
body.home-extended-scene[data-page="home"] main>.section.section-dark,
body.home-extended-scene[data-page="home"] footer{
 --ink:#f4f8ff;--muted:#d5e5f5;--line:rgba(198,224,255,.24);
 color:#f4f8ff;
 background:linear-gradient(115deg,rgba(5,18,39,.88),rgba(1,5,12,.82));
 border-block:1px solid rgba(143,186,229,.24);
}
body.home-extended-scene[data-page="home"] main>:is(.home-about,.section-dark) .kicker{
 color:#c0e3ff;--title-ink:#c0e3ff;--title-glow:rgba(90,162,220,.25);
}
body.home-extended-scene[data-page="home"] main>.home-about .metrics strong{color:#f4f8ff}
body.home-extended-scene[data-page="home"] main>.home-about .metrics span,
body.home-extended-scene[data-page="home"] main>.section.section-dark .split>div>p:not(.kicker){color:#d5e5f5}
body.home-extended-scene[data-page="home"] footer :is(p,.footer-bottom){color:#d5e5f5}
body.home-extended-scene[data-page="home"] footer a,
body.home-extended-scene[data-page="home"] footer .contact-region{color:#f4f8ff}
body.home-extended-scene[data-page="home"] footer :is(.footer-bottom,.direction-link){border-color:rgba(198,224,255,.25)}
body.home-extended-scene[data-page="home"] footer a:focus-visible{outline-color:#c0e3ff}
body.home-extended-scene[data-page="home"] footer .footer-brand img{filter:drop-shadow(0 1px 1px #f4f8ff) drop-shadow(0 -1px 1px #f4f8ff55)}
@media(forced-colors:active){
 body.home-extended-scene[data-page="home"] :is(main>.section.home-about:not(.section-dark),main>.section.section-dark,footer){background:Canvas;color:CanvasText;--ink:CanvasText;--muted:CanvasText}
 body.home-extended-scene[data-page="home"] :is(main>.home-about,main>.section.section-dark,footer) :is(p,a,.kicker,.metrics strong,.metrics span,.contact-region,.footer-bottom){color:CanvasText}
}
@media print{
 body.home-extended-scene[data-page="home"] :is(main>.section.home-about:not(.section-dark),main>.section.section-dark,footer){background:#fff;color:#f4f8ff}
}

/* Restore the original white chronological band without any scene veil. */
body.home-extended-scene[data-page="home"] main>.section.home-history:not(.section-dark){
 background:#fff; color:#064899; --ink:#064899; --muted:#345571; --line:#064899;
 border:0;
}
body.home-extended-scene[data-page="home"] .home-history .history-timeline{color:#064899}
body.home-extended-scene[data-page="home"] .home-history .history-caption h3{color:#087aff}
body.home-extended-scene[data-page="home"] .home-history .history-timeline::before,
body.home-extended-scene[data-page="home"] .home-history .history-step::after{background:#064899}
body.home-extended-scene[data-page="home"] .home-history .history-step::before{border-color:#064899}
body.home-extended-scene[data-page="home"] .home-history .history-scroll-hint,
body.home-extended-scene[data-page="home"] .home-history .kicker{color:#064899;--title-ink:#064899;--title-glow:transparent}

/* The existing motion control also pauses the logo light effects. */
body.home-extended-scene.motion-paused .animation-scene :is(.an-shine,.an-star){animation-play-state:paused}
