/* V21: complete sharp left photograph, recognisable referee at right, broad crossfade. */
@media(min-width:1001px){.portfolio-hero .hero-photo{left:0;right:auto;width:min(68%,calc(var(--hero-stage-height)*1.5));mask-image:linear-gradient(90deg,#000 0%,#000 62%,#000000e0 72%,#00000090 83%,#00000035 93%,transparent 100%);overflow:hidden}.portfolio-hero .hero-sharp-layer{mask-image:none;object-fit:contain;object-position:left center}.portfolio-hero .hero-soft-bridge{display:none}.portfolio-hero:before{inset:-8px -8px -8px auto;width:68%;background-image:url("assets/portfolio-1786.webp");background-size:cover;background-position:60% center;filter:blur(4px);transform:none;mask-image:linear-gradient(90deg,transparent 0%,#00000055 13%,#000000c0 26%,#000 37%)}.portfolio-hero:after{background:linear-gradient(90deg,transparent 35%,#17201615 49%,#17201655 65%,#172016b0 100%),linear-gradient(0deg,#17201633,transparent 35%)}.portfolio-hero .hero-content{text-shadow:0 2px 18px #10170fe0}.portfolio-hero .hero-intro{text-shadow:0 1px 7px #10170f}}
.hero:not(.portfolio-hero) .hero-bottom{height:auto;min-height:72px;padding:15px 20px;bottom:18px;background:linear-gradient(95deg,#10180ef0,#10180ed1);border:1px solid #e4ebd640;color:#fffdf2;backdrop-filter:blur(8px);text-shadow:0 1px 4px #000;font-weight:600;letter-spacing:.12em;gap:24px}.hero:not(.portfolio-hero) .hero-bottom a{color:#fffdf2}.hero:not(.portfolio-hero) .hero-bottom a span{color:#fff;font-size:24px}.design-cover-grid{grid-template-columns:minmax(0,1fr);max-width:980px}.design-cover-grid .design-card{width:100%}@media(max-width:700px){.hero:not(.portfolio-hero) .hero-bottom{padding:16px;gap:14px;letter-spacing:.08em;font-size:10px;line-height:1.7}}
.hero:not(.portfolio-hero) .hero-bottom>span{display:block;font-size:12px;color:#fffdf2;opacity:1}.hero:not(.portfolio-hero) .hero-bottom>a{font-size:12px;color:#fffdf2;opacity:1}@media(max-width:700px){.hero:not(.portfolio-hero) .hero-bottom{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:5px 16px}.hero:not(.portfolio-hero) .hero-bottom>span{font-size:10px;grid-column:1;display:block}.hero:not(.portfolio-hero) .hero-bottom>a{font-size:10px;grid-column:2;grid-row:1 / span 2;max-width:105px;gap:10px;line-height:1.5}}
.portfolio-hero .hero-photo .hero-soft-bridge{display:none!important}
.hero:not(.portfolio-hero) .hero-bottom{z-index:3}