.hp-wrap{width:100%;max-width:420px;margin:28px auto 0}.hp-browser{border:1px solid var(--c-accent-15);border-radius:var(--br-md);box-shadow:0 20px 60px #0006, 0 0 40px var(--c-accent-06);background:#050d19b3;overflow:hidden}.hp-bar{border-bottom:1px solid var(--c-accent-08);background:#0a1a2ee6;align-items:center;gap:6px;padding:10px 14px;display:flex}.hp-dot{border-radius:50%;width:8px;height:8px}.hp-dot-r{background:#ff5f57}.hp-dot-y{background:#ffbd2e}.hp-dot-g{background:#28ca41}.hp-url{color:var(--c-text-dim);background:var(--c-accent-05);border-radius:var(--br-pill);white-space:nowrap;text-overflow:ellipsis;animation:hpUrlFade .5s var(--ease-out);flex:1;margin-left:12px;padding:3px 12px;font-size:11px;overflow:hidden}@keyframes hpUrlFade{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.hp-viewport{aspect-ratio:16/10;background:#0a1a2e80;width:100%;position:relative}.hp-slide{opacity:0;visibility:hidden;transition:opacity .8s,visibility .8s;position:absolute;inset:0}.hp-slide--active{opacity:1;visibility:visible}.hp-slide img{object-fit:cover}.hp-progress{border-top:1px solid var(--c-accent-08);background:#0a1a2ee6;justify-content:center;gap:8px;padding:10px 0 12px;display:flex}.hp-dot-nav{background:var(--c-accent-20);width:6px;height:6px;transition:all .4s var(--ease-out);border-radius:50%}.hp-dot-nav--active{background:var(--c-accent);width:18px;box-shadow:0 0 10px var(--c-accent-40);border-radius:3px}@media (max-width:768px){.hp-wrap{max-width:320px}.hp-url{font-size:10px}}@media (prefers-reduced-motion:reduce){.hp-slide{transition:none}.hp-url{animation:none}}
.pg-portfolio-grid{gap:var(--sp-gap);grid-template-columns:repeat(3,1fr);display:grid}.pg-portfolio-card{color:inherit;background:var(--c-card-bg);border:1px solid var(--c-border);border-radius:var(--br-xl);transition:transform var(--tr-smooth), box-shadow var(--tr-smooth), border-color var(--tr-smooth);text-decoration:none;display:block;overflow:hidden}.pg-portfolio-card:hover{transform:var(--lift-md);border-color:var(--c-border-hover);box-shadow:var(--shadow-glow-md)}.pg-portfolio-img{aspect-ratio:16/10;width:100%;position:relative;overflow:hidden}.pg-portfolio-img img{object-fit:cover;width:100%;height:100%;transition:transform .8s var(--ease-out)}.pg-portfolio-card:hover .pg-portfolio-img img{transform:scale(1.05)}.pg-portfolio-placeholder{background:var(--c-accent-04);width:100%;height:100%;color:var(--c-accent-30);justify-content:center;align-items:center;display:flex}.pg-portfolio-img:after{content:"";background:linear-gradient(to top, var(--c-bg) 0%, transparent 50%);pointer-events:none;position:absolute;inset:0}.pg-portfolio-body{padding:24px var(--sp-section-x) 28px}.pg-portfolio-name{font-size:var(--fs-card-title);color:var(--c-heading);margin:0 0 8px;font-weight:600}.pg-portfolio-desc{font-size:var(--fs-body-sm);color:var(--c-text-body);margin:0 0 14px;line-height:1.6}.pg-portfolio-tags{flex-wrap:wrap;gap:6px;display:flex}.pg-portfolio-tag{border-radius:var(--br-pill);background:var(--c-accent-06);border:1px solid var(--c-accent-10);color:var(--c-accent);letter-spacing:.02em;padding:3px 10px;font-size:12px}@media (max-width:1024px){.pg-portfolio-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:768px){.pg-portfolio-grid{grid-template-columns:1fr}}.pg-tab-intro{max-width:720px;font-size:var(--fs-body);color:var(--c-text-body);text-align:center;margin:-16px auto 32px;line-height:1.6}.pg-tabs-intro{max-width:780px;font-size:var(--fs-body);color:var(--c-text-body);text-align:center;margin:-8px auto 28px;line-height:1.65}.pg-portfolio-logo-wrap{background:linear-gradient(180deg, var(--c-card-bg) 0%, #c9a2270a 100%);justify-content:center;align-items:center;width:100%;height:100%;padding:0 24px;display:flex}.pg-portfolio-logo-badge{border-radius:var(--br-xl);border:1px solid var(--c-brass-border-s);background:linear-gradient(#fff 0%,#f4f3ef 100%);justify-content:center;align-items:center;width:auto;min-width:96px;max-width:180px;height:72px;padding:10px 18px;display:flex;box-shadow:inset 0 1px #fff9,0 6px 18px #00000047}.pg-portfolio-logo-badge.is-tight{width:72px;min-width:0;height:72px;box-shadow:none;border-radius:var(--br-full);background:0 0;border-color:#0000;padding:0;overflow:hidden}.pg-portfolio-img .pg-portfolio-logo{object-fit:contain;width:auto;max-width:100%;height:auto;max-height:100%;display:block;transform:none!important}.pg-portfolio-card:hover .pg-portfolio-img .pg-portfolio-logo{transform:none!important}.pg-portfolio-logo-badge.is-tight .pg-portfolio-logo{width:100%;height:100%}.pg-portfolio-logo-badge.is-compact .pg-portfolio-logo{max-width:78%;max-height:78%}.pg-portfolio-logo-mono{filter:brightness(0)}.pg-section-advanced{scroll-margin-top:80px}.pg-portfolio-card-advanced{border-color:var(--c-brass-border);background:linear-gradient(180deg, var(--c-card-bg) 0%, #c9a22705 100%);isolation:isolate;position:relative}.pg-portfolio-card-advanced:before{content:"";border-radius:var(--br-xl);background:conic-gradient(from var(--pg-spin,0deg), transparent 0deg, var(--c-brass) 60deg, transparent 130deg, var(--c-brass-light) 220deg, transparent 290deg, var(--c-brass) 360deg);-webkit-mask-composite:xor;opacity:0;transition:opacity .6s var(--ease-out);pointer-events:none;z-index:1;padding:1px;animation:14s linear infinite pgConicSpin;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#000 0 0),linear-gradient(#000 0 0);mask-image:linear-gradient(#000 0 0),linear-gradient(#000 0 0);-webkit-mask-position:0 0,0 0;mask-position:0 0,0 0;-webkit-mask-size:auto,auto;mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.pg-portfolio-card-advanced:hover{border-color:var(--c-brass-border-s)}.pg-portfolio-card-advanced:hover:before,.pg-portfolio-card-advanced[data-revealed=true]:before{opacity:1}@property --pg-spin{syntax:"<angle>";inherits:false;initial-value:0deg}@keyframes pgConicSpin{to{--pg-spin:360deg}}.pg-portfolio-placeholder-advanced{background:linear-gradient(135deg, var(--c-brass-glow) 0%, var(--c-bg-deep,var(--c-bg)) 100%);color:var(--c-brass-light)}.pg-portfolio-card-advanced .pg-portfolio-tag{background:var(--c-brass-glow);border-color:var(--c-brass-border);color:var(--c-brass-light)}.pg-portfolio-card-advanced:hover{box-shadow:0 12px 36px #00000047, 0 0 40px var(--c-brass-glow)}.pz-reveal{opacity:0;transition:opacity .7s var(--ease-out), transform .7s var(--ease-out);transition-delay:calc(var(--i,0) * .1s);will-change:opacity, transform;transform:translateY(28px)}.pz-reveal[data-revealed=true]{opacity:1;transform:translateY(0)}@media (max-width:768px){.pg-portfolio-card-advanced:hover{box-shadow:0 6px 18px #00000047, 0 0 22px var(--c-brass-glow)}.pg-portfolio-card-advanced:before{animation-duration:22s}}@media (prefers-reduced-motion:reduce){.pg-portfolio-card-advanced:before{opacity:1;animation:none}.pz-reveal{opacity:1;transition:none;transform:none}}