@font-face{font-family:"Bebas Neue";src:url(bebas-neue-latin.woff2) format("woff2");font-display:swap;unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+2122,U+2190-2193}
@font-face{font-family:"Bebas Neue";src:url(bebas-neue-latin-ext.woff2) format("woff2");font-display:swap;unicode-range:U+0100-02AF,U+1E00-1EFF}
:root{--ink:#282828;--logo:#111;--muted:#999;--footer:#ddd;--bg:#fff}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:"Bebas Neue","Helvetica Neue",sans-serif;font-weight:400;letter-spacing:.03em}
a{color:inherit;text-decoration:none}
img,video{display:block;max-width:100%;height:auto}
.site-header{position:relative;height:202px;padding:0 4%;display:flex;align-items:center;justify-content:center}
.site-header nav{position:absolute;left:4%;top:50%;transform:translateY(-50%);display:flex;gap:25px;font-size:19px;line-height:19px;text-transform:uppercase}
.site-header nav a:hover,.other a:hover .label{color:var(--muted)}
.logo{font-size:44px;line-height:35px;color:var(--logo);text-transform:uppercase;text-align:center}
main{width:92%;max-width:1400px;margin:0 auto}
main:has(.covers){max-width:none}
.covers{display:grid;grid-template-columns:repeat(3,1fr);margin-top:33px}
.cover{position:relative;display:block;aspect-ratio:551/436;border-radius:18px;overflow:hidden}
.cover img{width:100%;height:100%;object-fit:cover}
.cover::after{content:"";position:absolute;inset:0;background:rgba(55,55,55,.7);opacity:0;transition:opacity .2s}
.cover-title{position:absolute;inset:0;z-index:1;display:flex;align-items:center;justify-content:center;padding:0 8%;color:#fff;font-size:24px;line-height:31px;text-transform:uppercase;text-align:center;opacity:0;transition:opacity .2s}
.cover:hover::after,.cover:focus-visible::after,.cover:hover .cover-title,.cover:focus-visible .cover-title{opacity:1}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.text{text-align:center;color:var(--muted);font-size:20px;line-height:26px;max-width:800px;margin:0 auto}
.text>div,.text>p{margin:0;padding-bottom:20px}
.text .title{color:var(--ink);font-size:30px;line-height:34px;padding-bottom:20px}
.text .sub-title{color:var(--ink);font-size:24px;line-height:30px;padding:20px 0 30px}
.text a{text-decoration:underline}
.row{display:flex;gap:8px;align-items:flex-start}
.row>div{min-width:0}
.mod img,.mod video{width:100%}
.mod img[data-zoom]{cursor:zoom-in}
.embed{margin-left:auto;margin-right:auto}
.embed>div{position:relative;height:0}
.embed iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.grid-row{display:flex;gap:8px;margin-bottom:8px}
.grid-row:last-child{margin-bottom:0}
.grid-row>div{min-width:0}
.grid-row img{width:100%;cursor:zoom-in}
.social{display:flex;justify-content:center;gap:15px;flex-wrap:wrap;padding:40px 0 15px}
.social a{display:flex;align-items:center;justify-content:center;width:30px;height:30px;color:#777;transition:color .2s}
.social a:hover{color:var(--ink)}
.social svg{width:26px;height:26px;fill:currentColor}
.contact{max-width:800px;margin:0 auto;padding-top:20px;text-align:center}
.contact h1{font-size:30px;line-height:34px;font-weight:400;margin:0 0 60px}
.contact p{color:var(--ink);font-size:20px;line-height:26px;margin:0}
.other{margin-top:60px}
.other h2{font-weight:400;font-size:24px;line-height:26px;color:var(--logo);margin:0 0 30px}
.other>div{display:grid;grid-template-columns:repeat(2,1fr);gap:5px}
.other .cover-title{font-size:22px}
.to-top{position:fixed;right:30px;bottom:30px;width:60px;height:60px;border-radius:50%;background:rgba(0,0,0,.1);display:flex;align-items:center;justify-content:center;color:#fff;opacity:0;pointer-events:none;transition:opacity .2s;z-index:5}
.to-top.show{opacity:1;pointer-events:auto}
.to-top svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2}
footer{padding:132px 16px 100px;text-align:center;font-size:18px;line-height:20px;color:var(--footer);text-transform:uppercase}
dialog{position:fixed;inset:0;width:100vw;height:100dvh;max-width:none;max-height:none;margin:0;border:0;padding:0;background:rgba(255,255,255,.94);overflow:hidden}
dialog::backdrop{background:transparent}
dialog img{width:100%;height:100%;object-fit:contain;display:block}
.lb-prev,.lb-next{position:absolute;top:0;bottom:0;width:30%;border:0;background:none;padding:0 40px;color:#111;cursor:pointer;display:flex;align-items:center}
.lb-prev{left:0;justify-content:flex-start}
.lb-next{right:0;justify-content:flex-end}
.lb-close{position:absolute;top:20px;right:20px;width:40px;height:40px;border:0;background:none;color:#111;cursor:pointer;z-index:2;display:flex;align-items:center;justify-content:center}
dialog svg{width:16px;height:24px;fill:none;stroke:currentColor;stroke-width:2}
.lb-close svg{width:14px;height:14px}
.lb-prev svg,.lb-next svg,.lb-close svg{transition:opacity .6s}
dialog.idle svg{opacity:0}
dialog:focus,dialog button:focus{outline:none}
dialog button:focus-visible svg{opacity:1;outline:2px solid #111;outline-offset:6px}
@media (max-width:768px){
 .site-header{height:auto;padding:28px 16px 34px;flex-direction:column-reverse;gap:18px}
 .site-header nav{position:static;transform:none;gap:20px;justify-content:center;flex-wrap:wrap}
 main{padding:0 16px}
 .logo{font-size:36px}
 .covers{grid-template-columns:1fr}
 main{width:100%}
 .row{flex-direction:column}
 .row>div{width:100%;flex:none!important}
 .grid-row{flex-direction:column}
 .grid-row>div{flex:none!important;width:100%}
 .other>div{grid-template-columns:1fr}
 .to-top{right:16px;bottom:16px;width:48px;height:48px}
 .lb-prev,.lb-next{padding:0 12px}
 .text{font-size:18px}
}
