.heroShowcaseBg--white{background-color:var(--color-white)}.heroShowcaseBg--gray-1{background-color:var(--color-gray-light-4)}.heroShowcaseBg--gray-2{background-color:var(--color-gray-light-3)}.heroShowcaseBg--gray-3{background-color:var(--color-gray-light-2)}.heroShowcaseBg--gray-4{background-color:var(--color-gray-light)}.heroTextOverlay--showcase .heroTitle{max-width:100%;margin-bottom:var(--spacing-2);font-size:clamp(28px,3.4vw,40px);line-height:1.15}.heroTextOverlay--showcase .heroDescription{max-width:760px;margin-bottom:var(--spacing-5);font-size:clamp(16px,1.8vw,20px)}.heroShowcaseViewport{--showcase-cards:4;--showcase-columns-extra:1;--showcase-gap:var(--spacing-4);--showcase-card-max:200px;--showcase-pad:var(--spacing-4);container-type:inline-size;box-sizing:border-box;width:calc(min(100%,
        (var(--showcase-cards) + var(--showcase-columns-extra)) * var(--showcase-card-max) + var(--showcase-cards) * var(--showcase-gap)) + 2 * var(--showcase-pad));margin:calc(-1 * var(--showcase-pad));padding:var(--showcase-pad)}.heroShowcaseViewport--cards-3{--showcase-cards:3}.heroShowcaseViewport--cards-4{--showcase-cards:4}.heroShowcaseRow{--showcase-card-w:calc((100cqw - var(--showcase-cards) * var(--showcase-gap)) / (var(--showcase-cards) + var(--showcase-columns-extra)));display:flex;align-items:flex-start;gap:var(--showcase-gap)}.heroShowcaseRow .entityCardLink.heroShowcaseCard{flex:0 0 var(--showcase-card-w);min-width:0}.heroShowcaseRow .entityCardLink.materials .shopCardImageWrap{width:100%}.heroShowcaseRow .entityCardLink.materials .entityCardImageContainer{width:100%;height:auto;aspect-ratio:1;flex-shrink:unset}.heroShowcaseRow .heroShowcaseMore{--showcase-more-blur-soft:2px;--showcase-more-blur-strong:6px;--showcase-more-bleed:var(--spacing-3);position:relative;flex:0 0 var(--showcase-card-w);aspect-ratio:1;box-sizing:border-box;display:flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-4);background-color:var(--color-white);border:1px solid var(--color-border);border-radius:var(--radius-md);color:var(--color-text-primary);font-size:var(--font-size-lg);font-weight:600;text-decoration:none;transition:transform var(--duration-slow) var(--ease-out),color var(--duration-base) var(--ease-out)}.heroShowcaseRow .heroShowcaseMore:after,.heroShowcaseRow .heroShowcaseMore:before{content:"";position:absolute;inset:calc(-1 * var(--showcase-more-bleed));pointer-events:none;transition:opacity var(--duration-slower) var(--ease-out)}.heroShowcaseRow .heroShowcaseMore:before{-webkit-backdrop-filter:blur(var(--showcase-more-blur-soft));backdrop-filter:blur(var(--showcase-more-blur-soft));-webkit-mask-image:linear-gradient(90deg,transparent 10%,#000 60%);mask-image:linear-gradient(90deg,transparent 10%,#000 60%)}.heroShowcaseRow .heroShowcaseMore:after{-webkit-backdrop-filter:blur(var(--showcase-more-blur-strong));backdrop-filter:blur(var(--showcase-more-blur-strong));-webkit-mask-image:linear-gradient(90deg,transparent 40%,#000);mask-image:linear-gradient(90deg,transparent 40%,#000)}.heroShowcaseRow .heroShowcaseMore:hover{transform:scale(1.03);color:var(--primary)}.heroShowcaseRow .heroShowcaseMore:hover:after,.heroShowcaseRow .heroShowcaseMore:hover:before{opacity:0}.heroShowcaseMoreArrow{flex:none;width:var(--spacing-5);height:var(--spacing-5);fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}@media (min-width:1024px){.heroShowcaseViewport--cards-3 .heroShowcaseCard:nth-child(n+4):not(.heroShowcaseMore),.heroShowcaseViewport--cards-4 .heroShowcaseCard:nth-child(n+5):not(.heroShowcaseMore){display:none}}@media (max-width:1023px){.heroShowcaseRow .shopCardActions{grid-auto-flow:row}}@media (min-width:701px) and (max-width:1023px){.heroShowcaseViewport--cards-3,.heroShowcaseViewport--cards-4{--showcase-cards:3}.heroShowcaseViewport .heroShowcaseCard:nth-child(n+4):not(.heroShowcaseMore){display:none}}@media (max-width:700px){.heroShowcaseViewport--cards-3,.heroShowcaseViewport--cards-4{--showcase-cards:2;--showcase-columns-extra:0.4;--showcase-gap:var(--spacing-2);overflow-x:auto;scrollbar-width:none}.heroShowcaseViewport::-webkit-scrollbar{display:none}.heroTextOverlay--showcase .heroTitle{font-size:clamp(20px,5.6vw,28px)}.heroTextOverlay--showcase .heroDescription{margin-bottom:var(--spacing-3);font-size:var(--font-size-base)}.heroShowcaseRow .heroShowcaseMore{padding:var(--spacing-3);font-size:var(--font-size-md)}}