/* Keep project cards close to the landscape 3:2 reference across the site. */
.section-project .project-wrap>.projects_homepage{
  height:auto!important;min-height:0!important;aspect-ratio:3/2!important
}
@media (min-width:768px){
  .work-gallery{
    --gallery-gutter:clamp(18px,2.5vw,48px);
    --gallery-gap:clamp(18px,2vw,36px);
    display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:minmax(0,1fr);
    column-gap:calc(var(--gallery-phone-width, 22vw) + 2 * var(--gallery-gap));
    padding:0 var(--gallery-gutter);box-sizing:border-box
  }
  .work-gallery-side{
    position:relative;min-width:0;min-height:0;height:100%;overflow-x:hidden;overflow-y:auto;
    overscroll-behavior:contain;scrollbar-width:none;-ms-overflow-style:none;
    -webkit-overflow-scrolling:touch;touch-action:pan-y;pointer-events:auto
  }
  .work-gallery-side::-webkit-scrollbar{display:none;width:0;height:0}
  .work-gallery .project-wrap{
    display:flex!important;flex-direction:column;align-items:center;
    gap:clamp(12px,1.3vw,22px)!important;width:100%;height:max-content;min-height:100%;padding:4px 8px 36px;box-sizing:border-box
  }
  .work-gallery .project-wrap>.projects_homepage{
    position:relative!important;flex:0 0 auto;width:min(var(--gallery-card-width, 360px),100%)!important;
    height:var(--gallery-card-height, 240px)!important;min-height:0!important;aspect-ratio:3/2!important;
    margin:0!important;overflow:hidden!important;border-radius:7px!important;
    box-shadow:0 16px 40px rgba(0,0,0,.38),0 4px 12px rgba(0,0,0,.28);
    opacity:0;transform:translateY(100vh);
    transition:filter .32s ease,opacity 1s cubic-bezier(.2,.65,.3,1),transform 1.15s cubic-bezier(.16,1,.3,1),box-shadow .4s ease;
    transition-delay:0s,calc(var(--card-index,0) * 34ms),calc(var(--card-index,0) * 34ms),0s
  }
  .work-gallery.is-visible .project-wrap>.projects_homepage{opacity:1;transform:translateY(0)}
  .work-gallery .project-wrap>.projects_homepage:hover,
  .work-gallery .project-wrap>.projects_homepage:focus-within{box-shadow:0 24px 54px rgba(0,0,0,.5),0 8px 20px rgba(0,0,0,.36)}
  .work-gallery .project-wrap>.projects_homepage{filter:brightness(.75);transition:filter .32s ease,opacity 1s cubic-bezier(.2,.65,.3,1),transform 1.15s cubic-bezier(.16,1,.3,1),box-shadow .4s ease}
  .work-gallery .project-wrap>.projects_homepage.is-selected{filter:brightness(1)}
  .work-gallery .project-wrap>.projects_homepage:hover,
  .work-gallery .project-wrap>.projects_homepage:focus-within{filter:brightness(1)}
  .work-gallery .project-wrap>.projects_homepage:has(.card-link[href="/projects/rosies"]){
    background:#241713 url('/assets/projects/rosies/rosies-card.jpg') 50% 44%/cover!important
  }
  .work-gallery .project-wrap>.projects_homepage:has(.card-link[href="/projects/nightlife"]){
    background:#101322 url('/assets/projects/nightlife/nightlife-01-900.jpg') 50% 50%/cover!important
  }
  .work-gallery .project-wrap>.projects_homepage .code-embed-8{
    position:absolute!important;inset:0!important;z-index:1;opacity:0;transition:opacity .3s ease;pointer-events:none
  }
  .work-gallery .project-wrap>.projects_homepage video{opacity:0!important;transition:opacity .3s ease}
  .work-gallery .project-wrap>.projects_homepage.is-playing .code-embed-8,
  .work-gallery .project-wrap>.projects_homepage.is-playing>video{opacity:1!important}
  .work-gallery .project-wrap>.projects_homepage::after{
    inset:0!important;z-index:2;background:linear-gradient(180deg,transparent 48%,rgba(0,0,0,.68))!important;opacity:1;transition:opacity .38s ease
  }
  .work-gallery .project-wrap>.projects_homepage:hover::after,
  .work-gallery .project-wrap>.projects_homepage:focus-within::after{opacity:1}
  .work-gallery .project-wrap>.projects_homepage .project-info{
    position:absolute!important;inset:auto 0 0!important;z-index:3;display:flex!important;align-items:flex-end;justify-content:space-between;gap:10px;text-align:left;
    padding:12px 14px!important;opacity:1!important;transition:opacity .35s ease;pointer-events:none
  }
  .work-gallery .project-wrap>.projects_homepage .project-info .sub_head{display:block!important;text-align:right;color:rgba(230,230,230,.88)!important}
  .work-gallery .project-wrap>.projects_homepage .project-info .linear_gradient{display:none!important}
  .work-gallery .project-wrap>.projects_homepage .project-info .body-text-3{font-family:"neue-haas-grotesk-text",Arial,sans-serif!important;font-weight:500!important;color:#e6e6e6!important;text-transform:uppercase;letter-spacing:.035em}
  .work-gallery .project-wrap>.projects_homepage .project-info .sub_head{font-family:"neue-haas-grotesk-text",Arial,sans-serif!important;font-weight:500!important;text-transform:uppercase;letter-spacing:.035em}
  .work-gallery .project-wrap>.projects_homepage .card-link{position:absolute;inset:0;z-index:4}
}
@media (max-width:767px){.work-gallery{display:none!important}}
@media (prefers-reduced-motion:reduce){.work-gallery,.work-gallery .project-wrap>.projects_homepage{transition:none!important;opacity:1!important;transform:none!important}}
