.mk-occ{background:rgb(var(--color-background));color:rgb(var(--color-foreground))}.mk-occ__head{margin-bottom:clamp(2.4rem,1.6rem + 2vw,4.4rem)}.mk-occ__title{margin:0;max-width:19ch;font-size:clamp(3.2rem,2rem + 3.2vw,6.4rem);line-height:.96;letter-spacing:-.035em;font-stretch:80%;color:rgb(var(--color-foreground))}.mk-occ__grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:minmax(17rem,auto);gap:1rem}.mk-occ__item{--bg: var(--mk-blue);--fg: var(--mk-ink);--card: #fff;--rot: -7deg;display:flex;min-width:0}.mk-occ__item:nth-child(2n){--rot: 6deg}.mk-occ__tile{position:relative;isolation:isolate;overflow:hidden;container-type:inline-size;display:flex;flex-direction:column;justify-content:space-between;gap:2rem;width:100%;padding:clamp(1.6rem,1rem + 1vw,2.8rem);border-radius:var(--mk-radius);background:var(--bg);color:var(--fg);text-decoration:none;transition:transform .5s var(--mk-ease),box-shadow .5s var(--mk-ease)}.mk-occ__name{position:relative;z-index:2;margin:0;max-width:100%;font-family:var(--font-heading-family);font-weight:800;font-size:clamp(2.2rem,14.5cqi,6.4rem);font-stretch:80%;font-variation-settings:"opsz" 72;line-height:.98;letter-spacing:-.035em;color:inherit;text-wrap:balance;-webkit-hyphens:manual;hyphens:manual;overflow-wrap:normal;word-break:normal}.mk-occ__go{position:relative;z-index:2;display:inline-grid;place-items:center;flex:none;width:4.4rem;height:4.4rem;border-radius:99rem;background:var(--mk-orange);color:var(--mk-ink);transform:rotate(-45deg);transition:transform .5s var(--mk-ease),background-color .2s ease}.mk-occ__go svg{width:2rem;height:2rem}.mk-occ__card{position:absolute;z-index:1;right:-5%;bottom:-9%;width:clamp(12rem,60cqi,26rem);aspect-ratio:1;overflow:hidden;border-radius:1.6rem;background:var(--card);transform:rotate(var(--rot));transform-origin:70% 70%;transition:transform .6s var(--mk-ease)}.mk-occ__card img,.mk-occ__card svg{display:block;width:100%;height:100%;object-fit:cover;mix-blend-mode:multiply}.mk-occ__card .placeholder-svg{background:transparent;fill:currentColor;opacity:.5}@media(hover:hover){.mk-occ__tile:hover{transform:translateY(-.4rem);box-shadow:var(--mk-shadow)}.mk-occ__tile:hover .mk-occ__card{transform:translate(-6%,-7%) rotate(calc(var(--rot) * 2.2)) scale(1.04)}.mk-occ__tile:hover .mk-occ__go{transform:rotate(0);background:var(--mk-orange-deep)}}.mk-occ__tile:focus-visible .mk-occ__go{transform:rotate(0)}@media screen and (max-width:749px){.mk-occ__item:nth-child(3n+1){grid-column:span 2}.mk-occ__item:last-child:nth-child(3n+2){grid-column:span 2}.mk-occ__item:nth-child(3n+2){--bg: var(--mk-blue-tile);--fg: var(--mk-ink);--card: var(--mk-blue-tile)}.mk-occ__item:nth-child(3n+3){--bg: var(--mk-ink);--fg: #fff;--card: #fff}.mk-occ__item:nth-child(3n+1) .mk-occ__name,.mk-occ__item:last-child:nth-child(3n+2) .mk-occ__name{max-width:62%;font-size:clamp(2.6rem,10cqi,4.2rem)}.mk-occ__item:nth-child(3n+1) .mk-occ__card,.mk-occ__item:last-child:nth-child(3n+2) .mk-occ__card{width:40%;right:-4%;bottom:-14%}.mk-occ__go{width:3.8rem;height:3.8rem}.mk-occ__go svg{width:1.7rem;height:1.7rem}}@media screen and (min-width:750px)and (max-width:989px){.mk-occ__grid{grid-template-columns:repeat(6,minmax(0,1fr));grid-auto-rows:minmax(24rem,auto);gap:1.6rem}.mk-occ__item{grid-column:span 2}.mk-occ__item:nth-child(5n+4),.mk-occ__item:nth-child(5n+5){grid-column:span 3}.mk-occ__item:nth-child(5n+2){--bg: var(--mk-ink);--fg: #fff;--card: #fff}.mk-occ__item:nth-child(5n+3),.mk-occ__item:nth-child(5n+4){--bg: var(--mk-blue-tile);--fg: var(--mk-ink);--card: var(--mk-blue-tile)}}@media screen and (min-width:990px){.mk-occ__grid{grid-template-columns:repeat(12,minmax(0,1fr));grid-auto-rows:minmax(clamp(25rem,21vw,30rem),auto);gap:2rem}.mk-occ__item{grid-column:span 3}.mk-occ__item:nth-child(7n+1),.mk-occ__item:nth-child(7n+2),.mk-occ__item:nth-child(7n+3){grid-column:span 4}.mk-occ__item:nth-child(7n+2),.mk-occ__item:nth-child(7n+4),.mk-occ__item:nth-child(7n+7){--bg: var(--mk-ink);--fg: #fff;--card: #fff}.mk-occ__item:nth-child(7n+3),.mk-occ__item:nth-child(7n+5){--bg: var(--mk-blue-tile);--fg: var(--mk-ink);--card: var(--mk-blue-tile)}.mk-occ__go{width:4.8rem;height:4.8rem}}@media(prefers-reduced-motion:reduce){.mk-occ__tile,.mk-occ__card,.mk-occ__go{transition:none}.mk-occ__tile:hover{transform:none}.mk-occ__tile:hover .mk-occ__card{transform:rotate(var(--rot))}}.mk-occ__cut{position:absolute;z-index:1;right:-3%;bottom:-6%;width:clamp(13rem,64cqi,28rem);transform:rotate(var(--rot));transform-origin:60% 80%;transition:transform .6s var(--mk-ease);pointer-events:none}.mk-occ__cut img{display:block;width:100%;height:auto;filter:drop-shadow(0 1.6rem 1.8rem rgba(20,32,46,.28))}@media(hover:hover){.mk-occ__tile:hover .mk-occ__cut{transform:translate(-4%,-6%) rotate(calc(var(--rot) * 2.2)) scale(1.05)}}@media(prefers-reduced-motion:reduce){.mk-occ__cut{transition:none}}.mk-occ__cut{width:auto;height:82%;aspect-ratio:720 / 700;bottom:-7%;right:-2%}.mk-occ__cut img{width:100%;height:100%;object-fit:contain}.mk-occ__tile:has(.mk-occ__stage){justify-content:flex-start;gap:1rem}.mk-occ__tile:has(.mk-occ__stage) .mk-occ__go{position:absolute;left:clamp(1.6rem,1rem + 1vw,2.8rem);bottom:clamp(1.6rem,1rem + 1vw,2.8rem);z-index:3}.mk-occ__stage{position:relative;flex:1 1 auto;min-height:0;margin-right:calc(-1*clamp(1.6rem,1rem + 1vw,2.8rem));margin-bottom:calc(-1*clamp(1.6rem,1rem + 1vw,2.8rem))}.mk-occ__stage .mk-occ__cut{position:absolute;right:-3%;bottom:-8%;top:auto;height:min(108%,26rem);max-height:none;width:auto;aspect-ratio:720 / 700}@media screen and (max-width:749px){.mk-occ__tile:has(.mk-occ__stage){min-height:21rem}}.mk-occ__grid .mk-occ__item .mk-occ__name[style*=--mk-longest]{max-width:100%;font-size:min(clamp(2.2rem,12cqi,6.4rem),calc((100cqi - 2 * clamp(1.6rem,1rem + 1vw,2.8rem)) / (var(--mk-longest) * .54)))}@media screen and (min-width:990px){.mk-occ__grid .mk-occ__item .mk-occ__name[style*=--mk-longest]{font-size:min(4.4rem,calc((min(100vw,1300px) / 4 - 6.4rem) / (var(--mk-max) * .46)))}}
/*# sourceMappingURL=/cdn/shop/t/24/assets/mk-occasion-tiles.css.map */