:root{--bg:#ece5d3;--ink:#14201a;--muted:#4d564f;--red:#e8452a;--green:#17894f;--yellow:#fbae1a;--blue:#0f6bb5;--card:#f4eedf}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--bg:#111a14;--ink:#ece5d3;--muted:#b2b5a6;--card:#18231b}}
:root[data-theme="dark"]{--bg:#111a14;--ink:#ece5d3;--muted:#b2b5a6;--card:#18231b}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font:400 1rem/1.6 Rubik,system-ui,sans-serif}
a{color:inherit;text-underline-offset:.2em}
a:focus-visible,button:focus-visible{outline:2px solid var(--red);outline-offset:3px}
.disp,h1,h2,h3,.logo,.btn,.nav a,.big{font-family:"Bebas Neue",Rubik,Impact,sans-serif;font-weight:400;letter-spacing:.03em}
.wrap{max-width:1100px;margin:0 auto;padding:0 clamp(16px,3vw,32px)}
.top{border-bottom:1px solid var(--ink);font-size:.95rem}
.top .wrap{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;padding-top:.45rem;padding-bottom:.45rem}
.top a{text-decoration:none;border-bottom:1px solid transparent}
.top a:hover{border-color:var(--ink)}
.top .grp{display:flex;gap:1rem;flex-wrap:wrap}
.soon{color:var(--muted)}
header.site{position:sticky;top:0;background:var(--bg);z-index:5;border-bottom:2px solid var(--ink)}
header.site .wrap{display:flex;align-items:center;gap:1.2rem;padding-top:.7rem;padding-bottom:.7rem}
.logo{font-size:1.9rem;line-height:1;text-decoration:none;white-space:nowrap}
.logo img{display:block;height:4.2rem;width:auto;filter:brightness(0)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .logo img{filter:none}}
:root[data-theme="dark"] .logo img{filter:none}
footer.site .logo img{height:4rem}
@media (max-width:820px){.logo img{height:3rem}.nav{font-size:1.3rem}}
.nav{display:flex;gap:1.1rem;overflow-x:auto;flex:1;scrollbar-width:none;font-size:1.5rem}
.nav::-webkit-scrollbar{display:none}
.nav a{text-decoration:none;white-space:nowrap;padding:.1rem 0;border-bottom:2px solid transparent}
.nav a:hover,.nav a[aria-current]{border-color:var(--red)}
.btn{display:inline-block;background:var(--red);color:#fff;text-decoration:none;font-size:1.25rem;padding:.35rem 1rem;border:2px solid var(--ink);white-space:nowrap}
.btn.alt{background:transparent;color:var(--ink)}
.btn:hover{transform:translate(-1px,-1px);box-shadow:3px 3px 0 var(--ink)}
.hero{padding:clamp(36px,8vh,88px) 0 clamp(24px,5vh,48px)}
.hero h1{font-size:clamp(2.6rem,8vw,5rem);line-height:.9;margin:0}
.hero .lede{font-size:clamp(1rem,1.7vw,1.15rem);max-width:58ch;margin:1rem 0 1.4rem}
.cta{display:flex;gap:.8rem;flex-wrap:wrap}
.rule{height:2px;background:var(--red);border:0;margin:0}
.next{display:grid;gap:0;border:2px solid var(--ink);margin-top:clamp(24px,5vh,44px);background:var(--card)}
.next .row{display:grid;grid-template-columns:7.5rem 1fr auto;gap:1rem;align-items:center;padding:.8rem 1rem;border-top:1px solid var(--ink)}
.next .row:first-child{border-top:0}
.next .d{font-family:"Bebas Neue",Impact,sans-serif;font-size:1.7rem;line-height:1}
.next small{display:block;color:var(--muted)}
.next .lbl{padding:.35rem 1rem;background:var(--ink);color:var(--bg);font-family:"Bebas Neue",Impact,sans-serif;font-size:1.1rem;letter-spacing:.06em}
section.blk{padding:clamp(32px,6vh,64px) 0;border-top:1px solid color-mix(in srgb,var(--ink) 22%,transparent)}
main>section.blk:nth-of-type(even):not(.support){background:linear-gradient(to bottom,color-mix(in srgb,var(--blue) 9%,var(--bg)),color-mix(in srgb,var(--green) 6%,var(--bg)))}
main>section.blk:nth-of-type(odd):not(.support){background:linear-gradient(to bottom,var(--bg),color-mix(in srgb,var(--yellow) 4%,var(--bg)))}
h2{font-size:clamp(2rem,4.6vw,3rem);line-height:1.05;margin:0 0 1rem}
h3{font-size:1.6rem;margin:.2rem 0 .3rem;line-height:1.1}
.frames{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(8px,2vw,24px)}
.fr{border:2px solid var(--ink);background:var(--bg);padding:clamp(3px,.5vw,6px);text-decoration:none;display:block}
.fr:nth-child(4){transform:rotate(-.5deg)}
.fr i{display:flex;flex-direction:column;gap:.5em;aspect-ratio:16/10;background:var(--c);color:var(--t,#fff);padding:clamp(8px,1.4vw,16px);font-style:normal;font-size:clamp(.78rem,1.3vw,.95rem);line-height:1.3;overflow-wrap:anywhere}
.fr strong{font-family:"Bebas Neue",Impact,sans-serif;font-weight:400;font-size:1.9em;line-height:1;letter-spacing:.03em}
.fr .more{margin-top:auto;font-family:"Bebas Neue",Impact,sans-serif;letter-spacing:.06em;font-size:1.2em}
.fr:hover{box-shadow:4px 4px 0 var(--ink)}
.news{display:grid;gap:0}
.news article{display:grid;grid-template-columns:9rem 1fr;gap:1rem;padding:1rem 0;border-top:1px solid var(--muted)}
.news article:first-child{border-top:0}
.news time{font-family:"Bebas Neue",Impact,sans-serif;font-size:1.4rem;letter-spacing:.04em;color:var(--red)}
.news p{margin:.2rem 0 0;max-width:62ch}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;text-align:left}
.stats .big{font-size:clamp(3rem,9vw,6rem);line-height:.9;display:block}
.support{background:var(--ink);color:var(--bg)}
.support .btn{border-color:var(--bg)}
.support a.btn.alt{color:var(--bg)}
/* ретро-фильтр на фото */
.mat img,.fbanner img{filter:sepia(.22) saturate(.88) contrast(1.06) brightness(1.03)}
.mat,.fbanner{position:relative}
.mat::after,.fbanner::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.10;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.tk .poster{filter:none}
/* шрифты как в афишах: Bebas - заголовки, даты и время; Montserrat - мелкие подписи и списки; Quicksand - как в логотипе, для девиза */
.next .d,.news time,.stats .big{letter-spacing:.07em}
.next .lbl,.top .lab,footer.site h4,.fr .more{font-family:Montserrat,Rubik,sans-serif;font-weight:600;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase}
.next small,.list small,.shot figcaption,.fr span:not(.more){font-family:Montserrat,Rubik,sans-serif;font-weight:400}
.next small,.list small{font-size:.82rem;letter-spacing:.02em}
.quote{font-family:Quicksand,Rubik,sans-serif;font-weight:500;font-size:clamp(1.05rem,2vw,1.35rem);letter-spacing:.03em;margin:0 0 .6rem;opacity:.9}
.vids{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:1.2rem}
.vf{margin:0}.vf figcaption{margin-top:.5rem;font-size:.9rem;opacity:.85}
.vid{display:block;position:relative;aspect-ratio:16/9;background:#0e1611;border:1px solid color-mix(in srgb,var(--fg) 20%,transparent)}
.vid iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.vidlink{display:grid;place-items:center;text-decoration:none;color:#f4ecd8;font-family:'Bebas Neue',sans-serif;font-size:1.5rem;letter-spacing:.06em}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.fbanner img{display:block;width:100%;height:auto;min-height:7rem;object-fit:cover;object-position:center}
.page-head.slim{padding-block:1.4rem .5rem}
.hbg{--bg:#111a14;--ink:#ece5d3;--muted:#b2b5a6;--card:#18231b;color:#ece5d3;background-size:cover;background-position:center 25%}.hbg .page-head{padding-block:clamp(56px,14vh,140px) 2rem}
.page-head{padding:clamp(32px,7vh,72px) 0 1.5rem}
.page-head h1{font-size:clamp(3.2rem,11vw,7rem);line-height:.92;margin:0}
.page-head p{font-size:clamp(1.05rem,2.2vw,1.35rem);max-width:46ch;margin:.8rem 0 0}
.tag{height:10px;width:64px;background:var(--c);margin-bottom:1rem;border:2px solid var(--ink)}
.cols2{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,4vw,56px)}
.prose p{max-width:62ch;margin:.6rem 0}
.list{list-style:none;padding:0;margin:.6rem 0;max-width:62ch}
.list li{padding:.55rem 0;border-top:1px solid var(--muted)}
.list li:first-child{border-top:0}
.list b{font-weight:500}
.list small{color:var(--muted);display:block}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:clamp(12px,2vw,24px)}
.card{border:2px solid var(--ink);background:var(--card);padding:1rem}
.card .ph{aspect-ratio:1;background:var(--c);display:grid;place-items:center;color:#fff;font-family:"Bebas Neue",Impact,sans-serif;font-size:4.5rem;margin-bottom:.8rem;border:2px solid var(--ink)}
.cp{font:inherit;font-size:.8rem;margin-left:.5rem;padding:.1rem .6rem;border:1px solid var(--ink);background:transparent;color:var(--ink);cursor:pointer}
.cp:hover{background:var(--ink);color:var(--bg)}
footer.site span{display:block;padding:.1rem 0}
.card p{margin:.2rem 0;color:var(--muted);font-size:.95rem}
details{border-top:1px solid var(--muted);padding:.7rem 0;max-width:62ch}
summary{cursor:pointer;font-family:"Bebas Neue",Impact,sans-serif;font-size:1.4rem;letter-spacing:.04em}
.embed{border:2px solid var(--ink);background:var(--card);min-height:420px}
.embed iframe{width:100%;min-height:640px;border:0;display:block}
.embed .empty{padding:2rem;max-width:52ch}
.tk{display:grid;grid-template-columns:minmax(0,260px) 1fr;gap:clamp(16px,3vw,32px);padding:clamp(12px,2vw,24px);align-items:start}.tk h3{margin:0 0 .5rem}.tk .poster{width:100%;height:auto;display:block;border:2px solid var(--ink)}.tk p{max-width:56ch}
@media (max-width:560px){.tk{grid-template-columns:1fr}.tk .poster{max-width:260px}}
footer.site{border-top:2px solid var(--red);padding:2rem 0 3rem;font-size:.95rem}
footer.site .wrap{display:grid;grid-template-columns:2fr 1fr 1fr;gap:1.5rem}
footer.site a{display:block;text-decoration:none;padding:.1rem 0}
footer.site a:hover{text-decoration:underline}
footer.site h4{margin:0 0 .4rem;font-family:"Bebas Neue",Impact,sans-serif;font-weight:400;font-size:1.3rem;letter-spacing:.05em}
.btn.sup{background:var(--yellow);color:#14201a}
.shots{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(10px,2vw,24px)}
.shots.all{display:block;column-width:280px;column-gap:clamp(10px,2vw,24px)}.shots.all .shot{break-inside:avoid;margin-bottom:clamp(10px,2vw,24px)}.shots.all .mat img{aspect-ratio:auto;height:auto}
.shot{margin:0}
.band img{aspect-ratio:auto;height:auto;width:100%;display:block}
@media (max-width:560px){.band img.crop,.band:has(img[src*=banner]) img{aspect-ratio:2/1;object-fit:cover}}
.mat{border:2px solid var(--ink);padding:clamp(6px,1.2vw,12px);background:var(--bg)}
.mat img,.mat .blank{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;background:var(--c)}
.blank{display:flex;align-items:flex-end;padding:clamp(8px,1.4vw,16px);color:var(--t,#fff)}
.blank strong{font-family:"Bebas Neue",Impact,sans-serif;font-weight:400;font-size:clamp(1.3rem,3vw,2rem);line-height:1;letter-spacing:.03em}
.shot figcaption{display:flex;flex-direction:column;padding-top:.5rem;font-size:.9rem;color:var(--muted)}
.shot figcaption b{font-family:"Bebas Neue",Impact,sans-serif;font-weight:400;font-size:1.2rem;color:var(--ink);letter-spacing:.04em}
.strip .shot:nth-child(2) .mat{transform:translateY(clamp(8px,2vw,24px))}
.strip{padding-bottom:clamp(8px,2vw,24px)}
@media (max-width:560px){.strip figcaption{display:none}.shots.all{column-width:auto;column-count:1}.strip{gap:8px}}
.hbtns{display:flex;gap:.5rem}
.dock{display:none}
@media (max-width:820px){
  .frames{grid-template-columns:1fr 1fr}
  .fr i{aspect-ratio:auto;min-height:8rem}
  .hbtns{display:none}
  .dock{display:grid;grid-template-columns:1fr 1fr;gap:.6rem;position:fixed;left:0;right:0;bottom:0;z-index:7;padding:.6rem 16px calc(.6rem + env(safe-area-inset-bottom,0px));background:var(--bg);border-top:2px solid var(--ink)}
  .dock .btn{text-align:center;font-size:1.4rem;padding:.5rem .5rem}
  body{padding-bottom:5rem}
  footer.site .wrap>div:first-child{grid-column:1/-1}
  .cols2{grid-template-columns:1fr}
  footer.site .wrap{grid-template-columns:1fr 1fr}
}
@media (max-width:560px){
  .top .lab{display:none}
  .top .wrap{justify-content:space-between}
  .hero .cta .btn{flex:1 1 9rem;text-align:center}
  .cta .btn{flex:1 1 9rem;text-align:center}
  .page-head p{font-size:1.05rem}
  header.site .wrap{flex-wrap:wrap}
  .nav{order:3;flex-basis:100%}
  .next .row{grid-template-columns:5.5rem 1fr}
  .next .row .btn{grid-column:1/-1;text-align:center}
  .news article{grid-template-columns:1fr;gap:.2rem}
  .stats .big{font-size:2.6rem}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.btn:hover{transform:none}}