/* AVI Projects: spatial motion inspired by the public Layers previews. */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.projects-hero{isolation:isolate;overflow:hidden;background:radial-gradient(ellipse at 80% 40%,#25341b 0,transparent 44%),#090d0a;min-height:760px}
.projects-hero::before{opacity:.35;background-size:110px 110px}
.projects-hero>.wrap{z-index:2;pointer-events:none}
.projects-hero>.wrap a,.projects-hero>.wrap button{pointer-events:auto}
.projects-hero h1{max-width:9ch;font-size:clamp(5rem,9.2vw,11rem)}
.projects-hero h1 span{color:var(--paper)}
.projects-hero p:not(.project-status){max-width:43ch}
.project-spatial-field{position:absolute;z-index:0;width:61%;height:100%;right:-5%;top:0;pointer-events:none;mask-image:linear-gradient(90deg,transparent,#000 16%)}
.project-spatial-field canvas{position:absolute;inset:0;width:100%;height:100%;opacity:0;transition:opacity 1s}
.project-spatial-field.is-ready canvas{opacity:1}
.spatial-fallback{position:absolute;inset:12% 14%;transform:rotate(-30deg)}
.spatial-fallback i{position:absolute;inset:0;border:22px solid #a8dd50;border-radius:50%;transform:rotateX(50deg);box-shadow:inset 0 2px 15px #edffc7,0 0 55px #91d23722}
.spatial-fallback i:nth-child(2){inset:12%}.spatial-fallback i:nth-child(3){inset:24%}
.is-ready .spatial-fallback{visibility:hidden}
.project-art-caption{position:absolute;right:6%;top:40px;z-index:3;color:#aac292;font-size:.66rem;letter-spacing:.15em;display:flex;align-items:center;gap:12px}
.project-art-caption::before{content:'';width:26px;height:1px;background:#b7ee5b}
.project-hero-actions{display:flex;flex-wrap:wrap;align-items:center;gap:24px;margin-top:32px}
.projects-hero .project-explore{display:inline-flex;align-items:center;gap:30px;padding:14px 20px;border:1px solid #7a9862;color:var(--green);font-size:.88rem;font-weight:700;transition:background .3s,color .3s}
.project-explore:hover,.project-explore:focus-visible{background:var(--green);color:var(--ink)}
.project-motion-toggle{font-size:.76rem;background:transparent;color:#cbd5c4;border:0;border-bottom:1px solid #597047;padding:8px 0}
.project-motion-toggle:hover{color:var(--green)}.project-motion-toggle:disabled{opacity:.8;cursor:default}
.project-signal{margin-top:42px}
.spatial-navigator{background:#0e140f;padding:95px 0 110px}
.spatial-navigator::before{top:auto;bottom:-.4em;opacity:.5}
.navigator-intro{display:flex;justify-content:space-between;align-items:end;gap:50px;margin-bottom:42px}
.navigator-intro h2{font-size:clamp(2.7rem,4.5vw,5.5rem);line-height:.87;letter-spacing:-.075em}
.navigator-intro h2 span{color:#75876b}
.navigator-intro>p{color:#b0bfaa;font-size:1rem;max-width:30ch}
.spatial-navigator .navigator-layout{grid-template-columns:.6fr 1.4fr;min-height:610px;border:1px solid #374b30;box-shadow:0 20px 70px #0003}
.spatial-navigator .navigator-menu{background:linear-gradient(150deg,#172015,#0a0f0b)}
.spatial-navigator .navigator-option{padding:25px;grid-template-columns:32px 1fr 18px;gap:15px;border-color:#35442f}
.navigator-option small{display:block;font-size:.76rem;font-weight:400;color:#a5b69d;margin-top:7px;letter-spacing:.01em}
.spatial-navigator .navigator-option b{font-size:clamp(1.5rem,2.6vw,2.9rem);line-height:1}
.spatial-navigator .navigator-option.active,.spatial-navigator .navigator-option:hover,.spatial-navigator .navigator-option:focus-visible{padding-left:32px;background:#b7ee5b;color:#10150d}
.navigator-option.active small,.navigator-option:hover small,.navigator-option:focus-visible small{color:#2c451c}
.spatial-navigator .navigator-option:focus-visible{outline:2px solid white;outline-offset:-5px}
.spatial-navigator .navigator-stage{padding:32px;min-width:0;background:#151e13;--image-x:0px;--image-y:0px}
.navigator-images{position:absolute;z-index:-2;inset:0;overflow:hidden}
.spatial-navigator .navigator-image{z-index:auto;opacity:0;inset:-2.5%;width:105%;height:105%;max-width:none;filter:saturate(.65) brightness(.85);transform:translate(var(--image-x),var(--image-y)) scale(1.07);transition:opacity .65s ease,transform 1s cubic-bezier(.22,1,.36,1)}
.spatial-navigator .navigator-image.is-active{opacity:1;transform:translate(var(--image-x),var(--image-y)) scale(1)}
.spatial-navigator .navigator-stage::after{background:linear-gradient(0deg,rgba(6,12,7,.98),rgba(6,12,7,.65) 32%,rgba(6,12,7,.05) 78%),linear-gradient(90deg,#0b160c66,transparent)}
.navigator-stage::before{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;background:radial-gradient(circle at var(--light-x,65%) var(--light-y,30%),#cbff8615,transparent 48%)}
.navigator-reticle{position:absolute;inset:15px;pointer-events:none;z-index:1}
.navigator-reticle i{position:absolute;width:16px;height:16px;border:0 solid #ceeeaf88}
.navigator-reticle i:nth-child(1){top:0;left:0;border-top-width:1px;border-left-width:1px}
.navigator-reticle i:nth-child(2){top:0;right:0;border-top-width:1px;border-right-width:1px}
.navigator-reticle i:nth-child(3){bottom:0;left:0;border-bottom-width:1px;border-left-width:1px}
.navigator-reticle i:nth-child(4){bottom:0;right:0;border-bottom-width:1px;border-right-width:1px}
.spatial-navigator .navigator-stage-ui{position:relative;z-index:1;line-height:1.4;font-size:.65rem;color:#d0edae}
.spatial-navigator .navigator-copy{position:relative;z-index:1;max-width:570px;margin-top:140px}
.spatial-navigator .navigator-copy .eyebrow{font-size:.63rem;letter-spacing:.18em;margin-bottom:16px;color:#b7ee5b}
.spatial-navigator .navigator-copy h3{font-size:clamp(3.4rem,5.7vw,6.8rem);line-height:.85;letter-spacing:-.085em;margin:0 0 22px;color:var(--paper)}
.spatial-navigator .navigator-copy .navigator-description{font-size:.98rem;line-height:1.5;max-width:40ch;margin-bottom:26px;color:#d6dfd1}
.spatial-navigator .navigator-copy .text-link{font-size:.86rem;padding-bottom:8px;display:inline-flex;gap:30px;align-items:center}
.navigator-copy .text-link span{transition:transform .25s}
.navigator-copy .text-link:hover span{transform:translate(3px,-3px)}
.navigator-progress{display:flex;gap:5px;width:130px;margin-top:32px;position:relative;z-index:1}
.navigator-progress span{height:2px;flex:1;background:#85997755;transition:background .4s}
.navigator-progress span.active{background:var(--green)}
.project-motion-paused .project-status span{animation:none}
.project-motion-paused .spatial-navigator .navigator-image{transition:none;transform:none}
.project-motion-paused .nexus-card{transform:none!important}
.project-motion-paused .nexus-card img{transition:none;transform:none!important}
.project-motion-paused .navigator-copy .text-link span{transition:none}
@media(min-width:1800px){.projects-hero{min-height:860px}.project-spatial-field{width:65%;right:-2%}}
@media(max-width:1020px){.project-spatial-field{right:-15%;width:78%;opacity:.7}.projects-hero h1{font-size:clamp(4.6rem,10vw,7rem)}.navigator-stage-ui span:last-child{display:none}.spatial-navigator .navigator-option{padding:18px;gap:8px}.spatial-navigator .navigator-option.active,.spatial-navigator .navigator-option:hover{padding-left:23px}}
@media(max-width:760px){
  .projects-hero{min-height:740px;padding:300px 0 45px;align-items:end}
  .project-spatial-field{width:100%;height:400px;top:-15px;right:0;mask-image:linear-gradient(#000 60%,transparent);opacity:1}
  .project-art-caption{top:25px;right:20px;font-size:.58rem}
  .projects-hero h1{font-size:clamp(3.5rem,13.5vw,6rem);margin:24px 0;max-width:none}
  .projects-hero p:not(.project-status){font-size:.98rem}
  .project-status{font-size:.65rem}.project-hero-actions{gap:22px;margin-top:24px}.project-signal{margin-top:28px;font-size:.6rem}
  .spatial-navigator{padding:65px 0}.navigator-intro{display:block;margin-bottom:32px}.navigator-intro h2{font-size:clamp(2.5rem,10vw,4.2rem)}.navigator-intro p{margin-top:22px;font-size:.92rem}
  .navigator-kicker{margin-bottom:25px;font-size:.6rem}.navigator-kicker span:last-child{font-size:.58rem}
  .spatial-navigator .navigator-layout{grid-template-columns:1fr;min-height:0}
  .spatial-navigator .navigator-menu{display:grid;grid-template-columns:repeat(2,1fr)}
  .spatial-navigator .navigator-option{min-height:94px;padding:16px;grid-template-columns:20px 1fr 12px;border-bottom:1px solid #35442f}
  .spatial-navigator .navigator-option:nth-child(odd){border-right:1px solid #35442f}
  .spatial-navigator .navigator-option.active,.spatial-navigator .navigator-option:hover,.spatial-navigator .navigator-option:focus-visible{padding-left:16px}
  .spatial-navigator .navigator-option b{font-size:1.35rem}.navigator-option small{font-size:.6rem;margin-top:6px}.navigator-option span{font-size:.6rem}
  .spatial-navigator .navigator-stage{min-height:500px;padding:26px 22px}
  .spatial-navigator .navigator-copy{margin-top:165px}.spatial-navigator .navigator-copy h3{font-size:clamp(2.8rem,11vw,4.5rem)}
  .spatial-navigator .navigator-copy .navigator-description{font-size:.9rem}.navigator-reticle{inset:11px}
}
@media(prefers-reduced-motion:reduce){.project-spatial-field canvas{transition:none}.navigator-option,.navigator-progress span{transition:none!important}.projects-hero .project-status span{animation:none}.spatial-navigator .navigator-image{transition:none;transform:none}.nexus-card{transform:none!important}.nexus-card img{transition:none;transform:none!important}}