.portfolio-page{--radius:1.25rem}.portfolio-page section[id]{scroll-margin-top:6.5rem}.portfolio-page [data-slot=card]{border-radius:1.5rem;box-shadow:0 12px 36px -24px #00000073}.portfolio-page .eyebrow{letter-spacing:.14em;background:#b6ff000a;border:1px solid #b6ff002e;border-radius:999px;padding:.5rem .875rem}.portfolio-page #hero a:not([aria-label="Scroll to projects"]),.portfolio-page nav a[href=\#contact],.portfolio-page [data-slot=badge],.portfolio-page .progress-bar{border-radius:999px}.portfolio-page #hero .hero-portrait{border-radius:2rem}.portfolio-page input,.portfolio-page textarea{border-radius:.875rem}.portfolio-page input{min-height:2.75rem}.portfolio-page nav>div[data-scrolled]{border:1px solid #0000;border-radius:1.5rem}.portfolio-page nav>div[data-scrolled=true]{border-color:var(--border);box-shadow:0 12px 40px -16px #0009}.portfolio-page .scroll-progress{background:var(--primary);transform-origin:0;pointer-events:none;height:2px;position:fixed;inset:0 0 auto;transform:scaleX(0)}@keyframes portfolio-scroll-hint{0%,to{transform:translateY(0)}50%{transform:translateY(5px)}}@media (prefers-reduced-motion:no-preference){.portfolio-page a[aria-label="Scroll to projects"] svg{animation:1.8s ease-in-out 3 portfolio-scroll-hint}}@media (hover:hover) and (prefers-reduced-motion:no-preference){.portfolio-page .project-card{transition:translate .3s,border-color .3s,box-shadow .3s}.portfolio-page .project-card:hover{translate:0 -5px;box-shadow:0 20px 44px -24px #000000b3}.portfolio-page #hero a svg{transition:transform .25s}.portfolio-page #hero a:hover svg{transform:translateY(-2px)}}@media (prefers-reduced-motion:reduce){html:has(.portfolio-page){scroll-behavior:auto!important}.portfolio-page *,.portfolio-page :before,.portfolio-page :after{transition:none!important;animation:none!important}}
