Rebrand UI copy and visual style to enterprise document-intelligence positioning

- Hero headline/subheadline reframed around "structured business data"
rather than raw OCR, matching the company's brand positioning.
- Added a small pipeline strip (Upload -> OCR -> AI-Assisted Extraction
-> Structured Data -> CSV Export) as a lightweight nod to the product's
data lifecycle.
- Swapped the indigo/emoji-heavy styling for a more muted blue/slate
palette, subtle card shadows, and eyebrow-style step labels; dropped
emoji from headings and quick-start buttons in favor of plain
professional labels.
- Renamed quick-start buttons and results tabs to match enterprise tone
(Structured fields / Notifications / Audit trail / Raw OCR output).
- Updated README title/intro and step references to match the new
single-flow layout and copy.

Scope stayed limited to rebranding this existing tool (per user
decision) rather than building a separate marketing website - the tool
still only covers construction/compliance/finance, no new extraction
capabilities were added.

README.md

@@ -1,8 +1,8 @@
 ---
-title: OCR Notification & Data Extractor
-emoji: 🧾
+title: Document Intelligence - OCR Data Extractor
+emoji: 📄
 colorFrom: blue
-colorTo: indigo
+colorTo: gray
 sdk: gradio
 sdk_version: 5.9.1
 app_file: app.py
@@ -10,11 +10,13 @@ pinned: false
 license: mit
 ---
 
-# OCR Notification & Data Extractor
+# Turn Documents Into Structured Business Data
 
-Upload scanned PDFs or images and turn them into structured, exportable
-data. Built for teams that need to pull actionable "notification" events
-and key fields out of paper-heavy workflows:
+The real value isn't converting images into text — it's turning
+unstructured documents into reliable, actionable data. This tool takes
+scanned PDFs or images, runs them through OCR, and uses an AI-assisted
+extraction step (configured by describing what you need in plain
+language) to produce clean, audit-ready structured data. Built for:
 
 - **Construction / SAP data support** — change orders, delay notices,
   punch list items, RFIs, PO numbers, SAP document numbers, quantities.
@@ -46,14 +48,18 @@ one blanket extraction pass over every document:
 
 ## How it works
 
-1. **Tailor extraction (chat tab)** — describe in plain language what you
-   want flagged vs. pulled as data (e.g. *"flag overdue invoices over
-   $10k and non-compliance notices, and pull the reference number and
-   gross weight"*). A Hugging Face-hosted chat model turns that into
-   extraction settings (categories, notification keywords, custom fields,
-   export filter), which populate the Upload & Run tab automatically. You
-   can also skip the chat and set everything by hand there.
-2. Upload one or more PDFs or images.
+The app is a single guided flow: describe what you need, upload your
+documents, run and review.
+
+1. **Step 1 - describe what you need** — in plain language (e.g. *"flag
+   overdue invoices over $10k and non-compliance notices, and pull the
+   reference number and gross weight"*), or tap one of the
+   construction/compliance/finance starting-point buttons. A Hugging
+   Face-hosted chat model turns that into extraction settings
+   (categories, notification keywords, custom fields, export filter),
+   shown live in the "Extraction plan" panel. You can also skip the chat
+   and set everything by hand in the "Advanced" accordion in Step 2.
+2. **Step 2 - upload your documents** — one or more PDFs or images.
 3. Each page's text is pulled directly from the PDF when it has a text
    layer; scanned/image-only pages are rendered and run through
    Tesseract OCR.
@@ -79,20 +85,20 @@ one blanket extraction pass over every document:
 
 ## Chat assistant setup
 
-The chat tab calls the Hugging Face Inference API, so it needs a token:
+The Step 1 assistant calls the Hugging Face Inference API, so it needs a token:
 
 - **On a Space:** add a repo secret named `HF_TOKEN` (Settings ->
   Variables and secrets) with a token that has Inference API access.
-- **Locally / as a fallback:** paste a token into the "Hugging Face
-  token" field in the chat tab; it's only used for that session.
+- **Locally / as a fallback:** paste a token into the "Use your own
+  Hugging Face token" accordion in Step 1; it's only used for that session.
 
 The model defaults to `HuggingFaceH4/zephyr-7b-beta` (ungated). Override
 it with the `HF_CHAT_MODEL` environment variable/secret if you'd rather
 use a different instruct model your token can access.
 
-If the chat call fails or no token is available, the Upload & Run tab
-still works fully via its manual checkboxes/textboxes — the chat is a
-convenience layer on top, not a dependency.
+If the chat call fails or no token is available, the rest of the app
+still works fully via the "Advanced: edit settings manually" accordion
+in Step 2 — the chat is a convenience layer on top, not a dependency.
 
 ## Local development
 

app.py

@@ -42,31 +42,77 @@ METADATA_COLUMNS = [
 ]
 
 QUICK_PROMPTS = {
-    "🏗️ Construction / SAP": (
+    "Construction & SAP data": (
         "Flag change orders, delay notices, and safety violations. "
         "Pull PO numbers, SAP document numbers, and reference numbers."
     ),
-    "✅ Compliance": (
+    "Regulatory compliance": (
         "Flag non-compliance, violations, and expired certifications. "
         "Pull certification codes and expiration dates."
     ),
-    "💵 Finance / AR": (
+    "Finance & accounts receivable": (
         "Flag overdue and past-due invoices, credit holds, and disputes. "
         "Pull invoice numbers, amounts, and due dates."
     ),
 }
 
 CUSTOM_CSS = """
-#hero { text-align: center; padding: 8px 8px 4px 8px; }
-#hero h1 { font-size: 1.9rem; margin-bottom: 2px; }
-#hero p { color: var(--body-text-color-subdued); max-width: 720px; margin: 0 auto; }
-.step-card { border-radius: 16px !important; padding: 22px !important; margin-bottom: 18px; }
-.step-kicker { font-weight: 600; font-size: 1.05rem; margin-bottom: 2px; }
+#hero { text-align: center; padding: 28px 16px 8px 16px; }
+#hero h1 {
+    font-size: 2.1rem; font-weight: 700; letter-spacing: -0.02em;
+    margin-bottom: 8px; color: var(--body-text-color);
+}
+#hero p {
+    color: var(--body-text-color-subdued); max-width: 640px; margin: 0 auto;
+    font-size: 1.02rem; line-height: 1.5;
+}
+.pipeline-strip {
+    display: flex; align-items: center; justify-content: center; flex-wrap: wrap;
+    gap: 6px; margin: 4px auto 28px auto; max-width: 900px; padding: 0 16px;
+}
+.pipeline-step {
+    display: flex; align-items: center; gap: 7px;
+    font-size: 0.78rem; font-weight: 600; letter-spacing: 0.01em;
+    color: var(--body-text-color-subdued);
+    background: var(--background-fill-secondary);
+    border: 1px solid var(--border-color-primary);
+    border-radius: 999px; padding: 5px 13px; white-space: nowrap;
+}
+.pipeline-step .num {
+    display: inline-flex; align-items: center; justify-content: center;
+    width: 16px; height: 16px; border-radius: 50%;
+    background: var(--primary-500); color: white; font-size: 0.65rem;
+}
+.pipeline-arrow { color: var(--body-text-color-subdued); font-size: 0.85rem; opacity: 0.6; }
+
+.step-card {
+    border-radius: 14px !important; padding: 24px !important; margin-bottom: 18px;
+    box-shadow: 0 1px 2px rgba(0,0,0,0.04), 0 1px 8px rgba(0,0,0,0.03) !important;
+}
+.step-eyebrow {
+    font-size: 0.72rem; font-weight: 700; text-transform: uppercase;
+    letter-spacing: 0.08em; color: var(--primary-500); margin-bottom: 4px;
+}
+.step-kicker { font-weight: 600; font-size: 1.15rem; margin-bottom: 2px; }
 .step-subtitle { color: var(--body-text-color-subdued); margin-bottom: 14px; font-size: 0.92rem; }
-#run-button button { font-size: 1.05rem !important; padding: 14px !important; }
+#run-button button { font-size: 1.02rem !important; padding: 14px !important; font-weight: 600 !important; }
 #quick-prompts button { font-size: 0.85rem !important; }
 """
 
+PIPELINE_HTML = """
+<div class="pipeline-strip">
+  <div class="pipeline-step"><span class="num">1</span>Upload</div>
+  <div class="pipeline-arrow">&rarr;</div>
+  <div class="pipeline-step"><span class="num">2</span>OCR Recognition</div>
+  <div class="pipeline-arrow">&rarr;</div>
+  <div class="pipeline-step"><span class="num">3</span>AI-Assisted Extraction</div>
+  <div class="pipeline-arrow">&rarr;</div>
+  <div class="pipeline-step"><span class="num">4</span>Structured Data</div>
+  <div class="pipeline-arrow">&rarr;</div>
+  <div class="pipeline-step"><span class="num">5</span>CSV Export</div>
+</div>
+"""
+
 
 def _file_path(f):
     return f if isinstance(f, str) else f.name
@@ -212,28 +258,29 @@ def handle_chat(history, message, settings, hf_token):
 
 
 theme = gr.themes.Soft(
-    primary_hue="indigo",
+    primary_hue="blue",
     secondary_hue="slate",
     neutral_hue="slate",
     font=[gr.themes.GoogleFont("Inter"), "ui-sans-serif", "system-ui", "sans-serif"],
 )
 
-with gr.Blocks(title="OCR Notification & Data Extractor", theme=theme, css=CUSTOM_CSS) as demo:
+with gr.Blocks(title="Document Intelligence — OCR & Structured Data Extraction", theme=theme, css=CUSTOM_CSS) as demo:
     gr.Markdown(
-        "# 🧾 OCR Notification & Data Extractor\n"
-        "Tell it what you need, upload your documents, and get a clean, "
-        "audit-ready CSV back — built for construction/SAP, compliance, "
-        "and finance teams.",
+        "# Turn Documents Into Structured Business Data\n"
+        "AI-assisted OCR built for construction, compliance, and finance "
+        "teams. Describe what you need, upload your documents, and get "
+        "clean, audit-ready data back — not just extracted text.",
         elem_id="hero",
     )
+    gr.HTML(PIPELINE_HTML)
 
     settings_state = gr.State(dict(DEFAULT_SETTINGS))
 
     with gr.Group(elem_classes=["step-card"]):
-        gr.Markdown('<div class="step-kicker">Step 1 · Tell us what you need</div>')
+        gr.Markdown('<div class="step-eyebrow">Step 1</div><div class="step-kicker">Tell us what you need</div>')
         gr.Markdown(
             '<div class="step-subtitle">Describe what to flag and what to pull as data, '
-            "in your own words — or tap a starting point below.</div>"
+            "in your own words — or start from a template below.</div>"
         )
         with gr.Row(elem_id="quick-prompts"):
             quick_buttons = {label: gr.Button(label, size="sm") for label in QUICK_PROMPTS}
@@ -249,10 +296,10 @@ with gr.Blocks(title="OCR Notification & Data Extractor", theme=theme, css=CUSTO
                 placeholder="e.g. Flag overdue invoices; pull reference number, gross weight, delivery date",
             )
             chat_send = gr.Button("Send", scale=1, variant="primary")
-        settings_display = gr.JSON(label="What we'll extract", value=DEFAULT_SETTINGS)
+        settings_display = gr.JSON(label="Extraction plan", value=DEFAULT_SETTINGS)
 
     with gr.Group(elem_classes=["step-card"]):
-        gr.Markdown('<div class="step-kicker">Step 2 · Upload your documents</div>')
+        gr.Markdown('<div class="step-eyebrow">Step 2</div><div class="step-kicker">Upload your documents</div>')
         gr.Markdown('<div class="step-subtitle">Upload as many PDFs or images as you need reviewed at once.</div>')
         files_input = gr.Files(
             label="PDF or image files",
@@ -282,18 +329,18 @@ with gr.Blocks(title="OCR Notification & Data Extractor", theme=theme, css=CUSTO
             )
 
     with gr.Group(elem_classes=["step-card"]):
-        gr.Markdown('<div class="step-kicker">Step 3 · Run &amp; review</div>')
+        gr.Markdown('<div class="step-eyebrow">Step 3</div><div class="step-kicker">Run &amp; review</div>')
         run_button = gr.Button("Run OCR & Extract", variant="primary", elem_id="run-button")
         status_output = gr.Textbox(label="Status", lines=2, interactive=False)
-        csv_output = gr.Files(label="Download CSVs (fields, notifications, run metadata)")
+        csv_output = gr.Files(label="Download CSVs (structured fields, notifications, audit trail)")
         with gr.Tabs():
-            with gr.Tab("Extracted fields"):
+            with gr.Tab("Structured fields"):
                 fields_table_output = gr.Dataframe(headers=FIELDS_COLUMNS, wrap=True)
-            with gr.Tab("Notification hits"):
+            with gr.Tab("Notifications"):
                 notifications_table_output = gr.Dataframe(headers=NOTIFICATIONS_COLUMNS, wrap=True)
-            with gr.Tab("Run audit"):
+            with gr.Tab("Audit trail"):
                 run_metadata_output = gr.JSON(label="Exactly what settings produced this run")
-            with gr.Tab("Raw OCR text (debug)"):
+            with gr.Tab("Raw OCR output (debug)"):
                 text_output = gr.Textbox(label="Raw extracted text", lines=20, show_label=False)
 
     chat_outputs = [