.work .guides .v.a{grid-column:7/13;display:block}.work main{z-index:1;grid-row:2;position:relative}.work .intro-block{grid-column:1/8;padding:clamp(40px,9vh,96px) 0 clamp(28px,5vh,56px)}.work .intro-block h1{font-family:var(--display);letter-spacing:-.03em;font-variation-settings:"wght" 500,"wdth" 100,"opsz" 96;max-width:none;margin-top:0;font-size:clamp(40px,min(5.5vw,9vh),76px);font-weight:500;line-height:1}.work h1 .w{white-space:nowrap;display:inline-block}.work h1 .ch{text-align:center;font-variation-settings:"wght" var(--w,500),"wdth" var(--d,100),"opsz" 96;transform:translateY(var(--y,0px));color:color-mix(in srgb,var(--p3) var(--m,0%),var(--fg));font-weight:400;display:inline-block}.work .intro{max-width:56ch;color:var(--muted);margin-top:clamp(12px,2vh,20px);font-size:clamp(15px,1.2vw,18px);line-height:1.55}.work .project{column-gap:var(--gap);border-top:1px solid var(--guide);color:inherit;grid-template-columns:repeat(12,minmax(0,1fr));align-items:center;padding:clamp(36px,6vh,72px) 0;display:grid}.work .shot{aspect-ratio:16/10;grid-column:1/7;margin:10px;position:relative}.work .shot .frame{background:color-mix(in srgb,var(--fg) 4%,var(--bg));border:1px solid var(--guide);transition:transform .6s var(--ease);border-radius:12px;position:absolute;inset:0;overflow:hidden}.work .shot svg{width:100%;height:100%;display:block}.work .shot img{object-fit:cover;width:100%;height:100%;display:block}.work .shot .frame.hero{background:radial-gradient(110% 120% at 72% 18%,color-mix(in srgb,var(--pc) 30%,var(--bg)) 0%,color-mix(in srgb,var(--pc) 9%,var(--bg)) 62%,var(--bg) 100%)}.work .shot .frame.hero:before{content:"";background:repeating-linear-gradient(90deg,color-mix(in srgb,var(--fg) 7%,transparent) 0 1px,transparent 1px calc(100%/12));pointer-events:none;position:absolute;inset:0}.work .shot .frame.hero img{object-fit:contain;box-sizing:border-box;padding:6% 5%;position:relative}.work .shot .x{width:14px;height:14px;transition:transform .45s var(--ease);position:absolute}.work .shot .x:before,.work .shot .x:after{content:"";background:var(--guide-hi);transition:background-color .3s;position:absolute}.work .shot .x:before{width:1.5px;height:14px;top:0;left:6px}.work .shot .x:after{width:14px;height:1.5px;top:6px;left:0}.work .shot .x.tl{top:-17px;left:-17px}.work .shot .x.tr{top:-17px;right:-17px}.work .shot .x.bl{bottom:-17px;left:-17px}.work .shot .x.br{bottom:-17px;right:-17px}.work .project:hover .shot .frame,.work .project:focus-visible .shot .frame{transform:scale(1.015)}.work .project:hover .x.tl,.work .project:focus-visible .x.tl{transform:translate(8px,8px)}.work .project:hover .x.tr,.work .project:focus-visible .x.tr{transform:translate(-8px,8px)}.work .project:hover .x.bl,.work .project:focus-visible .x.bl{transform:translate(8px,-8px)}.work .project:hover .x.br,.work .project:focus-visible .x.br{transform:translate(-8px,-8px)}.work .project:hover .x:before,.work .project:hover .x:after,.work .project:focus-visible .x:before,.work .project:focus-visible .x:after{background:var(--pc)}.work .info{grid-column:7/13;padding-left:clamp(0px,1.5vw,24px)}.work .info .accent{background:var(--pc);width:28px;height:2px;transition:width .45s var(--ease);margin-bottom:clamp(16px,2.4vh,22px);display:block}.work .project:hover .info .accent,.work .project:focus-visible .info .accent{width:56px}.work .info .eyebrow{color:var(--muted);margin-bottom:10px;font-size:15px}.work .info .eyebrow b{color:var(--fg);font-weight:500}.work .info h2{font-family:var(--display);letter-spacing:-.022em;max-width:18ch;font-size:clamp(26px,2.6vw,40px);font-weight:500;line-height:1.08}.work .info .sum{color:var(--muted);max-width:44ch;margin-top:14px;font-size:clamp(15px,1.2vw,17px);line-height:1.55}.work .meta{border-top:0;flex-wrap:wrap;gap:6px 22px;margin-top:clamp(16px,2.4vh,22px);padding-top:0;font-size:14px;display:flex}.work .meta span{color:var(--fg)}.work .meta span i{color:var(--muted);margin-right:6px;font-style:normal}.work .read{text-underline-offset:6px;min-height:44px;text-decoration:underline;text-decoration-thickness:1px;-webkit-text-decoration-color:color-mix(in srgb,var(--fg) 35%,transparent);text-decoration-color:color-mix(in srgb,var(--fg) 35%,transparent);align-items:center;margin-top:clamp(10px,1.8vh,16px);font-size:15px;font-weight:500;transition:text-decoration-color .25s,text-underline-offset .25s;display:inline-flex}.work .project:hover .read,.work .project:focus-visible .read{-webkit-text-decoration-color:var(--pc);text-decoration-color:var(--pc);text-underline-offset:8px}.work .project.soon{cursor:default}.work .project.soon .frame{border:1px dashed color-mix(in srgb,var(--pc) 55%,var(--guide));background:0 0}.work .project.soon h2{color:var(--muted);max-width:none}.work .tag{vertical-align:.32em;font:400 12px/1 var(--text);letter-spacing:0;background:color-mix(in srgb,var(--pc) var(--pill),transparent);color:var(--fg);border-radius:999px;margin-left:10px;padding:.4em .75em;display:inline-block}.work .also{border-top:1px solid var(--guide);padding:clamp(40px,7vh,80px) 0 clamp(56px,9vh,104px)}.work .also .inner{grid-column:1/8}.work .also h3{font-family:var(--display);letter-spacing:-.015em;margin-top:0;font-size:clamp(20px,1.8vw,26px);font-weight:500;line-height:1.5}.work .also p{color:var(--muted);max-width:52ch;margin-top:8px;font-size:15px}.work .chips{flex-wrap:wrap;gap:8px;max-width:none;margin-top:18px;list-style:none;display:flex}.work .chips li{background:color-mix(in srgb,var(--fg) 6%,transparent);border:1px solid var(--guide);border-radius:999px;padding:.45em .9em;font-size:14px}@media (max-width:1023px),(max-width:1199px) and (orientation:portrait){.work .shot,.work .info{grid-column:1/-1}.work .info{margin-top:28px;padding-left:0}.work .guides .v.a{display:none}.work .intro-block,.work .also .inner{grid-column:1/-1}}@media (max-width:809px){.work .shot{margin:8px}}@media (prefers-reduced-motion:reduce){.work .project:hover .shot .frame,.work .project:focus-visible .shot .frame,.work .project:hover .x.tl,.work .project:hover .x.tr,.work .project:hover .x.bl,.work .project:hover .x.br,.work .project:focus-visible .x.tl,.work .project:focus-visible .x.tr,.work .project:focus-visible .x.bl,.work .project:focus-visible .x.br{transform:none}.work .project:hover .info .accent,.work .project:focus-visible .info .accent{width:28px}.work .project:hover .read,.work .project:focus-visible .read{text-underline-offset:6px}.work .project .shot .frame,.work .project .shot .x,.work .project .info .accent,.work .project .read{transition:none}}
