/* Imported portfolio: original four edge-to-edge, grayscale portrait covers. */
#portfolio-section[hidden],#portfolio-grid[hidden],#portfolio-project[hidden],#portfolio-status[hidden],.gallery-wrap[hidden]{display:none!important}
#portfolio-section{position:relative;min-height:70vh;width:100%;color:#eee}
.portfolio-toolbar{position:absolute;left:0;top:-30px;line-height:20px;font-size:10px;color:#aaa;letter-spacing:.5px}
.portfolio-toolbar a:hover,.portfolio-project-end a:hover{color:#fff}
.portfolio-open .site-controls #tidy,.portfolio-open .site-controls #reset{display:none}
#category-links a[aria-current=page]{color:#f2f1ec}
#portfolio-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr);gap:0;width:100%;isolation:isolate}
.portfolio-cover{position:relative;z-index:0;display:block;aspect-ratio:3/7;overflow:visible;background:transparent;outline-offset:3px;transition:z-index 0s .85s}
/* Fade only the exposed perimeter of the whole grid; adjoining photographs stay opaque. */
#portfolio-grid{--fade-solid:linear-gradient(#000,#000);--fade-left-edge:linear-gradient(90deg,transparent,rgba(0,0,0,.45) 2%,#000 7%);--fade-right-edge:linear-gradient(270deg,transparent,rgba(0,0,0,.45) 2%,#000 7%);--fade-top-edge:linear-gradient(180deg,transparent,rgba(0,0,0,.04) 3%,rgba(0,0,0,.18) 6%,rgba(0,0,0,.5) 10%,rgba(0,0,0,.82) 14%,rgba(0,0,0,.97) 18%,#000 21%);--fade-bottom-edge:linear-gradient(0deg,transparent,rgba(0,0,0,.08) 4%,rgba(0,0,0,.4) 13%,rgba(0,0,0,.84) 25%,#000 37%)}
.portfolio-cover{--fade-left:var(--fade-solid);--fade-right:var(--fade-solid);--fade-top:var(--fade-top-edge);--fade-bottom:var(--fade-bottom-edge)}
@media(min-width:769px){.portfolio-cover:first-child{--fade-left:var(--fade-left-edge)}.portfolio-cover:last-child{--fade-right:var(--fade-right-edge)}}
@media(min-width:541px) and (max-width:768px){.portfolio-cover:nth-child(odd){--fade-left:var(--fade-left-edge)}.portfolio-cover:nth-child(even){--fade-right:var(--fade-right-edge)}.portfolio-cover:nth-child(-n+2){--fade-bottom:var(--fade-solid)}.portfolio-cover:nth-child(n+3){--fade-top:var(--fade-solid)}}
@media(max-width:540px){.portfolio-cover{--fade-left:var(--fade-left-edge);--fade-right:var(--fade-right-edge);--fade-top:var(--fade-solid);--fade-bottom:var(--fade-solid)}.portfolio-cover:first-child{--fade-top:var(--fade-top-edge)}.portfolio-cover:last-child{--fade-bottom:var(--fade-bottom-edge)}}
.portfolio-cover-visual{position:absolute;z-index:1;inset:0;display:block;overflow:hidden;background:#000;pointer-events:none;mask-image:var(--fade-left),var(--fade-right),var(--fade-top),var(--fade-bottom);mask-composite:intersect}
.portfolio-cover-visual>img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;background:#000;filter:grayscale(1);transition:opacity .28s ease,filter .3s ease;user-select:none;-webkit-user-drag:none}
.portfolio-cover .portfolio-cover-motion{position:absolute;inset:0;opacity:0;pointer-events:none}
.portfolio-cover .portfolio-cover-motion:not([src]){display:none}
.portfolio-cover .portfolio-cover-diffusion{opacity:1;mix-blend-mode:screen;pointer-events:none;transition:opacity .38s cubic-bezier(.22,1,.36,1)}
.portfolio-cover:focus-visible .portfolio-cover-visual>img{filter:none}
.portfolio-cover:focus-visible .portfolio-cover-diffusion{opacity:0}
@media(hover:hover) and (pointer:fine){.portfolio-cover:hover .portfolio-cover-visual>img{filter:none}.portfolio-cover:hover .portfolio-cover-diffusion{opacity:0}.portfolio-cover.motion-ready:hover .portfolio-cover-motion{opacity:1}}
.portfolio-cover.motion-ready:focus-visible .portfolio-cover-motion{opacity:1}
/* Keep the opaque original in front, including during rollover fades; only outer echoes show. */
.portfolio-cover-echo{display:none;position:absolute;z-index:0;inset:-44px;overflow:hidden;opacity:0;pointer-events:none;user-select:none;mix-blend-mode:screen;mask-image:linear-gradient(90deg,transparent,#000 44px,#000 calc(100% - 44px),transparent),linear-gradient(transparent,transparent 4%,rgba(0,0,0,.08) 8%,rgba(0,0,0,.42) 15%,#000 24%,#000 66%,transparent 98%);mask-composite:intersect;transition:opacity .45s cubic-bezier(.22,1,.36,1)}
.portfolio-cover-echo>img{position:absolute;inset:44px;display:block;width:calc(100% - 88px);height:calc(100% - 88px);object-fit:cover;pointer-events:none;-webkit-user-drag:none}
.portfolio-cover-echo>.photo-halo-layer{mask-image:linear-gradient(90deg,#000,transparent 22%,transparent 78%,#000)}
/* The broad white halo is made from highlights, behind the crisp original. */
.portfolio-cover-echo>img:nth-child(5){opacity:.48;animation:none}
/* Only diffused light trembles; no repeated enlargement or portrait duplication. */
@media(hover:hover) and (pointer:fine){
 .portfolio-cover-echo{display:block}
 .portfolio-cover:is(:hover,:focus-visible){z-index:2;transition-delay:0s}
 .portfolio-cover:is(:hover,:focus-visible) .portfolio-cover-echo{opacity:1}
 .portfolio-cover:is(:hover,:focus-visible) .portfolio-cover-echo>img{animation-play-state:running}
}
/* Keep portrait sizes and neighboring images stable while the halo reacts. */
@media(min-width:769px){
 #portfolio-grid{aspect-ratio:12/7;grid-template-rows:minmax(0,1fr)}
 .portfolio-cover{aspect-ratio:auto;min-width:0;min-height:0}
}

#portfolio-status{margin:0;padding:80px 20px;font-size:13px;color:#aaa;text-align:center}
#portfolio-status button{text-decoration:underline;padding:8px}
.portfolio-project-heading{max-width:800px;margin:0 auto;padding:100px 0 50px;text-align:center}
.portfolio-project-heading h1{margin:0;padding:8px 0 20px;font-size:30px;line-height:34px;font-weight:600;color:#eee}
.portfolio-project-heading p{margin:0;padding-bottom:20px;font-size:18px;line-height:26px;color:#eee}
.portfolio-block{margin-left:auto;margin-right:auto;max-width:100%;min-width:0}
.portfolio-image-zoom{display:block;max-width:100%;width:100%;margin:0 auto;padding:0;cursor:zoom-in;border:0;background:transparent;line-height:0}
.portfolio-image-zoom img{display:block;width:100%;height:auto;margin:auto;object-fit:contain;user-select:none;-webkit-user-drag:none}
.portfolio-row{display:flex;gap:8px;width:100%}.portfolio-column{min-width:0}.portfolio-column>.portfolio-block{width:100%!important}
.portfolio-embed{position:relative;width:100%;background:#111}.portfolio-audio{height:75px}.portfolio-embed iframe{display:block;width:100%;height:100%;border:0}.portfolio-video iframe{position:absolute;inset:0}
.portfolio-caption{margin:0;padding-top:15px;color:#888;font-size:14px;line-height:18px;text-align:center}
.portfolio-project-end{display:flex;justify-content:space-between;gap:20px;padding:60px 0 35px;font-size:12px;color:#aaa}
#portfolio-lightbox{padding:60px 30px 30px;width:100vw;height:100dvh;max-width:none;max-height:none;inset:0;margin:0;background:#000d;overflow:auto}
#portfolio-lightbox[open]{display:flex;align-items:center;justify-content:center}
#portfolio-lightbox::backdrop{background:#0009;backdrop-filter:blur(3px)}
#portfolio-full{display:block;max-width:100%;max-height:calc(100dvh - 90px);width:auto;height:auto;object-fit:contain;margin:auto}
#portfolio-lightbox-close{position:fixed;top:20px;right:24px;z-index:1;padding:10px 14px;font-size:11px;letter-spacing:1px;color:#eee;background:#111;border:1px solid #ffffff30;border-radius:3px}
@media(max-width:900px){.portfolio-toolbar{top:-22px}.portfolio-project-heading{padding:40px 5% 24px}.portfolio-project-heading h1{font-size:22px;line-height:25px;padding-bottom:14px}.portfolio-project-heading p{font-size:14px;line-height:20px;padding-bottom:14px}}
@media(max-width:768px){#portfolio-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:540px){#portfolio-grid{grid-template-columns:1fr}.portfolio-row{display:block}.portfolio-column{width:100%}.portfolio-block{width:100%!important}.portfolio-block-image{padding-top:0!important;padding-bottom:0!important}.portfolio-project-heading{padding-top:34px;padding-bottom:21px}.portfolio-project-heading h1{font-size:19px;line-height:22px}.portfolio-block-audio,.portfolio-block-video{padding-bottom:13px!important}.portfolio-project-end{padding-top:35px}}
@media(prefers-reduced-motion:reduce){#portfolio-grid,.portfolio-cover,.portfolio-cover-visual>img,.portfolio-cover .portfolio-cover-diffusion{transition:none}.portfolio-cover-echo{display:none}.portfolio-cover .portfolio-cover-motion{display:none!important}.portfolio-cover .portfolio-cover-still{opacity:1!important}}
@media print{#portfolio-grid img,#portfolio-project img,#portfolio-full{visibility:hidden!important}}