/* --- ГАЛЕРЕЯ: ОДНА КОЛОНКА, ПО ЦЕНТРУ, МАКС. ШИРИНА 640 PX --- */

	.gallery-container {
	padding: 20px;
	display: flex;
	justify-content: center;
}

	.gallery-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 20px;
	max-width: 640px;
	width: 100%;
}

	.card {
	max-width: 640px;
	margin: 0 auto;
	background: #fff; 
	border-radius: 10px; 
	overflow: hidden;
	box-shadow: 0 4px 12px rgba(0,0,0,0.30);
	display: flex; flex-direction: column;
    }

	.card-img { 
	width: 100%; 
	aspect-ratio: 16/9; 
	object-fit: cover; 
	display: block; 
}

	.card-info {
	padding: 14px; 
	flex-grow: 1;
	display: flex; 
	flex-direction: column; 
	justify-content: space-between;
}

	.card-title { 
	font-weight: 600; 
	margin-bottom: 6px; 
}

	.card-desc { 
	color: #666; 
	font-size: 0.9rem; 
	line-height: 1.3; 
	margin-bottom: 14px; 
	flex-grow: 1; 
}

/* Ссылки внутри описания (цвета и эффекты при наведении) */

	.card-desc a:link, .card-desc a:visited {
	color: #8b0000;
	text-decoration: none;
}
	.card-desc a:hover { 
	color: red; 
	text-decoration: none; 
}
	.card-desc a:active { 
	color: #8b0000; 
	text-decoration: none; 
}

/* Кнопка «СЛУШАТЬ» и другие кнопки */

	.btn {
	text-decoration: none;
	display: inline-block;
	padding: 10px 16px;
	border: 1px solid #e0e0e0;
	border-radius: 6px;
	color: #333;
	background: transparent;
	cursor: pointer;
	font-size: 0.95rem;
	transition: all 0.2s ease;
	width: 100%;
	text-align: center;
}
	.btn:hover {
	border-color: #8b0000;
	color: #8b0000;
	background-color: #fff5f5;
}

/* --- ПЛЕЕРЫ: ОБЁРТКИ И СТИЛИ --- */

/* Обертка аудиоплеера: рамка, скругление, отступы — как у кнопки */

	.audio-player-wrapper {
	margin-top: 16px;             /* отступ от кнопки */
	padding: 12px;                /* внутренние отступы, чтобы плеер не прилипал к краям */
	border: 1px solid #e0e0e0;    /* рамка как у кнопки .btn */
	border-radius: 6px;           /* скругление углов */
	background-color: #fff;       /* белый фон под плеером */
	width: 100%;                  /* растягивается на всю ширину карточки */
	box-sizing: border-box;       /* padding не увеличивает ширину блока */
}

/* Сам элемент audio: на всю ширину внутри обёртки */

	.audio-player-wrapper audio {
	width: 100%;
	display: block;
	outline: none;               /* убирает синюю рамку браузера при фокусе */
}

/* Обертка видеоплеера: стилизованы так же, как аудио, для единого вида */

	.video-player-wrapper {
	margin-top: 16px;             /* отступ от аудиоплеера */
	padding: 12px;
	border: 1px solid #e0e0e0;
	border-radius: 6px;
	background-color: #fff;
	width: 100%;
	box-sizing: border-box;
}

/* Сам элемент video: на всю ширину */

	.video-player-wrapper video {
	width: 100%;
	display: block;
	outline: none;
	max-width: 100%;             /* страховка на случай очень больших экранов */
}

/* АДАПТИВНОСТЬ: МОБИЛЬНЫЕ УСТРОЙСТВА */

	@media (max-width: 767px) {
	.mobile-toggle { 
	display: flex; 
	align-items: center; 
}
	.nav-links { 
	display: none; 
}
	.dropdown-menu {
        position: fixed;
        top: 64px; 
	left: 50%; 
	transform: translateX(-50%);
        width: 260px; 
	max-width: none; 
	right: auto;
}
	.gallery-container { 
	padding: 16px; 
}
	.card { 
	max-width: none; 
	margin: 0; }
	.gallery-grid { 
	max-width: 100%; 
}

/* На мобильных уменьшаем отступы внутри плееров, чтобы не было слишком тесно */

	.audio-player-wrapper, .video-player-wrapper {
        padding: 8px;
        margin-top: 14px;
}
}