/* The person is the original JPEG. The generated matte only removes its backdrop;
   the face, hair and blazer are never painted, filtered, warped or replaced. */
.opening .opening-image.portrait-scene{position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto;margin:0;mask-image:none;overflow:hidden}
.portrait-scene .portrait-stage{position:absolute;inset:auto 0 0;width:100%;height:auto;aspect-ratio:2/1;isolation:isolate;overflow:hidden;container-type:inline-size}
.portrait-scene .portrait-room,.portrait-scene .portrait-foreground{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:fill;pointer-events:none}
.portrait-scene .portrait-person{
  position:absolute;left:40%;top:-5.2%;width:53%;height:auto;max-width:none;
  object-fit:contain;object-position:center;filter:none;mix-blend-mode:normal;
  /* Opaque interior windows protect the original face and lower hair from
     unwanted gray/detail lines in the generated outer-silhouette matte.
     These windows lie entirely inside the photographed head and blazer. */
  mask-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),url('portrait-matte.png');
  mask-mode:alpha,alpha,alpha,luminance;
  mask-size:27.5% 45.5%,51% 4%,54% 37%,100% 100%;
  mask-position:49.655172% 43.119266%,48.979592% 52.083333%,51.086957% 82.539683%,center;
  mask-repeat:no-repeat;
  mask-composite:add;
}
/* Leave the moved cup and its handle beside the portrait rather than behind it. */
.opening .portrait-person{left:41.5%}
.portrait-scene .portrait-foreground{clip-path:polygon(0 78.5%,83.2% 86.3%,87.6% 58.1%,88.4% 57.8%,100% 57.2%,100% 100%,0 100%)}
.portrait-pen-inscription{position:absolute;left:63.02%;top:88.85%;color:#65431f;font-family:var(--serif);font-size:.73cqw;font-weight:500;line-height:1;letter-spacing:.01em;white-space:nowrap;transform:rotate(8.6deg);transform-origin:left center;pointer-events:none}
.meet-scene.portrait-scene .portrait-foreground{clip-path:polygon(0 84.5%,57.8% 86.9%,58.2% 86.1%,72.3% 86.7%,72.4% 88.6%,100% 90.8%,100% 100%,0 100%)}
.opening-copy{z-index:1}
.meet-scene.portrait-scene::after{display:none}

/* Responsive scene framing lives in mobile.css, after this desktop baseline. */

/* Desktop About follows the approved mobile treatment: the original portrait
   on the section's plain cream background, with the same soft lower fade. */
@media (min-width: 901px) {
  .meet-scene.portrait-scene .portrait-room,
  .meet-scene.portrait-scene .portrait-foreground,
  .meet-scene.portrait-scene .portrait-person { display: none; }
  .meet-scene.portrait-scene .portrait-person-mobile {
    display: block !important;
    position: absolute;
    left: 40%;
    top: -5.2%;
    width: 53%;
    height: auto;
    max-width: none;
    pointer-events: none;
    -webkit-mask-image: linear-gradient(to bottom, #000 0%, #000 68%, rgba(0,0,0,.8) 78%, rgba(0,0,0,.3) 90%, transparent 100%);
    mask-image: linear-gradient(to bottom, #000 0%, #000 68%, rgba(0,0,0,.8) 78%, rgba(0,0,0,.3) 90%, transparent 100%);
  }
}