.work-hero-section{padding-top:clamp(20px,3.5vw,40px);padding-bottom:clamp(36px,5vw,64px);position:relative}.work-ambient-glow{filter:blur(65px);pointer-events:none;z-index:0;background:radial-gradient(#6c5ce71f 0%,#8b5cf60d 45%,#0000 72%);border-radius:50%;width:min(1080px,94vw);height:520px;position:absolute;top:-40px;left:50%;transform:translate(-50%)}.portfolio-hero-pills{-ms-overflow-style:none;scrollbar-width:none;align-items:center;gap:6px;padding-bottom:4px;display:flex;overflow-x:auto}.portfolio-hero-pills::-webkit-scrollbar{display:none}.portfolio-hero-pill-btn{white-space:nowrap;color:#5e586c;cursor:pointer;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#ffffffe6;border:1px solid #e5e7ebd9;border-radius:9999px;align-items:center;gap:6px;padding:6px 13px;font-size:12px;font-weight:500;transition:all .22s cubic-bezier(.22,1,.36,1);display:inline-flex}.portfolio-hero-pill-btn:hover{color:#14121a;background:#fff;border-color:#6c5ce759;transform:translateY(-1px)}.portfolio-hero-pill-btn.is-active{color:#fff;background:#14121a;border-color:#14121a;box-shadow:0 4px 14px -2px #14121a38}.portfolio-hero-showcase{width:100%;position:relative}.portfolio-hero-main-card{background:#fff;border:1px solid #6c5ce729;border-radius:20px;width:100%;transition:transform .35s cubic-bezier(.22,1,.36,1),box-shadow .35s cubic-bezier(.22,1,.36,1);position:relative;overflow:hidden;box-shadow:0 20px 48px -14px #1412231f,0 2px 10px -2px #6c5ce70d}.portfolio-hero-main-card:hover{transform:translateY(-2px);box-shadow:0 24px 56px -14px #6c5ce72e,0 4px 14px -2px #1412230f}.portfolio-filter-bar{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.portfolio-filter-btn{color:#5e586c;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);cursor:pointer;background:#ffffffd9;border:1px solid #e5e7ebe6;border-radius:9999px;align-items:center;gap:7px;padding:8px 16px;font-size:13px;font-weight:500;transition:all .22s cubic-bezier(.22,1,.36,1);display:inline-flex}.portfolio-filter-btn:hover{color:#14121a;background:#fff;border-color:#6c5ce759;transform:translateY(-1px)}.portfolio-filter-btn.is-active{color:#fff;background:#14121a;border-color:#14121a;box-shadow:0 4px 16px -2px #14121a40}.portfolio-featured-card{background:#fff;border:1px solid #6c5ce72e;border-radius:24px;transition:transform .35s cubic-bezier(.22,1,.36,1),box-shadow .35s cubic-bezier(.22,1,.36,1),border-color .3s;position:relative;box-shadow:0 16px 40px -15px #1814300f,0 2px 8px -2px #6c5ce70a}.portfolio-featured-card:hover{border-color:#6c5ce759;transform:translateY(-3px);box-shadow:0 24px 50px -15px #6c5ce71f,0 4px 14px -2px #1814300a}.portfolio-grid-card{background:#fff;border:1px solid #e5e7ebd9;border-radius:20px;flex-direction:column;justify-content:space-between;transition:transform .35s cubic-bezier(.22,1,.36,1),box-shadow .35s cubic-bezier(.22,1,.36,1),border-color .3s;display:flex;position:relative;overflow:hidden;box-shadow:0 4px 20px -8px #1814300d}.portfolio-grid-card:hover{border-color:#6c5ce74d;transform:translateY(-4px);box-shadow:0 20px 40px -15px #18143017,0 4px 12px -2px #6c5ce70d}.portfolio-browser-frame{background:#fbfaff;border:1px solid #e5e7ebe6;border-radius:14px;width:100%;position:relative;overflow:hidden}.portfolio-browser-chrome{z-index:2;background:#fbfaff;border-bottom:1px solid #e5e7ebcc;flex-shrink:0;justify-content:space-between;align-items:center;padding:8px 12px;display:flex;position:relative}.portfolio-screenshot-wrapper{background:#f8f7fc;justify-content:center;align-items:flex-start;width:100%;display:flex;position:relative;overflow:hidden}.portfolio-screenshot-wrapper img,.portfolio-screenshot-img{object-fit:contain;object-position:top center;will-change:transform;width:100%;max-width:100%;height:auto;transition:transform .4s cubic-bezier(.22,1,.36,1);display:block}.portfolio-hero-viewport{background:#f8f7fc;justify-content:center;align-items:flex-start;width:100%;display:flex;position:relative;overflow:hidden}.portfolio-hero-viewport img,.portfolio-hero-img{object-fit:contain;object-position:top center;will-change:transform;width:100%;max-width:100%;height:auto;transition:transform .4s cubic-bezier(.22,1,.36,1);display:block}.portfolio-hero-title-bar{z-index:2;flex-shrink:0;position:relative}.portfolio-grid-card:hover .portfolio-screenshot-img,.portfolio-featured-card:hover .portfolio-screenshot-img,.portfolio-hero-main-card:hover .portfolio-hero-img{transform:scale(1.018)}.portfolio-num-badge{letter-spacing:.05em;color:#6c5ce7;background:#6c5ce714;border:1px solid #6c5ce729;border-radius:9999px;padding:3px 8px;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:11px;font-weight:700}