/* Seventh scene: a held film frame, followed by the five transverse portfolio chapters. */
.portfolio-feature{height:170svh;position:relative;margin-bottom:45px}
#projetos .section-heading{opacity:var(--portfolio-heading-opacity,1);translate:0 var(--portfolio-heading-y,0px)}
.portfolio-feature:has(.showcase[hidden]){display:none}
#projetos .showcase{position:sticky;top:110px;height:calc(100svh - 155px);min-height:390px;display:grid;grid-template-rows:minmax(0,1fr) auto auto;margin-bottom:0}
#projetos .showcase-media{height:100%;min-height:0;aspect-ratio:auto;transform:scale(var(--portfolio-scale,1));border-radius:var(--portfolio-radius,0px);transform-origin:center}
#projetos .showcase-bottom h3{font-size:clamp(28px,3.4vw,48px)}
#projetos .showcase-timeline{margin-top:20px}
.motion-reduced .portfolio-feature{height:auto}
.motion-reduced #projetos .showcase{position:relative;top:auto;height:auto;min-height:0}
.motion-reduced #projetos .showcase-media{height:auto;aspect-ratio:16/8.6;transform:none;border-radius:0}
.motion-reduced #projetos .project-card{opacity:1;translate:none}
.motion-reduced #projetos .section-heading{opacity:1;translate:none}
@media(max-width:700px){
 #projetos{padding-top:85px}
 .portfolio-feature{height:140svh;margin-bottom:35px}
 #projetos .showcase{top:95px;height:calc(100svh - 165px);min-height:380px}
 #projetos .showcase-bottom{gap:15px;align-items:flex-start}
 #projetos .showcase-bottom h3{font-size:29px}
 #projetos .showcase-bottom .tiny{font-size:7px}
 #projetos .showcase-controls{gap:10px}
 #projetos .showcase-controls button{width:36px;height:36px;font-size:19px}
 #projetos .showcase-open{width:90px;height:90px;font-size:7px}
 #projetos .project-grid{grid-template-columns:1fr;gap:36px}
 #projetos .project-card:nth-child(3n+2){transform:none}
 #projetos .project-card.portrait .project-media{aspect-ratio:4/5}
 #projetos .filters button{font-size:8px;padding:9px 0}
 .motion-reduced .portfolio-feature{height:auto}
}

.portfolio-navigation{display:flex;flex-wrap:wrap;gap:16px 30px;padding:25px 0 45px}
.portfolio-navigation a{border-bottom:1px solid #b7a28366;padding:8px 0}
.portfolio-navigation a:hover{color:var(--sand)}
#projetos .project-grid{display:block}
.portfolio-group{height:var(--group-height,250svh);position:relative;margin-inline:-6vw;width:calc(100% + 12vw);background:var(--sand);color:var(--ink)}
.portfolio-group-stage{position:sticky;top:0;height:100svh;overflow:hidden;isolation:isolate}
.portfolio-landscape{position:absolute;inset:0;width:100%;height:100%;opacity:.28;pointer-events:none;transform:translateY(calc((.5 - var(--rail-progress,0))*8svh)) scale(1.1)}
.portfolio-group-heading{position:absolute;left:30%;top:35%;width:65%;pointer-events:none;opacity:.6}
.portfolio-group-heading h3{font-size:clamp(62px,9vw,170px);line-height:.88;margin:25px 0}
.portfolio-group-heading h3 em{font-style:normal}
.portfolio-group-heading p{font-size:12px;max-width:260px}
.portfolio-rail{position:absolute;left:0;top:20svh;display:flex;align-items:flex-start;gap:7vw;padding:0 8vw;width:max-content;transform:translate3d(82vw,0,0);will-change:transform}
#projetos .portfolio-card{position:relative;display:block;flex:none;width:36vw;height:65svh;padding:0;background:var(--ink);color:var(--paper);text-align:left;box-shadow:0 18px 45px #29271f22;border-radius:0;overflow:visible;opacity:1;translate:none}
#projetos .portfolio-card:focus-visible{outline-color:var(--ink)}
#projetos .portfolio-card.is-portrait{width:30vw;height:65svh}
#projetos .portfolio-card:nth-child(3n+1){transform:translateY(-7svh) rotate(-1.4deg)}
#projetos .portfolio-card:nth-child(3n+2){transform:translateY(9svh) rotate(1.2deg)}
#projetos .portfolio-card:nth-child(3n+3){transform:translateY(1svh) rotate(-.8deg)}
#projetos .portfolio-card .project-media{position:relative;width:100%;height:100%;aspect-ratio:auto;overflow:hidden}
#projetos .portfolio-card .project-media:after{content:'';position:absolute;inset:35% 0 0;background:linear-gradient(transparent,#0009);pointer-events:none}
#projetos .portfolio-card img{width:100%;height:100%;object-fit:cover}
.portfolio-caption{position:absolute;left:25px;bottom:28px;right:70px;pointer-events:none}
.portfolio-caption .tiny{font-size:8px}
.portfolio-caption h4{font-size:clamp(24px,3vw,52px);line-height:1;margin-top:8px}
.portfolio-open{position:absolute;right:22px;bottom:26px;width:38px;height:38px;border:1px solid #fff9;border-radius:50%;display:grid;place-items:center;font-size:23px;pointer-events:none}
.portfolio-group-bottom{position:absolute;bottom:35px;left:6vw;right:6vw;display:flex;justify-content:space-between;font-size:8px;pointer-events:none}
#projetos [data-group="blender"] .portfolio-card{width:62vw;height:57svh}
#projetos [data-group="blender"] img{object-fit:contain}
#projetos .portfolio-card.site-project{width:66vw;height:auto;padding-bottom:88px;background:var(--paper);color:var(--ink)}
.site-address{display:block;height:30px;padding:8px 15px;background:var(--paper);font-size:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#projetos .site-project .project-media{height:auto}
#projetos .site-project img{filter:none;transform:none;height:auto;object-fit:contain;background:var(--paper)}
#projetos .site-project .project-media:after{display:none}
.site-project .portfolio-caption{bottom:20px;left:22px}
.site-project .portfolio-caption h4{font-size:clamp(22px,2.5vw,38px)}
.site-project .portfolio-open{border-color:currentColor}
#project-status{padding-top:30px}
.motion-reduced .portfolio-group{height:auto!important}
.motion-reduced .portfolio-group-stage{position:relative;height:auto;padding:70px 6vw}
.motion-reduced .portfolio-group-heading{position:relative;left:auto;top:auto;width:auto;opacity:1;margin-bottom:45px}
.motion-reduced .portfolio-landscape,.motion-reduced .portfolio-group-bottom{display:none}
.motion-reduced .portfolio-rail{position:relative;left:auto;top:auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:35px;width:auto;padding:0;transform:none!important;will-change:auto}
.motion-reduced #projetos .portfolio-card{width:100%!important;height:55svh;transform:none!important}
.motion-reduced #projetos .portfolio-card.site-project{height:auto}
@media(max-width:700px){
 .portfolio-navigation{gap:8px 20px;font-size:8px}
 .portfolio-group-heading{left:13%;top:38%;width:80%}
 .portfolio-group-heading h3{font-size:16vw;margin:20px 0}
 .portfolio-group-heading p{font-size:10px}
 .portfolio-rail{top:23svh;gap:12vw}
 #projetos .portfolio-card{width:84vw;height:51svh}
 #projetos .portfolio-card.is-portrait{width:65vw;height:60svh}
 #projetos [data-group="blender"] .portfolio-card{width:88vw;height:48svh}
 #projetos .portfolio-card.site-project{width:90vw;height:auto;padding-bottom:90px}
 .portfolio-caption{left:18px;bottom:22px;right:60px}
 .portfolio-caption h4{font-size:29px}
 .portfolio-caption .tiny{font-size:7px}
 .portfolio-open{right:15px;bottom:20px;width:32px;height:32px;font-size:20px}
 .portfolio-group-bottom{font-size:7px;bottom:82px}
 .motion-reduced .portfolio-rail{grid-template-columns:1fr}
}