EasonCoverage.com — Elementor Build Guide

EasonCoverage.com

Complete Elementor Free Build Guide — All 8 Pages + Global CSS + Copy-Paste Code Snippets

📌 How to use this guide: Start with the 4 Setup steps, then build each page in order. Each section tells you exactly which Elementor widget to use, what content to paste, and what settings to apply. Complex sections have ready-made HTML snippets you paste into an HTML widget.

Step 1 — Add Google Fonts to WordPress

The design uses two fonts: Lora (headings) and Nunito (body text).

1Go to: `Appearance → Customize → Additional CSS`

Paste this at the very top of the CSS box (before anything else):

@import url('https://fonts.googleapis.com/css2?family=Lora:wght@400;600;700&family=Nunito:wght@400;500;600;700;800&display=swap');

2In Elementor: `Elementor → Settings → Style`

Set Default Generic Fonts to: Nunito, sans-serif

Step 2 — Paste Global CSS

Go to Appearance → Customize → Additional CSS and paste ALL of this below the @import line:

/* ===== EASONCOVERAGE.COM GLOBAL STYLES ===== */
:root {
  --navy: #1a2e4a;
  --navy-light: #243d5e;
  --teal: #2a9d8f;
  --teal-light: #3ab5a5;
  --teal-dark: #1f7a6e;
  --gray-50: #f8f9fb;
  --gray-100: #f0f2f6;
  --gray-200: #e2e6ee;
  --gray-700: #4a5568;
  --gray-900: #1a202c;
}

/* Body Font */
body { font-family: 'Nunito', sans-serif; color: var(--gray-900); }

/* Headings */
h1, h2, h3, h4,
.elementor-heading-title {
  font-family: 'Lora', serif !important;
  color: var(--navy);
}

/* Eason Buttons */
.eason-btn {
  display: inline-block; font-family: 'Nunito', sans-serif;
  font-weight: 700; font-size: 0.95rem; padding: 13px 28px;
  border-radius: 8px; border: 2px solid transparent;
  cursor: pointer; transition: all 0.22s; text-decoration: none;
  line-height: 1; text-align: center;
}
.eason-btn-primary { background: var(--teal); color: #fff; border-color: var(--teal); }
.eason-btn-primary:hover { background: var(--teal-dark); border-color: var(--teal-dark); color: #fff; transform: translateY(-1px); }
.eason-btn-secondary { background: #fff; color: var(--navy); border-color: var(--navy); }
.eason-btn-secondary:hover { background: var(--navy); color: #fff; }
.eason-btn-outline-white { background: transparent; color: #fff; border-color: #fff; }
.eason-btn-outline-white:hover { background: #fff; color: var(--navy); }
.eason-btn-outline-teal { background: transparent; color: var(--teal); border-color: var(--teal); }
.eason-btn-outline-teal:hover { background: var(--teal); color: #fff; }
.eason-btn-lg { padding: 16px 36px; font-size: 1.05rem; }

/* Cards */
.eason-card {
  background: #fff; border-radius: 18px;
  box-shadow: 0 4px 16px rgba(0,0,0,0.10); border: 1px solid var(--gray-200);
  padding: 32px; transition: transform 0.22s, box-shadow 0.22s;
}
.eason-card:hover { transform: translateY(-3px); box-shadow: 0 10px 40px rgba(0,0,0,0.12); }
.eason-card-icon {
  width: 56px; height: 56px; border-radius: 12px;
  background: rgba(42,157,143,0.12); display: flex;
  align-items: center; justify-content: center; margin-bottom: 20px;
}

/* Checklist */
.eason-checklist { list-style: none; padding: 0; }
.eason-checklist li {
  display: flex; align-items: flex-start; gap: 10px;
  padding: 8px 0; color: var(--gray-700); font-size: 0.95rem;
  border-bottom: 1px solid var(--gray-100);
}
.eason-checklist li:last-child { border-bottom: none; }
.eason-checklist li::before {
  content: '✓'; flex-shrink: 0; width: 22px; height: 22px;
  border-radius: 50%; background: rgba(42,157,143,0.15);
  color: var(--teal); font-weight: 700; font-size: 0.75rem;
  display: flex; align-items: center; justify-content: center; margin-top: 1px;
}

/* Note Box */
.eason-note {
  background: rgba(42,157,143,0.08); border-left: 4px solid var(--teal);
  border-radius: 0 8px 8px 0; padding: 16px 20px; margin: 16px 0;
}
.eason-note p { color: var(--gray-700); font-size: 0.9rem; margin: 0; }
.eason-note-warning {
  background: rgba(220,53,69,0.07); border-left: 4px solid #dc3545;
  border-radius: 0 8px 8px 0; padding: 16px 20px; margin: 16px 0;
}
.eason-note-warning p { color: var(--gray-700); font-size: 0.9rem; margin: 0; }

/* Trust Badges */
.eason-trust-badges { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 20px; }
.eason-badge {
  display: flex; align-items: center; gap: 7px;
  background: rgba(255,255,255,0.12); border: 1px solid rgba(255,255,255,0.2);
  border-radius: 8px; padding: 7px 13px;
  color: rgba(255,255,255,0.9); font-size: 0.84rem; font-weight: 600;
  font-family: 'Nunito', sans-serif;
}
.eason-badge::before { content: '✓'; color: var(--teal); font-weight: 800; }

/* Step Numbers */
.eason-step-num {
  width: 56px; height: 56px; border-radius: 50%;
  background: var(--navy); color: #fff; font-family: 'Lora', serif;
  font-size: 1.3rem; font-weight: 700; display: flex;
  align-items: center; justify-content: center; margin: 0 auto 14px;
}

/* Pricing Cards */
.eason-pricing-header {
  background: var(--navy); padding: 28px 32px;
  border-radius: 14px 14px 0 0;
}
.eason-pricing-header h3 { color: #fff; font-family: 'Lora', serif; margin-bottom: 8px; }
.eason-price-main { font-family: 'Lora', serif; font-size: 2rem; font-weight: 700; color: var(--teal); }
.eason-pricing-body {
  background: #fff; padding: 28px 32px;
  border-radius: 0 0 14px 14px;
  border: 1px solid var(--gray-200); border-top: none;
}

/* Bullet list */
.eason-bullets { list-style: none; padding: 0; }
.eason-bullets li {
  display: flex; align-items: flex-start; gap: 8px;
  padding: 5px 0; color: var(--gray-700); font-size: 0.95rem;
}
.eason-bullets li::before {
  content: ''; flex-shrink: 0; width: 7px; height: 7px;
  border-radius: 50%; background: var(--teal); margin-top: 8px;
}

/* Forms */
.eason-form-wrap {
  background: #fff; border-radius: 20px;
  box-shadow: 0 10px 40px rgba(0,0,0,0.12);
  border: 1px solid var(--gray-200); padding: 40px 44px;
}
.eason-form-section {
  font-family: 'Nunito', sans-serif; font-weight: 800; font-size: 0.75rem;
  text-transform: uppercase; letter-spacing: 0.1em; color: var(--teal);
  margin: 28px 0 14px; padding-bottom: 7px; border-bottom: 2px solid var(--teal);
}
.eason-form-wrap input, .eason-form-wrap select, .eason-form-wrap textarea {
  width: 100%; padding: 12px 15px; border: 2px solid var(--gray-200);
  border-radius: 8px; font-family: 'Nunito', sans-serif;
  font-size: 0.95rem; color: var(--gray-900); margin-bottom: 14px;
  transition: border-color 0.2s; outline: none;
}
.eason-form-wrap input:focus, .eason-form-wrap select:focus, .eason-form-wrap textarea:focus {
  border-color: var(--teal); box-shadow: 0 0 0 3px rgba(42,157,143,0.15);
}
.eason-form-wrap label {
  display: block; font-weight: 700; font-size: 0.875rem;
  color: var(--navy); margin-bottom: 5px;
}
.eason-form-wrap textarea { min-height: 110px; resize: vertical; }
.eason-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.eason-form-wrap .radio-group { display: flex; flex-direction: column; gap: 8px; margin-bottom: 14px; }
.eason-form-wrap .radio-item { display: flex; align-items: center; gap: 8px; cursor: pointer; }
.eason-form-wrap .radio-item input { width: auto; padding: 0; margin: 0; accent-color: var(--teal); }
.eason-consent-box {
  background: var(--gray-50); border: 2px solid var(--gray-200);
  border-radius: 8px; padding: 14px 16px; margin: 16px 0;
}
.eason-field-error { color: #dc3545; font-size: 0.8rem; margin-top: -10px; margin-bottom: 10px; font-weight: 600; display: none; }
.eason-field-error.show { display: block; }
.eason-success-msg {
  display: none; background: rgba(40,167,69,0.1); border: 1px solid rgba(40,167,69,0.3);
  border-radius: 8px; padding: 14px 18px; color: #1a5e2a;
  font-weight: 600; margin-top: 12px;
}
.eason-success-msg.show { display: block; }

/* Contact Info Cards */
.eason-contact-card {
  background: var(--gray-50); border-radius: 12px;
  border: 1px solid var(--gray-200); padding: 22px;
}
.eason-contact-card h4 {
  font-family: 'Nunito', sans-serif; font-size: 0.8rem;
  text-transform: uppercase; letter-spacing: 0.07em;
  color: #8892a4; margin-bottom: 8px; font-weight: 700;
}
.eason-contact-card p, .eason-contact-card a { color: var(--navy); font-weight: 600; font-size: 0.95rem; margin: 0; }
.eason-contact-card a { color: var(--teal); text-decoration: none; }

/* Value Cards */
.eason-value-card {
  background: var(--navy); border-radius: 18px;
  padding: 28px; margin-bottom: 4px;
}
.eason-value-card h3 { color: var(--teal); font-family: 'Lora', serif; margin-bottom: 10px; }
.eason-value-card p { color: rgba(255,255,255,0.72); font-size: 0.93rem; margin: 0; }

/* Thank You */
.eason-thankyou-icon {
  width: 80px; height: 80px; border-radius: 50%;
  background: rgba(42,157,143,0.15); display: flex;
  align-items: center; justify-content: center;
  font-size: 2rem; margin: 0 auto 20px;
}

/* Stat Cards */
.eason-stat { background: #fff; border-radius: 14px; box-shadow: 0 4px 16px rgba(0,0,0,0.08); border: 1px solid var(--gray-200); padding: 24px; text-align: center; }
.eason-stat-num { font-family: 'Lora', serif; font-size: 2.2rem; font-weight: 700; color: var(--teal); }
.eason-stat-label { font-size: 0.875rem; color: var(--gray-700); margin-top: 6px; font-weight: 600; }

/* Mobile Responsive */
@media (max-width: 767px) {
  .eason-form-row { grid-template-columns: 1fr; }
  .eason-form-wrap { padding: 22px 18px; }
  .eason-trust-badges { flex-direction: column; }
}

✅ Click Publish after pasting the CSS. This applies all colors, fonts, cards, buttons, and form styling site-wide to every page.

Step 3 — Elementor Global Settings

1Go to Elementor → Settings → Style

Default Generic Fonts → Nunito, sans-serif
Page Title → Disabled (Elementor controls headings)

2For each page in WordPress: Pages → Add New

Set the page template to Elementor Canvas or Elementor Full Width (removes the theme's default header/footer so Elementor controls everything)
Click Edit with Elementor

⚠️ Important: If you want to use your Blosky theme's header and footer, choose Elementor Full Width. If you want a fully custom layout, choose Elementor Canvas. For this site, use Elementor Full Width and style your theme header via Blosky's settings.

Step 4 — Color Reference

Name	Hex Code	Where Used
Navy	`#1a2e4a`	Header background, headings, section backgrounds
Teal	`#2a9d8f`	Primary buttons, accents, icons, highlights
Gray 50	`#f8f9fb`	Alternating section backgrounds
Gray 700	`#4a5568`	Body text, paragraphs
White	`#ffffff`	Card backgrounds, text on dark sections

Section 1 — Hero

Use the HTML widget for the hero. It has trust badges and a complex layout that's easiest to paste in.

Section 2 — How We Can Help (3 Service Cards)

Section 3 — Why Choose Us

HTML widget: Paste the stats box snippet below

<div style="background:#1a2e4a;border-radius:20px;padding:32px;">
  <p style="color:rgba(255,255,255,0.45);font-size:0.75rem;text-transform:uppercase;letter-spacing:0.1em;font-weight:700;margin-bottom:18px;">Our Reach</p>
  <div style="display:grid;grid-template-columns:1fr 1fr;gap:14px;">
    <div style="background:rgba(255,255,255,0.07);border-radius:10px;padding:18px;text-align:center;">
      <div style="font-family:'Lora',serif;font-size:1.8rem;font-weight:700;color:#2a9d8f;">2022</div>
      <div style="color:rgba(255,255,255,0.6);font-size:0.8rem;margin-top:4px;font-weight:600;">Founded</div>
    </div>
    <div style="background:rgba(255,255,255,0.07);border-radius:10px;padding:18px;text-align:center;">
      <div style="font-family:'Lora',serif;font-size:1.8rem;font-weight:700;color:#2a9d8f;">Queens</div>
      <div style="color:rgba(255,255,255,0.6);font-size:0.8rem;margin-top:4px;font-weight:600;">Service Area</div>
    </div>
    <div style="background:rgba(255,255,255,0.07);border-radius:10px;padding:18px;text-align:center;">
      <div style="font-family:'Lora',serif;font-size:1.8rem;font-weight:700;color:#2a9d8f;">3+</div>
      <div style="color:rgba(255,255,255,0.6);font-size:0.8rem;margin-top:4px;font-weight:600;">Core Services</div>
    </div>
    <div style="background:rgba(255,255,255,0.07);border-radius:10px;padding:18px;text-align:center;">
      <div style="font-family:'Lora',serif;font-size:1.8rem;font-weight:700;color:#2a9d8f;">Free</div>
      <div style="color:rgba(255,255,255,0.6);font-size:0.8rem;margin-top:4px;font-weight:600;">Claims Consult</div>
    </div>
  </div>
</div>

Section 4 — Our Simple Process (4 Steps)

Section 5 — Bottom CTA

Section 1 — Page Hero

Sections 2–4 — Three Service Blocks

Repeat this layout 3 times (one per service). Alternate section background: white / #f8f9fb / white.

Service	Heading	Button Text	Button Link
01	Auto Insurance Intermediary Services	Request an Auto Insurance Quote	/auto-insurance-quote
02	Commercial Vehicle Insurance Assistance	Contact Us About Commercial Vehicle Coverage	/contact
03	Auto Accident Claims Process Assistance	Free Claims Consultation	/claims-assistance

Final CTA Section

HTML widget: Consultation card

<div class="eason-card">
  <h3 style="color:#2a9d8f;margin-bottom:14px;">Free Claims Consultation</h3>
  <p style="margin-bottom:16px;">We offer a free initial claims consultation to better understand your accident situation and explain how we may be able to assist.</p>
  <a href="/contact" class="eason-btn eason-btn-primary" style="display:block;text-align:center;margin-bottom:10px;">Request Free Consultation</a>
  <a href="tel:+13475068180" class="eason-btn eason-btn-secondary" style="display:block;text-align:center;">📞 Call (347) 506-8180</a>
</div>

HTML:

<div style="display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:16px;">
  <div class="eason-stat"><div class="eason-stat-num">2022</div><div class="eason-stat-label">Year Founded</div></div>
  <div class="eason-stat"><div class="eason-stat-num">Queens</div><div class="eason-stat-label">Service Area</div></div>
  <div class="eason-stat"><div class="eason-stat-num">Free</div><div class="eason-stat-label">Claims Consultation</div></div>
  <div class="eason-stat"><div class="eason-stat-num">3+</div><div class="eason-stat-label">Core Services</div></div>
</div>
<div style="background:#f8f9fb;border-radius:14px;padding:24px;border:1px solid #e2e6ee;">
  <h4 style="color:#1a2e4a;margin-bottom:12px;">Our Mission</h4>
  <p style="color:#4a5568;font-size:0.95rem;">Our mission is to provide clear, patient, and professional support for vehicle owners who need help understanding auto insurance options or navigating the claims process after an accident.</p>
</div>

Values cards — paste this:

<div style="display:grid;grid-template-columns:repeat(4,1fr);gap:16px;">
  <div class="eason-value-card"><h3>Clarity</h3><p>We explain the process in simple language so clients can better understand their options.</p></div>
  <div class="eason-value-card"><h3>Responsibility</h3><p>We take each client's situation seriously and provide patient, attentive support.</p></div>
  <div class="eason-value-card"><h3>Transparency</h3><p>We clearly explain our service scope, service fees, and limitations upfront.</p></div>
  <div class="eason-value-card"><h3>Professional Support</h3><p>We help clients stay organized and better prepared throughout the process.</p></div>
</div>

All 4 pricing cards — paste this:

<div style="display:grid;grid-template-columns:1fr 1fr;gap:20px;">
  <div style="border-radius:14px;overflow:hidden;box-shadow:0 4px 16px rgba(0,0,0,0.1);border:1px solid #e2e6ee;">
    <div class="eason-pricing-header">
      <h3>Free Claims Consultation</h3>
      <div><span class="eason-price-main">Free</span> <span style="color:rgba(255,255,255,0.55);font-size:0.9rem;">Initial Consultation</span></div>
    </div>
    <div class="eason-pricing-body">
      <p style="color:#4a5568;margin-bottom:18px;">We offer a free initial consultation for auto accident claims process assistance.</p>
      <a href="/claims-assistance" class="eason-btn eason-btn-primary" style="display:inline-block;">Request Free Claims Consultation</a>
    </div>
  </div>
  <div style="border-radius:14px;overflow:hidden;box-shadow:0 4px 16px rgba(0,0,0,0.1);border:1px solid #e2e6ee;">
    <div class="eason-pricing-header">
      <h3>Auto Insurance Services</h3>
      <div><span class="eason-price-main" style="font-size:1.5rem;">Service Fee</span> <span style="color:rgba(255,255,255,0.55);font-size:0.9rem;">May Apply</span></div>
    </div>
    <div class="eason-pricing-body">
      <p style="color:#4a5568;margin-bottom:18px;">We provide auto insurance consultation and application assistance. Service fees may apply.</p>
      <a href="/auto-insurance-quote" class="eason-btn eason-btn-primary" style="display:inline-block;">Request an Auto Insurance Quote</a>
    </div>
  </div>
  <div style="border-radius:14px;overflow:hidden;box-shadow:0 4px 16px rgba(0,0,0,0.1);border:1px solid #e2e6ee;">
    <div class="eason-pricing-header">
      <h3>Commercial Vehicle Assistance</h3>
      <div><span class="eason-price-main" style="font-size:1.3rem;">Contact Us</span> <span style="color:rgba(255,255,255,0.55);font-size:0.9rem;">for Details</span></div>
    </div>
    <div class="eason-pricing-body">
      <p style="color:#4a5568;margin-bottom:18px;">We assist drivers and business owners with commercial vehicle insurance support.</p>
      <a href="/contact" class="eason-btn eason-btn-primary" style="display:inline-block;">Contact Us</a>
    </div>
  </div>
  <div style="border-radius:14px;overflow:hidden;box-shadow:0 4px 16px rgba(0,0,0,0.1);border:1px solid #e2e6ee;">
    <div class="eason-pricing-header">
      <h3>Claims Process Assistance</h3>
      <div><span class="eason-price-main" style="font-size:1.3rem;">Contact Us</span> <span style="color:rgba(255,255,255,0.55);font-size:0.9rem;">for Details</span></div>
    </div>
    <div class="eason-pricing-body">
      <p style="color:#4a5568;margin-bottom:18px;">Service fees may apply for documentation support and communication assistance after free consultation.</p>
      <a href="tel:+13475068180" class="eason-btn eason-btn-primary" style="display:inline-block;">📞 Call (347) 506-8180</a>
    </div>
  </div>
</div>

HTML widget: Contact info cards

<div style="display:flex;flex-direction:column;gap:14px;">
  <div class="eason-contact-card">
    <h4>📍 Office Address</h4>
    <p>Eason Consulting Services Inc</p>
    <p>146-07 34 Ave, Room A<br>Flushing, NY 11354</p>
  </div>
  <div class="eason-contact-card">
    <h4>📞 Phone</h4>
    <a href="tel:+13475068180">(347) 506-8180</a>
  </div>
  <div class="eason-contact-card">
    <h4>✉️ Email</h4>
    <a href="mailto:info@EasonCoverage.com">info@EasonCoverage.com</a>
  </div>
  <div class="eason-contact-card">
    <h4>🕐 Business Hours</h4>
    <p>Monday – Friday: 9:00 AM – 5:00 PM</p>
    <p>Saturday: Closed | Sunday: Closed</p>
  </div>
</div>

<div style="max-width:520px;margin:0 auto;background:#fff;border-radius:20px;box-shadow:0 10px 40px rgba(0,0,0,0.12);border:1px solid #e2e6ee;padding:52px 44px;text-align:center;">
  <div class="eason-thankyou-icon">✓</div>
  <h1 style="font-family:'Lora',serif;color:#1a2e4a;margin-bottom:14px;">Thank You</h1>
  <p style="color:#4a5568;margin-bottom:8px;">Your request has been received. Eason Consulting Services Inc will contact you shortly.</p>
  <p style="color:#4a5568;">For faster assistance, call us at <a href="tel:+13475068180" style="color:#2a9d8f;font-weight:700;">(347) 506-8180</a>.</p>
  <div style="display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:28px;">
    <a href="tel:+13475068180" class="eason-btn eason-btn-primary eason-btn-lg">📞 Call Now</a>
    <a href="/" class="eason-btn eason-btn-secondary eason-btn-lg">Back to Home</a>
  </div>
</div>

📌 HTML Snippet — Page Hero

Paste into an HTML widget inside a Section with background #1a2e4a, padding 72px top/bottom. Replace BREADCRUMB, H1 TEXT, and SUBTEXT each time.

<div style="max-width:1100px;margin:0 auto;padding:0 24px;">
  <p style="color:rgba(255,255,255,0.45);font-size:0.75rem;text-transform:uppercase;letter-spacing:0.1em;font-weight:700;margin-bottom:12px;">BREADCRUMB</p>
  <h1 style="font-family:'Lora',serif;color:#fff;font-size:clamp(2rem,4vw,2.8rem);font-weight:700;margin-bottom:16px;line-height:1.25;">H1 TEXT</h1>
  <p style="color:rgba(255,255,255,0.75);font-size:1.05rem;max-width:660px;line-height:1.7;margin-bottom:24px;">SUBTEXT</p>
  <!-- Optional buttons -->
  <div style="display:flex;flex-wrap:wrap;gap:12px;">
    <a href="/contact" class="eason-btn eason-btn-primary eason-btn-lg">Free Claims Consultation</a>
    <a href="tel:+13475068180" class="eason-btn eason-btn-outline-white eason-btn-lg">📞 Call (347) 506-8180</a>
  </div>
</div>

📌 HTML Snippet — Home Hero (with trust badges)

<div style="max-width:1100px;margin:0 auto;padding:0 24px;">
  <p style="color:#2a9d8f;font-size:0.75rem;text-transform:uppercase;letter-spacing:0.12em;font-weight:800;margin-bottom:12px;">Auto Insurance & Claims Assistance — Flushing, NY</p>
  <h1 style="font-family:'Lora',serif;color:#fff;font-size:clamp(2rem,4vw,2.8rem);font-weight:700;margin-bottom:16px;line-height:1.25;">Auto Insurance & Accident Claims Assistance in Queens, NY</h1>
  <p style="color:rgba(255,255,255,0.78);font-size:1.08rem;max-width:660px;line-height:1.7;margin-bottom:24px;">Eason Consulting Services Inc helps vehicle owners in Queens navigate auto insurance applications, commercial vehicle coverage, and post-accident claims procedures with clear communication and professional support.</p>
  <div style="display:flex;flex-wrap:wrap;gap:12px;margin-bottom:24px;">
    <a href="/auto-insurance-quote" class="eason-btn eason-btn-primary eason-btn-lg">Get an Auto Insurance Quote</a>
    <a href="/claims-assistance" class="eason-btn eason-btn-outline-white eason-btn-lg">Free Claims Consultation</a>
    <a href="tel:+13475068180" class="eason-btn eason-btn-outline-white eason-btn-lg">📞 Call (347) 506-8180</a>
  </div>
  <div class="eason-trust-badges">
    <span class="eason-badge">Located in Flushing, NY</span>
    <span class="eason-badge">Chinese-Language Support</span>
    <span class="eason-badge">Insurance Application Assistance</span>
    <span class="eason-badge">Claims Process Guidance</span>
    <span class="eason-badge">Commercial Vehicle Support</span>
  </div>
</div>

📌 HTML Snippet — 3 Service Cards

<div style="display:grid;grid-template-columns:repeat(3,1fr);gap:22px;max-width:1100px;margin:0 auto;">
  <div class="eason-card">
    <div class="eason-card-icon">🏷️</div>
    <h3 style="font-family:'Lora',serif;color:#1a2e4a;margin-bottom:10px;">Auto Insurance Intermediary Services</h3>
    <p style="color:#4a5568;font-size:0.93rem;margin-bottom:20px;">We assist clients with auto insurance consultation, application support, and coverage option guidance based on individual needs.</p>
    <a href="/auto-insurance-quote" class="eason-btn eason-btn-outline-teal eason-btn-sm">Request a Quote</a>
  </div>
  <div class="eason-card">
    <div class="eason-card-icon">📋</div>
    <h3 style="font-family:'Lora',serif;color:#1a2e4a;margin-bottom:10px;">Auto Accident Claims Assistance</h3>
    <p style="color:#4a5568;font-size:0.93rem;margin-bottom:20px;">We help clients understand post-accident procedures, prepare basic documentation, and coordinate communication with repair shops and insurance companies.</p>
    <a href="/claims-assistance" class="eason-btn eason-btn-outline-teal eason-btn-sm">Free Claims Consultation</a>
  </div>
  <div class="eason-card">
    <div class="eason-card-icon">🚛</div>
    <h3 style="font-family:'Lora',serif;color:#1a2e4a;margin-bottom:10px;">Commercial Vehicle Insurance Support</h3>
    <p style="color:#4a5568;font-size:0.93rem;margin-bottom:20px;">We assist business owners and drivers who use vehicles for work with commercial vehicle insurance consultation and application support.</p>
    <a href="/services" class="eason-btn eason-btn-outline-teal eason-btn-sm">View Services</a>
  </div>
</div>

📌 HTML Snippet — 4 Process Steps

<div style="display:grid;grid-template-columns:repeat(4,1fr);gap:24px;text-align:center;max-width:1100px;margin:0 auto;">
  <div>
    <div class="eason-step-num">1</div>
    <h4 style="font-family:'Lora',serif;color:#1a2e4a;margin-bottom:8px;">Contact Us</h4>
    <p style="color:#4a5568;font-size:0.9rem;">Call us or submit a form online.</p>
  </div>
  <div>
    <div class="eason-step-num">2</div>
    <h4 style="font-family:'Lora',serif;color:#1a2e4a;margin-bottom:8px;">Share Your Situation</h4>
    <p style="color:#4a5568;font-size:0.9rem;">Tell us about your insurance needs, vehicle, or accident situation.</p>
  </div>
  <div>
    <div class="eason-step-num">3</div>
    <h4 style="font-family:'Lora',serif;color:#1a2e4a;margin-bottom:8px;">Receive Guidance</h4>
    <p style="color:#4a5568;font-size:0.9rem;">We explain available options, required information, and next steps.</p>
  </div>
  <div>
    <div class="eason-step-num">4</div>
    <h4 style="font-family:'Lora',serif;color:#1a2e4a;margin-bottom:8px;">Move Forward With Confidence</h4>
    <p style="color:#4a5568;font-size:0.9rem;">Our team helps you stay organized throughout the insurance or claims process.</p>
  </div>
</div>

📌 HTML Snippet — Checklist

<ul class="eason-checklist">
  <li>Founded in 2022 — serving Queens since day one</li>
  <li>Local Flushing office for in-person visits</li>
  <li>Serving vehicle owners throughout Queens, NY</li>
  <li>Chinese-language support available</li>
  <li>Patient step-by-step guidance throughout</li>
  <li>Clear explanation of service scope and fees</li>
  <li>Auto insurance and claims process support</li>
</ul>

📌 HTML Snippet — Note Box (Info + Warning)

<!-- Info Note -->
<div class="eason-note">
  <p><strong>Note:</strong> Service fees may apply for auto insurance consultation and application assistance.</p>
</div>

<!-- Warning Note -->
<div class="eason-note-warning">
  <p><strong>Important:</strong> Eason Consulting Services Inc provides accident claims process assistance only. We do not provide legal services, settlement negotiations, or guarantees of claim approval or compensation amounts.</p>
</div>

📌 HTML Snippet — CTA Band

Use inside a Section with background #1a2e4a, padding 64px top/bottom, centered text. Replace heading and subtext as needed per page.

<div style="max-width:680px;margin:0 auto;text-align:center;padding:0 24px;">
  <p style="color:#2a9d8f;font-size:0.75rem;text-transform:uppercase;letter-spacing:0.12em;font-weight:800;margin-bottom:10px;">Get Started Today</p>
  <h2 style="font-family:'Lora',serif;color:#fff;margin-bottom:14px;">Need Help With Auto Insurance or an Accident Claim?</h2>
  <p style="color:rgba(255,255,255,0.72);font-size:1.02rem;margin-bottom:24px;">Speak with Eason Consulting Services Inc today. We can help you understand the next steps and guide you through the process.</p>
  <div style="display:flex;flex-wrap:wrap;justify-content:center;gap:12px;">
    <a href="tel:+13475068180" class="eason-btn eason-btn-primary eason-btn-lg">📞 Call (347) 506-8180</a>
    <a href="/auto-insurance-quote" class="eason-btn eason-btn-outline-white eason-btn-lg">Get a Quote</a>
    <a href="/contact" class="eason-btn eason-btn-outline-white eason-btn-lg">Contact Us</a>
  </div>
</div>

📌 HTML Snippet — Full Quote Form

Paste this entire block into a single HTML widget on the Auto Insurance Quote page:

<div class="eason-form-wrap" style="max-width:780px;margin:0 auto;">
  <h2 style="font-family:'Lora',serif;color:#1a2e4a;margin-bottom:6px;">Personal Auto Quote Form</h2>
  <p style="color:#8892a4;font-size:0.88rem;margin-bottom:0;">Fields marked <span style="color:#dc3545;">*</span> are required.</p>
  <div class="eason-note-warning" style="margin-top:18px;"><p><strong>Important:</strong> Submitting this form does not guarantee insurance approval, policy issuance, pricing, or coverage. Final policy terms, premiums, and approval are determined by the insurance company.</p></div>

  <form id="eason-quote-form" novalidate>
    <p class="eason-form-section">Section A — Contact Information</p>
    <label for="eq-name">Full Name <span style="color:#dc3545;">*</span></label>
    <input type="text" id="eq-name" placeholder="John Smith" required>
    <p class="eason-field-error" id="eq-name-err">Please enter your full name.</p>
    <div class="eason-form-row">
      <div><label for="eq-phone">Phone Number <span style="color:#dc3545;">*</span></label><input type="tel" id="eq-phone" placeholder="(000) 000-0000" required><p class="eason-field-error" id="eq-phone-err">Please enter your phone number.</p></div>
      <div><label for="eq-email">Email Address <span style="color:#dc3545;">*</span></label><input type="email" id="eq-email" placeholder="your@email.com" required><p class="eason-field-error" id="eq-email-err">Please enter a valid email.</p></div>
    </div>
    <label for="eq-address">Address, City, State, ZIP <span style="color:#dc3545;">*</span></label>
    <input type="text" id="eq-address" placeholder="Street address, city, state, ZIP code" required>
    <p class="eason-field-error" id="eq-address-err">Please enter your address.</p>

    <p class="eason-form-section">Section B — Driver Information</p>
    <div class="eason-form-row">
      <div><label for="eq-dob">Date of Birth (optional)</label><input type="date" id="eq-dob"></div>
      <div><label for="eq-marital">Marital Status (optional)</label><select id="eq-marital"><option value="">Select...</option><option>Single</option><option>Married</option></select></div>
    </div>
    <label>Gender (optional)</label>
    <div class="radio-group" style="flex-direction:row;flex-wrap:wrap;gap:16px;">
      <label class="radio-item"><input type="radio" name="eq-gender" value="Male"> <span>Male</span></label>
      <label class="radio-item"><input type="radio" name="eq-gender" value="Female"> <span>Female</span></label>
      <label class="radio-item"><input type="radio" name="eq-gender" value="Prefer not to say"> <span>Prefer not to say</span></label>
    </div>

    <p class="eason-form-section">Section C — Vehicle Information</p>
    <div class="eason-form-row">
      <div><label for="eq-year">Vehicle Year</label><input type="text" id="eq-year" placeholder="e.g. 2021"></div>
      <div><label for="eq-make">Vehicle Make</label><input type="text" id="eq-make" placeholder="e.g. Toyota"></div>
    </div>
    <label for="eq-model">Vehicle Model</label>
    <input type="text" id="eq-model" placeholder="e.g. Camry">
    <label for="eq-vin">Vehicle VIN Number <span style="color:#dc3545;">*</span></label>
    <input type="text" id="eq-vin" placeholder="17-character vehicle identification number" required maxlength="17">
    <p class="eason-field-error" id="eq-vin-err">Please enter your VIN number.</p>

    <p class="eason-form-section">Section D — Coverage Information</p>
    <label>Coverage Type <span style="color:#dc3545;">*</span></label>
    <div class="radio-group">
      <label class="radio-item"><input type="radio" name="eq-coverage" value="Liability Only"> <span>Liability Only</span></label>
      <label class="radio-item"><input type="radio" name="eq-coverage" value="Full Coverage"> <span>Full Coverage</span></label>
      <label class="radio-item"><input type="radio" name="eq-coverage" value="Comprehensive & Collision"> <span>Comprehensive & Collision</span></label>
      <label class="radio-item"><input type="radio" name="eq-coverage" value="Not Sure"> <span>Not Sure</span></label>
    </div>
    <p class="eason-field-error" id="eq-coverage-err">Please select a coverage type.</p>
    <div class="eason-form-row">
      <div><label for="eq-ded">Deductible <span style="color:#dc3545;">*</span></label><select id="eq-ded" required><option value="">Select...</option><option>$250</option><option>$500</option><option>$1,000</option><option>$1,500</option><option>$2,000</option><option>Not Sure</option></select><p class="eason-field-error" id="eq-ded-err">Please select.</p></div>
      <div><label for="eq-usage">Vehicle Usage <span style="color:#dc3545;">*</span></label><select id="eq-usage" required><option value="">Select...</option><option>Pleasure Only</option><option>Work and Pleasure</option><option>Work Only</option></select><p class="eason-field-error" id="eq-usage-err">Please select.</p></div>
    </div>
    <label for="eq-bi">Bodily Injury Liability <span style="color:#dc3545;">*</span></label>
    <select id="eq-bi" required><option value="">Select limit...</option><option>$25,000/$50,000</option><option>$50,000/$100,000</option><option>$100,000/$300,000</option><option>$250,000/$500,000</option><option>Other / Not Sure</option></select>
    <p class="eason-field-error" id="eq-bi-err">Please select.</p>
    <label for="eq-pd">Property Damage Liability <span style="color:#dc3545;">*</span></label>
    <select id="eq-pd" required><option value="">Select limit...</option><option>$10,000</option><option>$25,000</option><option>$50,000</option><option>$100,000</option><option>$250,000</option><option>Other / Not Sure</option></select>
    <p class="eason-field-error" id="eq-pd-err">Please select.</p>

    <p class="eason-form-section">Section E — Current Insurance</p>
    <label>Do you currently have insurance? <span style="color:#dc3545;">*</span></label>
    <div class="radio-group">
      <label class="radio-item"><input type="radio" name="eq-ins" value="Yes"> <span>Yes</span></label>
      <label class="radio-item"><input type="radio" name="eq-ins" value="No"> <span>No</span></label>
      <label class="radio-item"><input type="radio" name="eq-ins" value="Lapsed less than 30 days"> <span>Lapsed less than 30 days</span></label>
      <label class="radio-item"><input type="radio" name="eq-ins" value="Lapsed more than 30 days"> <span>Lapsed more than 30 days</span></label>
    </div>
    <p class="eason-field-error" id="eq-ins-err">Please select.</p>
    <label for="eq-insurer">Current Insurance Company (optional)</label>
    <input type="text" id="eq-insurer" placeholder="Enter company name if applicable">
    <label>Do you own your home? <span style="color:#dc3545;">*</span></label>
    <div class="radio-group" style="flex-direction:row;gap:20px;">
      <label class="radio-item"><input type="radio" name="eq-home" value="Yes"> <span>Yes</span></label>
      <label class="radio-item"><input type="radio" name="eq-home" value="No"> <span>No</span></label>
    </div>
    <p class="eason-field-error" id="eq-home-err">Please select.</p>
    <label for="eq-notes">Additional Message (optional)</label>
    <textarea id="eq-notes" placeholder="Tell us anything else we should know."></textarea>

    <div class="eason-consent-box">
      <label class="radio-item" style="align-items:flex-start;">
        <input type="checkbox" id="eq-consent" style="margin-top:3px;">
        <span style="font-size:0.875rem;color:#4a5568;">I understand that submitting this form does not guarantee insurance approval, policy issuance, pricing, or coverage. <span style="color:#dc3545;">*</span></span>
      </label>
      <p class="eason-field-error" id="eq-consent-err">You must acknowledge this.</p>
    </div>

    <button type="submit" class="eason-btn eason-btn-primary eason-btn-lg" style="width:100%;justify-content:center;display:block;margin-top:10px;">Submit Quote Request</button>
    <div class="eason-success-msg" id="eq-success">✓ Thank you. Your quote request has been received. Eason Consulting Services Inc will contact you shortly.</div>
  </form>

  <p style="color:#8892a4;font-size:0.8rem;margin-top:16px;line-height:1.6;">All insurance quotes, premiums, coverage terms, policy approval, and final decisions are determined by the insurance company. Eason Consulting Services Inc provides consultation and application assistance only.</p>
</div>

<script>
(function(){
  function isEmail(v){return /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(v);}
  function showErr(id){var e=document.getElementById(id);if(e)e.classList.add('show');}
  function hideErr(id){var e=document.getElementById(id);if(e)e.classList.remove('show');}
  document.getElementById('eason-quote-form').addEventListener('submit',function(e){
    e.preventDefault();
    var ok=true;
    var n=document.getElementById('eq-name');
    if(!n||!n.value.trim()){showErr('eq-name-err');ok=false;}else hideErr('eq-name-err');
    var p=document.getElementById('eq-phone');
    if(!p||p.value.trim().length<7){showErr('eq-phone-err');ok=false;}else hideErr('eq-phone-err');
    var em=document.getElementById('eq-email');
    if(!em||!isEmail(em.value.trim())){showErr('eq-email-err');ok=false;}else hideErr('eq-email-err');
    var ad=document.getElementById('eq-address');
    if(!ad||!ad.value.trim()){showErr('eq-address-err');ok=false;}else hideErr('eq-address-err');
    var vi=document.getElementById('eq-vin');
    if(!vi||vi.value.trim().length<5){showErr('eq-vin-err');ok=false;}else hideErr('eq-vin-err');
    if(!document.querySelector('input[name="eq-coverage"]:checked')){showErr('eq-coverage-err');ok=false;}else hideErr('eq-coverage-err');
    var ded=document.getElementById('eq-ded');
    if(!ded||!ded.value){showErr('eq-ded-err');ok=false;}else hideErr('eq-ded-err');
    var us=document.getElementById('eq-usage');
    if(!us||!us.value){showErr('eq-usage-err');ok=false;}else hideErr('eq-usage-err');
    var bi=document.getElementById('eq-bi');
    if(!bi||!bi.value){showErr('eq-bi-err');ok=false;}else hideErr('eq-bi-err');
    var pd=document.getElementById('eq-pd');
    if(!pd||!pd.value){showErr('eq-pd-err');ok=false;}else hideErr('eq-pd-err');
    if(!document.querySelector('input[name="eq-ins"]:checked')){showErr('eq-ins-err');ok=false;}else hideErr('eq-ins-err');
    if(!document.querySelector('input[name="eq-home"]:checked')){showErr('eq-home-err');ok=false;}else hideErr('eq-home-err');
    var con=document.getElementById('eq-consent');
    if(!con||!con.checked){showErr('eq-consent-err');ok=false;}else hideErr('eq-consent-err');
    if(ok){
      document.getElementById('eq-success').classList.add('show');
      document.getElementById('eason-quote-form').reset();
      setTimeout(function(){window.location.href='/thank-you';},1600);
    }
  });
})();
</script>

📌 HTML Snippet — Contact Form

<div class="eason-form-wrap">
  <form id="eason-contact-form" novalidate>
    <label for="ec-name">Full Name <span style="color:#dc3545;">*</span></label>
    <input type="text" id="ec-name" placeholder="Your full name" required>
    <p class="eason-field-error" id="ec-name-err">Please enter your name.</p>
    <div class="eason-form-row">
      <div><label for="ec-phone">Phone <span style="color:#dc3545;">*</span></label><input type="tel" id="ec-phone" placeholder="(000) 000-0000" required><p class="eason-field-error" id="ec-phone-err">Please enter your phone.</p></div>
      <div><label for="ec-email">Email <span style="color:#dc3545;">*</span></label><input type="email" id="ec-email" placeholder="your@email.com" required><p class="eason-field-error" id="ec-email-err">Please enter a valid email.</p></div>
    </div>
    <label for="ec-service">Service Needed <span style="color:#dc3545;">*</span></label>
    <select id="ec-service" required>
      <option value="">Select a service...</option>
      <option>Auto Insurance Quote</option>
      <option>Claims Assistance</option>
      <option>Commercial Vehicle Insurance</option>
      <option>General Question</option>
    </select>
    <p class="eason-field-error" id="ec-service-err">Please select a service.</p>
    <label for="ec-msg">Message <span style="color:#dc3545;">*</span></label>
    <textarea id="ec-msg" placeholder="Tell us about your situation or question..." required></textarea>
    <p class="eason-field-error" id="ec-msg-err">Please enter your message.</p>
    <button type="submit" class="eason-btn eason-btn-primary eason-btn-lg" style="width:100%;display:block;text-align:center;">Send Message</button>
    <div class="eason-success-msg" id="ec-success">✓ Thank you. Your message has been received. Eason Consulting Services Inc will contact you shortly.</div>
  </form>
</div>
<script>
(function(){
  function isEmail(v){return /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(v);}
  function se(id){var e=document.getElementById(id);if(e)e.classList.add('show');}
  function he(id){var e=document.getElementById(id);if(e)e.classList.remove('show');}
  document.getElementById('eason-contact-form').addEventListener('submit',function(ev){
    ev.preventDefault();
    var ok=true;
    var n=document.getElementById('ec-name');if(!n||n.value.trim().length<2){se('ec-name-err');ok=false;}else he('ec-name-err');
    var p=document.getElementById('ec-phone');if(!p||p.value.trim().length<7){se('ec-phone-err');ok=false;}else he('ec-phone-err');
    var em=document.getElementById('ec-email');if(!em||!isEmail(em.value)){se('ec-email-err');ok=false;}else he('ec-email-err');
    var sv=document.getElementById('ec-service');if(!sv||!sv.value){se('ec-service-err');ok=false;}else he('ec-service-err');
    var mg=document.getElementById('ec-msg');if(!mg||mg.value.trim().length<3){se('ec-msg-err');ok=false;}else he('ec-msg-err');
    if(ok){
      document.getElementById('ec-success').classList.add('show');
      document.getElementById('eason-contact-form').reset();
      setTimeout(function(){window.location.href='/thank-you';},1600);
    }
  });
})();
</script>

✅ All done! Once all 8 pages are built in Elementor and the global CSS is in place, your EasonCoverage.com site will match the original design. Remember to set your WordPress front page to "Home" via Settings → Reading → Static Page.

📧 Real form submissions: The forms use client-side validation and redirect to /thank-you. To actually receive emails, install a free plugin like WPForms Lite or Contact Form 7 and replace the HTML form with their shortcode — OR connect a free Formspree.io endpoint by adding action="https://formspree.io/f/YOUR_ID" method="POST" to each <form> tag.

EasonCoverage.com

Step 1 — Add Google Fonts to WordPress

1Go to: `Appearance → Customize → Additional CSS`

2In Elementor: `Elementor → Settings → Style`

Step 2 — Paste Global CSS

Step 3 — Elementor Global Settings

1Go to Elementor → Settings → Style

2For each page in WordPress: Pages → Add New

Step 4 — Color Reference

🏠 Home Page

Section 1 — Hero

Section 2 — How We Can Help (3 Service Cards)

Section 3 — Why Choose Us

Section 4 — Our Simple Process (4 Steps)

Section 5 — Bottom CTA

📋 Services Page

Section 1 — Page Hero

Sections 2–4 — Three Service Blocks

Final CTA Section

📝 Auto Insurance Quote Page

🚗 Claims Assistance Page

ℹ️ About Us Page

💰 Pricing Page

📞 Contact Page

✅ Thank You Page

📌 HTML Snippet — Page Hero

📌 HTML Snippet — Home Hero (with trust badges)

📌 HTML Snippet — 3 Service Cards

📌 HTML Snippet — 4 Process Steps

📌 HTML Snippet — Checklist

📌 HTML Snippet — Note Box (Info + Warning)

📌 HTML Snippet — CTA Band

📌 HTML Snippet — Full Quote Form

📌 HTML Snippet — Contact Form

EasonCoverage.com

Step 1 — Add Google Fonts to WordPress

1Go to: Appearance → Customize → Additional CSS

2In Elementor: Elementor → Settings → Style

Step 2 — Paste Global CSS

Step 3 — Elementor Global Settings

1Go to Elementor → Settings → Style

2For each page in WordPress: Pages → Add New

Step 4 — Color Reference

🏠 Home Page

Section 1 — Hero

Section 2 — How We Can Help (3 Service Cards)

Section 3 — Why Choose Us

Section 4 — Our Simple Process (4 Steps)

Section 5 — Bottom CTA

📋 Services Page

Section 1 — Page Hero

Sections 2–4 — Three Service Blocks

Final CTA Section

📝 Auto Insurance Quote Page

🚗 Claims Assistance Page

ℹ️ About Us Page

💰 Pricing Page

📞 Contact Page

✅ Thank You Page

📌 HTML Snippet — Page Hero

📌 HTML Snippet — Home Hero (with trust badges)

📌 HTML Snippet — 3 Service Cards

📌 HTML Snippet — 4 Process Steps

📌 HTML Snippet — Checklist

📌 HTML Snippet — Note Box (Info + Warning)

📌 HTML Snippet — CTA Band

📌 HTML Snippet — Full Quote Form

📌 HTML Snippet — Contact Form

1Go to: `Appearance → Customize → Additional CSS`

2In Elementor: `Elementor → Settings → Style`