/* Mobile-specific styles */

/* Hero Section */
@media (max-width: 768px) {
	.hero {
		padding: 0 0 var(--space-24);
		flex-direction: column;
		gap: var(--space-8);
	}

	.hero-content {
		text-align: center;
		max-width: 100%;
		padding: 0 var(--space-4);
		order: 1;
	}

	.hero-content-text h3 {
		font-size: var(--text-4xl);
		margin-bottom: var(--space-6);
	}

	.hero-content-text p {
		max-width: 310px;
		font-size: var(--text-base);
		margin-bottom: var(--space-6);
	}

	.hero-content-text .primary-button {
		margin-top: 0;
	}

	.hero-mockup {
		max-width: 100%;
		margin-top: var(--space-8);
		display: flex;
		justify-content: center;
		order: 2;
		position: relative;
		z-index: var(--z-base);
	}

	.iphone-frame {
		position: relative;
		max-width: 85%;
		transform: none !important;
		margin-top: 0;
	}
}

/* Features Section */
@media (max-width: 768px) {
	.features {
		padding: var(--space-16) 0;
	}

	.feature-cards {
		padding: 0 var(--space-4);
	}

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

	.feature-card-header-text {
		border: 1px solid red;
	}

	.feature-card h3 {
		font-size: var(--text-base);
		font-weight: var(--font-semibold);
		margin-left: var(--space-4);
	}

	.feature-card-content p {
		font-size: var(--text-sm);
	}
}

/* Feature Boxes */
@media (max-width: 768px) {
	.feature-boxes {
		padding: var(--space-8) 0;
	}

	.feature-boxes-grid {
		grid-template-columns: repeat(1, 1fr);
		gap: var(--space-4);
		padding: 0 var(--space-4);
		max-width: 100%;
	}

	.feature-box,
	.feature-box-lg {
		width: 100%;
		height: auto;
		padding: var(--space-3) var(--space-4);
		font-size: var(--text-sm);
	}
}

/* AI Partners Section */
@media (max-width: 768px) {
	.ai-partners {
		padding: var(--space-16) 0;
	}

	.ai-partners h2 {
		font-size: var(--text-3xl);
		margin-bottom: var(--space-8);
		padding: 0 var(--space-4);
	}

	.logo-item {
		width: 60px;
		height: 60px;
	}
}

/* Dashboard Section */
@media (max-width: 768px) {
	.dashboard-section {
		padding: var(--space-16) 0;
	}

	.dashboard-content {
		flex-direction: column;
		gap: var(--space-8);
		padding: 0 var(--space-4);
	}

	.dashboard-mockup {
		max-width: 100%;
	}

	.cta-content {
		text-align: center;
	}

	.cta-content h2 {
		font-size: var(--text-3xl);
		margin-bottom: var(--space-4);
	}

	.cta-content p {
		font-size: var(--text-base);
		margin-bottom: var(--space-8);
		max-width: 310px;
	}
}

/* Calculator Section */
@media (max-width: 768px) {
	.calculator-section {
		padding: var(--space-16) 0;
	}

	.calculator-container {
		padding: var(--space-8) var(--space-4);
		flex-direction: column;
		gap: var(--space-6);
	}

	.calculator-container h3 {
		font-size: var(--text-2xl);
		text-align: center;
	}
}

/* FAQ Section */
@media (max-width: 768px) {
	.faq-section {
		padding: var(--space-16) 0;
	}

	.faq-section h2 {
		font-size: var(--text-3xl);
		margin-bottom: var(--space-8);
	}

	.faq-container {
		padding: 0 var(--space-4);
	}

	.faq-item {
		padding: var(--space-4) 0;
	}

	.faq-question-text {
		width: 90%;
	}

	.faq-question h3 {
		font-size: var(--text-base);
	}
}

/* Early Access Section */
@media (max-width: 768px) {
	.early-access {
		padding: var(--space-16) 0;
	}

	.early-access h2 {
		font-size: var(--text-3xl);
		margin-bottom: var(--space-8);
	}

	.email-form {
		padding: 0 var(--space-4);
	}
}

/* Footer */
@media (max-width: 768px) {
	footer {
		padding: var(--space-16) 0 var(--space-8);
	}

	.footer-content {
		padding: 0 var(--space-4);
		gap: var(--space-8);
	}

	.footer-main {
		flex-direction: column;
		gap: var(--space-8);
	}

	.social-links {
		gap: var(--space-4);
	}

	.legal-links {
		text-align: center;
	}
}