.portfolio-page{--portfolio-hero-height:480px;isolation:isolate;background:var(--background);color:var(--foreground);padding-bottom:clamp(72px,6vw,112px);position:relative;overflow:clip}.portfolio-container{z-index:1;width:min(86%,1240px);margin-inline:auto;position:relative}.portfolio-page .section-atmosphere{opacity:.75}.portfolio-page .atmosphere-branches{stroke:var(--brand-cyan)}.portfolio-list-background{inset:var(--portfolio-hero-height) 0 0;pointer-events:none;position:absolute}.portfolio-hero{isolation:isolate;min-height:var(--portfolio-hero-height);text-align:center;padding:148px 20px 56px;position:relative;overflow:clip}.portfolio-hero-effects{--portfolio-effects-play-state:paused;z-index:-1;pointer-events:none;position:absolute;inset:0}.portfolio-hero-effects[data-moving=true]{--portfolio-effects-play-state:running}.portfolio-hero-planet{opacity:.82;width:min(82%,1000px);height:auto;position:absolute;top:26px;left:50%;transform:translate(-50%);-webkit-mask-image:linear-gradient(#000 0% 38%,#0008 65%,#0000 98%);mask-image:linear-gradient(#000 0% 38%,#0008 65%,#0000 98%)}.portfolio-hero-effects .twinkle-stars{opacity:.55}.portfolio-hero-effects .twinkle-star{animation-play-state:var(--portfolio-effects-play-state)}.portfolio-hero-content{z-index:1;width:min(100%,800px);margin-inline:auto;position:relative}.portfolio-hero-content>h1{animation:.7s cubic-bezier(.22,1,.36,1) both portfolio-text-enter}.portfolio-hero-content>p{animation:.7s cubic-bezier(.22,1,.36,1) .12s both portfolio-text-enter}@keyframes portfolio-text-enter{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translate(0,0)}}.portfolio-hero h1{color:var(--brand-cream);text-wrap:balance;margin:0;font-size:clamp(30px,3.2vw,46px);font-weight:800;line-height:1.5}.portfolio-hero h1>span{display:block}.portfolio-hero h1 em{color:var(--brand-cyan);font-style:normal}.portfolio-hero-content>p{color:#bfcbd9;text-wrap:pretty;max-width:620px;margin:14px auto 0;font-size:14px;line-height:1.95}.portfolio-hero .portfolio-hero-cta{width:auto;min-width:180px;height:48px;color:var(--brand-cream);background:#080f1ec7;border-radius:13px;margin-top:24px;font-size:14px}.portfolio-demo-note{color:#a7bdcc;text-align:center;margin:0 0 18px;font-size:11px;line-height:1.9}.portfolio-results{scroll-margin-top:112px}.portfolio-results:focus{outline:none}.portfolio-results:focus-visible{outline:2px solid var(--brand-cyan);outline-offset:8px}.portfolio-listing-bar{border-top:1px solid #6ac5e72b;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-bottom:24px;padding-top:22px;display:flex}.portfolio-listing-bar h2{color:var(--brand-cream);margin:0;font-size:19px;font-weight:600;line-height:1.7}.portfolio-listing-bar>p{color:#aebfd0;font-variant-numeric:tabular-nums;margin:0;font-size:12px}.portfolio-listing-bar b{color:var(--brand-cream);font-weight:500}.portfolio-slider{isolation:isolate;overflow-clip-margin:8px;position:relative;overflow:clip}.portfolio-slide[data-entering=true]{animation:.5s cubic-bezier(.4,0,.2,1) both portfolio-fade-in}.portfolio-slide-out{pointer-events:none;animation:.4s ease-in-out both portfolio-fade-out;position:absolute;inset:0}@keyframes portfolio-fade-in{0%{opacity:0}to{opacity:1}}@keyframes portfolio-fade-out{0%{opacity:1}to{opacity:0}}.portfolio-grid{grid-template-columns:repeat(3,minmax(0,1fr));align-items:stretch;gap:clamp(18px,1.6vw,24px);display:grid}.portfolio-results .brands-heading-row[data-reveal-state=pending] h2{opacity:0;transform:translateY(12px)}.portfolio-results .brands-heading-row[data-reveal-state=revealed] h2{animation:.65s cubic-bezier(.22,1,.36,1) both portfolio-text-enter}.portfolio-page .project-card,.portfolio-skeleton{background:linear-gradient(150deg,#0c1221,#151d2b) padding-box padding-box,linear-gradient(135deg,#6ac5e7b3,#6ac5e724 46%,#e2e5c980) border-box;border:1px solid #0000;border-radius:22px;padding:clamp(15px,1.25vw,18px)}.portfolio-page .project-card{height:auto;min-height:400px;text-decoration:none;transition:background-color .2s}.portfolio-page .project-card:before{background:radial-gradient(at 0 100%,#6ac5e710,#0000 62%)}.portfolio-page .project-card:focus-visible{outline:2px solid var(--brand-cream);outline-offset:6px}.portfolio-page .project-cover{aspect-ratio:1.45}.portfolio-page .project-cover-clip{border-radius:15px}.portfolio-page .project-arrow{width:44px;height:44px;color:var(--brand-cream);outline:6px solid #111a28;bottom:-20px}.portfolio-page .project-copy{padding:24px 3px 3px}.portfolio-page .project-copy h3{margin-bottom:5px;font-size:clamp(20px,1.6vw,24px);font-weight:650;line-height:1.7}.portfolio-page .project-copy p{max-width:54ch;margin-bottom:20px;font-size:13px;line-height:1.95}.portfolio-page .project-demo{color:#a8bdce;font-size:10px}.portfolio-page .project-tags{gap:8px}.portfolio-page .project-tags li{color:#c4d6de;background:#6ac5e706;border-color:#6ac5e736;padding:5px 11px;font-size:10px}.portfolio-empty{color:#bacbd9;text-align:center;border:1px solid #6ac5e72b;border-radius:18px;padding:64px 20px;line-height:2}.portfolio-skeleton-cover{aspect-ratio:1.45;background:#26344780;border-radius:15px}.portfolio-skeleton-title,.portfolio-skeleton-line,.portfolio-skeleton-tags,.portfolio-skeleton-pagination{background:#26344780;border-radius:6px}.portfolio-skeleton-title{width:45%;height:30px;margin-top:35px}.portfolio-skeleton-line{width:95%;height:14px;margin-top:15px}.portfolio-skeleton-line+.portfolio-skeleton-line{width:70%;margin-top:10px}.portfolio-skeleton-tags{width:55%;height:28px;margin-top:28px}.portfolio-skeleton-pagination{width:min(280px,80%);height:44px;margin:62px auto 0}@media (hover:hover){.portfolio-page .project-card:hover{background:linear-gradient(150deg,#0c1525,#172637) padding-box padding-box,linear-gradient(135deg,#6ac5e7,#6ac5e74d 46%,#e2e5c9b3) border-box;border-color:#0000}}@media not (min-width:1000px){.portfolio-container{width:88%}}@media (not (min-width:1200px)) and (min-width:700px){.portfolio-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media not (min-width:700px){.portfolio-page{--portfolio-hero-height:500px;padding-bottom:64px}.portfolio-container{width:calc(100% - 40px)}.portfolio-hero{padding:124px 20px 44px}.portfolio-hero h1{font-size:clamp(27px,7.4vw,34px);line-height:1.55}.portfolio-hero-planet{opacity:.65;width:155%;max-width:none;top:48px}.portfolio-hero-content>p{max-width:40ch;margin-top:16px;font-size:13px;line-height:2}.portfolio-hero .portfolio-hero-cta{min-width:170px;height:48px;margin-top:26px;font-size:13px}.portfolio-demo-note{margin-bottom:14px;font-size:10px}.portfolio-grid{grid-template-columns:minmax(0,1fr);gap:22px}.portfolio-page .project-card{border-radius:19px;padding:15px}.portfolio-page .project-copy{padding-top:27px}.portfolio-page .project-copy h3{font-size:21px}.portfolio-page .project-copy p{margin-bottom:20px;font-size:13px}.portfolio-page .project-tags li{padding-inline:11px;font-size:10px}.portfolio-listing-bar h2{font-size:17px}.portfolio-listing-bar>p{font-size:11px}}@media (prefers-reduced-motion:reduce){.portfolio-hero-content>h1,.portfolio-hero-content>p,.portfolio-results .brands-heading-row[data-reveal-state] h2{opacity:1;animation:none;transform:none}.portfolio-slide[data-entering=true]{animation:none}.portfolio-slide-out{animation:none;display:none}.portfolio-page .project-card,.portfolio-hero .hero-cta,.portfolio-hero .hero-cta:after{transition:none}}
