IDHWB-QMS-7.5

Ver2.3.2

Status● APPROVED

AuthorGeorge (Architect)

Approved ByHumberto Dominguez

ISO 9001 Clause7.5.3 (Control)

HWB Website Design Rules

This is the Absolute Technical Manual for HWB front-end standards. It maps every component to its physical path, logical trigger, and visual style to ensure indestructible continuity.

1.0 Proof of Truth: The File Map

These are the verified server folders. If a file is not in this location, the system is in a failed state.

            [VERIFIED] HWB-COMPANY/HWB-IT/HWB-IT-WEBSITE/static/HWB-WEB Style.css

            [VERIFIED] HWB-COMPANY/HWB-IT/HWB-IT-WEBSITE/templates/HWB-WEB Index.html

            [VERIFIED] HWB-COMPANY/HWB-IT/HWB-IT-WEBSITE/templates/components/mega_bar.html

            [VERIFIED] HWB-COMPANY/HWB-IT/HWB-IT-WEBSITE/static/logo_standard.png

            [VERIFIED] HWB-COMPANY/HWB-IT/HWB-IT-WEBSITE/core/agents/ - (Intelligence Layer)

            [VERIFIED] HWB-COMPANY/HWB-IT/HWB-IT-WEBSITE/scripts/ - (Automation & Safety)

1.5 The Brand Logo Registry

TECHNICAL IDENTITY: Folder Path: HWB-COMPANY/HWB-IT/HWB-IT-WEBSITE/static/logo_standard.png
Logic: Always links to /. Triggers 28% Bisection Merge animation on About page.
CSS Class: .header-logo (Height: 80px Desktop / 64px Mobile).

Version	Full Server Path	Use Case
Standard	`HWB-IT-WEBSITE/static/logo_standard.png`	Main Header/Footer.
SEO Variant	`HWB-IT-WEBSITE/static/1-hwb-logo-plano-tx.png`	Google/Local Maps.
Sigma Mark	`HWB-IT-WEBSITE/static/img/logo_sigma.png`	Phone Icons.

1.7 Institutional Rollover Logic

ROLLOVER IDENTITY: Path A: static/img/soul_dedication.png (Tech)
Path B: static/img/soul_dedication_human.png (Human)
Logic: Swaps image on :hover. Transition: 0.4s ease-in-out.

2.0 Our Color Palette

HWB Blue
#2563eb

HWB Dark
#020617

Clinical Slate
#f8fafc

Folder Path: HWB-COMPANY/HWB-IT/HWB-IT-WEBSITE/static/HWB-WEB Style.css
Logic: Uses CSS Variables (--hwb-blue, --hwb-dark) for 100% environment parity.

3.0 Lead Capture Forms

Standalone Quote Form

Folder Path: HWB-COMPANY/HWB-IT/HWB-IT-WEBSITE/templates/quote_form.html
Logic: POST /get-quote. Calculates Annual Value using SQF slider.

Home Embedded Form

Folder Path: HWB-COMPANY/HWB-IT/HWB-IT-WEBSITE/templates/HWB-WEB Index.html
Logic: POST /get-quote. Simplified Name/Email/Phone capture.

4.0 Buttons & Interaction (Phase 3 Standard)

BLUE COMPRESSED BUTTON

Start a quote

Path: HWB-IT-WEBSITE/static/HWB-WEB Style.css
Logic: Links to /get-quote. Height: 32-40px. Radius: 6px.

OUTLINE COMPRESSED BUTTON

View Standards

Path: HWB-IT-WEBSITE/static/HWB-WEB Style.css
Logic: Links to /compliance. Height: 32-40px. Radius: 6px.

4.5 Memory Tier 6: Tactical Database

TELEMETRY ACTIVE

Database Table: "SigmaTelemetry" (PostgreSQL)
Logic: Captures session_id and objective to prevent context loss.

4.6 Consolidated Interaction Core

Database Table: "SigmaInteractionCore" (PostgreSQL)
Logic: Records every command and AI explanation for absolute auditability and session recovery.

6.0 How Pages Are Built (Sequence)

1. Top Contact Strip

Path: HWB-IT-WEBSITE/templates/components/mega_bar.html
Logic: Click-to-dial mobile integration.

2. Navigation Menu & Logo

Path: HWB-IT-WEBSITE/templates/components/mega_bar.html
Logic: Glass-blur shell (24px). Sticky scrolled state toggle.

3. High-Fidelity Hero

Path: HWB-IT-WEBSITE/templates/HWB-WEB Index.html
Logic: Centered 1000px content wrapper.

4. Service Cards

Path: HWB-IT-WEBSITE/static/HWB-WEB Style.css
Logic: 4-Column Grid standard.

5. Lead Quote Form

Path: HWB-IT-WEBSITE/templates/HWB-WEB Index.html
Logic: Direct CRM ingestion (Name/Email/Phone).

6. Quality Formula Banner

Path: HWB-IT-WEBSITE/templates/HWB-WEB Index.html
Logic: Centered Mandate Text. Authoritative Dark-variant.

7. Final Closing CTA

Path: HWB-IT-WEBSITE/static/HWB-WEB Style.css
Logic: Executive closure block with shadow glow.

8. Website Footer

Path: HWB-IT-WEBSITE/templates/base.html
Logic: Balanced 4-Column anchor for legal/social links.

7.0 How to Check Your Work

Compare page visually to www.hwbcleaning.com (Source of Truth).
Verify 1000px centering of all main text messages.
Confirm Peter Sentinel has taken a pre-edit snapshot.

8.0 Revision History

Ver	Date	Author	Change Description
2.3.2	05/18/2026	George	TOTAL RECONSTRUCTION. Re-sequenced all 12+ sections with Full Paths and Logic Cards. Verified all buttons.

Document Structure