Zentlemen.vn

.ethos-quote i font-size: 1.2rem; font-weight: 400; color: #1e1e2a;

/* footer */ footer background: var(--deep-charcoal); color: #dddcdc; padding: 3rem 0 2rem; border-radius: 32px 32px 0 0; margin-top: 1rem;

/* product showcase */ .showcase padding: 5rem 0;

.feature-card background: white; padding: 1.8rem; border-radius: 28px; box-shadow: 0 5px 15px rgba(0,0,0,0.02); transition: all 0.2s; border: 1px solid var(--border-light); zentlemen.vn

<footer> <div class="container"> <div class="footer-inner"> <div class="footer-col"> <div class="logo-foot">ZENTLEMEN<span style="color: #c7a45b;">.vn</span></div> <p>District 1, Ho Chi Minh City</p> <p>hello@zentlemen.vn</p> <p>+84 28 1234 567</p> </div> <div class="footer-col"> <h4 style="color:white; margin-bottom: 0.8rem;">Explore</h4> <p><a href="#">Ready-to-wear</a></p> <p><a href="#">Made to measure</a></p> <p><a href="#">Grooming</a></p> <p><a href="#">Lookbook</a></p> </div> <div class="footer-col"> <h4 style="color:white; margin-bottom: 0.8rem;">Service</h4> <p><a href="#">Private appointments</a></p> <p><a href="#">Shipping & returns</a></p> <p><a href="#">Alterations</a></p> <p><a href="#">FAQs</a></p> </div> <div class="footer-col"> <h4 style="color:white; margin-bottom: 0.8rem;">Connect</h4> <p><a href="#">Instagram</a></p> <p><a href="#">Facebook</a></p> <p><a href="#">Journal</a></p> </div> </div> <div class="copyright"> © 2025 Zentlemen.vn — crafted for the modern gentleman. All rights reserved. </div> </div> </footer>

.product-info padding: 1.5rem;

.art-gent .icon-set font-size: 5rem; margin-bottom: 0.5rem; display: block; letter-spacing: 8px; .ethos-quote i font-size: 1.2rem

.logo font-size: 1.7rem; font-weight: 700; letter-spacing: -0.5px; text-decoration: none; color: var(--deep-charcoal);

@media (max-width: 800px) .navbar flex-direction: column; gap: 1rem; .hero-content h1 font-size: 2.5rem; .hero-content p max-width: 100%; .container padding: 0 1.5rem; .hero padding: 2rem 0 3rem; </style> </head> <body>

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover"> <title>Zentlemen.vn — Refined Modern Gentleman</title>  <link href="https://fonts.googleapis.com/css2?family=Inter:opsz,wght@14..32,300;14..32,400;14..32,500;14..32,600;14..32,700&display=swap" rel="stylesheet"> <style> * margin: 0; padding: 0; box-sizing: border-box; /* footer */ footer background: var(--deep-charcoal)

/* header & nav */ .navbar display: flex; justify-content: space-between; align-items: center; padding: 1.5rem 0; border-bottom: 1px solid var(--border-light); flex-wrap: wrap;

/* typography */ h1, h2, h3 font-weight: 600; letter-spacing: -0.02em;

.product-item:hover transform: translateY(-6px); box-shadow: 0 20px 30px -12px rgba(0,0,0,0.08);

<div class="newsletter"> <div class="container"> <div class="newsletter-card"> <h3>Join the inner circle</h3> <p style="margin-top: 0.5rem; max-width: 500px; margin-left: auto; margin-right: auto;">Be the first to experience new collections, exclusive events, and private trunk shows.</p> <div class="form-group"> <input type="email" placeholder="Your email address" id="newsEmail"> <button class="btn btn-primary" id="subscribeBtn">Subscribe</button> </div> <p style="font-size: 0.7rem; margin-top: 1rem; opacity: 0.7;">No spam, only timeless inspiration.</p> </div> </div> </div> </main>