/* Project index and case study, Figma 6895:607 / 6895:1385. */
.nl-portfolio{padding-top:120px}
.nl-case{padding-top:60px}
.nl-portfolio h1,.nl-case h1{font-size:clamp(40px,3.333333vw,64px);font-weight:400;line-height:1.05;letter-spacing:-.04em}
.nl-portfolio h1{max-width:1394px;width:76%;margin-bottom:40px}
.nl-project-toolbar-anchor{height:0;pointer-events:none}
.nl-project-toolbar-slot{position:sticky;top:var(--nl-header-height,99px);z-index:20;height:var(--toolbar-height,auto);margin-bottom:40px;background:#fff}
.nl-project-toolbar{display:flex;align-items:center;justify-content:space-between;gap:24px;height:100%;background:#fff}
.nl-project-toolbar-slot.is-stuck{background:transparent}
/* Keep the reserved slot height; size the white bar around its compact contents. */
.nl-project-toolbar-slot.is-stuck .nl-project-toolbar{height:auto;padding-block:8px;box-shadow:0 0 0 100vmax #fff;clip-path:inset(0 -100vmax)}
.nl-project-toolbar-slot.is-stuck .nl-project-filters button{padding-block:6px}
@media(min-width:801px){.nl-project-toolbar-slot.is-stuck .nl-project-toolbar{align-items:center}.nl-project-toolbar-slot.is-stuck .nl-project-count{padding-top:0}}
.nl-project-filters{position:relative;isolation:isolate;display:flex;flex-wrap:wrap;gap:2px}
.nl-project-filters button{padding:10px 12px;border-radius:6px;background:#f2f2f2;font-size:17px;font-weight:500;line-height:1.3;letter-spacing:-.02em;transition:background .25s,color .25s,padding .25s var(--nl-ease)}
.nl-project-filters button:not([aria-pressed=true]):hover{background:#e4e4e4}
.nl-project-filters.has-sliding-pill button{position:relative}
.nl-project-filters.has-sliding-pill button:not([aria-pressed=true]):hover{background:#f2f2f2}
.nl-project-filters .nl-nav-highlight{z-index:1;mix-blend-mode:multiply}
.nl-project-filters .nl-nav-pill{background:#e4e4e4}
.nl-project-filters .nl-scramble{z-index:2}
.nl-project-filters button[aria-pressed=true]{background:#000;color:white}
.nl-project-count{flex:none;font-size:17px;line-height:1.3;letter-spacing:-.02em}
.nl-project[hidden],.nl-project-empty[hidden]{display:none}
.nl-project-empty{padding-block:80px;display:flex;flex-direction:column;align-items:center;gap:20px;text-align:center}
.nl-project-empty button{padding:10px 16px;border-radius:6px;background:#f2f2f2}
.nl-archive{padding-block:120px}
.nl-archive h2{font-size:clamp(30px,2.083333vw,40px);font-weight:500;line-height:1.05;letter-spacing:-.02em;margin-bottom:40px}
.nl-archive ul{position:relative;isolation:isolate;list-style:none;margin:0;padding:0}
.nl-archive-row{display:grid;grid-template-columns:24.2% minmax(0,1fr);gap:20px;font-size:20px;line-height:1.2;letter-spacing:-.02em}
.nl-archive-row.is-year-start{border-top:1px solid #f1f1f1}
.nl-archive-year{padding-block:12px}
.nl-archive-row a{position:relative;padding-block:12px;border-bottom:1px solid #f1f1f1}
.nl-archive-row:has(+.is-year-start) a{border-bottom:0}
.nl-archive .nl-nav-highlight{z-index:2}
.nl-archive .nl-nav-pill{background:#000}
.nl-archive-row .nl-scramble{position:relative;z-index:3;display:table;width:fit-content;max-width:calc(100% - 12px);white-space:normal;overflow-wrap:anywhere;transition:color .25s}
.nl-archive-row a:focus-visible .nl-scramble{color:#fff}
@media(hover:hover) and (pointer:fine){.nl-archive-row a:hover .nl-scramble{color:#fff}}
.nl-case-awards{display:flex;gap:6px;flex:none}
.nl-case-awards.is-open .nl-project-badge-tooltip{opacity:1;visibility:visible;transform:translate(-50%,0);transition-delay:0s}
@starting-style{.nl-case-awards.is-open .nl-project-badge-tooltip:popover-open{opacity:0;transform:translate(-50%,-4px)}}
.nl-case-hero{position:relative;height:800px;overflow:hidden;margin-top:-99px}
.nl-case-hero-media{position:absolute;inset:0}
.nl-case-hero-media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.nl-case-hero-fade{position:absolute;left:0;right:0;top:0;height:300px;z-index:1;pointer-events:none;background:linear-gradient(to bottom,rgba(0,0,0,.4),rgba(0,0,0,0))}
.nl-case-hero .nl-breadcrumbs{position:relative;z-index:2;padding-top:calc(99px + 16px);color:rgba(255,255,255,.6)}
.nl-case-hero .nl-breadcrumbs li+li::before{color:rgba(255,255,255,.6)}
.nl-case-hero .nl-breadcrumbs a:hover,.nl-case-hero .nl-breadcrumbs a:focus-visible{color:#fff}
.nl-case-hero-copy{position:absolute;left:0;right:0;bottom:60px;z-index:2;display:flex;flex-direction:column;gap:10px}
.nl-case-hero-copy h1{color:#fff;font-size:clamp(40px,3.333333vw,64px);font-weight:400;line-height:1.05;letter-spacing:-.04em}
.nl-case-media{position:relative;margin:0 0 40px;overflow:hidden;border-radius:6px;background:#ededed}
.nl-case-media img{width:100%;height:auto}
.nl-case-media video{width:100%;aspect-ratio:var(--media-ratio,16/9);object-fit:cover}
.nl-case-copy{display:grid;grid-template-columns:24.2% minmax(0,1fr);gap:20px;margin-block:120px}
.nl-case>.nl-case-copy:first-child{margin-top:0}
.nl-case-copy h2,.nl-case-copy p{font-size:18px;font-weight:400;line-height:1.5;letter-spacing:0}
.nl-case-copy>div{max-width:910px}
.nl-case-copy p+p{margin-top:27px}
.nl-case-meta{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-top:40px;font-size:14px;line-height:1.3;color:#969696}
.nl-case-meta a{color:#000;text-decoration:underline;text-underline-offset:4px;transition:opacity .25s}
.nl-case-meta a:hover{opacity:.5}
.nl-case-play{position:absolute;right:20px;bottom:20px;width:42px;height:42px;border-radius:50%;background:#0006;backdrop-filter:blur(16px);color:white;font-size:17px;opacity:0;transition:opacity .25s,background .25s}
.nl-case-media:hover .nl-case-play,.nl-case-hero-media:hover .nl-case-play,.nl-case-play:focus-visible,.nl-case-media:has(video[data-user-paused=true]) .nl-case-play,.nl-case-hero-media:has(video[data-user-paused=true]) .nl-case-play{opacity:1}
.nl-case-play:hover{background:#0009}
.nl-related{padding-block:80px 120px}
.nl-related .nl-section-heading .nl-button{padding:10px 16px}
@media(min-width:1921px){.nl-portfolio h1{width:1394px}}
@media(max-width:1300px){.nl-portfolio{padding-top:90px}.nl-portfolio h1{width:90%}.nl-project-toolbar{align-items:flex-start}.nl-project-count{padding-top:10px}.nl-project-filters button{font-size:15px}.nl-case-copy>div{max-width:100%}}
@media(max-width:800px){.nl-portfolio{padding-top:64px}.nl-portfolio h1{width:100%}.nl-project-toolbar{flex-direction:column;gap:16px}.nl-project-count{padding:0}.nl-case-copy{grid-template-columns:1fr;gap:24px;margin-block:64px}.nl-case>.nl-case-copy:first-child{margin-top:0}.nl-case-copy h2{color:#969696;font-size:16px}.nl-case-copy p{font-size:17px}.nl-case-media{margin-bottom:20px}.nl-archive,.nl-related{padding-block:64px}.nl-archive-row{grid-template-columns:72px minmax(0,1fr);font-size:18px}.nl-case-play{opacity:1;right:12px;bottom:12px}.nl-case-awards img{width:32px;height:32px}}
@media(max-width:1000px){.nl-case-hero{margin-top:-88px}.nl-case-hero .nl-breadcrumbs{padding-top:calc(88px + 16px)}}
@media(max-width:480px){.nl-portfolio h1,.nl-case h1{font-size:36px}.nl-project-filters button{font-size:14px;padding:9px 10px}.nl-project-toolbar-slot{margin-bottom:24px}.nl-archive-row{gap:12px;font-size:16px}.nl-case-copy p{font-size:16px}.nl-case-meta{margin-top:28px}.nl-related .nl-section-heading{gap:12px}.nl-related .nl-section-heading h2{font-size:26px}.nl-related .nl-section-heading .nl-button{font-size:14px;padding:10px 12px}}
@media(prefers-reduced-motion:reduce){.nl-project-filters button,.nl-archive-row .nl-scramble,.nl-case-play,.nl-case-meta a{transition:none}}