/* Intro veil (components/Intro.jsx + components/intro.js): shown on the homepage while the digital twin tour loads
   (homepage only; the 3D tours' veil is tours3d/shell/scene-loader.css). The logo's navigation arrow follows a route over a faint city map (progress tracks the real loading), and the
   blocks it passes turn digital; when loading finishes the arrow docks in its place in the logo, then shoots up and opens the veil.
   Colors are fixed here (independent of either page's variables). */
.intro-veil{--navy:#0b1622;--lime:#8dc63f;font-family:"Plus Jakarta Sans",system-ui,sans-serif}
/* If the script doesn't run (homepage) the veil lifts by itself after 12 s */
.intro-failsafe{animation:introClose .5s 12s forwards}
.intro-veil{position:fixed;inset:0;z-index:100;background:var(--navy);overflow:hidden;clip-path:inset(0 0 0 0)}
.intro-veil.shown{clip-path:inset(0 0 100% 0);transition:clip-path .85s cubic-bezier(.7,0,.25,1) .12s;pointer-events:none}
.intro-veil.finished{display:none}
@keyframes introClose{to{opacity:0;visibility:hidden}}
.intro-map{position:absolute;inset:0;width:100%;height:100%}
.intro-st{stroke:rgba(255,255,255,.05);stroke-width:1}
.intro-bl{fill:rgba(255,255,255,.03);stroke:rgba(141,198,63,0);stroke-width:1;transition:fill 1.6s ease,stroke 1.6s ease}
.intro-bl.lit{fill:rgba(141,198,63,.07);stroke:rgba(141,198,63,.38);transition-duration:.25s}
.intro-ahead{fill:none;stroke:rgba(255,255,255,.22);stroke-width:1.5;stroke-dasharray:1 8;stroke-linecap:round}
.intro-trail{fill:none;stroke:var(--lime);stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}
.intro-light{fill:none;stroke:var(--lime);stroke-width:10;stroke-linecap:round;stroke-linejoin:round;opacity:.16}
.intro-copy{position:absolute;left:50%;top:44%;width:min(380px,66vw);aspect-ratio:512/282;transform:translate(-50%,-50%)}
.intro-copy img{display:block;width:100%;height:100%;filter:brightness(0) invert(1);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 282' preserveAspectRatio='none'%3E%3Cpath fill-rule='evenodd' d='M0 0H512V282H0Z M134.2 91.5L99 171.2L134.2 156.2L169.4 171.2Z'/%3E%3C/svg%3E") center/100% 100% no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 282' preserveAspectRatio='none'%3E%3Cpath fill-rule='evenodd' d='M0 0H512V282H0Z M134.2 91.5L99 171.2L134.2 156.2L169.4 171.2Z'/%3E%3C/svg%3E") center/100% 100% no-repeat}
.intro-slot{position:absolute;left:19.83%;top:33.33%;width:12.76%;height:26.67%;overflow:visible;transition:opacity .3s}
.intro-slot polygon{fill:rgba(141,198,63,.06);stroke:rgba(255,255,255,.4);stroke-width:1.5;stroke-dasharray:3 4;vector-effect:non-scaling-stroke}
.intro-veil.docked .intro-slot{opacity:0}
/* The arrow stays invisible and tiny until its position and size are written (the script runs at the end of the page); otherwise the unsized SVG covers the screen at first. */
.intro-arrow{position:absolute;left:0;top:0;width:1px;height:1px;opacity:0;overflow:visible;transform-origin:50% 50%;will-change:transform;filter:drop-shadow(0 4px 10px rgba(0,0,0,.45))}
.intro-veil.ready .intro-arrow{opacity:1;transition:opacity .25s}
.intro-veil.lift .intro-arrow{transition:transform .55s cubic-bezier(.55,0,.85,.35)}
.intro-ring{position:absolute;left:0;top:0;width:10px;height:10px;margin:-5px 0 0 -5px;border-radius:50%;border:1.5px solid var(--lime);opacity:0;pointer-events:none}
.intro-veil.docked .intro-ring{animation:introRing .7s ease-out}
@keyframes introRing{0%{opacity:.9;transform:scale(1)}100%{opacity:0;transform:scale(14)}}
.intro-percent{position:absolute;left:0;right:0;bottom:max(28px,6vh);display:flex;justify-content:center;align-items:baseline;gap:12px;color:rgba(255,255,255,.5);font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase}
.intro-percent b{min-width:3.2em;text-align:right;color:#fff;font-size:15px;letter-spacing:0;font-variant-numeric:tabular-nums}
@media (prefers-reduced-motion:reduce){.intro-bl,.intro-veil.shown,.intro-slot{transition:none}.intro-veil.shown{clip-path:none;opacity:0;transition:opacity .4s}.intro-veil.docked .intro-ring{animation:none}}
