/* Estilos das páginas de projeto (projetos/<slug>/index.html) */
.pj{padding:150px 0 60px}
.back{display:inline-flex;align-items:center;gap:10px;font:500 10px/1 var(--ff-t);letter-spacing:.26em;text-transform:uppercase;color:var(--mute);margin-bottom:40px;transition:color .3s}.back:hover{color:#fff}
.pj-head{display:grid;gap:22px;max-width:1000px}
.pj h1{font-size:clamp(50px,7.5vw,112px);line-height:.95}
.pj .lede{font-size:clamp(16px,1.3vw,19px);max-width:62ch;color:var(--sand)}
.ficha{display:flex;gap:clamp(24px,4vw,56px);flex-wrap:wrap;padding:22px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin:36px 0 clamp(30px,4vw,54px)}
.ficha b{display:block;font:400 24px/1 var(--ff-d);color:#fff}.ficha span{font:500 9.5px/1.6 var(--ff-t);letter-spacing:.22em;text-transform:uppercase;color:var(--mute)}
.gal{display:grid;gap:12px;grid-template-columns:repeat(2,1fr)}
@media (min-width:900px){.gal{grid-template-columns:repeat(3,1fr)}}
.gal a{position:relative;display:block;aspect-ratio:4/5;overflow:hidden;background:var(--surface)}
.gal a:first-child{grid-column:1/-1;aspect-ratio:16/9}
@media (min-width:900px){.gal a:first-child{aspect-ratio:21/9}}
.gal img{width:100%;height:100%;object-fit:cover;transition:transform 1.4s var(--ease)}.gal a:hover img{transform:scale(1.04)}
.gal a::after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 1px var(--line);pointer-events:none}
.txt{display:grid;gap:30px;margin:clamp(50px,7vw,100px) 0}
@media (min-width:900px){.txt{grid-template-columns:.36fr .64fr;gap:80px;align-items:start}.txt h2{position:sticky;top:110px}}
.txt h2{font-size:clamp(34px,3.6vw,54px)}
.txt .body{display:grid;gap:20px;color:var(--mute);font-size:16px;max-width:66ch}
.txt .body p:first-child{color:var(--sand);font-size:17px}
.prog{margin-top:30px;padding-top:22px;border-top:1px solid var(--line)}
.prog small{display:block;font:500 10px/1 var(--ff-t);letter-spacing:.26em;text-transform:uppercase;color:var(--sage);margin-bottom:12px}
.prog p{color:var(--sand);font-size:15px}
.outros{padding:clamp(70px,9vw,120px) 0;background:var(--bg-2)}
.outros .head{display:flex;justify-content:space-between;align-items:end;gap:20px;flex-wrap:wrap;margin-bottom:30px}
.reel{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-bottom:10px;cursor:grab;-webkit-overflow-scrolling:touch}.reel::-webkit-scrollbar{display:none}.reel.drag{cursor:grabbing;scroll-snap-type:none}
.reel .card{flex:none;width:min(76%,340px);scroll-snap-align:start}
.hint{display:inline-flex;align-items:center;gap:10px;font:500 10px/1 var(--ff-t);letter-spacing:.24em;text-transform:uppercase;color:var(--mute)}
.hint svg{width:22px;height:22px;animation:hint 2.2s var(--ease) infinite}@keyframes hint{50%{transform:translateX(8px)}}
/* lightbox */
.lb{position:fixed;inset:0;z-index:80;background:rgba(10,12,10,.96);display:grid;place-items:center;opacity:0;pointer-events:none;transition:opacity .4s}
.lb.open{opacity:1;pointer-events:auto}
.lb img{max-width:min(94vw,1500px);max-height:88vh;object-fit:contain;box-shadow:0 40px 100px -40px #000}
.lb .x{position:absolute;right:22px;top:18px;font:300 40px var(--ff-d);color:var(--sand)}
.lb .n{position:absolute;top:50%;transform:translateY(-50%);width:54px;height:54px;border:1px solid var(--line-2);font:300 26px var(--ff-d);color:var(--sand);display:grid;place-items:center}
.lb .n.l{left:18px}.lb .n.r{right:18px}
.lb .c{position:absolute;bottom:22px;left:50%;transform:translateX(-50%);font:500 10px/1 var(--ff-t);letter-spacing:.26em;color:var(--mute)}