.portfolio-page{--pf-bg:#f4f2ee;--pf-surface:#fff;--pf-box:#eae7e0;--pf-ink:#14120f;--pf-muted:#14120f9e;--pf-line:#14120f1f;--pf-accent:var(--vivid-orange,#ff8b00);background:var(--pf-bg);color:var(--pf-ink)}.portfolio-hero{place-items:center;padding-block:24px 32px;padding-inline:15px;display:grid}.portfolio-hero-box{background:var(--pf-box);border-radius:30px;flex-direction:column;justify-content:center;width:100%;padding:34px 24px;display:flex}.portfolio-hero-inner{width:100%;max-width:1180px;margin-inline:auto}.portfolio-hero-title{letter-spacing:-.02em;margin-top:14px;font-size:clamp(38px,7.2vw,66px);line-height:.98}@media (width>=768px){.portfolio-hero{padding-block:28px 40px;padding-inline:4vw}.portfolio-hero-box{min-height:230px;padding:46px 44px}}@media (width>=1201px){.portfolio-hero{padding-block:32px 40px;padding-inline:4.5vw}.portfolio-hero-box{min-height:260px;padding:54px clamp(48px,5vw,92px)}.portfolio-hero-title{margin-top:18px}.portfolio-hero-headline{text-align:left;margin-left:0;margin-right:0;font-size:clamp(42px,4.5vw,68px);line-height:1}}.portfolio-hero [data-hero-anim]{opacity:0;transform:translateY(42px)}.portfolio-hero[data-ready=true] [data-hero-anim]{animation:.9s cubic-bezier(.16,1,.3,1) forwards portfolio-hero-in}.portfolio-hero[data-ready=true] [data-hero-anim=title]{animation-delay:.12s}@keyframes portfolio-hero-in{to{opacity:1;transform:translateY(0)}}@media (prefers-reduced-motion:reduce){.portfolio-hero [data-hero-anim]{opacity:1;transform:none;animation:none!important}}.portfolio-filter{border:1px solid var(--pf-line);background:var(--pf-surface);border-radius:999px;padding:8px;box-shadow:0 1px 2px #14120f0a}.portfolio-filter-scroll{flex-wrap:wrap;justify-content:center;gap:8px;display:flex}@media (width<=767px){.portfolio-filter{border-radius:22px}.portfolio-filter-scroll{scroll-snap-type:x proximity;scrollbar-width:none;-ms-overflow-style:none;flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto}.portfolio-filter-scroll::-webkit-scrollbar{display:none}.portfolio-filter-scroll>*{scroll-snap-align:start;flex:none}}.pf-pill{white-space:nowrap;border:1px solid var(--pf-line);color:var(--pf-ink);background:0 0;border-radius:999px;align-items:center;gap:8px;padding:10px 16px;font-size:14px;line-height:1;transition:background-color .22s,border-color .22s,color .22s;display:inline-flex}.pf-pill:hover{border-color:var(--pf-accent);background:#ff8b0012}.pf-pill[aria-pressed=true]{border-color:var(--pf-accent);background:#ff8b0024;font-weight:600}.pf-pill__count{color:var(--pf-muted);font-size:12px}.pf-pill[aria-pressed=true] .pf-pill__count{color:var(--pf-ink)}.pf-pill:focus-visible,.pf-page:focus-visible,.project-card a:focus-visible{outline:2px solid var(--pf-accent);outline-offset:3px}.portfolio-grid{grid-template-columns:1fr;gap:40px 16px;display:grid}@media (width>=768px){.portfolio-grid{grid-template-columns:1fr 1fr;gap:48px 16px}}.portfolio-grid[data-anim=out]{opacity:.35;transition:opacity .18s}.portfolio-grid[data-anim=in]>*{animation:.32s cubic-bezier(.16,1,.3,1) both pf-card-in}@keyframes pf-card-in{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}@media (prefers-reduced-motion:reduce){.portfolio-grid[data-anim=in]>*{animation:none}}.project-card{background:var(--pf-surface);border:1px solid var(--pf-line);border-radius:20px;padding:14px;position:relative;overflow:hidden}.project-card__media{aspect-ratio:14/9;border-radius:18px;position:relative;overflow:hidden}.project-card__media>*{object-fit:cover;width:100%;height:100%;transition:transform .7s cubic-bezier(.16,1,.3,1)}@media (width>=1201px){.project-card:hover .project-card__media>*,.project-card:focus-within .project-card__media>*{transform:scale(1.13)}}.project-card__content{background:var(--pf-surface);color:var(--pf-ink);border-radius:16px;justify-content:space-between;align-items:center;gap:16px;display:flex}@media (width>=1201px) and (hover:hover) and (pointer:fine){.project-card__content{opacity:0;width:70%;min-height:120px;padding:24px 28px;transition:opacity .3s,transform .3s;position:absolute;bottom:14px;left:14px;transform:translate(-50%)}.project-card:hover .project-card__content,.project-card:focus-within .project-card__content{opacity:1;transform:translate(0)}}@media (width<=1200px),(hover:none){.project-card__content{margin-top:14px;padding:4px 6px 6px}}@media (prefers-reduced-motion:reduce){.project-card:hover .project-card__media>*{transform:none}}.project-card__title{font-size:20px;font-weight:500;line-height:1.2}.project-card__arrow{border:1px solid var(--pf-line);width:50px;height:50px;color:var(--pf-ink);border-radius:999px;flex:none;place-items:center;transition:background-color .25s,transform .25s,border-color .25s;display:grid}@media (width>=1201px){.project-card:hover .project-card__arrow{background:var(--pf-accent);border-color:var(--pf-accent);color:#fff;transform:rotate(45deg)}}.pf-page{width:54px;height:54px;color:var(--pf-ink);border:1px solid #0000;border-radius:999px;place-items:center;font-size:15px;transition:border-color .22s,background-color .22s;display:grid}.pf-page:hover{border-color:var(--pf-accent)}.pf-page[aria-current=page]{border-color:var(--pf-ink);font-weight:600}.pf-page[disabled]{opacity:.35;pointer-events:none}.portfolio-hero .eyebrow,.portfolio-hero .eyebrow a{color:var(--pf-muted)}.portfolio-hero .eyebrow a:hover{color:var(--pf-ink)}.portfolio-hero .eyebrow:before{display:none!important}.portfolio-hero .eyebrow{text-align:center;justify-content:center;display:flex}@media (width>=1201px){.portfolio-hero .eyebrow{text-align:left;justify-content:flex-start}}.pt{isolation:isolate;width:100%;height:100%;position:relative;overflow:hidden}.pt:before{content:"";pointer-events:none;background:radial-gradient(80% 100% at 12% 8%,#ffffffb8,#0000 68%),radial-gradient(70% 90% at 92% 92%,#14151517,#0000 72%);position:absolute;inset:0}.pt img{width:100%;height:100%;display:block}.pt img[data-fit=top]{object-fit:cover;object-position:top center}.pt img[data-fit=contain]{object-fit:contain;object-position:center}.pt-browser{background:#fff;border-radius:10px;flex-direction:column;display:flex;position:absolute;overflow:hidden;box-shadow:0 18px 40px -18px #14151559,0 2px 6px #14151514}.pt-browser__bar{background:#f3f2ef;border-bottom:1px solid #0000000f;flex:none;align-items:center;gap:5px;height:7.5%;min-height:12px;padding:0 10px;display:flex}.pt-browser__bar i{background:#00000029;border-radius:99px;width:6px;height:6px}.pt-browser__view{flex:1;min-height:0}.pt-phone{background:#141515;border-radius:18px;width:19%;height:76%;padding:5px;position:absolute;bottom:7%;right:7%;box-shadow:0 18px 36px -14px #14151573}.pt-phone__view{background:#fff;border-radius:13px;height:100%;overflow:hidden}.pt-tile{background:#fbfaf8;border-radius:8px;overflow:hidden;box-shadow:0 14px 30px -16px #14151559,0 1px 3px #14151514}.pt[data-variant=browser-phone] .pt-a{width:68%;height:80%;top:10%;left:6%}.pt[data-variant=layers] .pt-back{opacity:.96;width:64%;height:70%;top:7%;right:6%}.pt[data-variant=layers] .pt-front{width:64%;height:70%;bottom:7%;left:6%}.pt[data-variant=browser-feed] .pt-a{width:60%;height:80%;top:10%;left:6%}.pt-col{grid-template-rows:1fr 1fr;gap:6%;width:25%;height:80%;display:grid;position:absolute;top:10%;right:6%}.pt-sheet{width:32%;height:82%;padding:3px;position:absolute;top:9%}.pt-sheet--a{z-index:2;left:14%}.pt-sheet--b{z-index:1;height:74%;top:13%;left:40%}.pt-sheet--c{z-index:3;width:22%;height:52%;top:24%;right:6%}.pt-sheet--solo{z-index:2;width:52%;left:24%}.pt[data-variant=board]:not(:has(.pt-sheet--c)) .pt-sheet--a{width:34%;left:16%}.pt[data-variant=board]:not(:has(.pt-sheet--c)) .pt-sheet--b{width:34%;height:82%;top:9%;left:auto;right:16%}.pt-feed{grid-template-columns:repeat(3,1fr);align-items:center;gap:4%;display:grid;position:absolute;inset:12% 6%}.pt-feed .pt-tile{height:86%}.pt-feed .pt-tile:nth-child(2){height:100%}.pt-contact{grid-template-rows:repeat(2,1fr);grid-template-columns:repeat(2,1fr);gap:4%;display:grid;position:absolute;inset:8% 10%}.pt-contact[data-n="3"] .pt-tile:first-child{grid-row:span 2}.pt-contact .pt-tile{padding:4px}@media (width<=640px){.pt-phone{border-radius:12px;padding:3px}.pt-phone__view{border-radius:9px}.pt-browser{border-radius:7px}.pt-browser__bar{gap:3px;min-height:9px;padding:0 6px}.pt-browser__bar i{width:4px;height:4px}}