/* "Enter the studio" contact-sheet link - used on index.html and christina-loew.html */
.portfolio-link{align-self:flex-start;max-width:100%;display:inline-flex;flex-direction:column;align-items:flex-start;gap:12px;color:#263127}
.portfolio-link:hover{opacity:1}
.portfolio-link .sheet{display:flex;gap:6px;max-width:100%}
.portfolio-link .sheet img{flex:0 1 56px;width:56px;min-width:0;height:auto;aspect-ratio:56/74;object-fit:cover;display:block;filter:grayscale(1);transition:filter .5s ease,transform .5s cubic-bezier(.2,.7,.2,1)}
.portfolio-link .lbl{font-family:'Inter Tight',Inter,sans-serif;font-size:11.5px;font-weight:500;letter-spacing:0.14em;text-transform:uppercase;white-space:nowrap;padding-bottom:6px;border-bottom:1px solid #263127}
.portfolio-link .arr{display:inline-block;transition:transform .3s ease}
.portfolio-link .sub{margin-top:-4px;font-family:'Inter Tight',Inter,sans-serif;font-size:10px;font-weight:500;letter-spacing:0.18em;text-transform:uppercase;color:#5F6A5C;white-space:nowrap}
.portfolio-link:hover .sheet img,.portfolio-link:focus-visible .sheet img{filter:none}
.portfolio-link:hover .sheet img:nth-child(odd),.portfolio-link:focus-visible .sheet img:nth-child(odd){transform:translateY(-4px)}
.portfolio-link:hover .arr,.portfolio-link:focus-visible .arr{transform:translateX(5px)}
.portfolio-link:focus-visible{outline:2px solid #263127;outline-offset:6px}
/* Touch screens have no hover, so show the colour straight away */
@media (hover: none){.portfolio-link .sheet img{filter:none}}
@media (prefers-reduced-motion: reduce){
  .portfolio-link .sheet img,.portfolio-link .arr{transition:none}
  .portfolio-link:hover .sheet img:nth-child(odd),.portfolio-link:focus-visible .sheet img:nth-child(odd),
  .portfolio-link:hover .arr,.portfolio-link:focus-visible .arr{transform:none}
}
