/* Enhanced Responsive Styles for Vanta Vibe */

/* Large Desktop (1400px+) */
@media (min-width: 1400px) {
	.container {
		max-width: 1400px;
		padding: 0 var(--space-2xl);
	}

	.nav {
		max-width: 1400px;
		padding-left: var(--space-3xl);
		padding-right: var(--space-3xl);
	}

	.nav-actions {
		flex-direction: row;
		flex-wrap: nowrap;
		gap: var(--space-lg);
	}

	.virtual-currency-notice {
		margin-left: var(--space-md);
		margin-top: 0;
	}

	.hero-title {
		font-size: 4rem;
	}

	.hero-subtitle {
		font-size: 1.375rem;
	}

	.features-grid {
		grid-template-columns: repeat(3, 1fr);
	}

	.games-grid {
		grid-template-columns: repeat(4, 1fr);
	}

	.testimonials-grid {
		grid-template-columns: repeat(3, 1fr);
	}

	.offers-grid {
		grid-template-columns: repeat(3, 1fr);
	}
}

/* Desktop (1200px - 1399px) */
@media (min-width: 1200px) and (max-width: 1399px) {
	.features-grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.games-grid {
		grid-template-columns: repeat(3, 1fr);
	}

	.offers-grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.nav-actions {
		flex-direction: row;
		flex-wrap: nowrap;
		gap: var(--space-md);
	}

	.virtual-currency-notice {
		margin-left: var(--space-md);
		margin-top: 0;
	}
}

/* Desktop Medium (1000px - 1199px) */
@media (min-width: 1000px) and (max-width: 1199px) {
	.nav-actions {
		flex-direction: row;
		flex-wrap: nowrap;
		gap: var(--space-md);
	}

	.virtual-currency-notice {
		margin-left: var(--space-md);
		margin-top: 0;
	}
}

/* Tablet Landscape (992px - 1199px) */
@media (min-width: 992px) and (max-width: 1199px) {
	.container {
		padding: 0 var(--space-xl);
	}

	.hero {
		padding: var(--space-4xl) 0;
	}

	.features-grid,
	.games-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: var(--space-xl);
	}

	.testimonials-grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.hero-stats {
		grid-template-columns: repeat(3, 1fr);
	}
}

/* Tablet Portrait (768px - 991px) */
@media (min-width: 768px) and (max-width: 991px) {
	/* Typography adjustments */
	h1 {
		font-size: 2.5rem;
	}
	h2 {
		font-size: 2rem;
	}
	h3 {
		font-size: 1.5rem;
	}

	.hero-title {
		font-size: 3rem;
	}

	.hero-subtitle {
		font-size: 1.125rem;
	}

	/* Container padding */
	.container {
		padding: 0 var(--space-lg);
	}

	/* Navigation */
	.nav {
		padding: var(--space-md) var(--space-xl);
	}

	.nav-menu {
		display: none;
		position: absolute;
		top: 100%;
		left: 0;
		right: 0;
		background: rgba(255, 255, 255, 0.98);
		backdrop-filter: blur(10px);
		border-top: 1px solid var(--gray-200);
		flex-direction: column;
		padding: var(--space-lg);
		box-shadow: var(--shadow-lg);
		border-radius: 0 0 var(--radius-lg) var(--radius-lg);
	}

	.nav-menu.active {
		display: flex;
	}

	.nav-link {
		padding: var(--space-md);
		text-align: center;
		border-radius: var(--radius-md);
	}

	.nav-toggle {
		display: flex;
	}

	.nav-actions {
		gap: var(--space-sm);
		flex-wrap: wrap;
		justify-content: flex-end;
	}

	.virtual-currency-notice {
		font-size: 0.7rem;
		margin-left: var(--space-sm);
		flex-basis: 100%;
		text-align: right;
		margin-top: var(--space-xs);
	}

	/* Hero section */
	.hero {
		padding: var(--space-4xl) 0;
	}

	.hero-stats {
		grid-template-columns: repeat(3, 1fr);
		gap: var(--space-lg);
	}

	.hero-actions {
		flex-direction: column;
		align-items: center;
	}

	.btn-large {
		width: 100%;
		max-width: 300px;
	}

	.trust-badges {
		gap: var(--space-lg);
	}

	/* Sections */
	.features-section,
	.games-section,
	.testimonials-section,
	.cta-section {
		padding: var(--space-4xl) 0;
	}

	/* Grids */
	.features-grid {
		grid-template-columns: 1fr;
		gap: var(--space-xl);
	}

	.games-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: var(--space-lg);
	}

	.offers-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: var(--space-lg);
	}

	.testimonials-grid {
		grid-template-columns: 1fr;
		gap: var(--space-lg);
	}

	/* Footer */
	.footer-content {
		grid-template-columns: repeat(2, 1fr);
		gap: var(--space-xl);
	}

	.footer-bottom {
		flex-direction: column;
		text-align: center;
		gap: var(--space-md);
	}

	/* Responsible banner */
	.responsible-content {
		flex-direction: column;
		gap: var(--space-md);
	}

	/* Modal adjustments */
	.modal-content {
		margin: var(--space-md);
		padding: var(--space-2xl);
	}

	.modal-buttons {
		flex-direction: column;
		gap: var(--space-md);
	}

	/* Cookie notice */
	.cookie-notice {
		bottom: var(--space-md);
		right: var(--space-md);
		left: var(--space-md);
		max-width: none;
	}
}

/* Mobile Large (576px - 767px) */
@media (min-width: 576px) and (max-width: 767px) {
	.hero-stats {
		grid-template-columns: repeat(2, 1fr);
	}

	.games-grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.trust-badges {
		grid-template-columns: repeat(2, 1fr);
		gap: var(--space-md);
	}

	/* Navigation (Mobile Large 576-767) */
	.nav-toggle {
		display: flex;
	}
	.nav-menu {
		display: none;
		position: absolute;
		top: 100%;
		left: 0;
		right: 0;
		background: rgba(255, 255, 255, 0.98);
		backdrop-filter: blur(10px);
		border-top: 1px solid var(--gray-200);
		flex-direction: column;
		padding: var(--space-lg);
		box-shadow: var(--shadow-lg);
		border-radius: 0 0 var(--radius-lg) var(--radius-lg);
	}
	.nav-menu.active {
		display: flex;
	}
}

/* Mobile (320px - 575px) */
@media (max-width: 575px) {
	/* Typography */
	.hero-title {
		font-size: 2.25rem;
	}

	.hero-subtitle {
		font-size: 1rem;
	}

	.section-title {
		font-size: 1.75rem;
	}

	.section-subtitle {
		font-size: 1rem;
	}

	/* Container */
	.container {
		padding: 0 var(--space-md);
	}

	/* Navigation */
	.nav {
		padding: var(--space-sm) var(--space-lg);
	}

	.nav-brand .logo {
		font-size: 1.5rem;
	}

	.logo-tagline {
		font-size: 0.625rem;
	}

	.nav-actions {
		display: none;
	}

	.virtual-currency-notice {
		font-size: 0.625rem;
		text-align: center;
		margin-top: var(--space-xs);
		margin-left: 0;
	}

	.nav-actions .btn-outline,
	.nav-actions .btn-primary {
		padding: var(--space-xs) var(--space-md);
		font-size: 0.75rem;
		min-width: 80px;
	}

	/* Hero */
	.hero {
		padding: var(--space-2xl) 0;
	}

	.hero-badge {
		font-size: 0.75rem;
		padding: var(--space-xs) var(--space-md);
	}

	.hero-stats {
		grid-template-columns: 1fr;
		gap: var(--space-md);
	}

	.stat-item {
		padding: var(--space-md);
	}

	.stat-number {
		font-size: 1.5rem;
	}

	.trust-badges {
		flex-direction: column;
		gap: var(--space-md);
	}

	.trust-badge {
		padding: var(--space-sm) var(--space-md);
		font-size: 0.75rem;
	}

	/* Sections */
	.features-section,
	.games-section,
	.testimonials-section,
	.cta-section {
		padding: var(--space-3xl) 0;
	}

	/* Компактнее секции на телефонах */
	.features-section,
	.games-section,
	.testimonials-section,
	.cta-section {
		padding: var(--space-2xl) 0;
	}

	.section-header {
		margin-bottom: var(--space-xl);
	}

	/* Cards */
	.feature-card,
	.game-card,
	.testimonial-card {
		padding: var(--space-lg);
	}

	.feature-card {
		padding: var(--space-xl);
	}

	.feature-icon {
		font-size: 2.5rem;
		margin-bottom: var(--space-md);
	}

	.game-icon {
		font-size: 3rem;
		padding: var(--space-lg) var(--space-md) var(--space-md);
	}

	.game-content {
		padding: var(--space-md) var(--space-lg);
	}

	.game-stats {
		flex-direction: column;
		gap: var(--space-sm);
	}

	.game-action {
		padding: 0 var(--space-lg) var(--space-lg);
	}

	/* Grids */
	.games-grid {
		grid-template-columns: 1fr;
		gap: var(--space-lg);
	}

	.offers-grid {
		grid-template-columns: 1fr;
		gap: var(--space-lg);
	}

	.offer-card {
		margin: 0 auto;
		max-width: 400px;
	}

	.countdown-timer {
		gap: var(--space-sm);
	}

	.time-unit {
		min-width: 50px;
		padding: var(--space-sm);
	}

	.time-value {
		font-size: 1.25rem;
	}

	/* Footer */
	.footer {
		padding: var(--space-3xl) 0 var(--space-lg);
	}

	.footer-content {
		grid-template-columns: 1fr;
		gap: var(--space-lg);
	}

	/* Buttons */
	.btn-large {
		padding: var(--space-md) var(--space-lg);
		font-size: 0.875rem;
		min-height: 2.75rem;
	}

	/* Modal */
	.modal-content {
		padding: var(--space-lg);
		margin: var(--space-sm);
	}

	.modal-content h2 {
		font-size: 1.25rem;
	}

	.age-modal .modal-icon {
		font-size: 3rem;
		margin-bottom: var(--space-md);
	}

	/* Age banners */
	.age-banner-top,
	.age-banner-bottom {
		padding: var(--space-sm);
		font-size: 0.75rem;
	}

	/* CTA Section */
	.cta-text h2 {
		font-size: 1.75rem;
	}

	.cta-text p {
		font-size: 1rem;
	}

	/* Scroll to top */
	.scroll-to-top {
		bottom: var(--space-lg);
		right: var(--space-lg);
		width: 3rem;
		height: 3rem;
		font-size: 1rem;
	}
}

/* Мобильное меню на самых маленьких экранах */
@media (max-width: 575px) {
	.nav-toggle {
		display: flex;
	}
	.nav-menu {
		display: none;
		position: absolute;
		top: 100%;
		left: 0;
		right: 0;
		background: rgba(255, 255, 255, 0.98);
		backdrop-filter: blur(10px);
		border-top: 1px solid var(--gray-200);
		flex-direction: column;
		padding: var(--space-lg);
		box-shadow: var(--shadow-lg);
		border-radius: 0 0 var(--radius-lg) var(--radius-lg);
		z-index: 1000;
	}
	.nav-menu.active {
		display: flex;
	}
	.nav-link {
		padding: var(--space-md);
		text-align: center;
	}
}

/* Touch-friendly improvements */
@media (hover: none) and (pointer: coarse) {
	/* Increase touch targets */
	.btn-primary,
	.btn-outline,
	.btn-secondary {
		min-height: 44px;
		min-width: 44px;
		padding: var(--space-md) var(--space-lg);
	}

	.nav-link {
		padding: var(--space-md);
		min-height: 44px;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.nav-toggle {
		min-height: 44px;
		min-width: 44px;
		padding: var(--space-md);
	}

	/* Remove hover effects on touch devices */
	.feature-card:hover,
	.game-card:hover,
	.testimonial-card:hover {
		transform: none;
		box-shadow: var(--shadow-md);
	}

	.btn-primary:hover,
	.btn-outline:hover {
		transform: none;
	}

	.stat-item:hover {
		transform: none;
		box-shadow: var(--shadow-sm);
	}
}

/* High contrast mode support */
@media (prefers-contrast: high) {
	:root {
		--primary-blue: #0052cc;
		--primary-purple: #5500cc;
		--gray-600: #333333;
		--gray-700: #222222;
		--gray-800: #111111;
	}

	.nav-link.active::after {
		height: 4px;
		width: 8px;
	}

	.feature-card,
	.game-card,
	.testimonial-card {
		border: 2px solid var(--gray-300);
	}

	.btn-primary,
	.btn-outline {
		border-width: 2px;
	}
}

/* Reduced motion support */
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}

	.pulse {
		animation: none;
	}

	.hero-background {
		background: var(--very-light-purple);
	}
}

/* Dark mode support (for future implementation) */
@media (prefers-color-scheme: dark) {
	:root {
		--white: #1a1a1a;
		--gray-50: #262626;
		--gray-100: #404040;
		--gray-200: #525252;
		--gray-300: #737373;
		--gray-800: #e5e5e5;
		--gray-900: #f5f5f5;
	}
}

/* Print styles */
@media print {
	.age-banner-top,
	.age-banner-bottom,
	.responsible-banner,
	.nav-actions,
	.hero-actions,
	.cta-actions,
	.modal,
	.cookie-notice,
	.scroll-to-top {
		display: none !important;
	}

	.header {
		position: static;
		box-shadow: none;
		border-bottom: 2px solid var(--gray-900);
	}

	body {
		font-size: 12pt;
		line-height: 1.4;
		color: #000;
		background: #fff;
	}

	.hero,
	.testimonials-section {
		background: none !important;
	}

	.footer {
		background: none !important;
		color: var(--gray-900) !important;
	}

	.feature-card,
	.game-card,
	.testimonial-card {
		box-shadow: none;
		border: 1px solid var(--gray-300);
	}

	a {
		color: #000;
		text-decoration: underline;
	}

	.btn-primary,
	.btn-outline {
		background: none;
		color: #000;
		border: 1px solid #000;
	}
}

/* Landscape orientation adjustments */
@media (orientation: landscape) and (max-height: 500px) {
	.hero {
		padding: var(--space-2xl) 0;
	}

	.hero-stats {
		grid-template-columns: repeat(3, 1fr);
		gap: var(--space-md);
	}

	.modal-content {
		max-height: 90vh;
		overflow-y: auto;
	}
}

/* Ultra-wide screens */
@media (min-width: 1920px) {
	.container {
		max-width: 1600px;
	}

	.hero-content {
		max-width: 1000px;
	}

	.section-header {
		max-width: 800px;
	}
}

/* Small height screens */
@media (max-height: 600px) {
	.hero {
		padding: var(--space-xl) 0;
	}

	.features-section,
	.games-section,
	.testimonials-section,
	.cta-section {
		padding: var(--space-2xl) 0;
	}

	/* Cookie Page Mobile Styles */
	.cookie-management-section,
	.cookie-info-section,
	.cookie-types-section,
	.third-party-section,
	.cookie-control-section,
	.cookie-retention-section,
	.cookie-updates-section,
	.cookie-contact-section {
		padding: var(--space-2xl) 0;
	}

	.cookie-manager {
		padding: var(--space-xl);
	}

	.cookie-types-grid {
		grid-template-columns: 1fr;
		gap: var(--space-lg);
	}

	.cookie-type-card {
		padding: var(--space-lg);
	}

	.type-header {
		flex-direction: column;
		align-items: flex-start;
		gap: var(--space-md);
	}

	.third-party-grid {
		grid-template-columns: 1fr;
		gap: var(--space-lg);
	}

	.control-methods {
		grid-template-columns: 1fr;
		gap: var(--space-lg);
	}

	.table-header,
	.table-row {
		grid-template-columns: 1fr;
		gap: 0;
	}

	.header-cell,
	.table-cell {
		padding: var(--space-md);
		border-bottom: 1px solid var(--gray-200);
	}

	.header-cell:before,
	.table-cell:before {
		content: attr(data-label) ": ";
		font-weight: var(--font-semibold);
		color: var(--gray-900);
	}

	.update-process {
		grid-template-columns: 1fr;
		gap: var(--space-lg);
	}

	.contact-options {
		grid-template-columns: 1fr;
		gap: var(--space-lg);
	}

	.cookie-actions {
		flex-direction: column;
		gap: var(--space-sm);
	}

	.cookie-actions .btn-primary,
	.cookie-actions .btn-outline,
	.cookie-actions .btn-secondary {
		width: 100%;
		text-align: center;
	}

	.benefits-grid {
		grid-template-columns: 1fr;
		gap: var(--space-lg);
	}

	.category-header {
		flex-direction: column;
		align-items: flex-start;
		gap: var(--space-md);
	}

	.category-toggle {
		align-self: flex-end;
	}
}
