@layer components{.featured-case-container{--media-radius: var(--radius-4);display:grid;grid-template-columns:1fr;row-gap:40px;container:featured-case-container/inline-size}@media(min-width: 768px){.featured-case-container{--media-radius: var(--radius-5)}}.featured-case-container .featured-case{display:grid;grid-template-areas:"overlay"}.featured-case-container .featured-case>.image{grid-area:overlay;overflow:hidden;border-radius:var(--media-radius)}.featured-case-container .featured-case>.image .picture-component{position:relative;height:100%}.featured-case-container .featured-case>.image .picture-component img{border-radius:var(--media-radius);object-fit:cover;height:100%;width:100%;transition:transform var(--transition)}.featured-case-container .featured-case>.image .picture-component::after{content:"";display:block;position:absolute;top:0;width:100%;height:100%;background:linear-gradient(90deg, var(--true-black) -13.99%, rgba(51, 51, 51, 0) 80.73%);border-radius:var(--media-radius)}.featured-case-container .featured-case>.body{grid-area:overlay;display:flex;flex-direction:column;padding-block:64px 32px;padding-inline:32px;z-index:var(--z-index-1)}.featured-case-container .featured-case>.body>.content{margin-block-end:auto}.featured-case-container .featured-case>.body>.tags>ul{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:flex-start;gap:8px}@media(min-width: 768px){.featured-case-container .featured-case>.body>.tags>ul{justify-content:flex-end}}@container featured-case-container (min-width: 450px){.featured-case-container .featured-case>.image .picture-component img{aspect-ratio:4}}}@layer theme{[class^=section].lg:has(.featured-case-container){padding-block-end:0}.featured-case-container .featured-case>.body>.block-header{color:var(--white)}.featured-case-container .featured-case>.body>.block-header .title{color:var(--white);line-height:1.6}.featured-case-container .featured-case:not([disabled]):active>.image .picture-component img{transform:scale(var(--image-trans-zoom))}@media(hover: hover){.featured-case-container .featured-case:not([disabled]):hover>.image .picture-component img{transform:scale(var(--image-trans-zoom))}}}
