/* Portfolio: type, colours, gallery tiles and motion. Layout is in
   layout-portfolio.css (generated from Wix's rules), tile positions in
   grid-portfolio.css. Values from wix-clone/capture. */
.portfolio-main {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  margin-top: calc(-1 * var(--header-h));
  background: var(--cream);
}
:where(.portfolio-main) h1 { font: 400 14px/1.3 var(--sans); margin: 0; }
:where(.portfolio-main) h2 { font: 400 45px/1 var(--sans); letter-spacing: -0.01em; text-transform: uppercase; margin: 0; }
:where(.portfolio-main) p { font: 12px/1.6 var(--mono); letter-spacing: 0.05em; margin: 0; }
.pf-intro, .pf-work { background: var(--cream); }

/* Wix Pro Gallery grid: rounded tiles that rise 100 px as they come into view. */
.pf-gallery { container-type: inline-size; }
.pgrid { position: relative; width: 100%; }
.ptile { position: absolute; border-radius: 15px; overflow: hidden; }
.ptile picture, .ptile img, .ptile video { display: block; width: 100%; height: 100%; object-fit: cover; }
.js .ptile[data-reveal] { transform: translateY(100px); transition: transform 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94); }
.js .ptile[data-reveal].in { transform: none; }
.pplay {
  position: absolute; inset: 0; display: grid; place-items: center;
  color: #fff; background: transparent; cursor: pointer;
}
.pplay svg { width: 30px; height: 30px; filter: drop-shadow(0 0 2px rgba(0, 0, 0, 0.4)); }
.ptile-video.playing .pplay { display: none; }

.pf-logo img { width: 100%; height: 100%; display: block; object-fit: cover; } /* Wix crop, centred */

@media (prefers-reduced-motion: reduce) {
  .js .ptile[data-reveal] { transform: none; transition: none; }
}