
/* Portfólio Opta Render — projetos vinculados às pastas originais. */
.portfolio-section{padding:90px 0 110px}
.portfolio-section .projects-heading{margin:53px 0 48px}
.portfolio-toolbar{display:flex;gap:24px;align-items:center;justify-content:space-between;border-bottom:1px solid #c7c9bc;padding-bottom:24px}
.filter-list{display:flex;flex-wrap:wrap;gap:8px}
.filter-button,.video-filter{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:42px;background:transparent;border:1px solid #b6bcaf;color:#424a3c;border-radius:2px;padding:10px 17px;font-size:11px;font-weight:600;cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.filter-button[aria-pressed=true],.video-filter[aria-pressed=true]{background:#263025;color:#f6f4ed;border-color:#263025}
.filter-button:hover,.video-filter:hover{border-color:#263025}
.filter-count{font-size:9px;opacity:.65}
.video-filter{flex-shrink:0;border-radius:24px}
.video-filter>span:first-child{font-size:20px;line-height:1}
.video-filter>span:last-child{font-size:9px;opacity:.7}
.portfolio-status{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:23px 0 27px;color:#626b5e;font-size:10px}
.portfolio-status p{margin:0}
.portfolio-status>span{font-size:8px;letter-spacing:.1em}
.portfolio-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:44px 24px}
.portfolio-card{min-width:0}
.portfolio-card-button{display:block;text-align:left;background:none;border:0;padding:0;width:100%;cursor:pointer;color:inherit}
.portfolio-visual{position:relative;display:block;aspect-ratio:4/5;background:#d2d4c9;overflow:hidden}
.portfolio-visual>img{height:100%;width:100%;object-fit:cover;transition:transform .7s var(--ease)}
.portfolio-card-button:hover .portfolio-visual>img{transform:scale(1.035)}
.portfolio-number{position:absolute;top:18px;left:18px;color:#fff;background:#18211b69;border:1px solid #ffffff57;display:grid;place-items:center;width:29px;height:29px;border-radius:50%;font-size:9px;backdrop-filter:blur(6px)}
.video-badge{position:absolute;right:16px;top:18px;color:#fff;background:#202a20df;padding:8px 11px;font-size:10px;letter-spacing:.02em}
.portfolio-open{position:absolute;left:0;right:0;bottom:0;padding:35px 22px 18px;background:linear-gradient(transparent,#101c18a6);font-size:11px;color:white;opacity:0;transform:translateY(8px);transition:opacity .25s,transform .25s}
.portfolio-card-button:hover .portfolio-open,.portfolio-card-button:focus-visible .portfolio-open{opacity:1;transform:none}
.portfolio-caption{display:flex;align-items:end;justify-content:space-between;gap:12px;padding:21px 0 20px;border-bottom:1px solid #c6c9bd}
.portfolio-category{display:block;font-size:8px;color:#69735f;letter-spacing:.12em;text-transform:uppercase;margin-bottom:9px}
.portfolio-name{display:block;font-family:var(--serif);font-size:33px;line-height:1}
.portfolio-media-count{font-size:9px;color:#59614f;line-height:1.6;text-align:right}
.portfolio-empty{padding:45px 0;font-size:14px;line-height:1.8;color:#626b5e}
.cover-fallback{height:100%;display:grid;place-items:center;font-family:var(--serif);font-size:42px}
.project-dialog{max-width:1460px;width:calc(100% - 64px);height:calc(100dvh - 48px);max-height:none;margin:24px auto;border:0;padding:0;background:var(--bg);color:var(--ink);overflow:auto;overscroll-behavior:contain}
.project-dialog::backdrop{background:#101810ad;backdrop-filter:blur(6px)}
.gallery-shell{padding:0 48px 64px}
.gallery-topbar{position:sticky;top:0;z-index:3;background:var(--bg);display:flex;align-items:center;justify-content:space-between;gap:16px;border-bottom:1px solid var(--line);padding:17px 0}
.gallery-brand{font-size:9px;font-weight:600;letter-spacing:.14em}
.gallery-close{display:flex;align-items:center;gap:25px;border:0;background:none;padding:4px 0 4px 12px;font-size:11px;cursor:pointer;color:var(--ink)}
.gallery-close>span{font-size:29px;font-weight:400;line-height:1}
.gallery-heading{padding:47px 0 34px;display:flex;align-items:end;justify-content:space-between;gap:20px}
.gallery-eyebrow{font-size:10px;letter-spacing:.13em;text-transform:uppercase;color:#6a745f;margin:0 0 16px}
.gallery-heading h2{font-family:var(--serif);font-size:clamp(48px,6vw,80px);font-weight:400;letter-spacing:-.03em;line-height:1;margin:0}
.gallery-heading>p{margin:0 0 5px;font-size:11px;color:#6a745f}
.gallery-tabs{display:flex;gap:30px;border-bottom:1px solid var(--line)}
.gallery-tabs>button{border:0;border-bottom:2px solid transparent;padding:17px 0;background:none;font-size:12px;cursor:pointer;color:#747c6c}
.gallery-tabs>button[aria-selected=true]{color:var(--ink);border-bottom-color:var(--ink);font-weight:700}
.environment-bar{display:flex;align-items:start;gap:23px;padding-top:25px}
.environment-bar>span{font-size:8px;letter-spacing:.12em;color:#737b6c;padding-top:14px}
.environment-bar .filter-button{font-size:10px;min-height:37px;padding:8px 13px}
.gallery-hint{font-size:10px;color:#737b6c;margin:25px 0 20px}
.gallery-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px 20px}
.gallery-item{margin:0;min-width:0}
.gallery-image-button{position:relative;width:100%;padding:0;display:block;border:0;background:#dce0d5;cursor:zoom-in;overflow:hidden;aspect-ratio:4/5}
.gallery-image-button>img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}
.gallery-image-button:hover>img{transform:scale(1.035)}
.image-enlarge{position:absolute;bottom:12px;right:12px;color:#fff;background:#1b291c99;border:1px solid #ffffff70;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;font-size:17px}
.gallery-item figcaption{display:flex;justify-content:space-between;gap:10px;font-size:9px;color:#65705d;padding-top:12px}
.gallery-videos{padding-top:30px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:30px}
.gallery-video-item{margin:0;min-width:0}
.gallery-video-item:only-child{width:min(100%,660px);grid-column:1/-1;justify-self:center}
.gallery-video-item>video{width:100%;display:block;max-height:67dvh;object-fit:contain;background:#172018}
.gallery-video-item>figcaption{display:flex;align-items:center;justify-content:space-between;gap:14px;font-size:11px;margin-top:17px;line-height:1.7}
.gallery-video-item>figcaption>a{font-size:10px;border-bottom:1px solid #8d9684}
.video-error{font-size:12px;line-height:1.8}
.image-dialog{border:0;padding:0;margin:0;width:100%;max-width:none;height:100dvh;max-height:none;background:#101610;color:#f1f1e8;overflow:auto;overscroll-behavior:contain}
.image-dialog::backdrop{background:#101610}
.image-viewer{height:100%;padding:0 32px;display:flex;flex-direction:column}
.viewer-topbar,.viewer-bottom{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:70px;flex-shrink:0;font-size:11px}
.viewer-topbar{border-bottom:1px solid #3b4337}
.viewer-topbar>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.viewer-close{color:#fff;background:none;border:0;font-size:32px;padding:5px 10px;cursor:pointer}
.viewer-stage{position:relative;flex:1;min-height:0;padding:20px 60px;display:flex;align-items:center;justify-content:center}
.viewer-stage>img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain}
.viewer-arrow{position:absolute;z-index:1;top:50%;transform:translateY(-50%);width:40px;height:48px;border:1px solid #7b8872;background:#151e18bf;color:#fff;font-size:23px;cursor:pointer}
.viewer-prev{left:0}.viewer-next{right:0}
.viewer-bottom{border-top:1px solid #3b4337;min-height:65px;font-size:10px}
.viewer-bottom>a{padding:10px 0;border-bottom:1px solid #78866f}
.viewer-error{font-size:12px;line-height:1.8;margin:8px 0;color:#d8ddca}
@media(min-width:1450px){.portfolio-grid{gap:50px 30px}.portfolio-name{font-size:39px}}
@media(max-width:1000px){.portfolio-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.portfolio-visual{aspect-ratio:4/5}.gallery-shell{padding-inline:28px}.gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.environment-bar{flex-direction:column;gap:12px}.environment-bar>span{padding:0}.portfolio-toolbar{align-items:start}}
@media(max-width:650px){
  .hero{min-height:0}.hero-heading{padding:50px 0 42px}
  .portfolio-section{padding:66px 0 75px}.portfolio-section .projects-heading{margin:37px 0 30px}
  .portfolio-toolbar{flex-direction:column;gap:15px;padding-bottom:20px}.filter-button{padding:9px 12px;min-height:39px;font-size:10px;gap:8px}.video-filter{min-height:37px;font-size:10px;padding:7px 13px}
  .portfolio-status{margin:20px 0}.portfolio-status>span{display:none}
  .portfolio-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 13px}.portfolio-number{top:10px;left:10px;width:24px;height:24px;font-size:8px}.video-badge{right:8px;top:10px;font-size:8px;padding:6px 7px}
  .portfolio-caption{align-items:start;flex-direction:column;gap:10px;padding:16px 0}.portfolio-name{font-size:29px}.portfolio-category{font-size:7px;margin-bottom:7px}.portfolio-media-count{font-size:8px;text-align:left}.portfolio-open{padding:25px 10px 12px;font-size:9px}
  .project-dialog{width:100%;height:100dvh;margin:0}.gallery-shell{padding:0 19px 40px}.gallery-topbar{padding:13px 0}.gallery-brand{font-size:7px;letter-spacing:.07em}.gallery-close{font-size:9px;gap:10px}
  .gallery-heading{padding:33px 0 25px;align-items:start;flex-direction:column;gap:20px}.gallery-eyebrow{font-size:9px;margin-bottom:12px}.gallery-heading h2{font-size:54px}.gallery-heading>p{font-size:10px}
  .gallery-tabs{gap:25px}.gallery-tabs>button{font-size:11px;padding:15px 0}.environment-bar .filter-list{gap:7px}.environment-bar .filter-button{font-size:9px;padding:7px 10px;min-height:33px}
  .gallery-grid{gap:22px 12px}.gallery-item figcaption{font-size:8px;padding-top:9px}.gallery-hint{font-size:9px;line-height:1.7}.image-enlarge{width:25px;height:25px;font-size:14px;bottom:8px;right:8px}
  .gallery-videos{grid-template-columns:1fr}.gallery-video-item>figcaption{font-size:10px;flex-wrap:wrap}.gallery-video-item>video{max-height:65dvh}
  .image-viewer{padding:0 14px}.viewer-topbar{min-height:62px;font-size:10px}.viewer-stage{padding:12px 0}.viewer-arrow{width:32px;height:42px;font-size:19px}.viewer-prev{left:0}.viewer-next{right:0}.viewer-bottom{min-height:60px;font-size:9px}
}
@media(hover:none){.portfolio-open{opacity:1;transform:none}}

/* Vídeos originais acima das galerias; projeto Alten abre o portfólio. */
.portfolio-visual{width:100%;border:0;padding:0;text-align:left}
.portfolio-image-cover{cursor:pointer;color:#fff}
.portfolio-image-cover:hover>img{transform:scale(1.035)}
.portfolio-image-cover:hover .portfolio-open,.portfolio-image-cover:focus-visible .portfolio-open{opacity:1;transform:none}
.portfolio-card[data-project="alten"]{grid-column:1/-1}
.portfolio-card[data-project="alten"] .portfolio-visual{aspect-ratio:16/9}
.portfolio-card[data-project="alten"] .portfolio-name{font-size:44px}
.portfolio-media-count{display:flex;flex-direction:column;align-items:end;gap:8px}
.portfolio-gallery-link{color:#293624;font-size:10px;border-bottom:1px solid #a1a892;padding-bottom:4px}
.portfolio-video-visual{background:#121b14}
.portfolio-cover-video{display:block;width:100%;height:100%;object-fit:contain;background:#121b14}
.cover-video-title{position:absolute;left:15px;top:16px;z-index:1;padding:8px 11px;background:#172319c9;color:#f6f5ed;font-size:9px;letter-spacing:.08em;text-transform:uppercase;pointer-events:none}
.cover-video-error{position:absolute;top:35%;left:10%;right:10%;color:#fff;font-size:11px;line-height:1.8;text-align:center;pointer-events:none}
.cover-play-button{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;align-items:center;flex-direction:column;gap:15px;background:transparent;border:0;color:#fff;cursor:pointer;padding:15px}
.cover-play-symbol{height:72px;width:72px;display:grid;place-items:center;border:1px solid #ffffffda;border-radius:50%;background:#1c291d70;font-size:23px;padding-left:3px;backdrop-filter:blur(5px)}
.cover-play-label{font-size:9px;font-weight:700;letter-spacing:.1em;white-space:nowrap;text-shadow:0 2px 10px #000}
.cover-play-button:hover .cover-play-symbol{background:#f4f2ea;color:#1a281c}
.brand-artwork,.footer-artwork{position:relative;display:block;overflow:hidden;flex-shrink:0}
.brand-artwork{width:213px;height:32px;mix-blend-mode:multiply}
.brand .brand-artwork img,.footer-main .footer-artwork img{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:120%;max-width:none;height:auto}
.footer-artwork{width:280px;height:40px;mix-blend-mode:screen}
.about-inner{gap:8%;padding-block:100px;align-items:center}
.about-portrait{margin:0;align-self:start}
.about-portrait>img{width:100%;height:auto;aspect-ratio:3/4;object-fit:cover;object-position:50% 20%}
.about-portrait>figcaption{display:flex;justify-content:space-between;gap:15px;padding:18px 0;border-bottom:1px solid #bdc2b5;font-size:8px;font-weight:600;letter-spacing:.08em;color:#626e5b;line-height:1.6}
.about-copy .section-index{margin-bottom:30px;font-size:9px;letter-spacing:.1em}
.about-copy h2{font-size:clamp(46px,5.3vw,75px);letter-spacing:-.06em;margin-bottom:13px}
.about-copy .about-role{font-size:10px;color:#626e5b;letter-spacing:.03em;margin-bottom:30px}
.about-copy p{max-width:none}
.about-copy .about-manifesto{font-size:29px;font-family:var(--serif);line-height:1.3;color:#303e2a;border-top:1px solid #bdc2b5;padding-top:24px;margin:28px 0 0}
.about-manifesto em{font-weight:400}
@media(max-width:900px){
  .brand-artwork{width:185px;height:29px}
  .about-inner{grid-template-columns:.85fr 1fr;gap:6%;padding-block:75px}
  .about-copy p{font-size:12px;line-height:1.9}
  .about-copy .about-manifesto{font-size:26px}
}
@media(max-width:650px){
  .brand-artwork{width:155px;height:25px}
  .footer-artwork{width:230px;height:34px}
  .portfolio-card[data-project="alten"] .portfolio-name{font-size:36px}
  .portfolio-media-count{align-items:start}
  .portfolio-gallery-link{font-size:8px}
  .cover-video-title{top:9px;left:9px;font-size:7px;padding:6px 7px;letter-spacing:.03em}
  .cover-play-button{gap:9px;padding:8px}
  .cover-play-symbol{height:46px;width:46px;font-size:17px}
  .cover-play-label{font-size:7px;letter-spacing:.03em}
  .about-inner{grid-template-columns:1fr;gap:45px;padding-block:65px}
  .about-portrait{width:min(100%,440px);margin-inline:auto}
  .about-portrait>figcaption{font-size:7px;padding-block:14px}
  .about-copy h2{font-size:51px}
  .about-copy .about-role{font-size:10px}
  .about-copy .about-manifesto{font-size:29px}
}

.original-film-link{border-bottom:1px solid #b9c3b3;padding-bottom:4px;white-space:nowrap}
@media(max-width:650px){.cinema-player-bottom{justify-content:flex-end}.original-film-link{font-size:8px}}
