@layer module{.module-blog-post-previous-next{&>a{align-items:center;aspect-ratio:3/1;border-radius:2px;display:flex;justify-content:center;overflow:hidden;position:relative;&>.backdrop{background-color:rgba(0,0,0,.5);z-index:2}&>.backdrop,&>svg{height:100%;inset:0;position:absolute;width:100%}&>svg{z-index:1}&>p{font-size:var(--fs);inset-block-start:0;padding:.35em .8em;position:absolute;z-index:3;--fs-min:14px;--fs-max:16px;background-color:var(--cs-link);color:#fff;font-weight:400}&.previous-post{grid-column:col-start 2/col-end 6;grid-row:row-start 1/row-end 1;&>p{border-end-end-radius:2px;inset-inline-start:0}&>div{grid-template-columns:32px 1fr;& h2{justify-self:start;text-align:start}}}&.next-post{grid-column:col-start 7/col-end -2;grid-row:row-start 1/row-end 1;&>p{border-end-start-radius:2px;inset-inline-end:0}&>div{grid-template-columns:1fr 32px;& h2{justify-self:end;text-align:end}}}&>img{height:100%;object-fit:cover;position:absolute;transition:transform 12s ease-out;width:100%}&:hover>img{transform:scale(1.1)}&>div{align-items:center;display:grid;gap:4em;inline-size:80%;position:relative;z-index:2;&>svg{block-size:32px;inline-size:32px;fill:#fff}&>h2{color:#fff;font-size:18px;font-weight:400;inline-size:100%;line-height:1.5;margin:0;text-align:center;text-shadow:0 0 2.5px rgba(0,0,0,.75),0 0 5px rgba(0,0,0,.5),0 0 10px rgba(0,0,0,.25)}}@media (max-width:1440px){&.previous-post{grid-column:col-start 1/col-end 6}&.next-post{grid-column:col-start 7/col-end -1}}}@media (max-width:1024px){&>a{aspect-ratio:16/9;&>div{gap:2em}}}@media (max-width:768px){&>a{aspect-ratio:4/3;&>div{gap:1.5em}}}@media (max-width:567px){&>a{aspect-ratio:3/1;&>div{gap:2em}&.previous-post{grid-row:row-start 1/row-end 1}&.next-post,&.previous-post{grid-column:col-start 1/col-end -1}&.next-post{grid-row:row-start 2/row-end 2}}}}}