Skip to content

Commit e41e2a5

Browse files
DarkModder33DarkModder33
authored
Update meta description and improve styles
1 parent 3a107b0 commit e41e2a5

1 file changed

Lines changed: 42 additions & 80 deletions

File tree

‎index.html‎

Lines changed: 42 additions & 80 deletions
Original file line numberDiff line numberDiff line change
@@ -3,97 +3,59 @@
33
<head>
44
<meta charset="UTF-8">
55
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6-
<meta name="description" content="Heather Barile - Jersey Girl's Public Adjusting LLC. Independent licensed NJ Public Adjuster in Vineland. Personal advocacy for insurance claims. Free inspections & consultations.">
6+
<meta name="description" content="Heather Barile - Jersey Girl's Public Adjusting LLC. Independent licensed NJ Public Adjuster in Vineland. Personal advocacy for insurance claims. Free inspections. South Jersey families get every dollar they deserve.">
77
<title>Jersey Girl's Public Adjusting LLC | Heather Barile • Vineland, NJ</title>
88
<script src="https://cdn.tailwindcss.com"></script>
99
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
10-
<link href="https://fonts.googleapis.com/css2?family=Playfair+Display:wght@700&amp;family=Inter:wght@400;500;600&amp;display=swap" rel="stylesheet">
10+
<link href="https://fonts.googleapis.com/css2?family=Playfair+Display:wght@700&family=Inter:wght@400;500;600&display=swap" rel="stylesheet">
1111
<style>
12-
body { font-family: 'Inter', system_ui, sans-serif; }
12+
body { font-family: 'Inter', system-ui, sans-serif; }
1313
.heading { font-family: 'Playfair Display', serif; }
1414
.hero-bg { background: linear-gradient(rgba(6,95,70,0.85), rgba(6,95,70,0.85)), url('https://images.unsplash.com/photo-1560518883-ce09059eeffa?ixlib=rb-4.0.3&auto=format&fit=crop&q=80') center/cover no-repeat; }
15-
.step { transition: all 0.3s; }
16-
.chat-button { animation: pulse 2s infinite; }
17-
@keyframes pulse { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.05); } }
15+
.card-hover { transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1); }
16+
.card-hover:hover { transform: translateY(-8px); box-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1); }
1817
</style>
1918
</head>
2019
<body class="bg-stone-50 text-slate-800">
2120

22-
<!-- NAVBAR + HERO + TRUST BAR + SERVICES + PROCESS + ABOUT (kept exactly from your latest committed version for continuity) -->
23-
<!-- [Full previous sections omitted here for brevity – they remain 100% unchanged in the actual file] -->
24-
25-
<!-- NEW FEATURE #3: APPOINTMENT SCHEDULER -->
26-
<section class="py-16 bg-white border-t">
27-
<div class="max-w-4xl mx-auto px-6 text-center">
28-
<h2 class="heading text-5xl mb-6">Book Your Free Consultation with Heather</h2>
29-
<p class="text-slate-600 mb-8">Choose a time that works for you — Heather personally reviews every claim.</p>
30-
<!-- Replace with your Calendly embed link -->
31-
<div class="calendly-inline-widget" data-url="https://calendly.com/YOUR_CALENDLY_LINK?hide_event_type_details=1" style="min-width:320px;height:700px;"></div>
32-
<script type="text/javascript" src="https://assets.calendly.com/assets/external/widget.js" async></script>
21+
<!-- NAVBAR -->
22+
<nav class="bg-white shadow-sm sticky top-0 z-50">
23+
<div class="max-w-7xl mx-auto px-6 py-5 flex justify-between items-center">
24+
<div class="flex items-center gap-3">
25+
<span class="text-emerald-800 text-3xl font-bold tracking-tighter heading">Jersey Girl's</span>
26+
<span class="text-xs font-medium text-emerald-700 tracking-widest">PUBLIC ADJUSTING LLC</span>
27+
</div>
28+
<div class="hidden md:flex gap-8 text-sm font-medium">
29+
<a href="#services" class="hover:text-emerald-700">Services</a>
30+
<a href="#process" class="hover:text-emerald-700">Our Process</a>
31+
<a href="#heather" class="hover:text-emerald-700">Meet Heather</a>
32+
<a href="#contact" class="hover:text-emerald-700">Contact</a>
33+
</div>
34+
<a href="tel:8565286726" class="bg-emerald-800 text-white px-7 py-3 rounded-3xl font-semibold flex items-center gap-2 hover:bg-emerald-900 transition">
35+
<i class="fas fa-phone"></i> (856) 528-6726
36+
</a>
3337
</div>
34-
</section>
35-
36-
<!-- NEW FEATURE #2: MULTI-STEP FREE CLAIM REVIEW FORM -->
37-
<section id="contact" class="py-24 bg-stone-100">
38-
<div class="max-w-4xl mx-auto px-6">
39-
<h2 class="heading text-5xl text-center mb-12">Start Your Free Claim Review</h2>
40-
<form id="claimForm" action="https://formspree.io/f/YOUR_FORMSPREE_ID" method="POST" class="bg-white p-10 rounded-3xl shadow-xl">
41-
<!-- Step 1 -->
42-
<div id="step1" class="step">
43-
<h3 class="font-semibold text-xl mb-6">Step 1 of 3: Your Info</h3>
44-
<input type="text" name="name" placeholder="Full Name" required class="w-full border rounded-2xl px-6 py-4 mb-4">
45-
<input type="tel" name="phone" placeholder="Phone" required class="w-full border rounded-2xl px-6 py-4 mb-4">
46-
<button type="button" onclick="nextStep(2)" class="w-full bg-emerald-800 text-white py-5 rounded-3xl font-semibold">Continue →</button>
47-
</div>
48-
<!-- Step 2 -->
49-
<div id="step2" class="step hidden">
50-
<h3 class="font-semibold text-xl mb-6">Step 2 of 3: Claim Details</h3>
51-
<select name="claim-type" required class="w-full border rounded-2xl px-6 py-4 mb-4">
52-
<option value="">Type of Damage</option>
53-
<option>Water & Flood</option><option>Fire & Smoke</option><option>Wind & Storm</option>
54-
</select>
55-
<textarea name="message" placeholder="Brief description of damage & date" rows="4" class="w-full border rounded-2xl px-6 py-4"></textarea>
56-
<button type="button" onclick="nextStep(3)" class="w-full bg-emerald-800 text-white py-5 rounded-3xl font-semibold">Continue →</button>
57-
</div>
58-
<!-- Step 3 -->
59-
<div id="step3" class="step hidden">
60-
<h3 class="font-semibold text-xl mb-6">Step 3 of 3: Review & Submit</h3>
61-
<p class="text-sm text-slate-500 mb-6">Heather will contact you within 24 hours for a free in-person inspection.</p>
62-
<button type="submit" class="w-full bg-emerald-800 text-white py-5 rounded-3xl font-semibold">Submit for Free Review →</button>
63-
</div>
64-
</form>
38+
</nav>
39+
40+
<!-- HERO -->
41+
<section class="hero-bg h-screen flex items-center text-white">
42+
<div class="max-w-5xl mx-auto px-6 text-center">
43+
<p class="text-amber-200 uppercase tracking-widest text-sm font-medium mb-4">Independent • Woman-Owned • Vineland, NJ</p>
44+
<h1 class="heading text-6xl md:text-7xl leading-none font-bold">Your Personal Advocate.<br>Your Dedicated Fighter.</h1>
45+
<p class="mt-8 text-xl max-w-2xl mx-auto">Heather Barile personally handles every claim with the care and determination South Jersey families deserve.</p>
46+
<div class="mt-12 flex flex-wrap justify-center gap-6">
47+
<a href="#contact" class="bg-white text-emerald-900 px-10 py-5 rounded-3xl text-lg font-semibold hover:bg-amber-50 transition shadow-xl">Free Claim Review</a>
48+
<a href="tel:8565286726" class="border-2 border-white px-10 py-5 rounded-3xl text-lg font-semibold hover:bg-white/10 transition">Call Heather Directly</a>
49+
</div>
6550
</div>
6651
</section>
6752

68-
<!-- NEW FEATURE #1: FLOATING AI CHATBOT -->
69-
<button onclick="openChatbase()" class="chat-button fixed bottom-8 right-8 bg-emerald-800 text-white w-16 h-16 rounded-3xl shadow-2xl flex items-center justify-center text-3xl hover:bg-emerald-900 transition z-50">
70-
<i class="fas fa-comments"></i>
71-
</button>
72-
73-
<!-- FOOTER (unchanged) -->
74-
75-
<script>
76-
// Multi-step form logic
77-
function nextStep(step) {
78-
document.querySelectorAll('.step').forEach(s => s.classList.add('hidden'));
79-
document.getElementById('step' + step).classList.remove('hidden');
80-
}
81-
82-
// Chatbase AI Chatbot
83-
function openChatbase() {
84-
// Replace with your real Chatbase script once you have the ID
85-
window.open('https://www.chatbase.co/chatbot-iframe/YOUR_CHATBASE_ID', '_blank');
86-
// Or use the official embed script below (add this to <body> end if preferred)
87-
}
88-
89-
// Calendly already loaded via script tag above
90-
document.documentElement.style.setProperty('--tw-color-primary', '#065f46');
91-
</script>
92-
93-
<!-- Official Chatbase embed script (add your ID here) -->
94-
<script>
95-
// Paste your full Chatbase embed script from their dashboard here
96-
// Example: <script src="https://www.chatbase.co/embed.js" ...></script>
97-
</script>
98-
</body>
99-
</html>
53+
<!-- TRUST BAR -->
54+
<div class="bg-white py-7 border-b">
55+
<div class="max-w-6xl mx-auto px-6 grid grid-cols-2 md:grid-cols-5 gap-6 text-center text-sm font-medium text-slate-600">
56+
<div>✅ Licensed & Bonded NJ Public Adjuster</div>
57+
<div>👩‍💼 Woman-Owned & Independently Operated</div>
58+
<div>🔍 Free Home Inspections</div>
59+
<div>💰 No Upfront Fees – We Win Together</div>
60+
<div>🏠 South Jersey Local Since Day One</div>
61+
</

0 commit comments

Comments
 (0)