.card{--card-border-radius:var(--radius-md);--card-gap:var(--gap-sm);background:var(--card-background,var(--color-white));border:1px solid var(--card-border-color,color-mix(var(--color-navy),95% transparent));border-radius:var(--card-border-radius);color:var(--card-color,var(--color-navy));display:grid!important;overflow:clip;position:relative;width:100%;& .card-content{--card-gap:clamp(var(--gap-xs),4cqi,var(--gap-sm));--card-padding:clamp(var(--padding-sm),4cqi,var(--padding-md));align-items:flex-start;container-name:card;container-type:inline-size;cursor:grab;display:flex;flex-direction:column;gap:var(--card-gap);justify-content:flex-end;padding:var(--card-padding);transition:background-color .25s cubic-bezier(.4,0,.2,1),backdrop-filter .25s cubic-bezier(.4,0,.2,1)!important;will-change:background-color,backdrop-filter;&:after{background:linear-gradient(to top,var(--color-navy),transparent);bottom:0;content:"";height:45%;left:0;mix-blend-mode:multiply;opacity:.5;pointer-events:none;position:absolute;width:100%;z-index:-1}}& .card-image{display:grid;place-content:stretch;& img{height:100%!important;object-fit:cover;transition:var(--transition-fast);width:100%;will-change:scale}}& .card-content,& .card-image,& .card-overlay{grid-area:1/1}& .card-title{animation:none;font-size:var(--font-size-1);letter-spacing:-.5px;line-height:1;margin-bottom:0}& .card-body,& .card-title{color:var(--color-white);font-family:var(--font-family)}& .card-body{font-weight:var(--font-weight-book);line-height:1.5;transition:var(--transition-fast)}.card-link{align-items:center;align-self:flex-end;cursor:pointer;display:inline-flex;font-family:var(--font-family);font-weight:var(--font-weight-book);gap:var(--gap-xs);line-height:1.5;margin-top:0;opacity:0;transition:var(--transition-fast);& a,& a:hover{color:var(--color-white)!important}}.card-overlay{z-index:5}& .card-emoji{height:clamp(40px,25cqi,64px);transition:var(--transition-fast);width:clamp(40px,25cqi,64px)}& .card-emoji .emoji{height:auto;width:100%}& .card-body,& .card-excerpt,& .card-link,& .card-title{align-self:flex-start;animation:none;transition:color .25s ease 0s,font-size .25s ease 0s,translate .25s ease 0s,opacity .25s ease 0s;translate:0 2rem}&:hover{& .card-image{& img{scale:1.04}}& .card-content{backdrop-filter:blur(4px);background:color-mix(in oklch,var(--color-navy),transparent 30%);background-blend-mode:multiply;position:relative}& .card-body,& .card-excerpt,& .card-link,& .card-title{opacity:1;transition:translate .5s cubic-bezier(.19,1,.22,1) .2s,opacity .5s cubic-bezier(.19,1,.22,1) .2s,color .25s cubic-bezier(.19,1,.22,1) .2s,font-size .35s ease-out .1s;translate:0 0}& .card-title{color:var(--color-pink);font-size:calc(var(--font-size-1)*1.25)}}}.card-usp{& .card-content{backdrop-filter:blur(0);background:var(--card-background)!important;justify-content:flex-start;&:after{display:none!important}}& .card-title{color:var(--heading-color)!important;font-size:var(--font-size-1)!important}& .card-body,& .card-title{scale:none!important;translate:none!important}& .card-body{color:var(--card-color)}& .card-link{--link-color:var(--text-color);align-self:flex-end;margin-top:auto;opacity:1!important;scale:none!important;translate:none!important;& a{color:var(--link-color)!important}& a:hover{color:var(--link-color-hover)!important}}}