Harborline Insurance Group — Independent Insurance Agency Website (9 Pages)

9 pages, each a complete, self-contained HTML page — a trustworthy, modern independent insurance agency design: a split hero with a floating tabbed "quote starter" card over soft sky blobs, alternating sky-tint bands with 24px rounded panels and shield-tipped wave dividers, Fraunces display headlines with italic accents over Manrope, a cobalt / sky / coral palette, pill buttons and shield-shaped icon badges. 1. Home (index.html) — hero with a quote starter (Auto / Home / Life / Business tabs), nine coverage flip cards, "one carrier vs. we shop many" connector graphic with three steps, count-up stats, carrier logo wall placeholders, bundle savings meters, claims help panel, reviews, quick FAQ. 2. Auto (auto.html) — six coverages in plain English, a 50/100/50 limits explainer, rate factors, special situations, auto FAQ. 3. Home & Renters (home-renters.html) — tabbed homeowners / renters / condo policies with lettered coverages, replacement cost vs. actual cash value, coastal flood and wind panel, add-ons, FAQ. 4. Life (life.html) — coverage-need estimator, term / whole / universal comparison table, who needs it, how applying works, FAQ. 5. Business (business.html) — eight business coverages, commercial auto, industries served, quote checklist, FAQ. 6. Claims Help (claims.html) — four-step claims timeline, after-accident checklist, 24/7 claim-line table, home claim tips, FAQ. 7. About (about.html) — story, three promises, agency stats, four agent profiles, six reviews. 8. Resources & FAQ (resources.html) — life-event cards, glossary, grouped FAQ, annual review checklist. 9. Get a Quote (quote.html) — quote request form with call box and "have this handy" checklist. ANIMATION. Coverage cards flip over on hover, focus or tap (and show both sides stacked when motion is off); the stat numbers count up (they read the number you type); the bundle meters fill; the connector lines in the "how an independent agent works" graphic draw themselves; the claims timeline fills as you scroll; the hero blobs float gently; links get a coral underline on hover; sections slide in as you scroll. Everything is visible without JavaScript, and visitors who ask for reduced motion see a still page. QUOTE STARTER. The home hero card's tabs switch between four mini-forms. "Start my quote" opens quote.html and carries the ZIP and answers in the link; the quote page pre-fills the ZIP, ticks the matching coverage box and adds the other answers to the notes. Nothing is sent anywhere. LIFE ESTIMATOR. It works in the browser: estimate = annual income × years to replace + debts − savings and existing coverage, rounded to the nearest $10,000. It is clearly labelled a rough estimate, not advice — keep that wording, and adjust the default values in each input's value attribute. CARRIERS. No real carrier names appear anywhere. Replace the "Carrier A–L" logo tiles and the claim-line table (claims page) with the carriers you are actually appointed with, their real 24/7 claim numbers, and logos you have permission to use. FONTS. Fraunces (with its italic) and Manrope load from Google Fonts via @font-face in each page's style block, with serif and sans-serif fallbacks. SEO. Each page opens with a labeled block (title, meta description, canonical link, Open Graph tags and JSON-LD — InsuranceAgency on the home page, FAQPage on the coverage, claims and resources pages, AboutPage and ContactPage). Copy it into your real <head> when you deploy, and update the domain, address, rating and areas served. FORMS. The quote request form and the hero quote starter post nowhere — connect the form to your agency management system, CRM or form service before publishing, and review the consent wording with your compliance contact. EDITING. Change colors and fonts site-wide in the editor's Theme panel; edit the header or footer once and use "Apply to all pages"; sections can be moved, duplicated, hidden or deleted; use the Tablet and Mobile views for device-specific tweaks. Each wave divider sits at the bottom of a section and is colored for the section after it — if you reorder sections, change its hl-wave--white / --sky class to match. CLAIMS & SAMPLE CONTENT. The agency name, license number (NC License #0000000 (sample)), address, phone numbers, team, statistics, ratings, reviews and every savings or discount figure are fictional samples — replace them with your own, and never promise a specific discount. Coverage descriptions are general information only, not a contract or advice; actual coverage depends on the policy issued. The footer says so on every page — keep that disclaimer. State-specific notes (North Carolina liability limits notation, workers' comp threshold, DMV FS-1 filing, coastal wind and flood) reflect general practice; check them against current state law and your carriers' forms, and adapt them if you're licensed in another state. IMAGES. All photography is real Unsplash stock, self-hosted under /content-images: cars, homes, an apartment, paperwork, office towers, a truck and a coin-and-seedling still life. Hands appear in the driving, paperwork and handshake photos, but no photo shows a recognisable face. One car photo shows a manufacturer badge — swap it if you prefer an unbranded vehicle.