255 lines
8.0 KiB
HTML
255 lines
8.0 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<title>Wise Hearted Event Decor - Website Demo & Revision Guide</title>
|
||
<style>
|
||
@page {
|
||
size: letter;
|
||
margin: 14mm 14mm;
|
||
}
|
||
* {
|
||
box-sizing: border-box;
|
||
margin: 0;
|
||
padding: 0;
|
||
}
|
||
body {
|
||
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
|
||
color: #1E293B;
|
||
background-color: #FFFFFF;
|
||
line-height: 1.5;
|
||
font-size: 13px;
|
||
-webkit-print-color-adjust: exact;
|
||
print-color-adjust: exact;
|
||
}
|
||
.header-bar {
|
||
background: #000000;
|
||
color: #FFFFFF;
|
||
padding: 22px 26px;
|
||
border-radius: 12px;
|
||
margin-bottom: 20px;
|
||
border: 2px solid #D4AF37;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
box-shadow: 0 4px 14px rgba(0,0,0,0.15);
|
||
}
|
||
.header-bar h1 {
|
||
font-size: 22px;
|
||
font-weight: 800;
|
||
color: #D4AF37;
|
||
margin-bottom: 3px;
|
||
letter-spacing: -0.01em;
|
||
}
|
||
.header-bar p {
|
||
font-size: 12px;
|
||
color: #FF3B94;
|
||
font-weight: 700;
|
||
text-transform: uppercase;
|
||
letter-spacing: 0.12em;
|
||
}
|
||
.badge-status {
|
||
background: linear-gradient(135deg, #FDF0CD 0%, #D4AF37 100%);
|
||
color: #080808;
|
||
font-size: 11px;
|
||
font-weight: 800;
|
||
padding: 6px 14px;
|
||
border-radius: 20px;
|
||
text-transform: uppercase;
|
||
letter-spacing: 0.05em;
|
||
}
|
||
.intro-box {
|
||
background-color: #FAF8F5;
|
||
border: 1px solid #E2E8F0;
|
||
border-left: 4px solid #D4AF37;
|
||
padding: 14px 18px;
|
||
border-radius: 8px;
|
||
margin-bottom: 18px;
|
||
font-size: 13px;
|
||
color: #334155;
|
||
}
|
||
.intro-box a {
|
||
color: #000000;
|
||
font-weight: 800;
|
||
text-decoration: underline;
|
||
text-decoration-color: #D4AF37;
|
||
text-underline-offset: 3px;
|
||
}
|
||
h2 {
|
||
font-size: 15px;
|
||
font-weight: 800;
|
||
color: #0F172A;
|
||
margin-top: 14px;
|
||
margin-bottom: 10px;
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 8px;
|
||
border-bottom: 1.5px solid #F1F5F9;
|
||
padding-bottom: 4px;
|
||
}
|
||
.card-grid {
|
||
display: grid;
|
||
grid-template-columns: 1fr 1fr;
|
||
gap: 12px;
|
||
margin-bottom: 16px;
|
||
}
|
||
.feature-card {
|
||
background: #FFFFFF;
|
||
border: 1px solid #E2E8F0;
|
||
border-radius: 8px;
|
||
padding: 12px 14px;
|
||
page-break-inside: avoid;
|
||
}
|
||
.feature-card h3 {
|
||
font-size: 13px;
|
||
font-weight: 700;
|
||
color: #000000;
|
||
margin-bottom: 4px;
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 6px;
|
||
}
|
||
.feature-card p {
|
||
font-size: 12px;
|
||
color: #475569;
|
||
line-height: 1.45;
|
||
}
|
||
.checklist-box {
|
||
background: #000000;
|
||
color: #FFFFFF;
|
||
border: 1.5px solid #D4AF37;
|
||
border-radius: 10px;
|
||
padding: 16px 20px;
|
||
margin-bottom: 16px;
|
||
page-break-inside: avoid;
|
||
}
|
||
.checklist-box h3 {
|
||
color: #D4AF37;
|
||
font-size: 14px;
|
||
font-weight: 800;
|
||
margin-bottom: 8px;
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 6px;
|
||
}
|
||
.checklist-box ul {
|
||
list-style: none;
|
||
padding: 0;
|
||
margin: 0;
|
||
display: grid;
|
||
grid-template-columns: 1fr 1fr;
|
||
gap: 8px 16px;
|
||
}
|
||
.checklist-box li {
|
||
font-size: 12px;
|
||
color: #E2E8F0;
|
||
display: flex;
|
||
align-items: flex-start;
|
||
gap: 8px;
|
||
line-height: 1.4;
|
||
}
|
||
.checklist-box li span.bullet {
|
||
color: #FF3B94;
|
||
font-weight: 800;
|
||
font-size: 13px;
|
||
}
|
||
.footer-note {
|
||
margin-top: 14px;
|
||
border-top: 1px solid #E2E8F0;
|
||
padding-top: 10px;
|
||
font-size: 11px;
|
||
color: #64748B;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
}
|
||
.btn-link {
|
||
color: #D4AF37;
|
||
font-weight: 700;
|
||
text-decoration: underline;
|
||
}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
|
||
<div class="header-bar">
|
||
<div>
|
||
<p>Called to Create. Enabled by God.</p>
|
||
<h1>Wise Hearted Event Decor</h1>
|
||
</div>
|
||
<div>
|
||
<span class="badge-status">✓ Live Demo Ready</span>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="intro-box">
|
||
<strong>Hi Jackie,</strong><br>
|
||
We have built and launched your new luxury event decor website based on your official Brand Board, color palette, 5 brand pillars, and portfolio photos! You can test and explore the live website here:<br>
|
||
👉 <a href="https://wise-hearted-decor.pages.dev" target="_blank"><strong>https://wise-hearted-decor.pages.dev</strong></a>
|
||
</div>
|
||
|
||
<h2>✨ What We Built & Designed for Your Brand</h2>
|
||
|
||
<div class="card-grid">
|
||
<div class="feature-card">
|
||
<h3><span>🖤</span> Jet Black & Gold Luxury Aesthetic</h3>
|
||
<p>Built on rich solid black (<code>#000000</code>) with 24k gold and vibrant hot pink highlights, matching your official brand cards.</p>
|
||
</div>
|
||
|
||
<div class="feature-card">
|
||
<h3><span>👑</span> Master 3D Gold Logo & Cross</h3>
|
||
<p>High-resolution 4X super-sampled 3D gold script emblem with the jewel magenta crystal cross and centered gold heart.</p>
|
||
</div>
|
||
|
||
<div class="feature-card">
|
||
<h3><span>✝️</span> The 5 Brand Pillars</h3>
|
||
<p>Highlighted Faith, Purpose, Wisdom, Love, and Creativity alongside your brand vibes (Faithful • Bold • Elegant • Empowering • Purposeful).</p>
|
||
</div>
|
||
|
||
<div class="feature-card">
|
||
<h3><span>📸</span> Filterable 9-Setup Portfolio</h3>
|
||
<p>Interactive gallery with category tabs (Weddings, Birthdays, Baby Showers, Themed, Specialty) and full-screen photo zoom.</p>
|
||
</div>
|
||
|
||
<div class="feature-card">
|
||
<h3><span>✨</span> Rising Gold Shimmer Particles</h3>
|
||
<p>Custom 60fps ambient gold and magenta sparkles drifting upward across the screen for an ultra-luxury, celebratory feel.</p>
|
||
</div>
|
||
|
||
<div class="feature-card">
|
||
<h3><span>📱</span> 95% Full-Width Mobile Experience</h3>
|
||
<p>Edge-to-edge layout built for iPhone and Android with big photo cards and effortless thumb-tap booking buttons.</p>
|
||
</div>
|
||
|
||
<div class="feature-card">
|
||
<h3><span>💬</span> Custom Event Inquiry Funnel</h3>
|
||
<p>Lead form capturing event date, venue location, party type, service checklist, budget tier, and custom color vision notes.</p>
|
||
</div>
|
||
|
||
<div class="feature-card">
|
||
<h3><span>🖼️</span> Favicons & Social Share Cards</h3>
|
||
<p>Custom preview thumbnails automatically appear whenever you share the website link in iMessage, SMS, WhatsApp, or Instagram.</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="checklist-box">
|
||
<h3><span>📋</span> Jackie’s Feedback & Customization Checklist</h3>
|
||
<p style="font-size: 11.5px; color: #CBD5E1; margin-bottom: 10px;">Please review the live demo and let us know what you would like to adjust, add, or refine:</p>
|
||
<ul>
|
||
<li><span class="bullet">✦</span> <strong>About Us Story:</strong> Send your personal bio or any custom story copy you’d like for the About section.</li>
|
||
<li><span class="bullet">✦</span> <strong>Services & Packages:</strong> Any specific package tiers, add-on options, or starting prices you'd like listed.</li>
|
||
<li><span class="bullet">✦</span> <strong>Service Area / Cities:</strong> Which cities or regions would you like highlighted (e.g., DFW, Southlake, Dallas)?</li>
|
||
<li><span class="bullet">✦</span> <strong>Contact Channels:</strong> What phone number, booking email, or Instagram handle (<code>@...</code>) should we link?</li>
|
||
<li><span class="bullet">✦</span> <strong>Photo Updates:</strong> Any additional event photos to feature or replace in the gallery.</li>
|
||
<li><span class="bullet">✦</span> <strong>Booking Form Fields:</strong> Any additional questions you’d like to ask clients during intake.</li>
|
||
</ul>
|
||
</div>
|
||
|
||
<div class="footer-note">
|
||
<span>Live URL: <a class="btn-link" href="https://wise-hearted-decor.pages.dev" target="_blank">wise-hearted-decor.pages.dev</a></span>
|
||
<span>Wise Hearted Event Decor • Called to Create. Enabled by God.</span>
|
||
</div>
|
||
|
||
</body>
|
||
</html>
|