.article-gallery{margin-top:clamp(46px,6vw,76px)}
.article-gallery__intro{display:flex;align-items:end;justify-content:space-between;gap:32px;margin-bottom:28px}
.article-gallery__intro p{max-width:510px;margin:0;color:#b8b8b2;font-size:clamp(17px,1.8vw,25px);line-height:1.3;letter-spacing:-.025em}
.article-gallery__rail{display:flex;align-items:stretch;gap:10px;height:460px;overflow:hidden}
.article-card{position:relative;isolation:isolate;display:flex;flex:1 1 0;min-width:0;overflow:hidden;border-radius:16px;background:#120d18;color:#fff;cursor:pointer;transition:flex .6s cubic-bezier(.22,1,.36,1)}
.article-card.is-active,.article-gallery__rail:not(.is-ready) .article-card:first-child{flex:4.33 1 0}
.article-card__media,.article-card__media:after{position:absolute;inset:0}
.article-card__media{z-index:-2;overflow:hidden;background:#120d18}
.article-card__media img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) saturate(.3) brightness(.54);transform:scale(1.03) translate(var(--image-x,0),var(--image-y,0));transition:filter .6s ease,transform .7s cubic-bezier(.22,1,.36,1)}
.article-card__media:after{z-index:1;content:"";background:linear-gradient(180deg,rgba(6,0,16,.05) 18%,rgba(6,0,16,.76) 100%);transition:background .6s ease}
.article-card.is-active .article-card__media img,.article-gallery__rail:not(.is-ready) .article-card:first-child .article-card__media img{filter:grayscale(0) saturate(.92) brightness(.83)}
.article-card__content{display:flex;flex:1;flex-direction:column;justify-content:flex-end;align-items:flex-start;min-width:max-content;padding:32px;opacity:0;transform:translateY(12px);transition:opacity .24s ease,transform .5s cubic-bezier(.22,1,.36,1)}
.article-card.is-active .article-card__content,.article-gallery__rail:not(.is-ready) .article-card:first-child .article-card__content{opacity:1;transform:none}
.article-card__category{max-height:0;margin:0;overflow:hidden;color:#fff;font:500 10px/1.4 var(--mono);letter-spacing:.1em;text-transform:uppercase;opacity:0;transform:translateY(8px);transition:max-height .35s ease,margin-bottom .35s ease,opacity .2s ease,transform .35s ease}
.article-card h3{position:relative;display:-webkit-box;max-width:22ch;margin:0;padding-left:.45em;overflow:hidden;color:#fff;font-size:clamp(23px,2.15vw,32px);line-height:.96;letter-spacing:-.055em;-webkit-box-orient:vertical;-webkit-line-clamp:2}
.article-card h3:before{position:absolute;top:.08em;bottom:.08em;left:0;width:.1em;border-radius:99px;background:#fff;content:""}
.article-card__summary{max-width:38ch;max-height:0;margin:0;overflow:hidden;opacity:0;color:#fff;transform:translateY(12px);font:400 14px/1.45 var(--display);transition:max-height .4s ease,margin-top .4s ease,opacity .24s ease,transform .4s cubic-bezier(.22,1,.36,1)}
.article-card__link{display:none}
.article-card.is-preview .article-card__media img{filter:grayscale(0) saturate(1) brightness(.62);transform:scale(1.075) translate(var(--image-x,0),var(--image-y,0))}
.article-card.is-preview .article-card__media:after{background:linear-gradient(180deg,rgba(6,0,16,.12) 12%,rgba(6,0,16,.94) 100%)}
.article-card.is-preview .article-card__category{max-height:28px;margin-bottom:13px;opacity:1;transform:none}
.article-card.is-preview .article-card__summary{max-height:112px;margin-top:17px;opacity:1;transform:none}
.article-card:focus-visible{outline:3px solid #fff;outline-offset:4px}

@media(max-width:850px){.article-gallery__intro{display:block}.article-gallery__intro p{margin-top:18px}.article-gallery__rail{height:400px}.article-card__content{padding:25px}.article-card h3{font-size:clamp(21px,3.4vw,29px)}}
@media(max-width:620px){.article-gallery__rail{display:grid;grid-template-columns:1fr;gap:18px;height:auto;overflow:visible}.article-card,.article-card.is-active{min-height:132px;flex:auto!important;border-radius:16px;transition:min-height .42s cubic-bezier(.22,1,.36,1)}.article-card.is-active{min-height:150px}.article-card__content,.article-card.is-active .article-card__content{width:100%;min-width:0;padding:24px;opacity:0;transform:none}.article-card.is-active .article-card__content{opacity:1}.article-card__category,.article-card__summary,.article-card__link{display:none}.article-card h3{width:100%;max-width:24ch;font-size:clamp(22px,6vw,30px);-webkit-line-clamp:2}.article-card__media img{filter:grayscale(1) saturate(.3) brightness(.5)}.article-card.is-active .article-card__media img{filter:grayscale(0) saturate(.92) brightness(.82)}}
@media(prefers-reduced-motion:reduce){.article-card,.article-card *{transition-duration:.01ms!important}}