Summit Ridge Roofing — Roofing Contractor Website (7 Pages)

7 pages, each a complete, self-contained HTML page — a bold storm-slate and signal-red roofing design: full-bleed parallax hero with a diagonal edge and an overlapping stat bar, Montserrat Black uppercase headlines over Inter, cut-corner buttons and dark numbered service tiles, hazard-stripe accents and a blueprint grid. 1. Home (index.html) — hero, count-up stat bar, six service tiles, credentials ticker, before/after slider, four steps, reviews. 2. Services (services.html) — replacement, a five-layer roof system diagram, materials comparison table, repairs, gutters, commercial. 3. Storm Damage (storm-damage.html) — signs of damage, the four-step claim process, claim stats and an insurance FAQ (FAQPage markup). 4. Projects (projects.html) — a featured before/after project and a tabbed photo gallery. 5. Financing (financing.html) — a working monthly payment estimator and three financing plans. 6. About (about.html) — story, team numbers, six reviews. 7. Free Inspection (inspection.html) — inspection request form, emergency callout, next steps, service areas. ANIMATION. The hero photo drifts in parallax, the stat numbers count up (they read the number you type), the credentials ticker scrolls, the roof-layer diagram draws itself, before/after sliders can be dragged and nudge once to show they move, the storm-line dot pulses, and sections slide in as you scroll. Everything is visible without JavaScript, and visitors who ask for reduced motion see a still page. FINANCING ESTIMATOR. It works in the browser: the APR lives in the estimator box's data-apr attribute (8.99 by default) and the terms in the dropdown's option values (in months). Replace the sample rates and plan details with your lender's real terms and any disclosures your state requires. BEFORE/AFTER SLIDERS. Each slider is two ordinary images — replace both with your own photos of the same roof. FONTS. Montserrat and Inter load from Google Fonts via @font-face in each page's style block, with system sans-serif fallbacks. SEO. Each page opens with a labeled block (title, meta description, canonical link, Open Graph tags and JSON-LD — RoofingContractor, CollectionPage, FAQPage, AboutPage or ContactPage). Copy it into your real <head> when you deploy, and update the domain, address, rating and areas served. FORMS. The inspection form posts nowhere — connect it to your CRM or form service before publishing. 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. CLAIMS & SAMPLE CONTENT. The company name, license number, address, phone, prices, material costs, financing rates, statistics, service areas and reviews are fictional placeholders. Replace them with your own real details. The insurance FAQ reflects general Texas practice — check it against current state law, and never offer to waive a deductible. IMAGES. All photography is real Unsplash stock, self-hosted under /content-images. Crew members are shown from behind or at a distance, so no photo shows a recognisable face. The before/after samples pair two different homes — replace them with your own photos of the same roof.