<script lang="ts">
	import WebHomePage from "$lib/components/WebHomePage.svelte";
	import MobileHomePage from "$lib/components/MobileHomePage.svelte";
</script>

<svelte:head>
	<title>Ethix - Home</title>
	<meta
		name="description"
		content="Ethix helps you make sustainable choices. Scan products, track your carbon footprint, and find eco-friendly alternatives."
	/>
</svelte:head>

<div class="web-view">
	<WebHomePage />
</div>

<div class="mobile-view">
	<MobileHomePage />
</div>

<style>
	.web-view {
		display: none;
	}

	.mobile-view {
		display: block;
	}

	@media (min-width: 768px) {
		.web-view {
			display: block;
		}
		.mobile-view {
			display: none;
		}
	}
</style>
