@media (min-width: 769px) {
    /* Контейнер пагинации на ПК */
    .pagination {
        display: flex !important;
        justify-content: flex-end; /* Например, прижать к правому краю на ПК */
        gap: 12px;
        margin-top: 50px;
		
    }
	.pagination-btn {
        width: 40px !important;
        height: 40px !important;
        background-color: #a30e0e !important;
        border: 1px solid #444 !important;
		margin: 30px auto !important;      /* ДОБАВЛЕНО: Центрирует сам блок пагинации по горизонтали */

    }

   
}
  @media screen and (min-width: 769px) {
        /* Создаем переменную, которая скроет блок только на ПК */
        .header-contacts {
            display: none !important;
        }
        /* Дополнительная страховка: скрываем сами ссылки внутри */
        .header-contacts a.header-contact {
            display: none !important;
        }
    }
.lang-switcher {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    font-weight: 600;
    margin-left: 15px;
}
.lang-link {
    color: #888;
    text-decoration: none;
    transition: 0.3s;
}
.lang-link:hover {
    color: #fc5130;
}
.lang-current {
    color: #fff;
    border-bottom: 1px solid #fc5130;
}
.lang-sep {
    color: #444;
}
.particles {
	position: fixed;
	width: 100%;
	z-index: -1;
	left: 0;
	height: 100%;
	top: 0
}


.footer-section a:hover,
.logo .elite,
.nav-menu a.active,
.nav-menu a:hover {
	color: #dc2626
}

.faq-title,
.info-center,
.info-header,
.section-title {
	text-align: center
}

.footer-links,
.nav-menu {
	list-style: none
}

.clear-filters,
.info-cta,
.logo,
.model-card,
.nav-menu a {
	text-decoration: none
}

.checkbox-group,
.faq-answer,
.faq-item,
.info-card,
.model-card,
.model-image {
	overflow: hidden
}

.channel-btn svg {
	filter: drop-shadow(0 2px 4px rgba(0, 0, 0, .3))
}

* {
	margin: 0;
	padding: 0;
	box-sizing: border-box
}

body {
	font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
	line-height: 1.6;
	color: #333;
	background: #fafafa;
	overflow-x: hidden
}

.nav-menu a::after,
.particle {
	background: #dc2626;
	position: absolute
}

.particles {
	pointer-events: none
}

.particle {
	width: 3px;
	height: 3px;
	opacity: .4;
	animation: 25s linear infinite float
}

.header {
	background: rgba(0, 0, 0, .95);
	border-bottom: 1px solid rgba(220, 38, 38, .3)
}

@keyframes float {
	0% {
		transform: translateY(100vh) rotate(0);
		opacity: 0
	}

	10%,
	90% {
		opacity: .4
	}

	100% {
		transform: translateY(-100vh) rotate(360deg);
		opacity: 0
	}
}

.header {
	position: sticky;
	top: 0;
	z-index: 100;
	box-shadow: 0 2px 20px rgba(0, 0, 0, .3)
}
.info-section{
	display: flex
}

.faq-item,
.faq-question,
.faq-section,
.faq-title,
.info-card,
.info-center,
.info-section,
.logo,
.nav-menu a {
	position: relative
}

.nav-container {
    max-width: 100%; 
    width: 100%;    
    margin: 0;      
    padding: 0 40px; 
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 60px;
}

.checkbox-group {
	display: flex;
	align-items: center
}

.logo {
	font-size: 28px;
	font-weight: 900;
	color: #fff;
	letter-spacing: -1px
}

.nav-menu a {
	letter-spacing: 1px;
	transition: .3s;
	text-transform: uppercase
}

.logo::before {
	content: '';
	position: absolute;
	top: 0;
	left: -10px;
	width: 4px;
	height: 100%;
	background: linear-gradient(to bottom, #dc2626, #991b1b)
}

.logo .elite {
	text-shadow: 0 0 30px rgba(220, 38, 38, .5)
}

.nav-menu {
	display: flex;
	gap: 30px
}

.nav-menu a {
	color: #ccc;
	font-weight: 500;
	font-size: 13px
}

.nav-menu a::after {
	content: '';
	bottom: -5px;
	left: 0;
	width: 0;
	height: 2px;
	transition: width .3s
}

.nav-menu a.active::after,
.nav-menu a:hover::after {
	width: 100%
}

.model-card {
	border: none;
	cursor: pointer
}

.checkbox-group::before {
	content: '';
	position: absolute;
	top: 0;
	left: -100%;
	width: 100%;
	height: 100%;
	background: linear-gradient(90deg, transparent, rgba(220, 38, 38, .2), transparent);
	transition: left .4s
}

.channel-btn:hover::before,
.checkbox-group:hover::before {
	left: 100%
}

.checkbox:hover {
	border-color: #dc2626;
	box-shadow: 0 0 10px rgba(220, 38, 38, .3)
}

.checkbox-group span {
	color: #fff;
	font-weight: 500;
	cursor: pointer;
	font-size: 13px
}

.badge,
.info-header h2,
.section-title {
	font-weight: 700;
	text-transform: uppercase
}

.filter-select:hover {
	border-color: rgba(220, 38, 38, .5)
}

.models-section {
	padding: 40px 20px;
	position: relative
}
.info-container{
display: grid

}


.info-container,
.models-container {
	max-width: 1400px;
	margin: 0 auto;
	position: relative;
	z-index: 1;
	
}

.section-title {
	font-size: 28px;
	margin-bottom: 30px;
	margin-top: 30px;
	color: #1a1a1a;
	letter-spacing: 2px;
	position: relative
}

.section-title::after {
	content: '';
	position: absolute;
	bottom: -8px;
	left: 50%;
	transform: translateX(-50%);
	width: 80px;
	height: 3px;
	background: linear-gradient(45deg, #dc2626, #991b1b)
}

.info-card:hover,
.model-card:hover {
	transform: translateY(-5px)
}

.models-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
	gap: 25px;
	min-height: 800px; /* ДОДАНО: Резервуємо місце, щоб сторінка не стрибала (CLS) */
            align-content: start;
}

.model-card {
	background: 0 0;
	position: relative;
	transition: .4s;
	border-radius: 8px
}

/* Стили для неактивных стрелок (disabled), если они есть */
.pagination-btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
    pointer-events: none;
}
.model-image {
	width: 100%;
	height: 500px;
	position: relative;
	border-radius: 8px;
	background: linear-gradient(135deg, #f8f9fa, #e9ecef);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 60px
}

.model-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: .3s
}

.model-card:hover .model-image img {
	filter: brightness(.4)
}

.model-badges {
	position: absolute;
	top: 15px;
	left: 15px;
	display: flex;
	flex-direction: column;
	gap: 8px;
	z-index: 3
}

/* КЛАСС ДЛЯ АКТИВНОЙ СТРАНИЦЫ */

/* Эффект при наведении на обычную кнопку */

@media screen and (max-width: 768px) {
    .model-info {
        position: absolute !important;
        bottom: 12px !important;
        left: 0 !important;
        width: 100% !important;
        padding: 0 15px !important;
        box-sizing: border-box !important;
        z-index: 10 !important;
        
        /* Выравниваем в одну строку */
        display: flex !important;
        flex-direction: row !important; 
        justify-content: space-between !important; 

    }

    .model-name {
        /* Убираем font-family, чтобы наследовался из body */
        font-family: inherit !important; 
        font-size: 18px !important;
        font-weight: 700 !important;
        color: #ffffff !important;
        margin: 0 !important;
        padding: 0 !important;
        text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.8) !important;
        line-height: 1 !important;
		
    }

    .model-price {
        /* Убираем font-family, чтобы наследовался из body */
        font-family: inherit !important;
        font-size: 18px !important;
        font-weight: 700 !important;
        color: #ffffff !important;
        margin: 0 !important;
        padding: 0 !important;
        text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.8) !important;
        white-space: nowrap !important;
        line-height: 1 !important;
    }
}

/* --- СТИЛИ ДЛЯ ПК (экран от 769px) --- */
@media screen and (min-width: 769px) {
    .model-info {
        position: absolute !important;
        bottom: 0 !important;
        left: 0 !important;
        width: 100% !important;
        /* Увеличиваем градиент, чтобы цена на светлом фоне не терялась */
        background: linear-gradient(to top, rgba(0,0,0,0.9) 0%, transparent 100%) !important;
        padding: 20px 15px 5px 15px !important; 
        box-sizing: border-box !important;
        z-index: 10 !important;
        display: flex !important;
		justify-content: space-between !important;
		align-items: flex-end !important;
    }

    .model-name {
        font-family: inherit !important;
        font-size: 20px !important;
        font-weight: 700 !important;
        color: #ffffff !important;
        margin: 0 !important;
        padding-bottom: 2px !important;
        text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.8) !important;
        text-transform: uppercase !important;
        /* ДОБАВЛЕНО: если имя слишком длинное, оно не налезет на цену */
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
		flex-shrink: 1 !important;
    }

    .model-price {
        font-family: inherit !important;
        font-size: 20px !important;
        font-weight: 700 !important;
        color: #ffffff !important;
        margin: 0 !important;
        /* ИСПРАВЛЕНО: добавляем отступ справа, чтобы цена не прилипала к краю карточки */
        padding: 0 5px 2px 0 !important; 
        white-space: nowrap !important;
		flex-shrink: 0 !important;
		text-align: right !important;
        /* ДОБАВЛЕНО: акцент на цену цветом, если нужно (например, красный как в пагинации) */
        /* color: #dc2626 !important; */
    }
}
.model-description {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	color: #fff;
	font-size: 14px;
	line-height: 1.6;
	text-align: center;
	padding: 20px;
	opacity: 0;
	transition: opacity .3s;
	z-index: 2;
	max-width: 90%
}

.model-card:hover .model-description {
	opacity: 1
}

.badge {
	padding: 6px 12px;
	font-size: 10px;
	letter-spacing: .5px;
	backdrop-filter: blur(10px);
	border: 1px solid rgba(255, 255, 255, .5);
	clip-path: polygon(0 0, calc(100% - 8px) 0, 100% 8px, 100% 100%, 8px 100%, 0 calc(100% - 8px))
}

.filters-section {
	backdrop-filter: blur(20px)
}

.info-header h2,
.model-name {
	font-size: 20px;
	letter-spacing: 1px
}

.badge.vip {
	background: linear-gradient(45deg, #ff6b00, #ff8500);
	color: #fff;
	box-shadow: 0 0 20px rgba(255, 107, 0, .3)
}

.badge.verified {
	background:linear-gradient(45deg, #3b82f6, #1d4ed8);
	color: #fff;
	box-shadow: 0 0 20px rgba(22, 16, 185, 0.3)
}

.badge.video {
	background: linear-gradient(45deg, #dc2626, #991b1b);
	color: #fff;
	box-shadow: 0 0 20px rgba(220, 38, 38, .3)
}

.badge.online {
	box-shadow: 0 0 20px rgba(59, 130, 246, .3)
}

.badge.online {
	background: linear-gradient(45deg, #10b981, #059669);
	color: #fff;
	animation: 2s infinite pulse
}

@keyframes pulse {

	0%,
	100% {
		transform: scale(1)
	}

	50% {
		transform: scale(1.05)
	}
}


.model-name {
	text-transform: uppercase;
	font-weight: 600;
	margin-bottom: 25px;
	color: #fff;
	text-transform: uppercase
}

.info-card h3 {
	color: #dc2626;
	text-transform: uppercase
}

.info-section {
	padding: 40px 20px;
	background: #fff
}

.info-card,
.info-header {
	background: rgba(0, 0, 0, .95);
	color: #fff
}

.faq-section::before,
.info-section::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #fff;
	background-image: url("data:image/svg+xml,%3Csvg width='180' height='180' viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M81.28 88H68.413l19.298 19.298L81.28 88zm2.107 0h13.226L90 107.838 83.387 88zm15.334 0h12.866l-19.298 19.298L98.72 88zm-32.927-2.207L73.586 78h32.827l.5.5 7.294 7.293L115.414 87l-24.707 24.707-.707.707L64.586 87l1.207-1.207zm2.62.207L74 80.414 79.586 86H68.414zm16 0L90 80.414 95.586 86H84.414zm16 0L106 80.414 111.586 86h-11.172zm-8-6h11.173L98 85.586 92.414 80zM82 85.586L87.586 80H76.414L82 85.586zM17.414 0L.707 16.707 0 17.414V0h17.414zM4.28 0L0 12.838V0h4.28zm10.306 0L2.288 12.298 6.388 0h8.198zM180 17.414L162.586 0H180v17.414zM165.414 0l12.298 12.298L173.612 0h-8.198zM180 12.838L175.72 0H180v12.838zM0 163h16.413l.5.5 7.294 7.293L25.414 172l-8 8H0v-17zm0 10h6.613l-2.334 7H0v-7zm14.586 7l7-7H8.72l-2.333 7h8.2zM0 165.414L5.586 171H0v-5.586zM10.414 171L16 165.414 21.586 171H10.414zm-8-6h11.172L8 170.586 2.414 165zM180 163h-16.413l-7.794 7.793-1.207 1.207 8 8H180v-17zm-14.586 17l-7-7h12.865l2.333 7h-8.2zM180 173h-6.613l2.334 7H180v-7zm-21.586-2l5.586-5.586 5.586 5.586h-11.172zM180 165.414L174.414 171H180v-5.586zm-8 5.172l5.586-5.586h-11.172l5.586 5.586zM152.933 25.653l1.414 1.414-33.94 33.942-1.416-1.416 33.943-33.94zm1.414 127.28l-1.414 1.414-33.942-33.94 1.416-1.416 33.94 33.943zm-127.28 1.414l-1.414-1.414 33.94-33.942 1.416 1.416-33.943 33.94zm-1.414-127.28l1.414-1.414 33.942 33.94-1.416 1.416-33.94-33.943zM0 85c2.21 0 4 1.79 4 4s-1.79 4-4 4v-8zm180 0c-2.21 0-4 1.79-4 4s1.79 4 4 4v-8zM94 0c0 2.21-1.79 4-4 4s-4-1.79-4-4h8zm0 180c0-2.21-1.79-4-4-4s-4 1.79-4 4h8z' fill='%23bf8888' fill-opacity='0.4' fill-rule='evenodd'/%3E%3C/svg%3E");
	pointer-events: none;
	z-index: 0
}
.text-element {
    border-top: 15px solid transparent; /* Это создаст разрыв, который нельзя «сломать» */
    background-clip: padding-box; /* Чтобы фон не залез на границу */
	margin-bottom: 20px
}

.info-header {
	padding: 15px 25px;
	margin-bottom: 30px;
	gap: 15px;
}

.info-grid {
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	gap: 30px;
	margin-bottom: 15px
}

.info-card {
	padding: 25px;
	transition: .3s
}

.info-card::before,
.info-cta {
	background: linear-gradient(45deg, #dc2626, #991b1b)
}

.info-card::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 4px
}

.info-card:hover {
	box-shadow: 0 10px 30px rgba(220, 38, 38, .2)
}

.info-card h3 {
	font-size: 16px;
	font-weight: 600;
	margin-bottom: 12px;
	letter-spacing: .5px
}

.info-card p {
	color: #ccc;
	line-height: 1.6;
	font-size: 13px
}

.info-center {
	margin-top: 30px;
	z-index: 1
}

.footer-section h3,
.info-cta {
	font-weight: 600;
	letter-spacing: 1px
}

.info-cta {
	display: inline-block;
	color: #fff;
	padding: 12px 30px;
	text-transform: uppercase;
	transition: .3s;
	font-size: 14px
}

.info-cta:hover {
	transform: translateY(-2px);
	box-shadow: 0 8px 25px rgba(220, 38, 38, .4)
}

.faq-section {
	padding: 40px 20px;
	background: #fafafa
}

.faq-item,
.faq-question {
	background: rgba(0, 0, 0, .95)
}

.faq-title {
	font-size: 26px;
	font-weight: 700;
	margin-bottom: 35px;
	color: #1a1a1a;
	text-transform: uppercase;
	letter-spacing: 2px;
	z-index: 1
}

.clear-filters,
.filter-select {
	letter-spacing: .5px;
	text-transform: uppercase
}

.faq-item {
	margin-bottom: 8px;
	z-index: 1
}

.faq-question {
	color: #fff;
	padding: 15px 25px;
	cursor: pointer;
	font-weight: 500;
	font-size: 14px;
	border: none;
	width: 100%;
	text-align: left;
	transition: .3s
}

.faq-question:hover {
	background: rgba(220, 38, 38, .2)
}

.footer {
	background: rgba(0, 0, 0, .98);
	color: #fff;
	padding: 40px 20px 25px;
	border-top: 1px solid rgba(220, 38, 38, .3)
}

.footer-container {
	max-width: 1400px;
	margin: 0 auto 30px;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
	gap: 30px
}

.footer-section h3 {
	color: #dc2626;
	font-size: 16px;
	margin-bottom: 15px;
	text-transform: uppercase
}

.footer-section a,
.footer-section p {
	color: #ccc;
	text-decoration: none;
	line-height: 1.8;
	font-size: 13px;
	transition: color .3s
}

.footer-links li {
	margin-bottom: 8px
}

.footer-bottom {
	border-top: 1px solid rgba(255, 255, 255, .1);
	padding-top: 25px;
	text-align: center;
	color: #666;
	font-size: 11px
}

.faq-question {
	padding-right: 40px
}

.faq-icon {
	position: absolute;
	right: 25px;
	top: 50%;
	transform: translateY(-50%);
	font-size: 18px;
	font-weight: 700;
	transition: transform .3s
}

.faq-answer {
	max-height: 0;
	background: rgba(40, 40, 40, .95);
	transition: max-height .3s, padding .3s;
	padding: 0 25px
}

.faq-answer p {
	color: #ccc;
	line-height: 1.6;
	font-size: 14px;
	margin: 0
}

.channel-btn::before {
	content: '';
	position: absolute;
	top: 0;
	left: -100%;
	width: 100%;
	height: 100%;
	transition: left .4s;
	z-index: -1
}

.telegram-channel::before {
	background: linear-gradient(90deg, transparent, rgba(59, 130, 246, .3), transparent)
}

.whatsapp-channel::before {
	background: linear-gradient(90deg, transparent, rgba(16, 185, 129, .3), transparent)
}

@media (max-width:768px) {
	.nav-menu {
		display: none
	}

	.checkbox-filters {
		justify-content: center;
		gap: 10px
	}

	.models-grid {
		grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
		gap: 15px
	}

	.nav-container {
		height: 55px
	}

	.logo {
		font-size: 24px
	}
}

@media (max-width:480px) {

	.models-grid {
		grid-template-columns: 1fr
	}

	.filters-section,
	.models-section {
		padding: 5px 15px
	}

	.back {
		background-image: url("data:image/svg+xml,%3Csvg width='180' height='180' viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M81.28 88H68.413l19.298 19.298L81.28 88zm2.107 0h13.226L90 107.838 83.387 88zm15.334 0h12.866l-19.298 19.298L98.72 88zm-32.927-2.207L73.586 78h32.827l.5.5 7.294 7.293L115.414 87l-24.707 24.707-.707.707L64.586 87l1.207-1.207zm2.62.207L74 80.414 79.586 86H68.414zm16 0L90 80.414 95.586 86H84.414zm16 0L106 80.414 111.586 86h-11.172zm-8-6h11.173L98 85.586 92.414 80zM82 85.586L87.586 80H76.414L82 85.586zM17.414 0L.707 16.707 0 17.414V0h17.414zM4.28 0L0 12.838V0h4.28zm10.306 0L2.288 12.298 6.388 0h8.198zM180 17.414L162.586 0H180v17.414zM165.414 0l12.298 12.298L173.612 0h-8.198zM180 12.838L175.72 0H180v12.838zM0 163h16.413l.5.5 7.294 7.293L25.414 172l-8 8H0v-17zm0 10h6.613l-2.334 7H0v-7zm14.586 7l7-7H8.72l-2.333 7h8.2zM0 165.414L5.586 171H0v-5.586zM10.414 171L16 165.414 21.586 171H10.414zm-8-6h11.172L8 170.586 2.414 165zM180 163h-16.413l-7.794 7.793-1.207 1.207 8 8H180v-17zm-14.586 17l-7-7h12.865l2.333 7h-8.2zM180 173h-6.613l2.334 7H180v-7zm-21.586-2l5.586-5.586 5.586 5.586h-11.172zM180 165.414L174.414 171H180v-5.586zm-8 5.172l5.586-5.586h-11.172l5.586 5.586zM152.933 25.653l1.414 1.414-33.94 33.942-1.416-1.416 33.943-33.94zm1.414 127.28l-1.414 1.414-33.942-33.94 1.416-1.416 33.94 33.943zm-127.28 1.414l-1.414-1.414 33.94-33.942 1.416 1.416-33.943 33.94zm-1.414-127.28l1.414-1.414 33.942 33.94-1.416 1.416-33.940-33.943zM0 85c2.21 0 4 1.79 4 4s-1.79 4-4 4v-8zm180 0c-2.21 0-4 1.79-4 4s1.79 4 4 4v-8zM94 0c0 2.21-1.79 4-4 4s-4-1.79-4-4h8zm0 180c0-2.21-1.79-4-4-4s-4 1.79-4 4h8z' fill='%23bf8888' fill-opacity='0.4' fill-rule='evenodd'/%3E%3C/svg%3E");
		background-repeat: repeat;
		background-size: auto
	}

	.filters-section {
		background: rgba(0, 0, 0, .95);
		padding: 25px 20px;
		border-bottom: 1px solid rgba(220, 38, 38, .3)
	}

	.filters-container {
		max-width: 1400px;
		margin: 0 auto
	}

	.filter-header {
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-bottom: 20px
	}

	.filter-count {
		color: #fff;
		font-size: 14px;
		font-weight: 500
	}

	.clear-filters {
		color: #dc2626;
		font-size: 12px;
		padding: 6px 12px;
		border: 1px solid #dc2626;
		transition: .3s;
		font-weight: 600;
		background: rgba(0, 0, 0, .3)
	}

	.clear-filters:hover {
		background: #dc2626;
		color: #fff;
		box-shadow: 0 3px 15px rgba(220, 38, 38, .4)
	}

	.checkbox-filters {
		display: flex;
		gap: 15px;
		margin-bottom: 20px;
		flex-wrap: wrap;
		justify-content: center
	}

	.checkbox-group {
		display: flex;
		align-items: center;
		gap: 8px;
		padding: 10px 18px;
		background: rgba(0, 0, 0, .6);
		border: 1px solid rgba(255, 255, 255, .1);
		transition: .3s;
		position: relative;
		cursor: pointer
	}

	.checkbox,
	.filter-select {
		background: rgba(0, 0, 0, .8);
		transition: .3s;
		cursor: pointer
	}

	.checkbox-group:hover {
		background: rgba(220, 38, 38, .1);
		border-color: rgba(220, 38, 38, .3);
		transform: translateY(-1px)
	}

	.checkbox {
		appearance: none;
		width: 16px;
		height: 16px;
		border: 2px solid #555;
		position: relative
	}

	.filter-select,
	.pagination-btn {
		border: 1px solid rgba(220, 38, 38, .3)
	}

	.checkbox:checked {
		background: #dc2626;
		border-color: #dc2626;
		box-shadow: 0 0 15px rgba(220, 38, 38, .5)
	}

	.checkbox:checked::after {
		content: '✓';
		position: absolute;
		top: -3px;
		left: 2px;
		color: #fff;
		font-size: 12px;
		font-weight: 700
	}

	.filters-grid {
		display: grid;
		grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
		gap: 15px
	}

	.filter-select {
		color: #fff;
		padding: 10px 15px;
		font-size: 12px;
		outline: 0;
		font-weight: 500
	}

	.filter-select:focus {
		border-color: #dc2626;
		box-shadow: 0 3px 20px rgba(220, 38, 38, .3);
		background: rgba(0, 0, 0, .9);
		color: #fff
	}

	.filter-select option {
		background: #1a1a1a;
		color: #fff
	}

	.mobile-filter-button {
		display: none;
		position: fixed;
		bottom: 20px;
		left: 20px;
		right: 20px;
		background: linear-gradient(45deg, #dc2626, #991b1b);
		color: #fff;
		padding: 15px 20px;
		border-radius: 12px;
		cursor: pointer;
		z-index: 1000;
		box-shadow: 0 4px 20px rgba(220, 38, 38, .4);
		justify-content: space-between;
		align-items: center;
		font-weight: 600;
		text-transform: uppercase;
		letter-spacing: 1px
	}

	.mobile-filter-count {
		background: rgba(255, 255, 255, .2);
		padding: 4px 12px;
		border-radius: 20px;
		font-size: 12px
	}


	.mobile-filters-content {
		width: 100%;
		height: 100%;
		background: #fff;
		display: flex;
		flex-direction: column
	}

	.mobile-filters-header {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 20px;
		border-bottom: 1px solid #eee;
		background: #f8f9fa
	}

	.mobile-filters-header h3 {
		margin: 0;
		font-size: 20px;
		font-weight: 600;
		color: #333
	}

	.mobile-close-btn {
		background: 0 0;
		border: none;
		font-size: 24px;
		color: #666;
		cursor: pointer;
		padding: 5px
	}

	.mobile-filters-body {
		flex: 1;
		overflow-y: auto;
		padding: 20px
	}

	.channel-btn,
	.model-contact-btn {
		text-decoration: none;
		overflow: hidden;
	}

	.mobile-filter-actions {
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-bottom: 20px;
		padding-bottom: 15px;
		border-bottom: 1px solid #eee
	}

	.mobile-active-count {
		color: #666;
		font-size: 14px
	}

	.mobile-clear-btn {
		background: 0 0;
		border: 1px solid #dc2626;
		color: #dc2626;
		padding: 6px 12px;
		border-radius: 6px;
		font-size: 12px;
		cursor: pointer;
		text-transform: uppercase;
		font-weight: 600
	}

	.mobile-filter-item {
		margin-bottom: 20px;
		padding-bottom: 15px;
		border-bottom: 1px solid #f0f0f0
	}

	.mobile-checkbox-label {
		display: flex;
		align-items: center;
		gap: 10px;
		cursor: pointer;
		font-weight: 500;
		color: #333
	}

	.mobile-checkbox {
		width: 18px;
		height: 18px;
		accent-color: #dc2626
	}

	.mobile-label {
		display: block;
		font-weight: 500;
		color: #333;
		margin-bottom: 8px
	}

	.mobile-select {
		width: 100%;
		background: #f8f9fa;
		border: 1px solid #ddd;
		padding: 12px;
		border-radius: 6px;
		color: #333;
		font-size: 14px
	}

	.channel-btn,
	.channel-name {
		font-size: 15px
	}

	.mobile-select:focus {
		border-color: #dc2626;
		outline: 0
	}

	.channel-btn,
	.channels-buttons,
	.channels-section {
		display: flex;
		position: relative
	}

	.channels-section {
		width: 100%;
		margin: 0px 0;
		padding: 25px 20px;
		justify-content: center
	}

	.channels-buttons {
		gap: 20px;
		flex-wrap: wrap;
		justify-content: center;
		width: 100%;
		max-width: 600px;
		z-index: 1
	}

	.channel-btn {
		align-items: center;
		gap: 12px;
		padding: 16px 28px;
		color: #fff;
		font-weight: 600;
		text-transform: uppercase;
		letter-spacing: .5px;
		transition: .3s;
		border: 1px solid rgba(255, 255, 255, .1);
		clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 10px 100%, 0 calc(100% - 10px));
		min-width: 180px;
		justify-content: center
	}

	.model-price {
		letter-spacing: 1px;
		text-transform: uppercase
	}

	.channel-btn:hover {
		transform: translateY(-3px) scale(1.05);
		box-shadow: 0 8px 25px rgba(0, 0, 0, .4);
		border-color: rgba(255, 255, 255, .3)
	}

	.channel-btn svg {
		width: 22px;
		height: 22px
	}

	.telegram-channel {
		background: linear-gradient(45deg, #3b82f6, #1d4ed8);
		box-shadow: 0 0 20px rgba(59, 130, 246, .3)
	}

	.telegram-channel:hover {
		background: linear-gradient(45deg, #1d4ed8, #3b82f6);
		box-shadow: 0 0 35px rgba(59, 130, 246, .6);
		border-color: rgba(59, 130, 246, .4)
	}

	.whatsapp-channel {
		background: linear-gradient(45deg, #10b981, #059669);
		box-shadow: 0 0 20px rgba(16, 185, 129, .3)
	}

	.whatsapp-channel:hover {
		background: linear-gradient(45deg, #059669, #10b981);
		box-shadow: 0 0 35px rgba(16, 185, 129, .6);
		border-color: rgba(16, 185, 129, .4)
	}

	.anchor-channel {
		background: linear-gradient(45deg, #dc2626, #991b1b);
		box-shadow: 0 0 20px rgba(220, 38, 38, .3);
		animation: 3s ease-in-out infinite anchorPulse
	}

	@keyframes anchorPulse {

		0%,
		100% {
			box-shadow: 0 0 20px rgba(220, 38, 38, .3)
		}

		50% {
			box-shadow: 0 0 30px rgba(220, 38, 38, .5)
		}
	}

	.anchor-channel::before {
		background: linear-gradient(90deg, transparent, rgba(220, 38, 38, .3), transparent)
	}

	.anchor-channel:hover {
		background: linear-gradient(45deg, #991b1b, #dc2626);
		box-shadow: 0 0 35px rgba(220, 38, 38, .6);
		border-color: rgba(220, 38, 38, .4);
		animation: none
	}

	html {
		scroll-behavior: smooth
	}

	@media (max-width:600px) {

		.channel-btn,
		.channel-name {
			font-size: 14px
		}

		.channels-section {
			margin: 0px 0;
			padding: 20px 15px
		}

		.channels-buttons {
			gap: 15px;
			max-width: 100%
		}

		.channel-btn {
			min-width: 150px;
			padding: 14px 20px;
			clip-path: polygon(0 0, calc(100% - 8px) 0, 100% 8px, 100% 100%, 8px 100%, 0 calc(100% - 8px))
		}

		.channel-btn svg {
			width: 20px;
			height: 20px
		}
	}

	.model-contact-btn,
	.pagination-btn {
		width: 30px;
		height: 30px;
		display: flex
	}

	.model-contacts {
		position: absolute;
		top: 10px;
		right: 10px;
		display: flex;
		gap: 8px;
		z-index: 5
	}

	.model-contact-btn {
		align-items: center;
		justify-content: center;
		color: #fff;
		transition: .3s;
		position: relative;
		border: 1px solid rgba(255, 255, 255, .15);
		cursor: pointer;
		clip-path: polygon(0 0, calc(100% - 8px) 0, 100% 8px, 100% 100%, 8px 100%, 0 calc(100% - 8px));
		box-shadow: 0 4px 15px rgba(0, 0, 0, .25)
	}

	.model-contact-btn svg {
		width: 20px;
		height: 20px;
		fill: white;
		z-index: 1
	}

	.telegram-contact {
		background: linear-gradient(45deg, #3b82f6, #1d4ed8);
		box-shadow: 0 0 15px rgba(59, 130, 246, .3)
	}

	.telegram-contact:hover {
		background: linear-gradient(45deg, #1d4ed8, #3b82f6);
		transform: translateY(-3px) scale(1.05);
		box-shadow: 0 0 25px rgba(59, 130, 246, .5)
	}

	.whatsapp-contact {
		background: linear-gradient(45deg, #10b981, #059669);
		box-shadow: 0 0 15px rgba(16, 185, 129, .3)
	}

	.whatsapp-contact:hover {
		background: linear-gradient(45deg, #059669, #10b981);
		transform: translateY(-3px) scale(1.05);
		box-shadow: 0 0 25px rgba(16, 185, 129, .5)
	}

	.model-price {
		position: absolute;
		right: 12px;
		color: #fff;
		font-weight: 700;
		font-size: 20px;
		font-family: Cinzel, serif;
		z-index: 90
	}

	.pagination-info {
		font-weight: 500;
		font-size: 14px
	}

	.model-card::after {
		content: '';
		position: absolute;
		bottom: 0;
		left: 0;
		right: 0;
		height: 40%;
		background: linear-gradient(to top, rgba(0, 0, 0, .7) 0, transparent 100%);
		pointer-events: none;
		border-radius: 0 0 8px 8px
	}

	.pagination-container {
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 20px;
		margin: 10px 0;
		padding: 0 20px
	}

	

	.pagination-btn {
		align-items: center;
		background: rgba(0, 0, 0, .8);
		color: #fff;
		cursor: pointer;
		transition: .3s;
		margin: 30px auto !important;      /* ДОБАВЛЕНО: Центрирует сам блок пагинации по горизонтали */
	}

	.pagination-info {
		color: #000
	}

	.pagination-btn {
		justify-content: center;
		border-radius: 4px
	}
.pagination-prev:disabled, 
.pagination-next:disabled {
    opacity: 0.4;
    cursor: not-allowed;
    filter: grayscale(1);
}

	.pagination-btn:hover:not(:disabled) {
		background: #dc2626;
		border-color: #dc2626;
		box-shadow: 0 3px 15px rgba(220, 38, 38, .4)
	}

	.pagination-btn:disabled {
		opacity: .4;
		cursor: not-allowed
	}
.colores{
color: #000;
}

	@media (max-width:768px) {
		.desktop-only {
			display: none !important
		}

		.mobile-filter-button {
			display: flex !important
		}

		

		.model-contact-btn {
			width: 34px;
			height: 34px
		}

		.model-contact-btn svg {
			width: 18px;
			height: 18px
		}
		

		.pagination-btn {
			width: 36px;
			height: 36px;
			border-color: #dc2626;
		}
	}

	@media (max-width:480px) {

		.channel-btn,
		.channel-name {
			font-size: 16px
		}

		.channels-section {
			padding: 15px 10px
		}

		.channel-btn {
			padding: 14px 18px
		}
	}



/* ЗАЩИТА МОБИЛЬНОЙ ВЕРСИИ (Экран меньше 768px) */
@media screen and (max-width: 768px) {
    
    /* Сбрасываем фон и обводку, чтобы на мобиле кнопки остались прежними */
}



	.nav-container {
		display: flex;
		align-items: center;
		justify-content: space-between;
		position: relative
	}

	@media (max-width:768px) {

		.nav-menu {
			display: none
		}
	}
}


    
/* ===== Channels block (unique: x9q7k_) ===== */

/* Card */

.x9q7k_card:focus-visible{
  outline: none;
  box-shadow: 0 0 0 3px rgba(255,255,255,.20), 0 10px 24px rgba(0,0,0,.18);
}

/* Icon */

/* Text */

/* Arrow */

/* Platform themes */

/* Responsive */



    /* HEADER */
.filters-section,
.header {
	backdrop-filter: blur(20px)
}

.clear-filters,
.logo,
.model-card,
.nav-menu a {
	text-decoration: none
}

.model-image {
	display: flex;
	align-items: center;
	justify-content: center
}

.model-image img {
	object-fit: cover;
	aspect-ratio: 3/4;
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover
}

.model-placeholder {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 60px;
	background: linear-gradient(135deg, #f8f9fa, #e9ecef);
	color: #dc2626
}

.models-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
	min-height: 400px
}

.model-card {
	min-height: 400px;
	display: block
}

.filters-section {
	min-height: 120px
}

.filters-container {
	min-height: 80px
}

.mobile-filter-button {
	justify-content: space-between;
	align-items: center;
	text-transform: uppercase;
	transform: translateZ(0)
}

.header {
	position: sticky;
	height: 60px
}

.nav-container {
	display: flex;
	align-items: center;
	justify-content: space-between
}

@media (max-width:768px) {
	.models-grid {
		grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
		gap: 15px;
		min-height: 300px
	}

	.model-card {
		min-height: 350px
	}

	.model-image {
		height: 320px
	}

	.header {
		height: 55px
	}

	.mobile-filter-button {
		display: flex !important
	}
}

@media (max-width:480px) {

	.model-card,
	.models-grid {
		min-height: 400px
	}

	.models-grid {
		grid-template-columns: 1fr
	}
}

body {
	font-display: swap;
	font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
	line-height: 1.6;
	color: #333;
	background: #fafafa;
	overflow-x: hidden
}

.models-section {
	min-height: 500px
}

.models-container {
	min-height: 450px
}

.particles {
	position: fixed;
	width: 100%;
	z-index: -1;
	left: 0;
	height: 100%;
	top: 0
}

.logo .elite,
.nav-menu a.active {
	color: #dc2626
}

.nav-menu {
	list-style: none;
	display: flex;
	gap: 30px
}

.checkbox-group,
.model-card,
.model-image {
	overflow: hidden
}

.channel-btn svg {
	filter: drop-shadow(0 2px 4px rgba(0, 0, 0, .3))
}

* {
	margin: 0;
	padding: 0;
	box-sizing: border-box
}

.nav-menu a::after,
.particle {
	background: #dc2626;
	position: absolute
}

.particle {
	width: 3px;
	height: 3px;
	opacity: .4;
	animation: 25s linear infinite float
}

.header {
	background: rgba(0, 0, 0, .95);
	border-bottom: 1px solid rgba(220, 38, 38, .3)
}

@keyframes float {
	0% {
		transform: translateY(100vh) rotate(0);
		opacity: 0
	}

	10%,
	90% {
		opacity: .4
	}

	100% {
		transform: translateY(-100vh) rotate(360deg);
		opacity: 0
	}
}

.header {
	position: sticky;
	top: 0;
	z-index: 100;
	box-shadow: 0 2px 20px rgba(0, 0, 0, .3)
}

.logo,
.nav-menu a {
	position: relative
}

.nav-container {
	max-width: 1400px;
	margin: 0 auto;
	padding: 0 20px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: 60px
}

.checkbox-group {
	display: flex;
	align-items: center
}

.logo {
	font-size: 28px;
	font-weight: 900;
	color: #fff;
	letter-spacing: -1px
}

.nav-menu a {
	letter-spacing: 1px;
	text-transform: uppercase
}

.logo::before {
	content: '';
	position: absolute;
	top: 0;
	left: -10px;
	width: 4px;
	height: 100%;
	background: linear-gradient(to bottom, #dc2626, #991b1b)
}

.logo .elite {
	text-shadow: 0 0 30px rgba(220, 38, 38, .5)
}

.nav-menu a {
	color: #ccc;
	font-weight: 500;
	font-size: 13px
}

.nav-menu a::after {
	content: '';
	bottom: -5px;
	left: 0;
	width: 0;
	height: 2px
}

.nav-menu a.active::after {
	width: 100%
}

.model-card {
	border: none
}

.checkbox-group::before {
	content: '';
	position: absolute;
	top: 0;
	left: -100%;
	width: 100%;
	height: 100%;
	background: linear-gradient(90deg, transparent, rgba(220, 38, 38, .2), transparent)
}

.checkbox-group span {
	color: #fff;
	font-weight: 500;
	font-size: 13px
}

.badge,
.section-title {
	font-weight: 700;
	text-transform: uppercase
}

.models-section {
	padding: 40px 20px;
	position: relative
}

.models-container {
	max-width: 1400px;
	margin: 0 auto;
	position: relative;
	z-index: 1
}

.section-title {
	text-align: center;
	font-size: 28px;
	margin-bottom: 30px;
	color: #1a1a1a;
	letter-spacing: 2px;
	position: relative
}

.section-title::after {
	content: '';
	position: absolute;
	bottom: -8px;
	left: 50%;
	transform: translateX(-50%);
	width: 80px;
	height: 3px;
	background: linear-gradient(45deg, #dc2626, #991b1b)
}

.models-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
	gap: 25px
}

.model-card {
	background: 0 0;
	position: relative;
	border-radius: 8px
}

.model-image {
	width: 100%;
	height: 400px;
	position: relative;
	border-radius: 8px;
	background: linear-gradient(135deg, #f8f9fa, #e9ecef);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 60px
}

.model-badges {
	position: absolute;
	top: 15px;
	left: 15px;
	display: flex;
	flex-direction: column;
	gap: 8px;
	z-index: 3
}

.badge {
	padding: 6px 12px;
	font-size: 10px;
	letter-spacing: .5px;
	backdrop-filter: blur(10px);
	border: 1px solid rgba(255, 255, 255, .5);
	clip-path: polygon(0 0, calc(100% - 8px) 0, 100% 8px, 100% 100%, 8px 100%, 0 calc(100% - 8px))
}


.badge.verified {
	background: linear-gradient(45deg, #3b82f6, #1d4ed8);
	color: #fff;
	box-shadow: 0 0 20px rgba(16, 185, 129, .3)
}

.clear-filters,
.filter-select {
	letter-spacing: .5px;
	text-transform: uppercase
}

.mobile-filter-button {
	letter-spacing: 1px;
	text-transform: uppercase
}

.channel-btn::before {
	content: '';
	position: absolute;
	top: 0;
	left: -100%;
	width: 100%;
	height: 100%;
	z-index: -1
}

.telegram-channel::before {
	background: linear-gradient(90deg, transparent, rgba(59, 130, 246, .3), transparent)
}

.whatsapp-channel::before {
	background: linear-gradient(90deg, transparent, rgba(16, 185, 129, .3), transparent)
}

@media (max-width:768px) {
	.nav-menu {
		display: none
	}

	.checkbox-filters {
		justify-content: center;
		gap: 10px
	}

	.models-grid {
		grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
		gap: 15px
	}

	.nav-container {
		height: 55px
	}

	.logo {
		font-size: 24px
	}
}

@media (max-width:480px) {
	.models-grid {
		grid-template-columns: 1fr
	}

	.filters-section,
	.models-section {
		padding: 20px 15px
	}
	    .logo {
        font-size: 21px;
    }
}

.back {
	background-repeat: repeat;
	background-size: auto
}

.filters-section {
	background: rgba(0, 0, 0, .95);
	padding: 25px 20px;
	border-bottom: 1px solid rgba(220, 38, 38, .3)
}

.filters-container {
	max-width: 1400px;
	margin: 0 auto
}

.filter-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 20px
}

.filter-count {
	color: #fff;
	font-size: 14px;
	font-weight: 500
}

.clear-filters {
	color: #dc2626;
	font-size: 12px;
	padding: 6px 12px;
	border: 1px solid #dc2626;
	font-weight: 600;
	background: rgba(0, 0, 0, .3)
}

.checkbox-filters {
	display: flex;
	gap: 15px;
	margin-bottom: 20px;
	flex-wrap: wrap;
	justify-content: center
}

.checkbox-group {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 10px 18px;
	background: rgba(0, 0, 0, .6);
	border: 1px solid rgba(255, 255, 255, .1);
	position: relative
}

.checkbox,
.filter-select {
	background: rgba(0, 0, 0, .8)
}

.checkbox {
	appearance: none;
	width: 16px;
	height: 16px;
	border: 2px solid #555;
	position: relative
}

.filter-select {
	border: 1px solid rgba(220, 38, 38, .3);
	color: #fff;
	padding: 10px 15px;
	font-size: 12px;
	outline: 0;
	font-weight: 500
}

.filters-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
	gap: 15px
}

.filter-select option {
	background: #1a1a1a;
	color: #fff
}

.mobile-filter-button {
	display: none;
	position: fixed;
	bottom: 20px;
	left: 20px;
	right: 20px;
	background: linear-gradient(45deg, #dc2626, #991b1b);
	color: #fff;
	padding: 15px 20px;
	border-radius: 12px;
	z-index: 1000;
	box-shadow: 0 4px 20px rgba(220, 38, 38, .4);
	justify-content: space-between;
	align-items: center;
	font-weight: 600
}

.mobile-filter-count {
	background: rgba(255, 255, 255, .2);
	padding: 4px 12px;
	border-radius: 20px;
	font-size: 12px
}

.mobile-filters-modal {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, .5);
	z-index: 2000;
	transform: translateX(-100%)
}

.mobile-filters-content {
	width: 100%;
	height: 100%;
	background: #fff;
	display: flex;
	flex-direction: column
}

.mobile-filters-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 20px;
	border-bottom: 1px solid #eee;
	background: #f8f9fa
}

.mobile-filters-header h3 {
	margin: 0;
	font-size: 20px;
	font-weight: 600;
	color: #333
}

.mobile-close-btn {
	background: 0 0;
	border: none;
	font-size: 24px;
	color: #666;
	padding: 5px
}

.mobile-filters-body {
	flex: 1;
	overflow-y: auto;
	padding: 20px
}

.channel-btn,
.model-contact-btn {
	text-decoration: none;
	overflow: hidden;
}

.mobile-filter-actions {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 20px;
	padding-bottom: 15px;
	border-bottom: 1px solid #eee
}

.mobile-active-count {
	color: #666;
	font-size: 14px
}

.mobile-clear-btn {
	background: 0 0;
	border: 1px solid #dc2626;
	color: #dc2626;
	padding: 6px 12px;
	border-radius: 6px;
	font-size: 12px;
	text-transform: uppercase;
	font-weight: 600
}

.mobile-filter-item {
	margin-bottom: 20px;
	padding-bottom: 15px;
	border-bottom: 1px solid #f0f0f0
}

.mobile-checkbox-label {
	display: flex;
	align-items: center;
	gap: 10px;
	font-weight: 500;
	color: #333
}

.mobile-checkbox {
	width: 18px;
	height: 18px;
	accent-color: #dc2626
}

.mobile-label {
	display: block;
	font-weight: 500;
	color: #333;
	margin-bottom: 8px
}

.mobile-select {
	width: 100%;
	background: #f8f9fa;
	border: 1px solid #ddd;
	padding: 12px;
	border-radius: 6px;
	color: #333;
	font-size: 14px
}

.channel-btn,
.channel-name {
	font-size: 15px
}

.channel-btn,
.channels-buttons,
.channels-section {
	display: flex;
	position: relative
}

.channels-section {
	width: 100%;
	margin: 30px 0;
	padding: 25px 20px;
	justify-content: center
}

.channels-buttons {
	gap: 20px;
	flex-wrap: wrap;
	justify-content: center;
	width: 100%;
	max-width: 600px;
	z-index: 1
}

.channel-btn {
	align-items: center;
	gap: 12px;
	padding: 16px 28px;
	color: #fff;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .5px;
	border: 1px solid rgba(255, 255, 255, .1);
	clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 10px 100%, 0 calc(100% - 10px));
	min-width: 180px;
	justify-content: center
}

.channel-btn svg {
	width: 22px;
	height: 22px
}

.telegram-channel {
	background: linear-gradient(45deg, #3b82f6, #1d4ed8);
	box-shadow: 0 0 20px rgba(59, 130, 246, .3)
}

.whatsapp-channel {
	background: linear-gradient(45deg, #10b981, #059669);
	box-shadow: 0 0 20px rgba(16, 185, 129, .3)
}

.anchor-channel {
	background: linear-gradient(45deg, #dc2626, #991b1b);
	box-shadow: 0 0 20px rgba(220, 38, 38, .3);
	animation: 3s ease-in-out infinite anchorPulse
}

@keyframes anchorPulse {

	0%,
	100% {
		box-shadow: 0 0 20px rgba(220, 38, 38, .3)
	}

	50% {
		box-shadow: 0 0 30px rgba(220, 38, 38, .5)
	}
}

.anchor-channel::before {
	background: linear-gradient(90deg, transparent, rgba(220, 38, 38, .3), transparent)
}

html {
	scroll-behavior: smooth
}

@media (max-width:600px) {

	.channel-btn,
	.channel-name {
		font-size: 14px
	}

	.channels-section {
		margin: 0px 0;
		padding: 0px 0px
	}

	.channels-buttons {
		gap: 15px;
		max-width: 100%
	}

	.channel-btn {
		min-width: 150px;
		padding: 14px 20px;
		clip-path: polygon(0 0, calc(100% - 8px) 0, 100% 8px, 100% 100%, 8px 100%, 0 calc(100% - 8px))
	}

	.channel-btn svg {
		width: 20px;
		height: 20px
	}
}

.model-contacts {
	position: absolute;
	top: 10px;
	right: 10px;
	display: flex;
	gap: 8px;
	z-index: 5
}

.model-contact-btn,
.nav-container {
	align-items: center;
	position: relative
}

.model-contact-btn {
	width: 40px;
	height: 40px;
	display: flex;
	justify-content: center;
	color: #fff;
	border: 1px solid rgba(255, 255, 255, .15);
	clip-path: polygon(0 0, calc(100% - 8px) 0, 100% 8px, 100% 100%, 8px 100%, 0 calc(100% - 8px));
	box-shadow: 0 4px 15px rgba(0, 0, 0, .25)
}

.model-contact-btn svg {
	width: 20px;
	height: 20px;
	fill: white;
	z-index: 1
}

.telegram-contact {
	background: linear-gradient(45deg, #3b82f6, #1d4ed8);
	box-shadow: 0 0 15px rgba(59, 130, 246, .3)
}

.whatsapp-contact {
	background: linear-gradient(45deg, #10b981, #059669);
	box-shadow: 0 0 15px rgba(16, 185, 129, .3)
}

.model-card::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	height: 40%;
	background: linear-gradient(to top, rgba(0, 0, 0, .7) 0, transparent 100%);
	border-radius: 0 0 8px 8px
}
.pagination-container{
    gap: 20px;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    
}
.pagination {
		display: flex;
		flex-direction: row !important;
   flex-wrap: nowrap !important;
    justify-content: center !important;
		gap: 8px
        
	}

    #paginationPages{
display:flex;
flex-direction:row;
align-items: center;
justify-content:center;
gap: 5px;
    }
.stile {
background-image: url("data:image/svg+xml,%3Csvg width='180' height='180' viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M81.28 88H68.413l19.298 19.298L81.28 88zm2.107 0h13.226L90 107.838 83.387 88zm15.334 0h12.866l-19.298 19.298L98.72 88zm-32.927-2.207L73.586 78h32.827l.5.5 7.294 7.293L115.414 87l-24.707 24.707-.707.707L64.586 87l1.207-1.207zm2.62.207L74 80.414 79.586 86H68.414zm16 0L90 80.414 95.586 86H84.414zm16 0L106 80.414 111.586 86h-11.172zm-8-6h11.173L98 85.586 92.414 80zM82 85.586L87.586 80H76.414L82 85.586zM17.414 0L.707 16.707 0 17.414V0h17.414zM4.28 0L0 12.838V0h4.28zm10.306 0L2.288 12.298 6.388 0h8.198zM180 17.414L162.586 0H180v17.414zM165.414 0l12.298 12.298L173.612 0h-8.198zM180 12.838L175.72 0H180v12.838zM0 163h16.413l.5.5 7.294 7.293L25.414 172l-8 8H0v-17zm0 10h6.613l-2.334 7H0v-7zm14.586 7l7-7H8.72l-2.333 7h8.2zM0 165.414L5.586 171H0v-5.586zM10.414 171L16 165.414 21.586 171H10.414zm-8-6h11.172L8 170.586 2.414 165zM180 163h-16.413l-7.794 7.793-1.207 1.207 8 8H180v-17zm-14.586 17l-7-7h12.865l2.333 7h-8.2zM180 173h-6.613l2.334 7H180v-7zm-21.586-2l5.586-5.586 5.586 5.586h-11.172zM180 165.414L174.414 171H180v-5.586zm-8 5.172l5.586-5.586h-11.172l5.586 5.586zM152.933 25.653l1.414 1.414-33.94 33.942-1.416-1.416 33.943-33.94zm1.414 127.28l-1.414 1.414-33.942-33.94 1.416-1.416 33.94 33.943zm-127.28 1.414l-1.414-1.414 33.94-33.942 1.416 1.416-33.943 33.94zm-1.414-127.28l1.414-1.414 33.942 33.94-1.416 1.416-33.94-33.943zM0 85c2.21 0 4 1.79 4 4s-1.79 4-4 4v-8zm180 0c-2.21 0-4 1.79-4 4s1.79 4 4 4v-8zM94 0c0 2.21-1.79 4-4 4s-4-1.79-4-4h8zm0 180c0-2.21-1.79-4-4-4s-4 1.79-4 4h8z' fill='%23bf8888' fill-opacity='0.4' fill-rule='evenodd'/%3E%3C/svg%3E");
}
.pagination-btn:active {
    background-color: #ffcc00 !important; /* Цвет, который вспыхнет при нажатии */
    transform: scale(0.95);              /* Кнопка слегка уменьшится (эффект нажатия) */
    transition: 0s;                      /* Вспышка должна быть мгновенной */
}
@media (max-width:480px) {

	.channel-btn,
	.channel-name {
		font-size: 16px
	}

	.channels-section {
		padding: 15px 10px
	}

	.channel-btn {
		padding: 14px 18px
	}
}

.nav-container {
	display: flex;
	justify-content: space-between
}

/* Стили для мобильных (оставляем как было) */

@media (max-width:768px) {
	.desktop-only {
		display: none !important
	}

	.mobile-filter-button {
		display: flex !important
	}

	

	.model-contact-btn {
		width: 34px;
		height: 34px
	}

	.model-contact-btn svg {
		width: 18px;
		height: 18px
	}

	.nav-menu {
		display: none
	}
	.mobile-filters-modal.show{
		display: block;
		transform: translateX(0);
	}
}
.faq-item.active > .faq-answer{
	    max-height: 1000px;
		    padding: 15px;
}
/* Стан появи попапа (анімація) */
.timed-popup-overlay.show .timed-popup-container.centered-popup {
  transform: translateY(0) scale(1);
  opacity: 1;
  visibility: visible;
}

/* --- 3. Шапка з картинкою --- */
.timed-popup-header {
  width: 100%;
  max-height: 435px;
  background: #000;
  overflow: hidden;
}

.timed-popup-header img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: brightness(0.9);
}

/* --- 4. Кнопка закриття ('X') --- */
.timed-popup-close {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 28px;
  height: 28px;
  background: rgba(0, 0, 0, 0.7);
  border: 1px solid rgba(252, 81, 48, 0.4);
  border-radius: 50%;
  cursor: pointer;
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: 0.3s;
}

/* Створення 'X' через псевдоелементи */
.timed-popup-close::before,
.timed-popup-close::after {
  content: "";
  position: absolute;
  width: 14px;
  height: 2px;
  background-color: #fff;
  transition: 0.3s;
}

.timed-popup-close::before {
  transform: rotate(45deg);
}

.timed-popup-close::after {
  transform: rotate(-45deg);
}

/* --- 5. Текстовий вміст --- */
.timed-popup-content {
  padding: 15px;
  color: #fff;
  /* ВИРІВНЮВАННЯ ТЕКСТУ ПО ЦЕНТРУ */
  text-align: center;
}

.timed-popup-title {
  font-size: 20px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-bottom: 6px;
}

/* НЕОНОВИЙ ТЕКСТ 'Want' */
.elite-text {
  color: #fc5130;
  text-shadow: 0 0 15px rgba(252, 81, 48, 0.7);
}

.timed-popup-subtitle {
  font-size: 11px;
  color: #aaa;
  text-transform: uppercase;
  letter-spacing: 2px;
  margin-bottom: 8px;
  font-weight: 500;
}

.timed-popup-text {
  font-size: 11px;
  line-height: 1.5;
  color: #ccc;
  margin-bottom: 15px;
  font-weight: 400;
}

/* --- 6. Блок кнопок --- */
.timed-popup-buttons {
  display: flex;
  justify-content: center;
  /* Центруємо кнопку */
}
/* --- 1. Базовий фон (Оверлей) --- */
.timed-popup-overlay {
  position: fixed; /* Фіксуємо поверх усього вікна */
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.85); /* Напівпрозорий темний фон */
  z-index: 99999; /* Дуже високий z-index, щоб перекрити меню/хедер */
  display: flex;
  align-items: center; /* Центруємо по вертикалі */
  justify-content: center; /* Центруємо по горизонталі */
  
  /* Початково прихований */
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
}

/* Коли додається клас show (через JS) - оверлей плавно з'являється */
.timed-popup-overlay.show {
  opacity: 1;
  visibility: visible;
}

/* --- 2. Базовий контейнер попапа --- */
.timed-popup-container.centered-popup {
  position: relative;
  background: #111; /* Темний фон самої картки */
  width: 90%;
  max-width: 400px; /* Максимальна ширина */
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
  
  /* Початковий стан для анімації виїзду */
  transform: translateY(20px) scale(0.95);
  transition: transform 0.3s ease;
}
/* ЧЕРВОНА НЕОНОВА КНОПКА TELEGRAM */



.timed-popup-button.telegram {
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: 6px;
  background: rgba(0, 0, 0, 0.5);
  border: 1px solid rgba(42, 171, 238, 0.25);
  color: #2aabee;
  padding: 13px 22px;
  font-size: 16px;
  letter-spacing: 2px;
  text-transform: uppercase;
  font-weight: 500;
  border-radius: 20px;
  width: 100%;
  justify-content: center;
  box-shadow: 0 0 20px rgba(59, 130, 246, 0.3);
}

.pagination-page,.pagination-prev,.pagination-next{
	    padding: 10px;
        background: linear-gradient(45deg, #dc2626, #991b1b);
    border-radius: 8px;
	color: #fff;
	font-weight: 700
	
}
.pagination-prev,.pagination-next{
	    background: linear-gradient(45deg, #711f1f, #991b1b);
}
.pagination-page.active{
background: linear-gradient(45deg, #000000, #f8a6a6);
}