.portfolio-hero{background:var(--ink);min-height:980px;color:var(--paper);padding:70px 5vw 55px;position:relative;overflow:hidden}.portfolio-kicker{font:400 10px var(--mono);letter-spacing:.12em;text-transform:uppercase;gap:16px;display:flex}.portfolio-kicker span{color:var(--lime)}.portfolio-hero-copy{z-index:2;grid-template-columns:1.25fr .75fr;align-items:end;margin-top:55px;display:grid;position:relative}.portfolio-hero h1{font:300 clamp(65px,8.5vw,130px)/.73 var(--serif);letter-spacing:-.06em;margin:0}.portfolio-hero h1 em{color:var(--lime);font-weight:300}.portfolio-hero-copy>p{color:#b7b8b1;max-width:470px;margin:0 0 8px;font-size:14px;line-height:1.8}.hero-timeline{z-index:3;height:520px;margin-top:18px;position:relative}.timeline-caption{z-index:4;color:#9a9b94;font:400 9px var(--mono);letter-spacing:.08em;text-transform:uppercase;justify-content:space-between;display:flex;position:absolute;inset:20px 0 auto}.timeline-key{align-items:center;gap:14px;display:flex}.timeline-key .range-key,.timeline-key .milestone-key{align-items:center;gap:6px;display:inline-flex}.timeline-key .range-key:before,.timeline-key .milestone-key:before{content:"";background:var(--lime);border-radius:50%;width:7px;height:7px}.timeline-key .milestone-key:before{background:var(--clay)}.timeline-curve{width:100%;height:100%;position:absolute;inset:0;overflow:visible}.timeline-curve path{fill:none;stroke:#666860;stroke-width:3px;stroke-linecap:round;stroke-linejoin:round}.timeline-curve .timeline-duration{stroke:var(--lime);stroke-width:9px;opacity:.48}.timeline-points{position:absolute;inset:0}.timeline-point{--point-color:var(--clay);z-index:5;opacity:0;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.timeline-point.chapter{--point-color:var(--lime)}.timeline-point.open{z-index:20}.hero-timeline.ready .timeline-point{opacity:1}.timeline-point>button{border:2px solid var(--point-color);background:var(--ink);width:46px;height:46px;color:var(--point-color);cursor:pointer;font:300 30px/1 var(--sans);border-radius:50%;place-items:center;padding:0;transition:all .2s;display:grid}.timeline-point>button:hover,.timeline-point>button:focus-visible,.timeline-point.open>button{background:var(--point-color);color:var(--ink);transform:rotate(90deg)}.duration-cap{z-index:-1;border:2px solid var(--lime);background:var(--ink);pointer-events:none;border-radius:50%;width:13px;height:13px;margin:-6.5px 0 0 -6.5px;position:absolute;top:23px;left:23px}.duration-cap.end{background:var(--lime)}.timeline-point.chapter:not(.has-duration) .duration-cap{display:none}.milestone-label{text-align:center;width:140px;position:absolute;top:58px;left:50%;transform:translate(-50%)}.timeline-point:nth-child(2n) .milestone-label{top:auto;bottom:58px}.milestone-label time{color:var(--point-color);font:500 10px var(--mono);white-space:nowrap;display:block}.milestone-label span{display:none}.milestone-comment{background:var(--paper);width:280px;color:var(--ink);opacity:0;pointer-events:none;padding:24px;transition:opacity .18s,transform .18s;position:absolute;top:50%;left:62px;transform:translate(-8px,-50%);box-shadow:0 18px 45px #00000052}.milestone-comment:before{content:"";background:var(--paper);width:18px;height:18px;position:absolute;top:50%;left:-9px;transform:translateY(-50%)rotate(45deg)}.milestone-comment time{color:var(--point-color);font:500 10px var(--mono);position:relative}.milestone-comment h3{font:300 31px/.95 var(--serif);margin:14px 0 10px;position:relative}.milestone-comment strong,.milestone-comment .milestone-link{color:var(--blue);font:500 10px/1.4 var(--mono);letter-spacing:.04em;text-transform:uppercase;margin:-3px 0 12px;display:block;position:relative}.milestone-comment a{text-underline-offset:3px;text-decoration:underline 1px}.milestone-comment p{white-space:pre-line;max-height:45vh;color:var(--muted);margin:0;padding-right:4px;font-size:12px;line-height:1.65;position:relative;overflow-y:auto}.milestone-comment p a{color:var(--blue);overflow-wrap:anywhere}.timeline-point.align-right .milestone-comment{left:auto;right:62px;transform:translate(8px,-50%)}.timeline-point.align-right .milestone-comment:before{left:auto;right:-9px}.timeline-point.open .milestone-comment{opacity:1;pointer-events:auto;transform:translateY(-50%)}.portfolio-projects{background:var(--paper);padding:110px 5vw}.portfolio-section-head{grid-template-columns:.45fr 1.55fr;align-items:start;gap:4vw;margin-bottom:80px;display:grid}.portfolio-section-head>p{color:var(--muted);font:400 10px var(--mono);letter-spacing:.08em;text-transform:uppercase;margin:9px 0 0}.portfolio-section-head h2{font:300 clamp(56px,8vw,118px)/.82 var(--serif);letter-spacing:-.05em;margin:0}.projects-heading{grid-template-columns:.45fr 1fr auto;align-items:end}.project-filters{flex-wrap:wrap;justify-content:end;gap:8px;display:flex}.project-filters button{border:1px solid var(--line);color:inherit;cursor:pointer;font:500 9px var(--mono);text-transform:uppercase;background:0 0;border-radius:99px;padding:10px 15px}.project-filters button.active{background:var(--ink);color:var(--paper)}.portfolio-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;display:grid}.portfolio-grid.is-pair{grid-template-columns:repeat(2,minmax(0,1fr))}.portfolio-card{background:var(--white);grid-template-rows:auto 1fr;min-width:0;transition:transform .25s;display:grid}.portfolio-card:hover{transform:translateY(-8px)}.portfolio-card[hidden]{display:none}.portfolio-card:only-child{grid-column:span 2}.portfolio-card-visual{aspect-ratio:16/10;background-color:var(--blue);min-height:0;color:var(--lime);background-position:50%;background-size:cover;place-items:center;display:grid;position:relative;overflow:hidden}.portfolio-card.theme-clay .portfolio-card-visual{background-color:var(--clay)}.portfolio-card.theme-dark .portfolio-card-visual{background-color:var(--ink)}.portfolio-card-visual:before{content:"";aspect-ratio:1;opacity:.45;border:1px solid;border-radius:50%;width:62%;position:absolute}.portfolio-card-visual.has-image:before{display:none}.portfolio-card-visual>span{font:400 10px var(--mono);position:absolute;top:20px;left:20px}.portfolio-card-visual strong{font:300 clamp(72px,8vw,125px)/1 var(--serif);letter-spacing:-.05em;position:relative}.portfolio-card-copy{flex-direction:column;padding:28px;display:flex}.portfolio-card-copy>div{color:var(--muted);font:400 9px var(--mono);text-transform:uppercase;justify-content:space-between;gap:16px;display:flex}.portfolio-card-copy>div span:last-child{text-align:right;flex:none}.portfolio-card-copy h3{overflow-wrap:break-word;font:300 clamp(32px,3vw,48px)/.95 var(--serif);margin:34px 0 14px}.portfolio-card-copy p{color:var(--muted);margin:0;font-size:12px;line-height:1.7}.portfolio-card-copy b{border-bottom:0;border-top:1px solid var(--line);font:500 9px var(--mono);text-transform:uppercase;margin-top:auto;padding-top:42px;display:block}@media (width<=900px){.portfolio-hero{min-height:920px}.portfolio-hero-copy{grid-template-columns:1fr}.portfolio-hero-copy>p{margin-top:30px}.portfolio-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=680px){.portfolio-hero{min-height:1080px;padding:55px 6vw 35px;overflow:visible}.portfolio-hero-copy{margin-top:35px}.portfolio-hero h1{font-size:20vw}.portfolio-hero-copy>p{font-size:13px}.hero-timeline{height:680px;margin-top:15px}.timeline-caption{top:0}.timeline-curve,.timeline-points{height:630px;top:20px}.timeline-point>button{width:44px;height:44px}.milestone-label{width:108px;top:52px}.timeline-point:nth-child(2n) .milestone-label{bottom:52px}.milestone-label time{font-size:9px}.milestone-label span{display:none}.milestone-comment h3{margin:10px 0 8px;font-size:22px}.timeline-point .milestone-comment,.timeline-point.align-right .milestone-comment,.timeline-point.stacked-comment .milestone-comment{box-sizing:border-box;width:min(210px,100vw - 32px);max-height:min(260px,100vh - 32px);padding:16px;position:fixed;top:50%;left:50%;right:auto;overflow:hidden;transform:translate(-50%,calc(8px - 50%))}.timeline-point .milestone-comment:before{display:none}.timeline-point.open .milestone-comment,.timeline-point.stacked-comment.open .milestone-comment{transform:translate(-50%,-50%)}.milestone-comment strong,.milestone-comment .milestone-link{margin-bottom:8px;font-size:8px}.milestone-comment p{max-height:82px;font-size:11px;overflow-y:auto}.portfolio-projects{padding:80px 6vw}.portfolio-section-head,.projects-heading{grid-template-columns:1fr;gap:22px;margin-bottom:55px}.project-filters{justify-content:start}.portfolio-grid,.portfolio-grid.is-pair{grid-template-columns:1fr}.portfolio-card:only-child{grid-column:auto}.portfolio-card-visual{min-height:0}.timeline-key{gap:8px}.timeline-instruction{display:none}}.milestone-comment .milestone-media{aspect-ratio:16/9;max-height:150px;margin:12px 0}.milestone-comment .milestone-media img,.milestone-comment .milestone-media video,.milestone-comment .milestone-media iframe{max-height:150px}@media (width<=680px){.timeline-point .milestone-comment,.timeline-point.align-right .milestone-comment,.timeline-point.stacked-comment .milestone-comment{overflow-y:auto}.milestone-comment .milestone-media{max-height:110px}}.milestone-comment p{font-size:16px}.timeline-point.open>button{z-index:2;position:relative}@media (width<=680px){.milestone-comment p{max-height:120px;font-size:16px}}.engineering-intro{grid-template-columns:.35fr 1fr;align-items:start;gap:6vw;margin-bottom:42px;display:grid}.engineering-intro>p:last-child{max-width:720px;color:var(--muted);margin:0;font-size:16px;line-height:1.8}.engineering-timeline-shell{background:var(--ink);color:var(--paper);margin:0 -5vw 75px;padding:22px 5vw 36px}.engineering-timeline-shell .hero-timeline{margin-top:0}.engineering-timeline-shell .timeline-caption{top:14px}@media (width<=760px){.engineering-intro{grid-template-columns:1fr;gap:18px;margin-bottom:30px}.engineering-timeline-shell{margin:0 -6vw 60px;padding:18px 6vw 28px}.engineering-timeline-shell .timeline-caption{top:0}.engineering-timeline-shell .timeline-point:not(.open) .milestone-comment{display:none}.engineering-timeline-shell .timeline-point.open .milestone-comment{display:block}}
