/* Блок «Поделиться с друзьями»: кнопка MAX и подсказка о скопированной ссылке. */

/* Кнопка MAX — иконка «облачко сообщения» белым на сине-фиолетовом фоне. */
ul.svg-social-icons li a.max-icon {
	background: linear-gradient(135deg, #6b5cff 0%, #2f7dfa 100%);
}

ul.svg-social-icons li a.max-icon:before {
	content: '';
	position: absolute;
	top: 8px;
	left: 8px;
	width: 20px;
	height: 20px;
	background-repeat: no-repeat;
	background-size: 20px 20px;
	background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'%3e%3cpath d='M12 3C6.9 3 3 6.4 3 10.6c0 2.3 1.2 4.3 3.2 5.7-.2 1.3-.8 2.4-1.4 3.1-.2.3 0 .6.3.6 2 0 3.6-.9 4.7-1.7 1.1.3 2.2.4 3.2.4 5.1 0 9-3.4 9-7.6S17.1 3 12 3zm-3.6 9.2c-.7 0-1.3-.6-1.3-1.3s.6-1.3 1.3-1.3 1.3.6 1.3 1.3-.6 1.3-1.3 1.3zm3.6 0c-.7 0-1.3-.6-1.3-1.3s.6-1.3 1.3-1.3 1.3.6 1.3 1.3-.6 1.3-1.3 1.3zm3.6 0c-.7 0-1.3-.6-1.3-1.3s.6-1.3 1.3-1.3 1.3.6 1.3 1.3-.6 1.3-1.3 1.3z'/%3e%3c/svg%3e");
}

ul.svg-social-icons li a.max-icon:hover {
	opacity: .88;
}

/* Подсказка «ссылка скопирована» */
.ochag-share-note {
	position: fixed;
	left: 50%;
	bottom: 24px;
	transform: translateX(-50%) translateY(8px);
	background: #1f2a24;
	color: #fff;
	padding: 10px 18px;
	border-radius: 8px;
	font: 14px/1.4 -apple-system, 'Segoe UI', Arial, sans-serif;
	opacity: 0;
	pointer-events: none;
	transition: opacity .2s ease, transform .2s ease;
	z-index: 100000;
}

.ochag-share-note--on {
	opacity: 1;
	transform: translateX(-50%) translateY(0);
}

/* Картинка записи внутри статьи: не даём вылезать за колонку */
.post-content .single-thumb {
	margin: 0 0 26px;
}

.post-content .single-thumb img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: 10px;
}

/* ============================================================
   Комфортная статья: тема отдавала тексту всю ширину (1400 px при 1920,
   это примерно 130 знаков в строке) и крупный кегль 19,8 px.
   Ограничиваем колонку и уменьшаем шрифт — читать заметно легче.
   ============================================================ */

.gp-single-post {
	max-width: 820px;
	margin-left: auto;
	margin-right: auto;
}

.gp-single-post .post-content,
.gp-single-post .post-content p,
.gp-single-post .post-content li,
.gp-single-post .post-content blockquote {
	font-size: 17.5px;
	line-height: 1.62;
}

/* Текст по ширине, а не по левой кромке: оба края ровные.
   Переносы включены — иначе в русском тексте появляются большие дыры между словами. */
.gp-single-post .post-content p,
.gp-single-post .post-content li,
.gp-single-post .post-content blockquote {
	text-align: justify;
	hyphens: auto;
	-webkit-hyphens: auto;
	-ms-hyphens: auto;
	overflow-wrap: break-word;
}

/* Заголовки, подписи и списки кнопок по ширине не растягиваем */
.gp-single-post .post-content h2,
.gp-single-post .post-content h3,
.gp-single-post .post-header,
.gp-single-post .post-footer {
	text-align: left;
}

.gp-single-post .post-content p {
	margin: 0 0 20px;
}

.gp-single-post .post-content h2 {
	font-size: 25px;
	line-height: 1.3;
	margin: 34px 0 12px;
}

.gp-single-post .post-content h3 {
	font-size: 20px;
	line-height: 1.35;
	margin: 26px 0 10px;
}

.gp-single-post .post-content ul,
.gp-single-post .post-content ol {
	margin: 0 0 20px 22px;
}

.gp-single-post .post-content li {
	margin: 0 0 8px;
}

.gp-single-post h1.post-title {
	font-size: 31px;
	line-height: 1.25;
	margin-bottom: 12px;
}

.gp-single-post .post-header__items {
	font-size: 14px;
}

/* На телефоне колонку не ограничиваем — там и так узко */
@media (max-width: 860px) {
	.gp-single-post {
		max-width: none;
	}
}

