.pin-nav{z-index:30;padding:0 4.2%;min-height:80px;background:linear-gradient(#050505eF,#050505b5);border-bottom:1px solid #ffffff1c}
.portfolio-menu{align-self:stretch;display:flex;align-items:center}.portfolio-menu-items{display:flex;align-items:stretch;height:100%;gap:clamp(14px,2.4vw,34px)}
.portfolio-nav-item{display:flex;align-items:center}.portfolio-nav-trigger{height:100%;position:relative;border:0;background:none;color:#f4f4f2;font:600 18px "Microsoft YaHei",sans-serif;letter-spacing:.02em;white-space:nowrap;cursor:pointer;padding:0 4px}.portfolio-nav-trigger span{font-size:12px;color:#a9a9a5;margin-left:5px}.portfolio-nav-trigger::after{content:'';position:absolute;left:0;right:0;bottom:0;height:2px;background:#b5ff65;box-shadow:0 0 10px rgba(181,255,101,.55);transform:scaleX(0);transition:transform .2s}.portfolio-nav-trigger:hover::after,.portfolio-nav-trigger[aria-expanded=true]::after,.portfolio-nav-trigger:focus-visible::after{transform:scaleX(1)}
.portfolio-submenu[hidden]{display:none}.portfolio-submenu{position:absolute;top:100%;left:0;width:100%;background:rgba(8,14,10,.95);backdrop-filter:blur(16px) saturate(1.1);border-bottom:1px solid rgba(170,220,150,.2);box-shadow:0 28px 50px #000a;color:#fff;animation:menu-in .23s ease-out}.portfolio-sub-inner{max-width:1320px;margin:auto;padding:34px 4.5% 38px;display:grid;grid-template-columns:1.1fr 1.25fr 1.2fr;gap:5%;align-items:start}.portfolio-sub-heading small,.portfolio-sub-preview span{font:10px Arial,sans-serif;letter-spacing:.17em;color:#a1a29e}.portfolio-sub-heading h2{font:600 32px "Microsoft YaHei",sans-serif;margin:12px 0}.portfolio-sub-heading p{font-size:13px;color:#aaa;line-height:1.8;max-width:260px}.portfolio-sub-heading>a{display:inline-block;color:#eee;text-decoration:none;font-size:13px;margin-top:14px;border-bottom:1px solid #999;padding-bottom:8px}.portfolio-sub-links{display:grid;grid-template-columns:1fr 1fr;gap:0 24px}.portfolio-sub-links a{display:flex;justify-content:space-between;gap:8px;color:#e3e3df;font-size:16px;text-decoration:none;padding:14px 0;border-bottom:1px solid rgba(170,220,150,.18)}.portfolio-sub-links a:hover{color:#b5ff65;border-color:rgba(181,255,101,.55)}.portfolio-sub-links a span{color:#888}.portfolio-sub-preview{display:block;position:relative;overflow:hidden;border-radius:5px;color:white}.portfolio-sub-preview img{display:block;width:100%;height:160px;object-fit:cover;filter:brightness(.72);transition:transform .35s,filter .35s}.portfolio-sub-preview:hover img{transform:scale(1.04);filter:brightness(.9)}.portfolio-sub-preview span{position:absolute;bottom:13px;left:14px;color:#fff}.portfolio-menu-toggle{display:none}@keyframes menu-in{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
@media(max-width:800px){.pin-nav{min-height:66px;padding:0 22px}.portfolio-menu-toggle{display:block;border:1px solid #ffffff66;border-radius:30px;padding:9px 15px;background:#121212;color:#fff;font:14px "Microsoft YaHei",sans-serif}.portfolio-menu-toggle span{margin-left:5px}.portfolio-menu-items{display:none;position:absolute;top:100%;left:0;right:0;height:auto;max-height:calc(100svh - 76px);overflow-y:auto;overscroll-behavior:contain;background:#101111;gap:0;padding:8px 22px 20px}.portfolio-menu.is-open .portfolio-menu-items{display:block}.portfolio-nav-item{display:block;border-bottom:1px solid #ffffff22}.portfolio-nav-trigger{display:flex;align-items:center;justify-content:space-between;width:100%;height:auto;min-height:56px;text-align:left;font-size:18px}.portfolio-nav-trigger::after{display:none}.portfolio-submenu{position:static;box-shadow:none;border:0;animation:none}.portfolio-sub-inner{display:block;padding:6px 0 16px}.portfolio-sub-heading small,.portfolio-sub-heading h2,.portfolio-sub-heading p,.portfolio-sub-preview{display:none}.portfolio-sub-heading>a{margin:0 0 8px;font-size:13px}.portfolio-sub-links{gap:0 16px}.portfolio-sub-links a{padding:12px 0;font-size:15px}}
@media(prefers-reduced-motion:reduce){.portfolio-submenu{animation:none}.portfolio-sub-preview img{transition:none}}
/* Inset navigation frame and comfortable spacing. */
@media(min-width:801px){.pin-nav{top:20px;left:4.2%;width:91.6%;padding:0 3%;min-height:76px;border:1px solid #ffffff1c;border-radius:12px 12px 0 0;background:#090a0aed}.portfolio-menu-items{gap:clamp(22px,2.7vw,46px)}.portfolio-submenu{border:1px solid #ffffff1c;border-top:0;border-radius:0 0 12px 12px;overflow:hidden}.portfolio-sub-inner{padding:36px 4% 40px}}
@media(max-width:800px){.pin-nav{top:12px;left:12px;width:calc(100% - 24px);padding:0 17px;border:1px solid #ffffff1c;border-radius:10px;background:#090a0aed}.portfolio-menu-items{border:1px solid #ffffff22;border-top:0;border-radius:0 0 10px 10px}}