.portfolio { background: #0c0d0f; border-top: 1px solid var(--color-border); overflow: clip; }


/* Linha do tempo */
.pf-timeline { position: relative; display: grid; gap: 110px; }
.pf-line { position: absolute; left: 7px; top: 14px; bottom: 0; width: 1px; background: var(--color-border); }
.pf-line__fill { position: absolute; inset: 0; background: linear-gradient(180deg, var(--color-gold-light), var(--color-gold)); transform-origin: top; transform: scaleY(var(--pf-p, 0)); box-shadow: 0 0 12px rgba(214,171,116,.5); }

.pf-item { display: grid; grid-template-columns: 200px 1fr; gap: 0 40px; position: relative; }
.pf-item__year { position: sticky; top: 100px; align-self: start; display: flex; align-items: center; gap: 22px; font-family: var(--font-serif); font-size: clamp(2.4rem, 4vw, 3.4rem); line-height: 1; color: var(--color-text-light); }
.pf-dot { position: relative; flex: none; width: 15px; height: 15px; border-radius: 50%; border: 1px solid var(--color-gold); background: #0c0d0f; transition: background .6s, box-shadow .6s; }
.pf-item__year.is-visible .pf-dot { background: var(--color-gold); box-shadow: 0 0 0 6px rgba(185,139,87,.15), 0 0 18px rgba(214,171,116,.6); }

.pf-item__artist { font-size: 0.8rem; letter-spacing: .2em; text-transform: uppercase; color: var(--color-gold); margin-bottom: 10px; padding-top: 6px; }
.pf-item__title { font-family: var(--font-serif); font-weight: 400; font-size: clamp(1.6rem, 2.8vw, 2.1rem); line-height: 1.2; margin-bottom: 14px; }
.pf-item__text { font-size: 1rem; line-height: 1.75; color: rgba(240,233,220,.78); max-width: 640px; }

/* Mosaico de fotos */
.pf-gallery { display: grid; gap: 10px; margin-top: 34px; }
.pf-gallery--hg { grid-template-columns: repeat(3, 1fr); grid-template-rows: 430px; }
.pf-gallery--mb { grid-template-columns: 2fr 1fr; grid-template-rows: 210px 210px; }
.pf-gallery--mb .pf-photo:first-child { grid-row: span 2; }
.pf-gallery--fs { grid-template-columns: 1fr 2fr 1fr; grid-template-rows: 210px 210px; }
.pf-gallery--fs .pf-photo:nth-child(1), .pf-gallery--fs .pf-photo:nth-child(2) { grid-row: span 2; }
.pf-gallery--lp { grid-template-columns: minmax(0, 480px); grid-template-rows: 480px; }
.pf-gallery--lp img { object-position: 50% 20%; }

.pf-photo { position: relative; overflow: hidden; border-radius: 4px; cursor: zoom-in; background: #16171a; }
.pf-photo img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.15); transition: transform 1.4s var(--ease), filter .6s; filter: saturate(.92); }
.pf-photo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(10,10,12,.85), transparent 55%); opacity: 0; transition: opacity .5s; pointer-events: none; }
.pf-photo figcaption { position: absolute; left: 16px; right: 16px; bottom: 14px; z-index: 1; font-size: 0.86rem; line-height: 1.5; color: var(--color-text-light); opacity: 0; transform: translateY(10px); transition: opacity .5s, transform .5s var(--ease); }
.pf-photo:hover img { transform: scale(1.04); filter: saturate(1.05); }
.pf-photo:hover::after, .pf-photo:hover figcaption { opacity: 1; transform: none; }

/* Revelação em cortina (camada por cima, para não esconder a foto do IntersectionObserver) */
.pf-photo.reveal { opacity: 1; filter: none; transform: none; }
.pf-photo.reveal::before { content: ""; position: absolute; inset: 0; z-index: 2; background: #0c0d0f; transform-origin: top; transition: transform 1.2s var(--ease) var(--d, 0s); pointer-events: none; }
.pf-photo.reveal.is-visible::before { transform: scaleY(0); }
.pf-photo.reveal.is-visible img { transform: scale(1); }
.pf-photo.reveal.is-visible:hover img { transform: scale(1.04); }

/* Visualizador */
.lightbox { position: fixed; inset: 0; z-index: 300; display: grid; grid-template-columns: 70px 1fr 70px; align-items: center; padding: 40px 20px; background: rgba(8,8,10,.94); backdrop-filter: blur(10px); opacity: 0; transition: opacity .4s; }
.lightbox[hidden] { display: none; }
.lightbox.is-open { opacity: 1; }
.lightbox__figure { margin: 0; display: flex; flex-direction: column; align-items: center; gap: 16px; max-height: 100%; }
.lightbox__img { max-width: 100%; max-height: calc(100vh - 150px); object-fit: contain; border-radius: 4px; box-shadow: 0 30px 80px rgba(0,0,0,.6); transform: scale(.96); transition: transform .5s var(--ease); }
.lightbox.is-open .lightbox__img { transform: none; }
.lightbox__caption { max-width: 640px; text-align: center; font-size: 0.92rem; color: var(--color-text-light); }
.lightbox__caption small { display: block; margin-top: 4px; font-size: 0.78rem; letter-spacing: .14em; text-transform: uppercase; color: var(--color-gold); }
.lightbox__nav, .lightbox__close { width: 48px; height: 48px; border-radius: 50%; border: 1px solid rgba(185,139,87,.5); color: var(--color-gold-light); display: grid; place-items: center; justify-self: center; transition: background .3s, color .3s; }
.lightbox__nav:hover, .lightbox__close:hover { background: var(--color-gold); color: #111; }
.lightbox__nav--prev .ico { transform: scaleX(-1); }
.lightbox__close { position: absolute; top: 20px; right: 20px; }
.lightbox__close .ico { transform: rotate(45deg); width: 20px; height: 20px; }

@media (max-width: 820px) {
  .pf-timeline { gap: 72px; }
  .pf-item { grid-template-columns: 1fr; padding-left: 36px; }
  .pf-item__year { position: static; margin: 0 0 14px -36px; font-size: 2.2rem; }
  .pf-gallery, .pf-gallery--hg, .pf-gallery--mb, .pf-gallery--fs, .pf-gallery--lp { grid-template-columns: 1fr 1fr; grid-template-rows: none; grid-auto-rows: 170px; }
  .pf-gallery .pf-photo, .pf-gallery--mb .pf-photo:first-child, .pf-gallery--fs .pf-photo:nth-child(1), .pf-gallery--fs .pf-photo:nth-child(2) { grid-row: auto; }
  .pf-gallery .pf-photo:first-child { grid-column: span 2; grid-row: span 2; }
  .pf-gallery--hg .pf-photo:first-child { grid-row: span 2; }
  .pf-gallery--fs .pf-photo:last-child { grid-column: span 2; }
  .pf-photo figcaption { display: none; }
  .lightbox { grid-template-columns: 1fr; padding: 70px 12px 90px; }
  .lightbox__nav { position: absolute; bottom: 24px; }
  .lightbox__nav--prev { left: calc(50% - 64px); }
  .lightbox__nav--next { right: calc(50% - 64px); }
}

/* Painel em tela cheia */
html.pf-open, html.pf-open body, html.lb-open, html.lb-open body { overflow: hidden; }
.pf-panel { position: fixed; inset: 0; z-index: 150; overflow-y: auto; overscroll-behavior: contain; background: #0c0d0f; clip-path: circle(0 at var(--ox, 50%) var(--oy, 50%)); transition: clip-path .9s cubic-bezier(.7, 0, .2, 1); }
.pf-panel[hidden] { display: none; }
.pf-panel.is-open { clip-path: circle(150% at var(--ox, 50%) var(--oy, 50%)); }
.pf-panel .portfolio { border-top: 0; padding-top: 110px; }
.pf-panel__bar { position: sticky; top: 0; z-index: 5; padding: 14px 0; background: rgba(12,13,15,.82); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); border-bottom: 1px solid var(--color-border); }
.pf-panel__bar-inner { display: flex; align-items: center; justify-content: space-between; }
.pf-panel__brand .logo__mark { height: 30px; }
.pf-panel__brand { display: inline-flex; align-items: center; gap: 10px; font-size: 0.8rem; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: var(--color-gold-light); }
.pf-panel__close { display: inline-flex; align-items: center; gap: 10px; padding: 9px 18px; border-radius: 999px; border: 1px solid rgba(185,139,87,.5); font-size: 0.8rem; letter-spacing: .08em; text-transform: uppercase; color: var(--color-text-light); transition: background .3s, color .3s; }
.pf-panel__close .ico { transform: scaleX(-1); color: var(--color-gold-light); transition: transform .3s var(--ease); }
.pf-panel__close:hover { background: var(--color-gold); color: #111; }
.pf-panel__close:hover .ico { color: #111; transform: scaleX(-1) translateX(4px); }
.pf-panel__end { padding: 20px 0 100px; text-align: center; }
.pf-panel__end .title { margin-bottom: 28px; }

@media (max-width: 820px) {
}
@media (prefers-reduced-motion: reduce) {
  .pf-panel { transition: none; }
}

/* Quem sou eu / Carreira */
.pf-about { padding: 70px 0 30px; }
.pf-about__row { display: grid; grid-template-columns: minmax(0, 420px) 1fr; gap: 70px; align-items: center; }
.pf-about__photo { margin: 0; aspect-ratio: 4 / 5; overflow: hidden; border-radius: 4px; position: relative; }
.pf-about__photo img { width: 100%; height: 100%; object-fit: cover; object-position: center 20%; filter: saturate(.9) contrast(1.03); }
.pf-about__photo::after { content: ""; position: absolute; inset: 0; box-shadow: inset 0 0 0 1px rgba(185,139,87,.25); border-radius: 4px; pointer-events: none; }
.pf-about__text .title { font-size: clamp(2.4rem, 5vw, 3.6rem); margin-bottom: 26px; }
.pf-about__text p:not(.eyebrow) { font-size: 1.05rem; line-height: 1.8; color: rgba(240,233,220,.8); max-width: 600px; }
.pf-about__text p:not(.eyebrow) + p { margin-top: 18px; }
.pf-career { margin-top: 90px; padding-top: 80px; border-top: 1px solid var(--color-border); }
.pf-career__lead { font-family: var(--font-serif); font-size: clamp(1.5rem, 2.6vw, 2rem); line-height: 1.5; color: var(--color-text-light); max-width: 960px; margin-top: 6px; }
.pf-career__cols { display: grid; grid-template-columns: 1fr 1fr; gap: 50px; margin-top: 40px; max-width: 960px; }
.pf-career__cols p { padding-left: 22px; border-left: 1px solid rgba(185,139,87,.45); font-size: 1.05rem; line-height: 1.8; color: rgba(240,233,220,.8); }
.pf-panel__end { border-top: 1px solid var(--color-border); padding-top: 90px; }

@media (max-width: 820px) {
  .pf-about { padding-top: 40px; }
  .pf-about__row { grid-template-columns: 1fr; gap: 34px; }
  .pf-about__photo { max-width: 420px; }
  .pf-career { margin-top: 60px; padding-top: 56px; }
  .pf-career__cols { grid-template-columns: 1fr; gap: 22px; margin-top: 28px; }
}
