.archives{background:oklch(100% 0 0);min-height:100dvh}.archives__wrapper{grid-template-columns:1fr;gap:2em;padding:2em;display:grid}@media (width>=769px){.archives__wrapper{grid-template-columns:repeat(12,1fr)}}.archives__header{z-index:10;color:#fff;mix-blend-mode:difference;flex-direction:column;justify-content:center;height:20em;padding-top:6em;display:flex;position:sticky;top:2em}@media (width>=769px){.archives__header{grid-column:3/11;height:15em;padding-top:0;display:block}}.archives__title,.archives__year{-webkit-user-select:none;user-select:none;transition:opacity .3s}.archives__grid{grid-template-columns:repeat(2,1fr);gap:2em;display:grid}@media (width>=769px){.archives__grid{grid-column:1/-1;grid-template-columns:repeat(6,1fr);margin-top:2em}}.archives__item{cursor:pointer;display:block}.archives__item:hover .archives__item-title,.archives__item:hover .archives__item-year{opacity:1}.archives__item-media{aspect-ratio:1;justify-content:center;align-items:center;width:100%;margin-bottom:1.2em;padding:30%;display:flex;position:relative;overflow:hidden}.archives__item-media img,.archives__item-media video{object-fit:contain;max-width:100%;max-height:100%;display:block}.archives__item-title,.archives__item-year{letter-spacing:0;opacity:.5;font-size:1em;line-height:1.1}.archives__item-title{margin-bottom:.1em}.archives__detail{z-index:5;pointer-events:none;opacity:0;background:oklch(100% 0 0);justify-content:center;align-items:center;width:100%;height:100%;padding:2em;display:flex;position:fixed;top:0;left:0}@media (width>=769px){.archives__detail{padding:8em}}.archives__detail--active{pointer-events:auto;opacity:1}.archives__detail-close{color:oklch(10% 0 0);cursor:pointer;z-index:20;background:0 0;border:none;width:3em;height:3em;line-height:1;position:fixed;top:2em;right:2em}.archives__detail-close svg{width:100%;height:100%}.archives__detail-media{justify-content:center;align-items:center;width:100%;height:100%;display:flex}.archives__detail-media img,.archives__detail-media video{object-fit:contain;max-width:100%;max-height:100%;display:block}