*, *::before, *::after { box-sizing: border-box; } html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font: inherit; vertical-align: baseline; } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } ol, ul { list-style: none; } img { display: block; max-width: 100%; } a { color: inherit; text-decoration: none; } body, input, button, textarea { font-family: -apple-system, BlinkMacSystemFont, Roboto, "Helvetica Neue", Helvetica, Arial, sans-serif; } body { min-width: 320px; min-height: 100vh; color: #f5f7fb; background:black; font-size: 16px; line-height: 1.45;}
.main__header {    position: sticky;
    top: 0;
    z-index: 1000;
    width: 100%;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    background: rgba(8, 11, 19, 0.82);
    backdrop-filter: blur(18px); padding:14px 0;}
.nav-list,
	.header__rightside,
	.header__container,
		.header__leftside {display:flex; align-items:center; justify-content:space-between;}
			.main__logotype {}
			.main__logotype a {}
			.header__menu-btn {display:none; align-items:center; justify-content:center; width:40px; height:40px; border:1px solid rgba(255,255,255,.1); border-radius:8px; background:#271c1c; color:#fff; cursor:pointer; transition:border-color .22s ease, background .22s ease, color .22s ease;}
			.header__menu-btn:hover {border-color:#e10600; background:#e10600;}
			.header__menu-btn svg {width:22px; height:22px;}
.main__nav-list {}
	.nav-list {gap:12px;}
		.nav-list_item {display:flex; align-items:center; gap:12px;}
		.nav-list_item a {display:flex; align-items:center; gap:12px; color:#fff;}
		.nav-list_item a.select,
		.nav-list_item a:hover {color:#e10600;}
		.nav-list_item a svg {width:22px; max-width:22px;}
		.nav-list_item a span {}
.header__rightside {gap:18px;}
.header__rightside a {position: relative; isolation: isolate; overflow: hidden; min-height: 38px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 0 16px; border: 1px solid rgba(255,255,255,.1); border-radius:8px; background:#271c1c; color:#fff; font-size: 15px; font-weight: 500; transition: border-color 0.22s ease, color 0.22s ease, transform 0.22s ease, box-shadow .22s ease;}
.header__rightside a:before {content:""; position:absolute; top:-35%; left:-75%; width:42%; height:170%; background:linear-gradient(90deg, transparent, rgba(255,255,255,.55), transparent); transform:skewX(-22deg); transition:left .55s ease; pointer-events:none;}
.header__rightside a:hover:before {left:130%;}
.header__rightside a:hover {transform:translateY(-1px); box-shadow:0 10px 24px rgba(225,6,0,.22);}
.header__rightside a span {position:relative; z-index:2;}
.header__rightside a.main__comming-btn:hover,
.header__rightside a.main__register-btn {background:#e10600; }

.post__section,
.article__container,
.demo__section,
.main__promo-section,
.header__container {max-width:1460px; width:calc(100% - 32px); margin-left:auto; margin-right:auto;}
.main__container {padding-top:20px;}
.main__promo-section {}
.main__promo-section a {display:block; position:relative; overflow:hidden; border-radius:14px; border:1px solid #e10600; min-height:360px;}
	.promo__container {display:flex; flex-flow:column; padding:80px; position:relative; z-index:4;    align-items: flex-start;}
		.promo__label {}
		.promo__label span {min-height: 30px; display: inline-flex; align-items: center; margin-bottom: 13.6px; padding: 0 11.6px; border: 1px solid #e10600; border-radius: 999px; background: #e106004f; color: #fff; font-size: 14px; font-weight: 500; line-height: 1;}
	.promo__container h2 {max-width: 560px; margin: 0; color:#fff; font-size: 46px; font-weight: 500; line-height: 1.2; letter-spacing: 0;}
	.promo__btn {position: relative; isolation: isolate; overflow: hidden; min-height: 54px; display: inline-flex; align-items: center; justify-content: center; margin-top: 25.2px; padding: 0 23.3px; border: 1px solid #e10600 ; border-radius:12px; background:#e10600; color:#fff; font-size: 16px; font-weight: 500; transition: border-color 0.22s ease, color 0.22s ease, transform 0.22s ease, box-shadow .22s ease;}
	.promo__btn:before {content:""; position:absolute; top:-35%; left:-78%; width:42%; height:170%; background:linear-gradient(90deg, transparent, rgba(255,255,255,.58), transparent); transform:skewX(-22deg); transition:left .6s ease; pointer-events:none;}
	.main__promo-section a:hover .promo__btn:before {left:132%;}
	.main__promo-section a:hover .promo__btn {transform:translateY(-1px); box-shadow:0 12px 28px rgba(225,6,0,.26);}
	.promo__btn span {position:relative; z-index:2;}
.promo__image{position:absolute; right:0; top:0; bottom:0; left:0; width:100%; height:100%; object-fit:cover; z-index:1; transform-origin:center; animation:promoImagePulse 7s ease-in-out infinite;}
.demo__section {display:flex; flex-flow:column; gap:24px; margin:20px auto;}
	.demo__categories {display:flex; flex-wrap:wrap; gap:10px;border: 1px solid rgba(255, 255, 255, .1); border-radius: 8px; background: rgba(8, 11, 19, 0.82); padding: 6px;}
	.demo__categories a {padding:3px 6px; border-radius:6px;}
	.demo__categories a:hover {background:#e10600; color:#fff;}
	.demo__list {display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap:16px;}
		.demo__item {max-width:none; min-width:0;}
		.demo__item a {color:#fff;}
		.demo__item a:hover .demo_name {color:#e10600;}
			.demo__short {display:flex; flex-flow:column; gap:10px;}
				.demo_preview {position:relative; overflow:hidden;  border-radius:10px; padding-top:86%;}
				.demo_preview img {position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover; transition:transform .45s ease;}
				.demo_preview span {position:absolute; left:50%; top:50%; z-index:3; overflow:hidden; min-height:38px; display:inline-flex; align-items:center; justify-content:center; padding:0 18px; border:1px solid #e10600; border-radius:8px; background:#e10600; color:#fff; font-size:14px; font-weight:600; line-height:1; opacity:0; transform:translate(-50%, -50%) scale(.92); transition:opacity .28s ease, transform .28s ease, box-shadow .28s ease;}
				.demo_preview span:before {content:""; position:absolute; top:-35%; left:-80%; width:42%; height:170%; background:linear-gradient(90deg, transparent, rgba(255,255,255,.58), transparent); transform:skewX(-22deg); transition:left .56s ease; pointer-events:none;}
				.demo__item a:hover .demo_preview img {transform:scale(1.07);}
				.demo__item a:hover .demo_preview span {opacity:1; transform:translate(-50%, -50%) scale(1); box-shadow:0 12px 26px rgba(225,6,0,.3);}
				.demo__item a:hover .demo_preview span:before {left:130%;}
				.demo_details {display:flex; flex-flow:column;}
				.demo_details p,
					.demo_name {overflow: hidden; text-overflow: ellipsis; max-width: 100%; white-space: nowrap; color:#fff;}
				.demo_details p {color:rgba(255,255,255,.4); font-size:12px;}
	.article__container-cover {margin-top:36px; padding-bottom:25px;}
		.article__container {max-width:1040px; padding:32px; border:1px solid rgba(255,255,255,.08); border-radius:10px; background:#151515; color:rgba(255,255,255,.76);}
			.article__container h1 {margin-bottom:18px; color:#fff; font-size:32px; font-weight:600; line-height:1.22;}
			.article__container h2 {margin:34px 0 14px; color:#fff; font-size:24px; font-weight:600; line-height:1.28;}
			.article__container h3 {margin:26px 0 12px; color:#fff; font-size:20px; font-weight:600; line-height:1.3;}
			.article__container p {margin:0 0 14px; font-size:16px; line-height:1.7;}
			.article__container strong {color:#fff; font-weight:700;}
			.article__container a {color:#ff3b34; border-bottom:1px solid rgba(225,6,0,.45); transition:border-color .22s ease, color .22s ease;}
			.article__container a:hover {color:#fff; border-color:#e10600;}
			.article__container ul,
			.article__container ol {display:flex; flex-flow:column; gap:9px; margin:12px 0 20px; padding-left:22px; color:rgba(255,255,255,.78);}
			.article__container ul {list-style:disc;}
			.article__container ol {list-style:decimal;}
			.article__container li {padding-left:4px; line-height:1.65;}
			.article__container li::marker {color:#e10600;}
			.article__container table {width:100%; margin:18px 0 24px; border-collapse:collapse; overflow:hidden; border:1px solid rgba(255,255,255,.1); border-radius:10px; background:#271c1c; color:rgba(255,255,255,.78); font-size:15px;}
			.article__container tbody {}
			.article__container tr {border-bottom:1px solid rgba(255,255,255,.08);}
			.article__container tr:last-child {border-bottom:0;}
			.article__container th,
			.article__container td {padding:13px 14px; text-align:left; vertical-align:top; line-height:1.5;}
			.article__container th {background:#e10600; color:#fff; font-weight:600;}
			.article__container td:first-child {color:#fff; font-weight:600;}
			.article__pros-cons {display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:18px; margin:18px 0 28px;}
				.article__pros-cons-item {position:relative; overflow:hidden; padding:22px; border-radius:10px; background:#10131b;}
				.article__pros-cons-item:before {content:""; position:absolute; right:-48px; bottom:-78px; width:170px; height:170px; border-radius:50%; filter:blur(30px); opacity:.42; pointer-events:none;}
				.article__pros-cons-item--plus {border:1px solid rgba(31,200,101,.34); box-shadow:0 18px 46px rgba(31,200,101,.08);}
				.article__pros-cons-item--plus:before {background:#1fc865;}
				.article__pros-cons-item--minus {border:1px solid rgba(225,6,0,.38); box-shadow:0 18px 46px rgba(225,6,0,.12);}
				.article__pros-cons-item--minus:before {background:#e10600;}
					.article__pros-cons-item p {position:relative; z-index:2; margin:0 0 14px; color:#fff; font-size:18px; font-weight:700; line-height:1.3;}
					.article__pros-cons-item ul {position:relative; z-index:2; gap:10px; margin:0; padding:0; list-style:none;}
					.article__pros-cons-item li {position:relative; padding-left:25px; line-height:1.55;}
					.article__pros-cons-item li:before {content:""; position:absolute; left:0; top:.77em; width:9px; height:9px; border-radius:50%; transform:translateY(-50%);}
					.article__pros-cons-item--plus li:before {background:#1fc865; box-shadow:0 0 14px rgba(31,200,101,.65);}
					.article__pros-cons-item--minus li:before {background:#e10600; box-shadow:0 0 14px rgba(225,6,0,.65);}
			.article__faq {display:flex; flex-flow:column; gap:12px; margin:16px 0 0;}
				.article__faq-item {position:relative; overflow:hidden; padding:18px 20px; border:1px solid rgba(255,255,255,.08); border-radius:10px; background:#10131b;}
				.article__faq-item:before {content:""; position:absolute; right:-70px; top:-100px; width:180px; height:180px; border-radius:50%; background:#e10600; filter:blur(42px); opacity:.18; pointer-events:none;}
					.article__faq-question {position:relative; z-index:2; display:flex; align-items:flex-start; gap:10px; color:#fff; font-size:17px; font-weight:700; line-height:1.45;}
					.article__faq-question:before {content:"?"; min-width:26px; height:26px; display:inline-flex; align-items:center; justify-content:center; border-radius:7px; background:#e10600; color:#fff; font-size:15px; line-height:1;}
					.article__faq-answer {position:relative; z-index:2; display:flex; gap:12px; margin-top:10px; color:rgba(255,255,255,.72); font-size:15px; line-height:1.65;}
					.article__faq-answer:before {content:""; width:2px; min-width:2px; border-radius:2px; background:rgba(225,6,0,.7);}
.post__list {display:flex; gap:12px; max-width:1040px; margin:0px auto;}
.post__list li {width:calc(33.3% - 12px);}
.post__list li a {position:relative; overflow:hidden; padding-top:145px; border-radius:10px; display:block;}
.post__list li a img{position:absolute; left:0; top:0; right:0; width:100%; height:100%; object-fit:cover;    transition: transform .45s ease;}
.post__list li a:hover img {transform: scale(1.07);}
.main__footer {margin-top:28px; padding:24px 0 28px; border-top:1px solid rgba(255,255,255,.08);}
	.footer__container {max-width:1040px; width:calc(100% - 32px); margin:0 auto; display:flex; align-items:center; justify-content:space-between; gap:18px; padding:18px 20px; border:1px solid rgba(255,255,255,.08); border-radius:10px; background:#151515;}
		.footer__payments {display:flex; align-items:center; gap:14px;}
			.footer__title {color:rgba(255,255,255,.58); font-size:13px; line-height:1;}
			.footer__icons {display:flex; align-items:center; gap:8px;}
			.footer__icons img {width:auto; height:24px; max-width:58px; padding:4px 6px; border:1px solid rgba(255,255,255,.08); border-radius:7px; background:#271c1c;}
		.footer__responsible {display:flex; align-items:center; gap:10px;}
			.footer__responsible img {width:auto; max-width:110px; height:26px; object-fit:contain; opacity:.82;}
		.footer__copy {color:rgba(255,255,255,.54); font-size:13px; white-space:nowrap;}

@keyframes promoImagePulse {
	0%, 100% {transform:scale(1);}
	50% {transform:scale(1.045);}
}

@media (max-width: 1180px) {
	.demo__list {grid-template-columns: repeat(5, minmax(0, 1fr));}
}

@media (max-width: 1040px) {
	.post__list li a img {object-fit:contain;}
}
@media (max-width: 860px) {
	.main__nav-list {order:3; width:100%; overflow-x:auto;}
	.header__container {flex-wrap:wrap; gap:14px;}
	.nav-list {justify-content:flex-start; min-width:max-content;}
	.main__container {padding-top:16px;}
	.main__promo-section a {min-height:330px;}
		.promo__container {padding:42px 28px;}
		.promo__container h2 {max-width:520px; font-size:34px;}
	.demo__list {grid-template-columns: repeat(3, minmax(0, 1fr)); gap:14px;}
		.article__container {padding:24px;}
			.article__container h1 {font-size:28px;}
			.article__container h2 {font-size:22px;}
			.article__container h3 {font-size:19px;}
			.article__container table {display:block; overflow-x:auto; white-space:nowrap;}
			.article__pros-cons {grid-template-columns:1fr;}
}

@media (max-width: 760px) {
	.post__list {flex-wrap:wrap;}
	.post__list li { width: calc(50% - 12px); }
}
@media (max-width: 720px) {
	.post__section {display:none;}
	.main__footer {margin-top:0;}
}
@media (max-width: 690px) {
 .footer__container {flex-flow:column; align-items:center;}
}
@media (max-width: 580px) {
	.article__container,
	.demo__section,
	.main__promo-section,
	.header__container {width:calc(100% - 24px);}
	.main__header {padding:10px 0;}
	.header__rightside {width:100%; gap:10px;}
	.header__rightside a {flex:1; min-height:40px; padding:0 12px; font-size:14px;}
	.nav-list {gap:8px;}
		.nav-list_item a {gap:8px; font-size:14px;}
	.main__promo-section a {min-height:300px; border-radius:10px;}
		.promo__container {padding:30px 20px;}
		.promo__label span {font-size:12px;}
		.promo__container h2 {font-size:27px;}
		.promo__btn {min-height:48px; padding:0 18px; font-size:15px;}
	.demo__section {gap:16px; margin:16px auto;}
	.demo__categories {flex-wrap:nowrap; overflow-x:auto;}
	.demo__categories a {white-space:nowrap;}
	.demo__list {grid-template-columns: repeat(2, minmax(0, 1fr)); gap:12px;}
		.demo_preview span {min-height:34px; padding:0 14px; font-size:13px;}
	.article__container-cover {margin-top:28px;}
		.article__container {padding:20px 16px;}
			.article__container h1 {font-size:25px;}
			.article__container h2 {margin-top:28px; font-size:21px;}
			.article__container h3 {font-size:18px;}
			.article__container p {font-size:15px; line-height:1.65;}
			.article__container ul,
			.article__container ol {padding-left:20px;}
			.article__pros-cons {gap:12px; margin:14px 0 22px;}
				.article__pros-cons-item {padding:18px;}
					.article__pros-cons-item p {font-size:17px;}
					.article__pros-cons-item ul {padding:0;}
			.article__faq {gap:10px;}
				.article__faq-item {padding:16px;}
					.article__faq-question {font-size:16px;}
					.article__faq-answer {font-size:14px;}
		.footer__payments {flex-wrap:wrap;}
		.footer__copy {white-space:normal;}
}

@media (max-width: 480px) {
	.header__leftside {width:100%; gap:12px;}
		.header__menu-btn {display:inline-flex;}
	.main__nav-list {display:block; max-height:0; opacity:0; overflow:hidden; transition:max-height .28s ease, opacity .22s ease;}
	.main__header.is-menu-open .main__nav-list {max-height:360px; opacity:1;}
	.nav-list {min-width:0; flex-flow:column; align-items:stretch; gap:8px; padding:10px; border:1px solid rgba(255,255,255,.08); border-radius:10px; background:#151515;}
		.nav-list_item {width:100%;}
		.nav-list_item a {min-height:42px; padding:0 12px; border-radius:8px; background:#271c1c; display: flex; width: 100%; justify-content: center;}
		.nav-list_item a.select,
		.nav-list_item a:hover {background:#e10600; color:#fff;}
	.footer__icons {flex-wrap:wrap;}
}
 
