/* Ported verbatim from the original index.html's inline <head><style> block —
   per-project grid duotone treatment (background tint + grayscale/contrast
   filter + mix-blend-mode on the image, plus a colored ::after overlay),
   removed on hover to reveal the true image. This was never in the linked
   egons-portfolio-3-0.css file, only inline in the original page head. */
.overlay {
  mix-blend-mode: overlay;
}
.hard-light {
  mix-blend-mode: hard-light;
}
.hover-overlay, .thumb-item, .pointer-none {
  pointer-events: none;
}
/* .w-tab-link.w--current / .tab-text rules that lived here were dropped:
   in the original site they existed only inside index.html's own inline
   <style>, but the homepage has no .w-tab-link element anywhere — dead CSS
   there. Since this file is loaded globally (not scoped per-page like the
   original inline blocks were), the unscoped selector was instead
   colliding with the real .w-tab-link.w--current on case-study pages
   (the Problem/Research/Solution/Reflection tabs), painting them navy
   instead of the intended .desc-tab.w--current styling. */
.port-container img, .port-container video {
  object-fit: cover;
  object-position: center;
  height: 100%;
  width: 100%;
}
@media (min-width: 991px) {
  .port-container::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transition: all ease-out .5s;
  }
  .port-container:hover::after, .port-container:hover, .port-container:hover img, .port-container:hover video {
    filter: none;
    -webkit-filter: none;
    mix-blend-mode: unset !important;
    background: transparent;
    transition: all ease-out .5s;
  }
  .acommons {
    background-color: #0C77A3;
  }
  .acommons img {
    filter: grayscale(100%) contrast(1);
    mix-blend-mode: lighten;
  }
  .acommons::after {
    background-color: #F696A0;
    mix-blend-mode: multiply;
  }
  .gobee {
    background-color: #60FF67;
  }
  .gobee img, .gobee video {
    mix-blend-mode: multiply;
    -webkit-filter: grayscale(100%) contrast(1.5);
    filter: grayscale(100%) contrast(1.5);
  }
  .gobee::after {
    background-color: #21A3A3;
    mix-blend-mode: lighten;
  }
  .hkcnewsapp {
    background-color: #f1e3a0;
  }
  .hkcnewsapp img {
    mix-blend-mode: darken;
    -webkit-filter: grayscale(100%) contrast(2);
    filter: grayscale(100%) contrast(2);
  }
  .hkcnewsapp::after {
    background: linear-gradient(140deg, #f430a9, #f2e782);
    mix-blend-mode: lighten;
  }
  .l9l {
    background-color: #001442;
  }
  .l9l img {
    mix-blend-mode: lighten;
    -webkit-filter: grayscale(100%) contrast(.8);
    filter: grayscale(100%) contrast(.8);
  }
  .l9l::after {
    background-color: #599ba6;
    mix-blend-mode: multiply;
  }
  .kiwi {
    background-color: #88169d;
  }
  .kiwi img, .kiwi video {
    -webkit-filter: grayscale(100%) contrast(1.2);
    filter: grayscale(100%) contrast(1.2);
    mix-blend-mode: lighten;
  }
  .kiwi::after {
    mix-blend-mode: hard-light;
    background: linear-gradient(to top left, #75d775, #321a5b);
  }
  .bp {
    background-color: #E50914;
  }
  .bp img {
    -webkit-filter: grayscale(100%) contrast(1.2);
    filter: grayscale(100%) contrast(1.2);
    opacity: .8;
  }
  .bp::after {
    mix-blend-mode: exclusion;
    -webkit-filter: contrast(1.1);
    filter: contrast(1.1);
    background-color: #282581;
  }
  .boxbrand {
    background-color: #FCA300;
  }
  .boxbrand img {
    mix-blend-mode: darken;
  }
  .boxbrand::after {
    background: #282581;
    mix-blend-mode: lighten;
    -webkit-filter: contrast(1.1);
    filter: contrast(1.1);
  }
  .ce {
    background-color: #ffe000;
  }
  .ce img {
    mix-blend-mode: multiply;
    -webkit-filter: grayscale(100%) contrast(.8);
    filter: grayscale(100%) contrast(.8);
  }
  .ce::after {
    background-color: #242222;
    mix-blend-mode: lighten;
  }
  /* New tiles (2026-08) — starting-point duotones, placeholder exact
     values pending user tweaks. */
  .vizop {
    background-color: #4515ab;
  }
  .vizop img {
    mix-blend-mode: lighten;
    -webkit-filter: grayscale(100%) contrast(1.2);
    filter: grayscale(100%) contrast(1.2);
  }
  .vizop::after {
    background-color: #2e7234;
    mix-blend-mode: multiply;
  }
  .ding-dong-technology {
    background-color: #f1e3c6;
  }
  .ding-dong-technology img {
    mix-blend-mode: darken;
    -webkit-filter: grayscale(100%) contrast(1.5);
    filter: grayscale(100%) contrast(1.5);
  }
  .ding-dong-technology::after {
    background-color: #2b5f8a;
    mix-blend-mode: lighten;
  }
  .miles-academy {
    background-color: #4caf50;
  }
  .miles-academy img {
    mix-blend-mode: multiply;
    -webkit-filter: grayscale(100%) contrast(1);
    filter: grayscale(100%) contrast(1);
  }
  .miles-academy::after {
    background-color: #ffe000;
    mix-blend-mode: multiply;
  }
  .viviane-chen {
    background-color: #212120;
  }
  .viviane-chen img {
    mix-blend-mode: lighten;
    -webkit-filter: grayscale(100%) contrast(1.1);
    filter: grayscale(100%) contrast(1.1);
  }
  .viviane-chen::after {
    background-color: #603827;
    mix-blend-mode: hard-light;
  }
}
