.portfolio-projects .grid figure.fa-project{aspect-ratio:16/9;isolation:isolate;overflow:hidden;background:radial-gradient(ellipse at 72% 48%,#83c82323,transparent 60%),#050705}
.portfolio-projects .grid figure.fa-project>img{position:absolute;right:2%;top:4%;width:48%;height:92%;min-height:0;object-fit:contain;opacity:1;rotate:12deg;z-index:2;filter:drop-shadow(0 0 25px #aaff0020);transition:transform .65s,rotate .65s,filter .65s}
.fa-card-brand{position:absolute;inset:0;z-index:3;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;padding:8%;font-family:var(--display,system-ui);text-align:left;pointer-events:none}
.fa-card-brand>span{font-size:clamp(20px,3vw,42px);font-weight:800;letter-spacing:-.06em;line-height:1}.fa-card-brand strong{color:#aaff00;font-size:clamp(22px,3.4vw,48px);letter-spacing:-.06em;line-height:1.15}.fa-card-brand strong span{display:inline-block;font-size:.7em;margin-left:10px;transition:transform .4s}.fa-card-brand small{font:8px/1.7 ui-monospace,monospace;letter-spacing:.08em;margin-top:16px;color:#d1ddc7;max-width:55%}
.fa-bb-orbit{position:absolute;right:-2%;top:35%;width:68%;height:30%;border:1px solid #aaff0035;border-radius:50%;rotate:-22deg;z-index:1;pointer-events:none;transition:border-color .4s,box-shadow .4s}
.fa-bb-orbit i{position:absolute;inset:-2px;border-radius:50%;animation:fa-orbit 3.8s linear infinite;animation-play-state:paused}.fa-bb-orbit i:nth-child(2){animation-delay:-1.3s}.fa-bb-orbit i:nth-child(3){animation-delay:-2.5s}.fa-bb-orbit i:before{content:'';position:absolute;left:12%;top:8%;width:5px;height:5px;border-radius:50%;background:#d7ffa4;box-shadow:0 0 8px #aaff00,8px 3px 0 -1px #abec65,16px 5px 0 -1.7px #abec65}
.portfolio-projects .fa-project-link:is(:hover,:focus-visible) .fa-project>img{opacity:1;transform:translate(-4%,-3%) scale(1.06);rotate:4deg;filter:drop-shadow(0 0 28px #aaff0040)}.portfolio-projects .fa-project-link:is(:hover,:focus-visible) .fa-bb-orbit{border-color:#aaff0080;box-shadow:0 0 35px #aaff0012,inset 0 0 25px #aaff0010}.fa-project-link:is(:hover,:focus-visible) .fa-bb-orbit i{animation-play-state:running}.fa-project-link:is(:hover,:focus-visible) .fa-card-brand strong span{transform:translate(3px,-3px)}.fa-project-link:focus-visible{outline:2px solid #aaff00;outline-offset:4px}
@keyframes fa-orbit{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.portfolio-projects .grid figure.fa-project *{animation:none!important;transition:none!important}.portfolio-projects .fa-project-link:is(:hover,:focus-visible) .fa-project>img{transform:none;rotate:12deg}}