.mosaic{gap:14px;margin-top:2.25rem;display:grid}.mosaic__row{gap:14px;margin:0;padding:0;list-style:none;display:flex}.tile{min-width:0;position:relative}.ar-wide{aspect-ratio:16/9;flex:1.7778 1 0}.ar-std{aspect-ratio:4/3;flex:1.3333 1 0}.ar-tall{aspect-ratio:3/4;flex:.75 1 0}.tile--coral{--hue:#f08a6e}.tile--sun{--hue:#f7cf5a}.tile--sky{--hue:#7cc0e8}.tile--mint{--hue:#7fd1a6}.tile--lavender{--hue:#cdbfea}.tile__link{color:#fff;background:var(--sand);border-radius:22px;width:100%;height:100%;text-decoration:none;display:block;position:relative;overflow:hidden}.tile__link:hover{color:#fff}.tile__link picture,.tile__link img{object-fit:cover;width:100%;height:100%;display:block}.tile__link:after{content:"";pointer-events:none;background:linear-gradient(#0c130f00 40%,#0c130f26 62%,#0c130fb8 100%);position:absolute;inset:0}.tile__label{z-index:1;font:700 1.05rem/1.3 var(--sans);text-shadow:0 1px 10px #00000080;align-items:center;gap:.5rem;display:flex;position:absolute;bottom:14px;left:16px;right:60px}.tile__dot{background:var(--hue);border-radius:50%;flex:none;width:10px;height:10px;box-shadow:0 0 0 3px #ffffff59}.tile__zoom{z-index:1;backdrop-filter:blur(10px);background:#fff3;border:1px solid #ffffff59;border-radius:50%;place-items:center;width:40px;height:40px;display:grid;position:absolute;bottom:10px;right:12px}.tile__zoom svg{fill:none;stroke:#fff;stroke-width:2.2px;stroke-linecap:round;stroke-linejoin:round;width:18px;height:18px}.tile__link:focus-visible{outline:3px solid var(--ink);outline-offset:4px}@media (prefers-reduced-motion:no-preference){.tile__link{transition:translate .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s}.tile__link img{transition:transform .7s cubic-bezier(.2,.8,.2,1)}.tile__zoom{transition:scale .3s,background-color .3s}.tile__link:hover,.tile__link:focus-visible{translate:0 -5px;box-shadow:0 22px 40px -18px #101c168c}.tile__link:hover img,.tile__link:focus-visible img{transform:scale(1.05)}.tile__link:hover .tile__zoom,.tile__link:focus-visible .tile__zoom{background:#ffffff52;scale:1.1}}@media (width<=639px){.mosaic,.mosaic__row{gap:10px}.mosaic__row{flex-wrap:wrap}.tile{flex:100%}.mosaic__row--3 .tile:not(:first-child){flex:calc(50% - 5px)}.mosaic__row--3 .tile:not(:first-child) .tile__label{font-size:.95rem;bottom:10px;left:12px;right:12px}.mosaic__row--3 .tile:not(:first-child) .tile__zoom{display:none}.tile__link{border-radius:18px}}