:root{
	color-scheme:	light;
	--clr-text:		light-dark(#000, #fff);
	--clr-bg:		light-dark(#fff, #333);
	--clr-gray-l:	light-dark(#eee, #000);
	--clr-gray-d:	light-dark(#777, #777);
	--clr-red:		#db4646;
	--fs-mega:		36px;
	--fs-big:		28px;
	--fs-mid:		22px;
	--fs-text:		18px;
	--gap-main:		var(--fs-big);
	--gap-small:	var(--fs-text);
	--sz-sl:		calc(var(--gap-main) * 2);
}

html, body{height:100%;margin:0;padding:0;font:normal var(--fs-text) sans-serif;background-color:var(--clr-gray-l);}

.intro{display:flex;gap:var(--gap-main);min-height:100vh;padding:2em 1em;align-items:center;background-color:var(--clr-bg);}
.intro .face,
.intro .menu{flex:1;text-align:center;}

.intro .face .logo{width:clamp(160px,25vw,600px);height:clamp(200px,50vh,600px);object-fit:contain;}
.intro .face blockquote{padding:0;margin:1em 0;font-size:var(--fs-text);font-style:italic;text-align:center;}

.intro .menu nav{display:flex;gap:var(--fs-text);flex-direction:column;align-items:center;}
.intro .menu nav>a{min-width:10em;padding:var(--fs-text);border-radius:1em;font-size:var(--fs-mid);font-weight:600;background-color:var(--clr-gray-l);color:var(--clr-text);text-decoration:none;cursor:pointer;}
.intro .menu nav>a[href="#support"]{background-color:var(--clr-red);color:var(--clr-bg);}

.intro .menu nav .socials{display:flex;gap:var(--gap-main);margin-top:1em;justify-content:center;}
.intro .menu nav .socials a{width:var(--sz-sl);height:var(--sz-sl);flex:0 0 var(--sz-sl);font-size:0px;background-repeat:no-repeat;background-size:contain;}
.intro .menu nav .socials a.vk{background-image:url(i/sl_vk.svg);}
.intro .menu nav .socials a.tg{background-image:url(i/sl_tg.svg);}
.intro .menu nav .socials a.yt{background-image:url(i/sl_yt.svg);}

main{max-width:1280px;margin:0 auto;}

main article{padding:2em 1em}
main article h1,
main article h2{margin-top:0;font-size:var(--fs-mega);font-weight:700}

main article .columns{display:flex;gap:var(--gap-main);}
main article .columns .col{flex:1;}

main article h3{font-size:var(--fs-text);}

main article .docs{}
main article .docs ul{display:flex;padding:0;gap:1em;flex-wrap:wrap;}
main article .docs ul li{list-style:none;}
main article .docs ul li a{display:inline-block;padding:0.5em 1em;background-color:var(--clr-bg);text-decoration:none;border-radius:var(--fs-text);}
main article .docs ul li a:after{content:"(" attr(data-ext) ")";margin-left:1ex;text-transform:uppercase;}

main article img.full{display:block;width:100%;user-select:none;border-radius:var(--gap-main);}
main article .cite{padding:var(--gap-main);border-radius:0 0 var(--gap-main) var(--gap-main);background-color:var(--clr-bg);}
main article .cite h3{margin-top:0;}
main article .cite blockquote{padding:0;margin:0;font-style:italic;}

main .fast_nav{display:none;}
main .fast_nav a{}

main article#curators{}
main article#curators ul{display:flex;padding:0;gap:1em;flex-wrap:wrap;}
main article#curators ul li{list-style:none;padding:var(--fs-text);background-color:var(--clr-bg);border-radius:var(--fs-text);}
main article#curators ul li i{display:block;}

main article#support{display:flex;padding:2em;margin:2em 1em;background-color:var(--clr-bg);border-radius:var(--gap-main);flex-wrap:wrap;}
main article#support h2{flex:1 0 100%;text-align:center;}
main article#support h2:after,
main article#support h2:before{margin:0 1ex;content:"\2764";color:var(--clr-red);}
main article#support .variant{flex:0 1 50%;box-sizing:border-box;}

main article#support .form{display:flex;padding:var(--gap-main);gap:var(--gap-main);flex-direction:column;font-size:var(--fs-mid);}
main article#support .form .btn{padding:1ex;font-size:var(--fs-mid);font-weight:600;border-radius:1ex;border:solid 2px var(--clr-gray-d);background-color:var(--clr-gray-l);box-sizing:border-box;text-align:center;cursor:pointer;}

main article#support .form .field{}
main article#support .form .field.preset{display:flex;gap:var(--gap-small);flex-wrap:wrap;}
main article#support .form .field.preset .btn{flex:0 1 calc(33.3333333% - 2 / 3 * var(--gap-small));}
main article#support .form .field.preset .btn.set{background-color:var(--clr-text);color:var(--clr-bg);}
main article#support .form .field.preset input{min-width:0;-moz-appearance:textfield;background-color:var(--clr-bg);}
main article#support .form .field.preset input::-webkit-outer-spin-button,
main article#support .form .field.preset input::-webkit-inner-spin-button {-webkit-appearance: none;margin:0;}
main article#support .form .field.preset input.btn:focus{outline:none!important;}
main article#support .form .field.submit{}
main article#support .form .field.submit button{width:100%;background-color:var(--clr-red);border-color:var(--clr-red);color:var(--clr-bg);}
main article#support .form .field.submit button:disabled{opacity:0.3}

main article#support .qr{display:flex;justify-content:center;}

main article#media{}
main article#media ul{display:flex;padding:0;gap:1em;flex-wrap:wrap;}
main article#media ul li{display:flex;gap:1em;border-radius:var(--fs-text);list-style:none;flex:1 1 calc(50% - 1em);background-color:var(--clr-bg);}
main article#media ul li a{display:flex;width:100%;padding:var(--fs-text);gap:1em;flex-direction:column;justify-content:space-between;text-decoration:none;box-sizing:border-box;}
main article#media ul li a .title{}
main article#media ul li a .source{display:flex;gap:1em;color:var(--clr-gray-d);}
main article#media ul li a .source .name{flex:1}
main article#media ul li a .source .date{text-align:right;}

main article#contacts{}
main article#contacts ul{display:flex;padding:0;gap:1em;flex-wrap:wrap;}
main article#contacts ul li{display:flex;gap:1em;list-style:none;}
main article#contacts ul li img{width:10ex;height:10ex;flex:0;border-radius:50%}
main article#contacts ul li address{display:flex;gap:0.5em;flex:1;flex-direction:column;}
main article#contacts ul li address .name{font-weight:600}

footer{padding:var(--gap-main);text-align:center;}

.hidden{display:none!important}

@media screen and (max-width:1280px){

:root{
	--fs-mega:		32px;
	--fs-big:		24px;
	--fs-mid:		20px;
	--fs-text:		16px;
}

main{padding:1em}

}

@media screen and (max-width:800px){

:root{
	--fs-mega:		24px;
	--fs-big:		18px;
	--fs-mid:		16px;
	--fs-text:		14px;
}

main{padding:1em}

main article .columns{display:block;}

main article#support .variant{flex-basis:100%}


}

@media screen and (max-width:600px){

:root{
	--fs-mega:		20px;
	--fs-big:		16px;
	--fs-mid:		14px;
	--fs-text:		12px;
}

}

@media screen and (max-width:480px){

:root{
	--fs-mega:		18px;
}

main article{padding:1em 0.25em}
main article#support{margin:1em 0.25em;}

.intro{min-height:unset;flex-direction:column;}
.intro .face .logo{max-width:400px;max-height:160px}


}