@layer components{.f_c_visualNavTile{display:flex;position:relative;overflow:hidden;height:96px;padding:16px;border-radius:4px;& .firstImageContainer,& .secondImageContainer{display:grid;position:relative;align-self:center;border-radius:4px;box-shadow:2px 2px 6px 0 #00000014;transition-duration:.3s;transition-property:rotate,translate;&:after{pointer-events:none;position:absolute;inset:0;z-index:10;border-radius:4px;border:.5px solid rgba(0,0,0,.08)}}& .imageUnderlay{z-index:1;grid-column:1;grid-row:1;height:100%;width:100%}& .firstImageContainer .imageUnderlay{background-color:#00000005}& .secondImageContainer .imageUnderlay{background-color:#0000000d}& .image{aspect-ratio:1/1;object-fit:cover;object-position:center;border-radius:4px;width:100%;height:100%}& .imageWrapper{grid-column:1;grid-row:1;height:auto}&.condensed{& .firstImageContainer .imageWrapper{width:56px}& .secondImageContainer .imageWrapper{width:44px}}&:not(.condensed){& .firstImageContainer .imageWrapper{width:64px}& .secondImageContainer .imageWrapper{width:48px}}& .imageSection{display:flex;flex-direction:row;position:relative;top:0;bottom:16px}}}@utility f_c_visualNavTile_imageLeft{flex-direction:row-reverse;justify-content:flex-end;gap:20px;&.condensed{height:88px}& .textSection{display:flex;flex-direction:column;justify-content:center;min-width:0;flex-grow:1}& .imageSection{width:auto}& .firstImageContainer{rotate:0;z-index:3}& .secondImageContainer{z-index:2;margin-left:-28px;rotate:14deg}&:hover{& .firstImageContainer{rotate:-3deg}& .secondImageContainer{translate:8px 1px;rotate:22deg}}}@utility f_c_visualNavTile_imageRight{flex-direction:row;gap:12px;padding-right:0;&.condensed{padding:8px 0 8px 8px;height:76px}& .textSection{display:flex;flex-direction:column;justify-content:flex-end;flex-grow:1}& .imageSection{width:48px}& .firstImageContainer{rotate:-10deg}& .secondImageContainer{display:none}&:hover{& .firstImageContainer{rotate:-3deg}}}
/*# sourceMappingURL=a5d1094c226da160.css.map*/