/* Portfolio pages: sticky bio + editorial gallery (desktop). Mobile keeps one column. */
.pf { max-width: 1240px; margin: 0 auto; padding: 24px 20px 64px; }
.pf-bio img { width: 150px; height: auto; display: block; }
.pf .pf-bio h1.like-h3 { margin: 16px 0 8px; padding: 0; }
.pf-bio .bio-text-div { padding: 0; }
.pf-cta { display: inline-block; margin-top: 16px; padding: 12px 22px; border: 1px solid var(--dark-lilac, #7e7eca);
  border-radius: 999px; color: var(--dark-lilac, #7e7eca); text-decoration: none; font-weight: 500; letter-spacing: .04em;
  transition: background-color .2s, color .2s; }
.pf-cta:hover, .pf-cta:focus-visible { background: var(--dark-lilac, #7e7eca); color: #fff; }
.pf-gallery { display: grid; gap: 12px; margin-top: 32px; }
.pf-row { display: grid; gap: 12px; }
.pf-cell { position: relative; margin: 0; overflow: hidden; border-radius: 4px; background: #f4f4fb; }
.pf-cell img { position: absolute; inset: 0; width: 100%; height: 100% !important; max-width: none; display: block; object-fit: cover; transition: transform .6s cubic-bezier(.2,.7,.2,1); }

@media (max-width: 767px) { .pf-cell { aspect-ratio: auto; background: none; line-height: 0; } .pf-cell img { position: static; width: 100%; height: auto !important; } }

@media (min-width: 768px) {
  .pf-row--1 { grid-template-columns: 1fr; }
  .pf-row--2 { grid-template-columns: 1fr 1fr; }
  .pf-row--3 { grid-template-columns: 1fr 1fr 1fr; }
  .pf-row--1 .pf-cell { aspect-ratio: 3 / 2; }
  .pf-row--2 .pf-cell { aspect-ratio: 4 / 5; }
  .pf-row--3 .pf-cell { aspect-ratio: 3 / 4; }
  .pf-cell:hover img { transform: scale(1.03); }
}

@media (min-width: 992px) {
  .pf { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 56px; align-items: start; padding-top: 48px; }
  .pf-bio { position: sticky; top: 120px; }
  .pf-gallery { margin-top: 0; }
}

@media (prefers-reduced-motion: reduce) { .pf-cell img { transition: none; } }

/* Pairs of landscape photos keep a landscape crop */
@media (min-width: 768px) { .pf-row--2.pf-row--wide .pf-cell { aspect-ratio: 3 / 2; } }

/* Stylist lists line up with the gallery column on desktop */
@media (min-width: 992px) {
  .pf ~ .bottom-nav.w-container { width: 100%; max-width: 1240px; margin: 0 auto; padding: 0 20px 0 376px; }
  .pf ~ .bottom-nav .chip-flex.home-nav-container { max-width: none; padding: 0; justify-content: flex-start; }
  .pf ~ .bottom-nav .chip-flex.home-nav-container > a.edmh-chip { max-width: none; }
}

/* Header shares the bio column's left edge on tablet and desktop */
@media (min-width: 768px) {
  body:has(.pf) .nav-container.w-container { width: 100%; max-width: 1240px; padding-left: 20px; padding-right: 20px; }
  body:has(.pf) .edmh-logo { margin-left: 0; padding-left: 0; }
}
/* Tablet: artist lists start at the same 20px edge as the bio */
@media (min-width: 768px) and (max-width: 991px) {
  .pf ~ .bottom-nav.w-container { width: 100%; max-width: none; padding: 0 20px; }
  .pf ~ .bottom-nav .chip-flex.home-nav-container { padding: 0; justify-content: flex-start; }
}
/* Wide desktop: menu spans the gallery column, first label on its left edge, last on its right */
@media (min-width: 1100px) {
  body:has(.pf) .nav-container.w-container { display: flex; align-items: flex-start; }
  body:has(.pf) .edmh-logo { flex: 0 0 356px; float: none; }
  body:has(.pf) .w-nav-menu { float: none; flex: 1; display: flex; justify-content: space-between; }
  body:has(.pf) .w-nav-menu > .w-dropdown:first-of-type { margin-left: 0; }
  body:has(.pf) .w-nav-menu > .w-dropdown:first-of-type .w-dropdown-toggle { padding-left: 0; }
  body:has(.pf) .w-nav-menu > :last-child { padding-right: 0; margin-right: 0; }
}