Brightwire Electric — Residential Electrician Website (8 Pages)

8 pages, each a complete, self-contained HTML page — a schematic-and-circuit design for a residential electrician: a pale concrete split hero with a dark, working breaker panel set on it, Big Shoulders Display headlines over Barlow, a light porcelain/graphite palette with an electric indigo accent and arc-flash cyan circuit glows (graphite kept for the panel, the footer and one feature band per page), PCB cards with solder-pad corners and thin circuit traces that power up between sections. 1. Home (index.html) — interactive load-center hero, LCD count-up stats, six service cards, "Is this an emergency?" guide, four-step visit wire, EV and lighting features, services ticker, reviews. 2. Residential Services (services.html) — tabbed service directory, older-wiring flip cards, warning signs, remodel steps, FAQ (FAQPage markup). 3. Panels & EV Chargers (panels-ev.html) — numbered load-center diagram, panel upgrade & EV readiness checker, Level 1 vs Level 2 comparison, EV install steps with permit and inspection, FAQ (FAQPage markup). 4. Lighting (lighting.html) — lit/unlit before-after slider, fixture cards, color-temperature picker, room-by-room lumens table, dimmer and smart-switch advice. 5. Safety & Inspections (safety.html) — smoke/CO alarm placement diagram, GFCI vs AFCI explained, interactive home checklist with score, testing schedule, inspection types. 6. Pricing (pricing.html) — diagnostic fee explained, tabbed flat-rate price book, standard vs after-hours rates, FAQ (FAQPage markup). 7. About & Reviews (about.html) — story, count-up numbers, credential plates, team monograms, rating meters, six reviews, service area. 8. Book an Electrician (book.html) — booking form, emergency box, next steps, hours, service area, FAQ. ANIMATION. The hero breakers flip on in sequence when the page opens; hovering or tapping a breaker flicks it, lights its circuit line and fills the capacity bar. PCB traces draw themselves across section seams and then carry a moving glow. Buttons flicker like a warming filament on hover, the CTA bulb lights up when its button is hovered, stats count up, meters fill, diagram pins pulse, the services ticker scrolls and sections slide in. Everything is visible without JavaScript, and visitors who ask for reduced motion see a still page. LOAD CENTER (home hero). Each breaker is a link whose label and amperage are editable text; the details it shows (circuit line, name, "what it powers" and the capacity percentage) live in its data-id, data-name, data-powers and data-load attributes. Edit those to match the sample home you want to show. The capacity bar is illustrative, not a load calculation. EMERGENCY GUIDE. Six tabs (burning smell, sparking outlet, breaker keeps tripping, flickering lights, warm outlet or switch, partial power loss), each with what it might mean, a safe first step and an urgency level. It is labeled general guidance and never gives wiring instructions beyond switching off the breaker if safe and calling a licensed electrician. Have it reviewed against your own policies and keep the 911 advice. READINESS CHECKER (Panels & EV). It works in the browser from the home's age, panel size and planned additions; the weight of each addition is in its checkbox's data-w attribute and the age weights are on the age options. It only gives gentle guidance ("may need a load calculation or panel upgrade") and says so. COLOR-TEMPERATURE PICKER AND CHECKLIST. The picker tints a photo between 2200K and 5000K and is labeled as a simulation. The home checklist counts ticked items and shows a score; it contains nothing that requires opening a cover or using a tool. FONTS. Big Shoulders Display and Barlow 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 — Electrician, FAQPage, AboutPage or ContactPage). Copy it into your real <head> when you deploy, and update the domain, address, rating and areas served. FORMS. The booking form posts nowhere and says so on the page — connect it to your scheduling software 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, insurance figures, permit counts, address, phone, prices, diagnostic and after-hours fees, statistics, team, service areas and reviews are fictional placeholders — replace them with your own. Electrical licensing, permit requirements and code adoption vary by state and city: check the permit, GFCI/AFCI and smoke/CO alarm wording against your local rules. All prices are samples. Charging speeds, lumen figures and alarm lifespans are general guidance. IMAGES. All photography is real Unsplash stock, self-hosted under /content-images: interiors, light fixtures, hand tools and an EV charge port. No photo shows a person or a brand. Panels, breakers, outlets, chargers and wiring are drawn as generic SVG line art with no brand names. The lighting before/after uses one photo with the "before" side darkened in CSS — replace both sides with your own project photos.