.support-grid {
	display:               grid;
	grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
	gap:                   0;
	border-left:           1px solid #e5e5e5;
	border-top:            1px solid #e5e5e5;
	margin-bottom:         24px;
}

.support-grid__item {
	border-right:  1px solid #e5e5e5;
	border-bottom: 1px solid #e5e5e5;
	background:    #fff;
}

.support-grid__link {
	display:         flex;
	flex-direction:  column;
	align-items:     center;
	justify-content: center;
	min-height:      190px;
	padding:         24px 16px;
	text-decoration: none;
	color:           #222;
}

.support-grid__image-wrap {
	height:          70px;
	display:         flex;
	align-items:     center;
	justify-content: center;
	margin-bottom:   18px;
}

.support-grid__image {
	max-height: 70px;
	max-width:  180px;
	width:      auto;
	height:     auto;
}

.support-grid__placeholder {
	width:         70px;
	height:        70px;
	border:        2px solid #d9d9d9;
	border-radius: 4px;
	display:       inline-block;
}

.support-grid__name {
	font-size:   20px;
	line-height: 1.3;
	font-weight: 700;
	text-align:  center;
}

.support-folder {
	display:               grid;
	grid-template-columns: 320px 1fr;
	gap:                   0;
	border:                1px solid #e5e5e5;
}

.support-folder__sidebar {
	background:   #f5f6f7;
	padding:      24px;
	border-right: 1px solid #e5e5e5;
}

.support-folder__sidebar-title {
	font-size:      13px;
	font-weight:    700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	margin-bottom:  16px;
	color:          #7a7f86;
}

.support-folder__brand-list {
	display:        flex;
	flex-direction: column;
	gap:            8px;
}

.support-folder__brand-link {
	display:         block;
	padding:         10px 12px;
	border-radius:   4px;
	text-decoration: none;
	color:           #2c2f33;
	font-weight:     600;
}

.support-folder__brand-link:hover,
.support-folder__brand-link--active {
	background: #fff;
	color:      #2f66ff;
}

.support-folder__content {
	padding:    24px;
	background: #fff;
}

.support-folder__header {
	display:       flex;
	align-items:   center;
	gap:           16px;
	margin-bottom: 20px;
}

.support-folder__back {
	font-size:       14px;
	font-weight:     600;
	color:           #2c2f33;
	text-decoration: none;
}

.support-folder__title {
	margin:      0;
	font-size:   30px;
	line-height: 1.2;
}

.support-docs {
	display:        flex;
	flex-direction: column;
	border:         1px solid #e5e5e5;
	border-radius:  4px;
	overflow:       hidden;
}

.support-docs__item {
	display:               grid;
	grid-template-columns: 42px 1fr auto;
	align-items:           center;
	gap:                   16px;
	padding:               16px 18px;
	text-decoration:       none;
	color:                 #252a31;
	border-bottom:         1px solid #ececec;
	background:            #fff;
}

.support-docs__item:last-child {
	border-bottom: 0;
}

.support-docs__item:hover {
	background: #fafbfc;
}

.support-docs__icon {
	width:           42px;
	height:          42px;
	display:         flex;
	align-items:     center;
	justify-content: center;
	font-size:       10px;
	font-weight:     700;
	letter-spacing:  0.03em;
	border:          1px solid #d6d6d6;
	border-radius:   4px;
	color:           #5d6570;
	text-transform:  uppercase;
}

.support-docs__meta {
	min-width: 0;
}

.support-docs__name {
	font-size:     18px;
	line-height:   1.35;
	font-weight:   600;
	color:         #222;
	margin-bottom: 4px;
	word-break:    break-word;
}

.support-docs__subline {
	display:     flex;
	gap:         12px;
	font-size:   13px;
	line-height: 1.3;
	color:       #7a7f86;
}

.support-docs__action {
	font-size:   14px;
	font-weight: 700;
	color:       #2f66ff;
	white-space: nowrap;
}

@media (max-width: 991px) {
	.support-folder {
		grid-template-columns: 1fr;
	}

	.support-folder__sidebar {
		border-right:  0;
		border-bottom: 1px solid #e5e5e5;
	}
}

@media (max-width: 767px) {
	.support-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.support-grid__link {
		min-height: 150px;
	}

	.support-grid__name {
		font-size: 16px;
	}

	.support-folder__title {
		font-size: 24px;
	}

	.support-docs__item {
		grid-template-columns: 34px 1fr;
		gap:                   12px;
	}

	.support-docs__action {
		grid-column: 2;
	}

	.support-docs__name {
		font-size: 16px;
	}
}
