.projects-page{background:#fff;min-height:100vh;padding-top:76px}.projects-nav{height:82px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(20px,6vw,92px);border-bottom:1px solid var(--line);background:rgba(255,255,255,.94);position:sticky;top:0;z-index:100;backdrop-filter:blur(14px)}
.projects-nav img{height:42px;width:auto}.projects-nav a{text-decoration:none}.projects-back{display:inline-flex;align-items:center;gap:8px;color:var(--ink);font-size:.84rem;font-weight:750}.projects-hero{padding:clamp(70px,8vw,110px) 20px 35px;text-align:center;background:radial-gradient(circle at 50% 0,rgba(63,194,201,.13),transparent 42%)}.projects-hero .kicker{display:block}.projects-hero h1{font-size:clamp(2.25rem,5vw,4.6rem);line-height:1.02;margin:12px auto 17px;color:var(--ink)}.projects-hero p{max-width:670px;margin:auto;color:var(--muted);line-height:1.7}.projects-content{padding:25px clamp(20px,6vw,92px) 100px;max-width:1500px;margin:auto}.projects-content .filters{margin-bottom:34px}.projects-content .work-grid{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:24px!important;overflow:visible!important;padding:0!important}.projects-content .work-card{display:flex!important;width:auto!important;max-width:none!important;opacity:1!important;transform:none}.projects-content .work-card.hide{display:none!important}.projects-footer{padding:28px 20px;text-align:center;background:#071127;color:rgba(255,255,255,.65);font-size:.78rem}@media(max-width:980px){.projects-content .work-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}@media(max-width:620px){.projects-nav{height:68px;padding:0 16px}.projects-nav img{height:34px}.projects-hero{padding:55px 18px 25px}.projects-content{padding:20px 16px 70px}.projects-content .filters{justify-content:flex-start;overflow-x:auto;flex-wrap:nowrap;padding-bottom:5px}.projects-content .filter{white-space:nowrap}.projects-content .work-grid{grid-template-columns:1fr!important;gap:17px!important}}

/* Project cards must never capture vertical touch scrolling on phones/tablets. */
@media(max-width:1024px){
  .projects-content,.projects-content .work-grid,.projects-content .work-card,
  .projects-content .work-card *{touch-action:pan-y pinch-zoom!important;overscroll-behavior-y:auto!important}
  .projects-content .work-grid{overflow:visible!important}
  .projects-content .work-card{transform:none!important}
}