<![CDATA[<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Skincare Product Landing Page</title>
<!-- Fonts -->
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600&family=Playfair+Display:wght@500;700&display=swap" rel="stylesheet">
<style>
body { font-family: 'Inter', sans-serif; background-color: #f9f9f9; color: #333; }
h1, h2 { font-family: 'Playfair Display', serif; }
.hero-accent { background-color: #FFDE59; border-radius: 24px; width: 320px; height: 400px; position: relative; }
.product-card { transition: transform 0.3s ease; }
.product-card:hover { transform: translateY(-5px); }
</style>
</head>
<body>
<!-- NAV -->
<nav>
AS-SHAMIR
<a href="#">products</a>
<a href="#">story</a>
<a href="#">manufacturing</a>
<a href="#">team</a>
<button>🔍</button>
<button>👤</button>
<button>👜
0
</button>
</nav>
<!-- HERO -->
<main>
<!-- TEXT -->
<p>
Black Cumin | Cajuput Serum Concentrate
</p>
<h1>
Specific Skin <br> Concern
</h1>
<p>
Formulated to absorb deep into pores, this active serum helps to achieve blemish-free skin and smooth the complexion.
</p>
<button>
Add To Cart
</button>
$4.97
<!-- IMAGE -->
<img decoding="async"
src="https://images.unsplash.com/photo-1608248597279-f99d160bfcbc?q=80&w=800&auto=format&fit=crop"
alt="Serum Bottle"
>
</main>
<!-- SOCIAL -->
<section>
<h3>Trusted by 350,000+ Clients</h3>
<p>Worldwide since 2008</p>
<h2>4.6</h2>
<p>Ratings</p>
<h2>6M+</h2>
<p>Sales / Year</p>
</section>
<!-- PRODUCTS -->
<section>
<h2>Our Products</h2>
<!-- Product 1 -->
<img decoding="async" src="https://images.unsplash.com/photo-1598440947619-2c35fc9aa908?q=80&w=400">
<h4>Blueberry Jasmine</h4>
<p>$14.97</p>
<!-- Product 2 -->
<img decoding="async" src="https://images.unsplash.com/photo-1570197788417-0e82375c9371?q=80&w=400">
<h4>Rosehip Rose</h4>
<p>$18.50</p>
<!-- Product 3 -->
<img decoding="async" src="https://images.unsplash.com/photo-1611930022073-b7a4ba5fcccd?q=80&w=400">
<h4>Cajuput Serum</h4>
<p>$4.97</p>
<!-- Product 4 -->
<img decoding="async" src="https://images.unsplash.com/photo-1556228578-8c89e6adf883?q=80&w=400">
<h4>Green Tea Vitamin</h4>
<p>$22.00</p>
</section>
</body>
</html>]]>
