From 0345c1ed18d281081bf862e2c28f0e70143174e4 Mon Sep 17 00:00:00 2001
From: Adam Moussa <166072409+amoussa1229@users.noreply.github.com>
Date: Tue, 7 Apr 2026 15:11:10 -0400
Subject: [PATCH] Extract shared CSS into central main.css stylesheet

Move ~2,600 lines of duplicated CSS (reset, tokens, typography, nav,
footer, buttons, mobile menu, page hero, CTA, form base styles, and
shared responsive breakpoints) into /assets/css/main.css. Each page
now only contains page-specific styles inline.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 about/index.html                 | 373 +-------------------------
 assets/css/main.css              | 440 +++++++++++++++++++++++++++++++
 career/index.html                | 336 +----------------------
 contact/index.html               | 359 +------------------------
 index.html                       | 358 +------------------------
 jobs/dispatcher/index.html       | 362 +------------------------
 privacy-policy/index.html        | 279 +-------------------
 services/index.html              | 359 +------------------------
 social-accountability/index.html | 368 +-------------------------
 terms-of-service/index.html      | 279 +-------------------
 10 files changed, 457 insertions(+), 3056 deletions(-)
 create mode 100644 assets/css/main.css

diff --git a/about/index.html b/about/index.html
index 24ae571..cbc4060 100644
--- a/about/index.html
+++ b/about/index.html
@@ -21,239 +21,9 @@
   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
   <link rel="preload" as="style" href="https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&family=Inter:wght@300;400;500;600&display=swap">
   <link href="https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&family=Inter:wght@300;400;500;600&display=swap" rel="stylesheet">
+  <link rel="stylesheet" href="/assets/css/main.css">
 
   <style>
-    /* ── Reset & Tokens ── */
-    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
-
-    :root {
-      --rose:        #cc3366;
-      --rose-dark:   #a82a54;
-      --rose-tint:   #f7edf1;
-      --ink:         #1a1814;
-      --ink-mid:     #3d3730;
-      --body-bg:     #faf9f7;
-      --surface:     #ffffff;
-      --warm-gray:   #f0ece6;
-      --border:      #e0dbd4;
-      --text:        #2a2520;
-      --text-muted:  #7c756d;
-      --font-display: 'DM Serif Display', Georgia, serif;
-      --font-body:    'Inter', system-ui, sans-serif;
-      --max-w:       1200px;
-      --gap:         clamp(1.5rem, 4vw, 3rem);
-    }
-
-    html { scroll-behavior: smooth; }
-
-    body {
-      font-family: var(--font-body);
-      font-size: 1rem;
-      line-height: 1.65;
-      color: var(--text);
-      background: var(--body-bg);
-      -webkit-font-smoothing: antialiased;
-    }
-
-    img { display: block; max-width: 100%; }
-    a { color: inherit; text-decoration: none; }
-
-    .container {
-      max-width: var(--max-w);
-      margin-inline: auto;
-      padding-inline: clamp(1.25rem, 5vw, 2.5rem);
-    }
-
-    /* ── Typography ── */
-    .display-lg {
-      font-family: var(--font-display);
-      font-size: clamp(2rem, 4vw, 3.5rem);
-      line-height: 1.1;
-      letter-spacing: -0.015em;
-    }
-    .display-md {
-      font-family: var(--font-display);
-      font-size: clamp(1.5rem, 3vw, 2.25rem);
-      line-height: 1.2;
-    }
-    .label {
-      font-size: 0.75rem;
-      font-weight: 600;
-      letter-spacing: 0.12em;
-      text-transform: uppercase;
-      color: var(--rose);
-    }
-    .body-lg { font-size: 1.125rem; line-height: 1.7; }
-
-    /* ── Buttons ── */
-    .btn {
-      display: inline-flex;
-      align-items: center;
-      gap: 0.5rem;
-      font-family: var(--font-body);
-      font-size: 0.875rem;
-      font-weight: 600;
-      letter-spacing: 0.04em;
-      padding: 0.875rem 1.75rem;
-      border-radius: 2px;
-      transition: all 0.2s ease;
-      cursor: pointer;
-      border: 1.5px solid transparent;
-    }
-    .btn-primary {
-      background: var(--rose);
-      color: #fff;
-      border-color: var(--rose);
-    }
-    .btn-primary:hover {
-      background: var(--rose-dark);
-      border-color: var(--rose-dark);
-    }
-    .btn-outline {
-      background: transparent;
-      color: var(--rose);
-      border-color: var(--rose);
-    }
-    .btn-outline:hover {
-      background: var(--rose);
-      color: #fff;
-    }
-
-    /* ── Navigation ── */
-    .site-header {
-      position: fixed;
-      top: 0;
-      left: 0;
-      right: 0;
-      z-index: 100;
-      background: rgba(255,255,255,0.97);
-      box-shadow: 0 1px 0 var(--border);
-      backdrop-filter: blur(12px);
-      -webkit-backdrop-filter: blur(12px);
-      transition: background 0.3s ease, box-shadow 0.3s ease;
-    }
-    .nav-inner {
-      display: flex;
-      align-items: center;
-      justify-content: space-between;
-      height: 72px;
-    }
-    .nav-logo {
-      display: flex;
-      align-items: center;
-      gap: 0.625rem;
-    }
-    .nav-logo img { height: 44px; width: auto; }
-
-    .nav-links {
-      display: flex;
-      align-items: center;
-      gap: 2rem;
-      list-style: none;
-    }
-    .nav-links a {
-      font-size: 0.875rem;
-      font-weight: 500;
-      color: var(--ink-mid);
-      transition: color 0.15s;
-    }
-    .nav-links a:hover { color: var(--rose) !important; }
-
-    .nav-cta {
-      font-size: 0.8125rem;
-      font-weight: 600;
-      padding: 0.625rem 1.25rem;
-      border-radius: 2px;
-      border: 1.5px solid var(--rose);
-      color: var(--rose);
-      background: transparent;
-      transition: all 0.2s;
-    }
-    .nav-cta:hover {
-      background: var(--rose) !important;
-      border-color: var(--rose) !important;
-      color: #fff !important;
-    }
-
-    .nav-hamburger {
-      display: none;
-      flex-direction: column;
-      gap: 5px;
-      cursor: pointer;
-      padding: 4px;
-      background: none;
-      border: none;
-      color: var(--ink);
-    }
-    .nav-hamburger span {
-      display: block;
-      width: 24px;
-      height: 2px;
-      background: currentColor;
-      transition: all 0.25s;
-    }
-
-    /* ── Mobile Nav ── */
-    .mobile-menu {
-      display: none;
-      position: fixed;
-      inset: 0;
-      background: var(--ink);
-      z-index: 99;
-      flex-direction: column;
-      justify-content: center;
-      align-items: center;
-      gap: 2rem;
-    }
-    .mobile-menu.open { display: flex; }
-    .mobile-menu a {
-      font-family: var(--font-display);
-      font-size: 2rem;
-      color: rgba(255,255,255,0.75);
-      transition: color 0.15s;
-    }
-    .mobile-menu a:hover { color: #fff; }
-    .mobile-menu-close {
-      position: absolute;
-      top: 1.5rem;
-      right: 1.5rem;
-      background: none;
-      border: none;
-      color: rgba(255,255,255,0.5);
-      font-size: 1.5rem;
-      cursor: pointer;
-      line-height: 1;
-    }
-
-    /* ── Page Hero ── */
-    .page-hero {
-      background: var(--ink);
-      padding: 140px 0 60px;
-    }
-    .breadcrumb {
-      display: flex;
-      align-items: center;
-      gap: 0.5rem;
-      font-size: 0.8125rem;
-      color: rgba(255,255,255,0.4);
-      margin-bottom: 1.25rem;
-    }
-    .breadcrumb a {
-      color: rgba(255,255,255,0.5);
-      transition: color 0.15s;
-    }
-    .breadcrumb a:hover { color: #fff; }
-    .breadcrumb span { color: rgba(255,255,255,0.25); }
-    .page-hero h1 {
-      font-family: var(--font-display);
-      font-size: clamp(2.25rem, 5vw, 3.5rem);
-      line-height: 1.1;
-      color: #fff;
-    }
-
-    /* ── Section Scaffolding ── */
-    .section { padding: clamp(4rem, 8vw, 7rem) 0; }
-
     /* ── About Intro ── */
     .about-intro { background: var(--surface); }
     .about-intro-grid {
@@ -342,155 +112,16 @@
       border-radius: 3px;
     }
 
-    /* ── CTA Banner ── */
-    .cta-section {
-      background: var(--warm-gray);
-    }
-    .cta-inner {
-      display: grid;
-      grid-template-columns: 1fr auto;
-      gap: 3rem;
-      align-items: center;
-      padding: clamp(3.5rem, 7vw, 6rem) 0;
-    }
-    .cta-text .label { margin-bottom: 0.75rem; }
-    .cta-text h2 { margin-bottom: 1rem; }
-    .cta-text p {
-      color: var(--text-muted);
-      font-size: 1rem;
-      max-width: 520px;
-      line-height: 1.75;
-    }
-    .cta-actions {
-      display: flex;
-      flex-direction: column;
-      gap: 0.75rem;
-      align-items: flex-start;
-      white-space: nowrap;
-    }
-    .cta-phone {
-      display: flex;
-      align-items: center;
-      gap: 0.5rem;
-      font-size: 0.875rem;
-      color: var(--text-muted);
-    }
-    .cta-phone strong {
-      color: var(--text);
-      font-weight: 600;
-    }
-
-    /* ── Footer ── */
-    .site-footer {
-      background: var(--ink);
-      padding: clamp(3.5rem, 6vw, 5rem) 0 2rem;
-    }
-    .footer-grid {
-      display: grid;
-      grid-template-columns: 1.75fr 1fr 1fr 1fr;
-      gap: 3rem;
-      padding-bottom: 3rem;
-      border-bottom: 1px solid rgba(255,255,255,0.07);
-    }
-    .footer-brand img { height: 38px; margin-bottom: 1rem; }
-    .footer-brand p {
-      font-size: 0.875rem;
-      color: rgba(255,255,255,0.4);
-      line-height: 1.75;
-      max-width: 260px;
-      margin-bottom: 1.5rem;
-    }
-    .footer-social {
-      display: flex;
-      gap: 0.625rem;
-    }
-    .footer-social a {
-      width: 36px;
-      height: 36px;
-      border: 1px solid rgba(255,255,255,0.12);
-      border-radius: 2px;
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      color: rgba(255,255,255,0.45);
-      font-size: 0.75rem;
-      transition: all 0.2s;
-    }
-    .footer-social a:hover {
-      border-color: var(--rose);
-      color: var(--rose);
-    }
-    .footer-col h4 {
-      font-size: 0.75rem;
-      font-weight: 600;
-      letter-spacing: 0.1em;
-      text-transform: uppercase;
-      color: rgba(255,255,255,0.3);
-      margin-bottom: 1.25rem;
-    }
-    .footer-col ul { list-style: none; }
-    .footer-col ul li { margin-bottom: 0.625rem; }
-    .footer-col ul li a {
-      font-size: 0.875rem;
-      color: rgba(255,255,255,0.5);
-      transition: color 0.15s;
-    }
-    .footer-col ul li a:hover { color: #fff; }
-    .footer-contact-item {
-      display: flex;
-      gap: 0.5rem;
-      font-size: 0.875rem;
-      color: rgba(255,255,255,0.5);
-      margin-bottom: 0.5rem;
-      line-height: 1.5;
-    }
-    .footer-contact-item strong { color: rgba(255,255,255,0.75); }
-    .footer-bottom {
-      display: flex;
-      align-items: center;
-      justify-content: space-between;
-      padding-top: 1.75rem;
-      gap: 1rem;
-      flex-wrap: wrap;
-    }
-    .footer-bottom p {
-      font-size: 0.8125rem;
-      color: rgba(255,255,255,0.28);
-    }
-    .footer-bottom-links {
-      display: flex;
-      gap: 1.5rem;
-      list-style: none;
-    }
-    .footer-bottom-links a {
-      font-size: 0.8125rem;
-      color: rgba(255,255,255,0.28);
-      transition: color 0.15s;
-    }
-    .footer-bottom-links a:hover { color: rgba(255,255,255,0.65); }
-
-    /* ── Responsive ── */
+    /* ── Responsive (page-specific) ── */
     @media (max-width: 1024px) {
       .values-grid { grid-template-columns: 1fr 1fr; }
-      .footer-grid { grid-template-columns: 1fr 1fr; gap: 2.5rem; }
-      .footer-brand { grid-column: span 2; }
     }
 
     @media (max-width: 768px) {
-      .nav-links, .nav-cta { display: none; }
-      .nav-hamburger { display: flex; }
-
       .about-intro-grid { grid-template-columns: 1fr; }
       .values-grid { grid-template-columns: 1fr; }
       .why-grid { grid-template-columns: 1fr; }
       .why-img-wrap { order: -1; }
-      .cta-inner { grid-template-columns: 1fr; }
-      .footer-grid { grid-template-columns: 1fr; }
-      .footer-brand { grid-column: span 1; }
-    }
-
-    @media (max-width: 480px) {
-      .page-hero { padding: 120px 0 40px; }
     }
   </style>
 </head>
diff --git a/assets/css/main.css b/assets/css/main.css
new file mode 100644
index 0000000..cf17278
--- /dev/null
+++ b/assets/css/main.css
@@ -0,0 +1,440 @@
+/* ══════════════════════════════════════════════
+   Sea Haven Industries — Shared Styles
+   ══════════════════════════════════════════════ */
+
+/* ── Reset & Tokens ── */
+*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
+
+:root {
+  --rose:        #cc3366;
+  --rose-dark:   #a82a54;
+  --rose-tint:   #f7edf1;
+  --ink:         #1a1814;
+  --ink-mid:     #3d3730;
+  --body-bg:     #faf9f7;
+  --surface:     #ffffff;
+  --warm-gray:   #f0ece6;
+  --border:      #e0dbd4;
+  --text:        #2a2520;
+  --text-muted:  #7c756d;
+  --font-display: 'DM Serif Display', Georgia, serif;
+  --font-body:    'Inter', system-ui, sans-serif;
+  --max-w:       1200px;
+  --gap:         clamp(1.5rem, 4vw, 3rem);
+}
+
+html { scroll-behavior: smooth; }
+
+body {
+  font-family: var(--font-body);
+  font-size: 1rem;
+  line-height: 1.65;
+  color: var(--text);
+  background: var(--body-bg);
+  -webkit-font-smoothing: antialiased;
+}
+
+img { display: block; max-width: 100%; }
+a { color: inherit; text-decoration: none; }
+
+.container {
+  max-width: var(--max-w);
+  margin-inline: auto;
+  padding-inline: clamp(1.25rem, 5vw, 2.5rem);
+}
+
+/* ── Typography ── */
+.display-xl {
+  font-family: var(--font-display);
+  font-size: clamp(2.8rem, 6vw, 5.5rem);
+  line-height: 1.05;
+  letter-spacing: -0.02em;
+}
+.display-lg {
+  font-family: var(--font-display);
+  font-size: clamp(2rem, 4vw, 3.5rem);
+  line-height: 1.1;
+  letter-spacing: -0.015em;
+}
+.display-md {
+  font-family: var(--font-display);
+  font-size: clamp(1.5rem, 3vw, 2.25rem);
+  line-height: 1.2;
+}
+.label {
+  font-size: 0.75rem;
+  font-weight: 600;
+  letter-spacing: 0.12em;
+  text-transform: uppercase;
+  color: var(--rose);
+}
+.body-lg { font-size: 1.125rem; line-height: 1.7; }
+.body-sm { font-size: 0.875rem; line-height: 1.6; color: var(--text-muted); }
+
+/* ── Buttons ── */
+.btn {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.5rem;
+  font-family: var(--font-body);
+  font-size: 0.875rem;
+  font-weight: 600;
+  letter-spacing: 0.04em;
+  padding: 0.875rem 1.75rem;
+  border-radius: 2px;
+  transition: all 0.2s ease;
+  cursor: pointer;
+  border: 1.5px solid transparent;
+}
+.btn-primary {
+  background: var(--rose);
+  color: #fff;
+  border-color: var(--rose);
+}
+.btn-primary:hover {
+  background: var(--rose-dark);
+  border-color: var(--rose-dark);
+}
+.btn-outline {
+  background: transparent;
+  color: var(--rose);
+  border-color: var(--rose);
+}
+.btn-outline:hover {
+  background: var(--rose);
+  color: #fff;
+}
+.btn-ghost-light {
+  background: transparent;
+  color: #fff;
+  border-color: rgba(255,255,255,0.5);
+}
+.btn-ghost-light:hover {
+  background: rgba(255,255,255,0.12);
+  border-color: #fff;
+}
+.btn svg { width: 1rem; height: 1rem; }
+
+/* ── Navigation (Interior Page — always white) ── */
+.site-header {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  z-index: 100;
+  background: rgba(255,255,255,0.97);
+  box-shadow: 0 1px 0 var(--border);
+  backdrop-filter: blur(12px);
+  -webkit-backdrop-filter: blur(12px);
+  transition: background 0.3s ease, box-shadow 0.3s ease;
+}
+.nav-inner {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  height: 72px;
+}
+.nav-logo {
+  display: flex;
+  align-items: center;
+  gap: 0.625rem;
+}
+.nav-logo img { height: 44px; width: auto; }
+
+.nav-links {
+  display: flex;
+  align-items: center;
+  gap: 2rem;
+  list-style: none;
+}
+.nav-links a {
+  font-size: 0.875rem;
+  font-weight: 500;
+  color: var(--ink-mid);
+  transition: color 0.15s;
+}
+.nav-links a:hover { color: var(--rose) !important; }
+
+.nav-cta {
+  font-size: 0.8125rem;
+  font-weight: 600;
+  padding: 0.625rem 1.25rem;
+  border-radius: 2px;
+  border: 1.5px solid var(--rose);
+  color: var(--rose);
+  background: transparent;
+  transition: all 0.2s;
+}
+.nav-cta:hover {
+  background: var(--rose) !important;
+  border-color: var(--rose) !important;
+  color: #fff !important;
+}
+
+.nav-hamburger {
+  display: none;
+  flex-direction: column;
+  gap: 5px;
+  cursor: pointer;
+  padding: 4px;
+  background: none;
+  border: none;
+  color: var(--ink);
+}
+.nav-hamburger span {
+  display: block;
+  width: 24px;
+  height: 2px;
+  background: currentColor;
+  transition: all 0.25s;
+}
+
+/* ── Mobile Nav ── */
+.mobile-menu {
+  display: none;
+  position: fixed;
+  inset: 0;
+  background: var(--ink);
+  z-index: 99;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  gap: 2rem;
+}
+.mobile-menu.open { display: flex; }
+.mobile-menu a {
+  font-family: var(--font-display);
+  font-size: 2rem;
+  color: rgba(255,255,255,0.75);
+  transition: color 0.15s;
+}
+.mobile-menu a:hover { color: #fff; }
+.mobile-menu-close {
+  position: absolute;
+  top: 1.5rem;
+  right: 1.5rem;
+  background: none;
+  border: none;
+  color: rgba(255,255,255,0.5);
+  font-size: 1.5rem;
+  cursor: pointer;
+  line-height: 1;
+}
+
+/* ── Page Hero ── */
+.page-hero {
+  background: var(--ink);
+  padding: 140px 0 60px;
+}
+.breadcrumb {
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
+  font-size: 0.8125rem;
+  color: rgba(255,255,255,0.4);
+  margin-bottom: 1.25rem;
+}
+.breadcrumb a {
+  color: rgba(255,255,255,0.5);
+  transition: color 0.15s;
+}
+.breadcrumb a:hover { color: #fff; }
+.breadcrumb span { color: rgba(255,255,255,0.25); }
+.page-hero h1 {
+  font-family: var(--font-display);
+  font-size: clamp(2.25rem, 5vw, 3.5rem);
+  line-height: 1.1;
+  color: #fff;
+}
+
+/* ── Section Scaffolding ── */
+.section { padding: clamp(4rem, 8vw, 7rem) 0; }
+.section-header { margin-bottom: clamp(2.5rem, 5vw, 4rem); }
+.section-header .label { margin-bottom: 0.75rem; }
+
+/* ── CTA Banner ── */
+.cta-section {
+  position: relative;
+  overflow: hidden;
+  background: var(--warm-gray);
+}
+.cta-inner {
+  display: grid;
+  grid-template-columns: 1fr auto;
+  gap: 3rem;
+  align-items: center;
+  padding: clamp(3.5rem, 7vw, 6rem) 0;
+}
+.cta-text .label { margin-bottom: 0.75rem; }
+.cta-text h2 { margin-bottom: 1rem; }
+.cta-text p {
+  color: var(--text-muted);
+  font-size: 1rem;
+  max-width: 520px;
+  line-height: 1.75;
+}
+.cta-actions {
+  display: flex;
+  flex-direction: column;
+  gap: 0.75rem;
+  align-items: flex-start;
+  white-space: nowrap;
+}
+.cta-phone {
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
+  font-size: 0.875rem;
+  color: var(--text-muted);
+}
+.cta-phone strong {
+  color: var(--text);
+  font-weight: 600;
+}
+
+/* ── Common Form Styles ── */
+.form-group {
+  margin-bottom: 1.25rem;
+}
+.form-group label {
+  display: block;
+  font-size: 0.8125rem;
+  font-weight: 500;
+  color: var(--text);
+  margin-bottom: 0.375rem;
+}
+.form-group input,
+.form-group textarea {
+  width: 100%;
+  border: 1px solid var(--border);
+  padding: 0.75rem 1rem;
+  border-radius: 2px;
+  font-family: var(--font-body);
+  font-size: 0.9375rem;
+  color: var(--text);
+  background: var(--surface);
+  transition: border-color 0.2s ease;
+  outline: none;
+}
+.form-group input::placeholder,
+.form-group textarea::placeholder {
+  color: var(--text-muted);
+}
+.form-group input:focus,
+.form-group textarea:focus {
+  border-color: var(--rose);
+}
+.form-group textarea {
+  resize: vertical;
+  min-height: 120px;
+}
+.form-submit {
+  margin-top: 0.5rem;
+}
+
+/* ── Footer ── */
+.site-footer {
+  background: var(--ink);
+  padding: clamp(3.5rem, 6vw, 5rem) 0 2rem;
+}
+.footer-grid {
+  display: grid;
+  grid-template-columns: 1.75fr 1fr 1fr 1fr;
+  gap: 3rem;
+  padding-bottom: 3rem;
+  border-bottom: 1px solid rgba(255,255,255,0.07);
+}
+.footer-brand img { height: 38px; margin-bottom: 1rem; }
+.footer-brand p {
+  font-size: 0.875rem;
+  color: rgba(255,255,255,0.4);
+  line-height: 1.75;
+  max-width: 260px;
+  margin-bottom: 1.5rem;
+}
+.footer-social {
+  display: flex;
+  gap: 0.625rem;
+}
+.footer-social a {
+  width: 36px;
+  height: 36px;
+  border: 1px solid rgba(255,255,255,0.12);
+  border-radius: 2px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: rgba(255,255,255,0.45);
+  font-size: 0.75rem;
+  transition: all 0.2s;
+}
+.footer-social a:hover {
+  border-color: var(--rose);
+  color: var(--rose);
+}
+.footer-col h4 {
+  font-size: 0.75rem;
+  font-weight: 600;
+  letter-spacing: 0.1em;
+  text-transform: uppercase;
+  color: rgba(255,255,255,0.3);
+  margin-bottom: 1.25rem;
+}
+.footer-col ul { list-style: none; }
+.footer-col ul li { margin-bottom: 0.625rem; }
+.footer-col ul li a {
+  font-size: 0.875rem;
+  color: rgba(255,255,255,0.5);
+  transition: color 0.15s;
+}
+.footer-col ul li a:hover { color: #fff; }
+.footer-contact-item {
+  display: flex;
+  gap: 0.5rem;
+  font-size: 0.875rem;
+  color: rgba(255,255,255,0.5);
+  margin-bottom: 0.5rem;
+  line-height: 1.5;
+}
+.footer-contact-item strong { color: rgba(255,255,255,0.75); }
+.footer-bottom {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding-top: 1.75rem;
+  gap: 1rem;
+  flex-wrap: wrap;
+}
+.footer-bottom p {
+  font-size: 0.8125rem;
+  color: rgba(255,255,255,0.28);
+}
+.footer-bottom-links {
+  display: flex;
+  gap: 1.5rem;
+  list-style: none;
+}
+.footer-bottom-links a {
+  font-size: 0.8125rem;
+  color: rgba(255,255,255,0.28);
+  transition: color 0.15s;
+}
+.footer-bottom-links a:hover { color: rgba(255,255,255,0.65); }
+
+/* ── Shared Responsive ── */
+@media (max-width: 1024px) {
+  .footer-grid { grid-template-columns: 1fr 1fr; gap: 2.5rem; }
+  .footer-brand { grid-column: span 2; }
+}
+
+@media (max-width: 768px) {
+  .nav-links, .nav-cta { display: none; }
+  .nav-hamburger { display: flex; }
+  .cta-inner { grid-template-columns: 1fr; }
+  .footer-grid { grid-template-columns: 1fr; }
+  .footer-brand { grid-column: span 1; }
+}
+
+@media (max-width: 480px) {
+  .page-hero { padding: 120px 0 40px; }
+}
diff --git a/career/index.html b/career/index.html
index cb5461d..1b36e37 100644
--- a/career/index.html
+++ b/career/index.html
@@ -21,210 +21,9 @@
   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
   <link rel="preload" as="style" href="https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&family=Inter:wght@300;400;500;600&display=swap">
   <link href="https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&family=Inter:wght@300;400;500;600&display=swap" rel="stylesheet">
+  <link rel="stylesheet" href="/assets/css/main.css">
 
   <style>
-    /* ── Reset & Tokens ── */
-    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
-
-    :root {
-      --rose:        #cc3366;
-      --rose-dark:   #a82a54;
-      --rose-tint:   #f7edf1;
-      --ink:         #1a1814;
-      --ink-mid:     #3d3730;
-      --body-bg:     #faf9f7;
-      --surface:     #ffffff;
-      --warm-gray:   #f0ece6;
-      --border:      #e0dbd4;
-      --text:        #2a2520;
-      --text-muted:  #7c756d;
-      --font-display: 'DM Serif Display', Georgia, serif;
-      --font-body:    'Inter', system-ui, sans-serif;
-      --max-w:       1200px;
-      --gap:         clamp(1.5rem, 4vw, 3rem);
-    }
-
-    html { scroll-behavior: smooth; }
-
-    body {
-      font-family: var(--font-body);
-      font-size: 1rem;
-      line-height: 1.65;
-      color: var(--text);
-      background: var(--body-bg);
-      -webkit-font-smoothing: antialiased;
-    }
-
-    img { display: block; max-width: 100%; }
-    a { color: inherit; text-decoration: none; }
-
-    .container {
-      max-width: var(--max-w);
-      margin-inline: auto;
-      padding-inline: clamp(1.25rem, 5vw, 2.5rem);
-    }
-
-    /* ── Typography ── */
-    .display-lg {
-      font-family: var(--font-display);
-      font-size: clamp(2rem, 4vw, 3.5rem);
-      line-height: 1.1;
-      letter-spacing: -0.015em;
-    }
-    .display-md {
-      font-family: var(--font-display);
-      font-size: clamp(1.5rem, 3vw, 2.25rem);
-      line-height: 1.2;
-    }
-    .label {
-      font-size: 0.75rem;
-      font-weight: 600;
-      letter-spacing: 0.12em;
-      text-transform: uppercase;
-      color: var(--rose);
-    }
-    .body-lg { font-size: 1.125rem; line-height: 1.7; }
-    .body-sm { font-size: 0.875rem; line-height: 1.6; color: var(--text-muted); }
-
-    /* ── Buttons ── */
-    .btn {
-      display: inline-flex;
-      align-items: center;
-      gap: 0.5rem;
-      font-family: var(--font-body);
-      font-size: 0.875rem;
-      font-weight: 600;
-      letter-spacing: 0.04em;
-      padding: 0.875rem 1.75rem;
-      border-radius: 2px;
-      transition: all 0.2s ease;
-      cursor: pointer;
-      border: 1.5px solid transparent;
-    }
-    .btn-primary {
-      background: var(--rose);
-      color: #fff;
-      border-color: var(--rose);
-    }
-    .btn-primary:hover {
-      background: var(--rose-dark);
-      border-color: var(--rose-dark);
-    }
-    .btn-ghost-light {
-      background: transparent;
-      color: #fff;
-      border-color: rgba(255,255,255,0.5);
-    }
-    .btn-ghost-light:hover {
-      background: rgba(255,255,255,0.12);
-      border-color: #fff;
-    }
-
-    /* ── Navigation ── */
-    .site-header {
-      position: fixed;
-      top: 0;
-      left: 0;
-      right: 0;
-      z-index: 100;
-      background: rgba(255,255,255,0.97);
-      box-shadow: 0 1px 0 var(--border);
-      backdrop-filter: blur(12px);
-      -webkit-backdrop-filter: blur(12px);
-      transition: background 0.3s ease, box-shadow 0.3s ease;
-    }
-    .nav-inner {
-      display: flex;
-      align-items: center;
-      justify-content: space-between;
-      height: 72px;
-    }
-    .nav-logo {
-      display: flex;
-      align-items: center;
-      gap: 0.625rem;
-    }
-    .nav-logo img { height: 44px; width: auto; }
-
-    .nav-links {
-      display: flex;
-      align-items: center;
-      gap: 2rem;
-      list-style: none;
-    }
-    .nav-links a {
-      font-size: 0.875rem;
-      font-weight: 500;
-      color: var(--ink-mid);
-      transition: color 0.15s;
-    }
-    .nav-links a:hover { color: var(--rose) !important; }
-
-    .nav-cta {
-      font-size: 0.8125rem;
-      font-weight: 600;
-      padding: 0.625rem 1.25rem;
-      border-radius: 2px;
-      border: 1.5px solid var(--rose);
-      color: var(--rose);
-      background: transparent;
-      transition: all 0.2s;
-    }
-    .nav-cta:hover {
-      background: var(--rose) !important;
-      border-color: var(--rose) !important;
-      color: #fff !important;
-    }
-
-    .nav-hamburger {
-      display: none;
-      flex-direction: column;
-      gap: 5px;
-      cursor: pointer;
-      padding: 4px;
-      background: none;
-      border: none;
-      color: var(--ink);
-    }
-    .nav-hamburger span {
-      display: block;
-      width: 24px;
-      height: 2px;
-      background: currentColor;
-      transition: all 0.25s;
-    }
-
-    /* ── Page Hero ── */
-    .page-hero {
-      background: var(--ink);
-      padding: 140px 0 60px;
-    }
-    .breadcrumb {
-      display: flex;
-      align-items: center;
-      gap: 0.5rem;
-      font-size: 0.8125rem;
-      color: rgba(255,255,255,0.4);
-      margin-bottom: 1.25rem;
-    }
-    .breadcrumb a {
-      color: rgba(255,255,255,0.5);
-      transition: color 0.15s;
-    }
-    .breadcrumb a:hover { color: #fff; }
-    .breadcrumb span { color: rgba(255,255,255,0.25); }
-    .page-hero h1 {
-      font-family: var(--font-display);
-      font-size: clamp(2.25rem, 5vw, 3.5rem);
-      line-height: 1.1;
-      color: #fff;
-    }
-
-    /* ── Section Scaffolding ── */
-    .section { padding: clamp(4rem, 8vw, 7rem) 0; }
-    .section-header { margin-bottom: clamp(2.5rem, 5vw, 4rem); }
-    .section-header .label { margin-bottom: 0.75rem; }
-
     /* ── Careers Intro ── */
     .careers-intro { background: var(--surface); }
     .careers-intro .label { margin-bottom: 0.75rem; }
@@ -314,140 +113,9 @@
       margin: 0 auto 2rem;
     }
 
-    /* ── Footer ── */
-    .site-footer {
-      background: var(--ink);
-      padding: clamp(3.5rem, 6vw, 5rem) 0 2rem;
-    }
-    .footer-grid {
-      display: grid;
-      grid-template-columns: 1.75fr 1fr 1fr 1fr;
-      gap: 3rem;
-      padding-bottom: 3rem;
-      border-bottom: 1px solid rgba(255,255,255,0.07);
-    }
-    .footer-brand img { height: 38px; margin-bottom: 1rem; }
-    .footer-brand p {
-      font-size: 0.875rem;
-      color: rgba(255,255,255,0.4);
-      line-height: 1.75;
-      max-width: 260px;
-      margin-bottom: 1.5rem;
-    }
-    .footer-social {
-      display: flex;
-      gap: 0.625rem;
-    }
-    .footer-social a {
-      width: 36px;
-      height: 36px;
-      border: 1px solid rgba(255,255,255,0.12);
-      border-radius: 2px;
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      color: rgba(255,255,255,0.45);
-      font-size: 0.75rem;
-      transition: all 0.2s;
-    }
-    .footer-social a:hover {
-      border-color: var(--rose);
-      color: var(--rose);
-    }
-    .footer-col h4 {
-      font-size: 0.75rem;
-      font-weight: 600;
-      letter-spacing: 0.1em;
-      text-transform: uppercase;
-      color: rgba(255,255,255,0.3);
-      margin-bottom: 1.25rem;
-    }
-    .footer-col ul { list-style: none; }
-    .footer-col ul li { margin-bottom: 0.625rem; }
-    .footer-col ul li a {
-      font-size: 0.875rem;
-      color: rgba(255,255,255,0.5);
-      transition: color 0.15s;
-    }
-    .footer-col ul li a:hover { color: #fff; }
-    .footer-contact-item {
-      display: flex;
-      gap: 0.5rem;
-      font-size: 0.875rem;
-      color: rgba(255,255,255,0.5);
-      margin-bottom: 0.5rem;
-      line-height: 1.5;
-    }
-    .footer-contact-item strong { color: rgba(255,255,255,0.75); }
-    .footer-bottom {
-      display: flex;
-      align-items: center;
-      justify-content: space-between;
-      padding-top: 1.75rem;
-      gap: 1rem;
-      flex-wrap: wrap;
-    }
-    .footer-bottom p {
-      font-size: 0.8125rem;
-      color: rgba(255,255,255,0.28);
-    }
-    .footer-bottom-links {
-      display: flex;
-      gap: 1.5rem;
-      list-style: none;
-    }
-    .footer-bottom-links a {
-      font-size: 0.8125rem;
-      color: rgba(255,255,255,0.28);
-      transition: color 0.15s;
-    }
-    .footer-bottom-links a:hover { color: rgba(255,255,255,0.65); }
-
-    /* ── Mobile Nav ── */
-    .mobile-menu {
-      display: none;
-      position: fixed;
-      inset: 0;
-      background: var(--ink);
-      z-index: 99;
-      flex-direction: column;
-      justify-content: center;
-      align-items: center;
-      gap: 2rem;
-    }
-    .mobile-menu.open { display: flex; }
-    .mobile-menu a {
-      font-family: var(--font-display);
-      font-size: 2rem;
-      color: rgba(255,255,255,0.75);
-      transition: color 0.15s;
-    }
-    .mobile-menu a:hover { color: #fff; }
-    .mobile-menu-close {
-      position: absolute;
-      top: 1.5rem;
-      right: 1.5rem;
-      background: none;
-      border: none;
-      color: rgba(255,255,255,0.5);
-      font-size: 1.5rem;
-      cursor: pointer;
-      line-height: 1;
-    }
-
-    /* ── Responsive ── */
-    @media (max-width: 1024px) {
-      .footer-grid { grid-template-columns: 1fr 1fr; gap: 2.5rem; }
-      .footer-brand { grid-column: span 2; }
-    }
-
+    /* ── Responsive (page-specific) ── */
     @media (max-width: 768px) {
-      .nav-links, .nav-cta { display: none; }
-      .nav-hamburger { display: flex; }
-      .page-hero { padding: 120px 0 40px; }
       .job-meta { flex-direction: column; gap: 0.5rem; align-items: flex-start; }
-      .footer-grid { grid-template-columns: 1fr; }
-      .footer-brand { grid-column: span 1; }
     }
 
     @media (max-width: 480px) {
diff --git a/contact/index.html b/contact/index.html
index 3e8c63d..1d4b727 100644
--- a/contact/index.html
+++ b/contact/index.html
@@ -21,199 +21,10 @@
   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
   <link rel="preload" as="style" href="https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&family=Inter:wght@300;400;500;600&display=swap">
   <link href="https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&family=Inter:wght@300;400;500;600&display=swap" rel="stylesheet">
+  <link rel="stylesheet" href="/assets/css/main.css">
 
   <style>
     .grecaptcha-badge { visibility: hidden; }
-    /* ── Reset & Tokens ── */
-    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
-
-    :root {
-      --rose:        #cc3366;
-      --rose-dark:   #a82a54;
-      --rose-tint:   #f7edf1;
-      --ink:         #1a1814;
-      --ink-mid:     #3d3730;
-      --body-bg:     #faf9f7;
-      --surface:     #ffffff;
-      --warm-gray:   #f0ece6;
-      --border:      #e0dbd4;
-      --text:        #2a2520;
-      --text-muted:  #7c756d;
-      --font-display: 'DM Serif Display', Georgia, serif;
-      --font-body:    'Inter', system-ui, sans-serif;
-      --max-w:       1200px;
-      --gap:         clamp(1.5rem, 4vw, 3rem);
-    }
-
-    html { scroll-behavior: smooth; }
-
-    body {
-      font-family: var(--font-body);
-      font-size: 1rem;
-      line-height: 1.65;
-      color: var(--text);
-      background: var(--body-bg);
-      -webkit-font-smoothing: antialiased;
-    }
-
-    img { display: block; max-width: 100%; }
-    a { color: inherit; text-decoration: none; }
-
-    .container {
-      max-width: var(--max-w);
-      margin-inline: auto;
-      padding-inline: clamp(1.25rem, 5vw, 2.5rem);
-    }
-
-    /* ── Typography ── */
-    .display-lg {
-      font-family: var(--font-display);
-      font-size: clamp(2rem, 4vw, 3.5rem);
-      line-height: 1.1;
-      letter-spacing: -0.015em;
-    }
-    .display-md {
-      font-family: var(--font-display);
-      font-size: clamp(1.5rem, 3vw, 2.25rem);
-      line-height: 1.2;
-    }
-    .label {
-      font-size: 0.75rem;
-      font-weight: 600;
-      letter-spacing: 0.12em;
-      text-transform: uppercase;
-      color: var(--rose);
-    }
-    .body-lg { font-size: 1.125rem; line-height: 1.7; }
-    .body-sm { font-size: 0.875rem; line-height: 1.6; color: var(--text-muted); }
-
-    /* ── Buttons ── */
-    .btn {
-      display: inline-flex;
-      align-items: center;
-      gap: 0.5rem;
-      font-family: var(--font-body);
-      font-size: 0.875rem;
-      font-weight: 600;
-      letter-spacing: 0.04em;
-      padding: 0.875rem 1.75rem;
-      border-radius: 2px;
-      transition: all 0.2s ease;
-      cursor: pointer;
-      border: 1.5px solid transparent;
-    }
-    .btn-primary {
-      background: var(--rose);
-      color: #fff;
-      border-color: var(--rose);
-    }
-    .btn-primary:hover {
-      background: var(--rose-dark);
-      border-color: var(--rose-dark);
-    }
-
-    /* ── Navigation ── */
-    .site-header {
-      position: fixed;
-      top: 0;
-      left: 0;
-      right: 0;
-      z-index: 100;
-      background: rgba(255,255,255,0.97);
-      box-shadow: 0 1px 0 var(--border);
-      backdrop-filter: blur(12px);
-      -webkit-backdrop-filter: blur(12px);
-      transition: background 0.3s ease, box-shadow 0.3s ease;
-    }
-    .nav-inner {
-      display: flex;
-      align-items: center;
-      justify-content: space-between;
-      height: 72px;
-    }
-    .nav-logo {
-      display: flex;
-      align-items: center;
-      gap: 0.625rem;
-    }
-    .nav-logo img { height: 44px; width: auto; }
-
-    .nav-links {
-      display: flex;
-      align-items: center;
-      gap: 2rem;
-      list-style: none;
-    }
-    .nav-links a {
-      font-size: 0.875rem;
-      font-weight: 500;
-      color: var(--ink-mid);
-      transition: color 0.15s;
-    }
-    .nav-links a:hover { color: var(--rose) !important; }
-
-    .nav-cta {
-      font-size: 0.8125rem;
-      font-weight: 600;
-      padding: 0.625rem 1.25rem;
-      border-radius: 2px;
-      border: 1.5px solid var(--rose);
-      color: var(--rose);
-      background: transparent;
-      transition: all 0.2s;
-    }
-    .nav-cta:hover {
-      background: var(--rose) !important;
-      border-color: var(--rose) !important;
-      color: #fff !important;
-    }
-
-    .nav-hamburger {
-      display: none;
-      flex-direction: column;
-      gap: 5px;
-      cursor: pointer;
-      padding: 4px;
-      background: none;
-      border: none;
-      color: var(--ink);
-    }
-    .nav-hamburger span {
-      display: block;
-      width: 24px;
-      height: 2px;
-      background: currentColor;
-      transition: all 0.25s;
-    }
-
-    /* ── Page Hero ── */
-    .page-hero {
-      background: var(--ink);
-      padding: 140px 0 60px;
-    }
-    .breadcrumb {
-      display: flex;
-      align-items: center;
-      gap: 0.5rem;
-      font-size: 0.8125rem;
-      color: rgba(255,255,255,0.4);
-      margin-bottom: 1.25rem;
-    }
-    .breadcrumb a {
-      color: rgba(255,255,255,0.5);
-      transition: color 0.15s;
-    }
-    .breadcrumb a:hover { color: #fff; }
-    .breadcrumb span { color: rgba(255,255,255,0.25); }
-    .page-hero h1 {
-      font-family: var(--font-display);
-      font-size: clamp(2.25rem, 5vw, 3.5rem);
-      line-height: 1.1;
-      color: #fff;
-    }
-
-    /* ── Section Scaffolding ── */
-    .section { padding: clamp(4rem, 8vw, 7rem) 0; }
 
     /* ── Contact Section ── */
     .contact-section { background: var(--surface); }
@@ -279,180 +90,14 @@
       grid-template-columns: 1fr 1fr;
       gap: 1rem;
     }
-    .form-group {
-      margin-bottom: 1.25rem;
-    }
-    .form-group label {
-      display: block;
-      font-size: 0.8125rem;
-      font-weight: 500;
-      color: var(--text);
-      margin-bottom: 0.375rem;
-    }
-    .form-group input,
     .form-group textarea {
-      width: 100%;
-      border: 1px solid var(--border);
-      padding: 0.75rem 1rem;
-      border-radius: 2px;
-      font-family: var(--font-body);
-      font-size: 0.9375rem;
-      color: var(--text);
-      background: var(--surface);
-      transition: border-color 0.2s ease;
-      outline: none;
-    }
-    .form-group input::placeholder,
-    .form-group textarea::placeholder {
-      color: var(--text-muted);
-    }
-    .form-group input:focus,
-    .form-group textarea:focus {
-      border-color: var(--rose);
-    }
-    .form-group textarea {
-      resize: vertical;
       min-height: 140px;
     }
-    .form-submit {
-      margin-top: 0.5rem;
-    }
-
-    /* ── Footer ── */
-    .site-footer {
-      background: var(--ink);
-      padding: clamp(3.5rem, 6vw, 5rem) 0 2rem;
-    }
-    .footer-grid {
-      display: grid;
-      grid-template-columns: 1.75fr 1fr 1fr 1fr;
-      gap: 3rem;
-      padding-bottom: 3rem;
-      border-bottom: 1px solid rgba(255,255,255,0.07);
-    }
-    .footer-brand img { height: 38px; margin-bottom: 1rem; }
-    .footer-brand p {
-      font-size: 0.875rem;
-      color: rgba(255,255,255,0.4);
-      line-height: 1.75;
-      max-width: 260px;
-      margin-bottom: 1.5rem;
-    }
-    .footer-social {
-      display: flex;
-      gap: 0.625rem;
-    }
-    .footer-social a {
-      width: 36px;
-      height: 36px;
-      border: 1px solid rgba(255,255,255,0.12);
-      border-radius: 2px;
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      color: rgba(255,255,255,0.45);
-      font-size: 0.75rem;
-      transition: all 0.2s;
-    }
-    .footer-social a:hover {
-      border-color: var(--rose);
-      color: var(--rose);
-    }
-    .footer-col h4 {
-      font-size: 0.75rem;
-      font-weight: 600;
-      letter-spacing: 0.1em;
-      text-transform: uppercase;
-      color: rgba(255,255,255,0.3);
-      margin-bottom: 1.25rem;
-    }
-    .footer-col ul { list-style: none; }
-    .footer-col ul li { margin-bottom: 0.625rem; }
-    .footer-col ul li a {
-      font-size: 0.875rem;
-      color: rgba(255,255,255,0.5);
-      transition: color 0.15s;
-    }
-    .footer-col ul li a:hover { color: #fff; }
-    .footer-contact-item {
-      display: flex;
-      gap: 0.5rem;
-      font-size: 0.875rem;
-      color: rgba(255,255,255,0.5);
-      margin-bottom: 0.5rem;
-      line-height: 1.5;
-    }
-    .footer-contact-item strong { color: rgba(255,255,255,0.75); }
-    .footer-bottom {
-      display: flex;
-      align-items: center;
-      justify-content: space-between;
-      padding-top: 1.75rem;
-      gap: 1rem;
-      flex-wrap: wrap;
-    }
-    .footer-bottom p {
-      font-size: 0.8125rem;
-      color: rgba(255,255,255,0.28);
-    }
-    .footer-bottom-links {
-      display: flex;
-      gap: 1.5rem;
-      list-style: none;
-    }
-    .footer-bottom-links a {
-      font-size: 0.8125rem;
-      color: rgba(255,255,255,0.28);
-      transition: color 0.15s;
-    }
-    .footer-bottom-links a:hover { color: rgba(255,255,255,0.65); }
-
-    /* ── Mobile Nav ── */
-    .mobile-menu {
-      display: none;
-      position: fixed;
-      inset: 0;
-      background: var(--ink);
-      z-index: 99;
-      flex-direction: column;
-      justify-content: center;
-      align-items: center;
-      gap: 2rem;
-    }
-    .mobile-menu.open { display: flex; }
-    .mobile-menu a {
-      font-family: var(--font-display);
-      font-size: 2rem;
-      color: rgba(255,255,255,0.75);
-      transition: color 0.15s;
-    }
-    .mobile-menu a:hover { color: #fff; }
-    .mobile-menu-close {
-      position: absolute;
-      top: 1.5rem;
-      right: 1.5rem;
-      background: none;
-      border: none;
-      color: rgba(255,255,255,0.5);
-      font-size: 1.5rem;
-      cursor: pointer;
-      line-height: 1;
-    }
-
-    /* ── Responsive ── */
-    @media (max-width: 1024px) {
-      .footer-grid { grid-template-columns: 1fr 1fr; gap: 2.5rem; }
-      .footer-brand { grid-column: span 2; }
-    }
 
+    /* ── Responsive (page-specific) ── */
     @media (max-width: 768px) {
-      .nav-links, .nav-cta { display: none; }
-      .nav-hamburger { display: flex; }
-      .page-hero { padding: 120px 0 40px; }
       .contact-grid { grid-template-columns: 1fr; }
       .form-row { grid-template-columns: 1fr; }
-      .footer-grid { grid-template-columns: 1fr; }
-      .footer-brand { grid-column: span 1; }
     }
 
     @media (max-width: 480px) {
diff --git a/index.html b/index.html
index 5834d65..d7bfd19 100644
--- a/index.html
+++ b/index.html
@@ -21,129 +21,13 @@
   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
   <link rel="preload" as="style" href="https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&family=Inter:wght@300;400;500;600&display=swap">
   <link href="https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&family=Inter:wght@300;400;500;600&display=swap" rel="stylesheet">
+  <link rel="stylesheet" href="/assets/css/main.css">
 
   <style>
-    /* ── Reset & Tokens ── */
-    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
-
-    :root {
-      --rose:        #cc3366;
-      --rose-dark:   #a82a54;
-      --rose-tint:   #f7edf1;
-      --ink:         #1a1814;
-      --ink-mid:     #3d3730;
-      --body-bg:     #faf9f7;
-      --surface:     #ffffff;
-      --warm-gray:   #f0ece6;
-      --border:      #e0dbd4;
-      --text:        #2a2520;
-      --text-muted:  #7c756d;
-      --font-display: 'DM Serif Display', Georgia, serif;
-      --font-body:    'Inter', system-ui, sans-serif;
-      --max-w:       1200px;
-      --gap:         clamp(1.5rem, 4vw, 3rem);
-    }
-
-    html { scroll-behavior: smooth; }
-
-    body {
-      font-family: var(--font-body);
-      font-size: 1rem;
-      line-height: 1.65;
-      color: var(--text);
-      background: var(--body-bg);
-      -webkit-font-smoothing: antialiased;
-    }
-
-    img { display: block; max-width: 100%; }
-    a { color: inherit; text-decoration: none; }
-
-    .container {
-      max-width: var(--max-w);
-      margin-inline: auto;
-      padding-inline: clamp(1.25rem, 5vw, 2.5rem);
-    }
-
-    /* ── Typography ── */
-    .display-xl {
-      font-family: var(--font-display);
-      font-size: clamp(2.8rem, 6vw, 5.5rem);
-      line-height: 1.05;
-      letter-spacing: -0.02em;
-    }
-    .display-lg {
-      font-family: var(--font-display);
-      font-size: clamp(2rem, 4vw, 3.5rem);
-      line-height: 1.1;
-      letter-spacing: -0.015em;
-    }
-    .display-md {
-      font-family: var(--font-display);
-      font-size: clamp(1.5rem, 3vw, 2.25rem);
-      line-height: 1.2;
-    }
-    .label {
-      font-size: 0.75rem;
-      font-weight: 600;
-      letter-spacing: 0.12em;
-      text-transform: uppercase;
-      color: var(--rose);
-    }
-    .body-lg { font-size: 1.125rem; line-height: 1.7; }
-    .body-sm { font-size: 0.875rem; line-height: 1.6; color: var(--text-muted); }
-
-    /* ── Buttons ── */
-    .btn {
-      display: inline-flex;
-      align-items: center;
-      gap: 0.5rem;
-      font-family: var(--font-body);
-      font-size: 0.875rem;
-      font-weight: 600;
-      letter-spacing: 0.04em;
-      padding: 0.875rem 1.75rem;
-      border-radius: 2px;
-      transition: all 0.2s ease;
-      cursor: pointer;
-      border: 1.5px solid transparent;
-    }
-    .btn-primary {
-      background: var(--rose);
-      color: #fff;
-      border-color: var(--rose);
-    }
-    .btn-primary:hover {
-      background: var(--rose-dark);
-      border-color: var(--rose-dark);
-    }
-    .btn-outline {
-      background: transparent;
-      color: var(--rose);
-      border-color: var(--rose);
-    }
-    .btn-outline:hover {
-      background: var(--rose);
-      color: #fff;
-    }
-    .btn-ghost-light {
-      background: transparent;
-      color: #fff;
-      border-color: rgba(255,255,255,0.5);
-    }
-    .btn-ghost-light:hover {
-      background: rgba(255,255,255,0.12);
-      border-color: #fff;
-    }
-    .btn svg { width: 1rem; height: 1rem; }
-
-    /* ── Navigation ── */
+    /* ── Homepage Nav Overrides (dark transparent → scrolled white) ── */
     .site-header {
-      position: fixed;
-      top: 0;
-      left: 0;
-      right: 0;
-      z-index: 100;
       background: rgba(20, 16, 12, 0.45);
+      box-shadow: none;
       backdrop-filter: blur(6px);
       -webkit-backdrop-filter: blur(6px);
       transition: background 0.3s ease, box-shadow 0.3s ease, backdrop-filter 0.3s ease;
@@ -154,71 +38,11 @@
       backdrop-filter: blur(12px);
       -webkit-backdrop-filter: blur(12px);
     }
-    .nav-inner {
-      display: flex;
-      align-items: center;
-      justify-content: space-between;
-      height: 72px;
-    }
-    .nav-logo {
-      display: flex;
-      align-items: center;
-      gap: 0.625rem;
-    }
-    .nav-logo img { height: 44px; width: auto; }
-
-    .nav-links {
-      display: flex;
-      align-items: center;
-      gap: 2rem;
-      list-style: none;
-    }
-    .nav-links a {
-      font-size: 0.875rem;
-      font-weight: 500;
-      transition: color 0.15s;
-    }
-    .site-header.scrolled .nav-links a { color: var(--ink-mid); }
     .site-header:not(.scrolled) .nav-links a { color: rgba(255,255,255,0.85); }
-    .nav-links a:hover { color: var(--rose) !important; }
-
-    .nav-cta {
-      font-size: 0.8125rem;
-      font-weight: 600;
-      padding: 0.625rem 1.25rem;
-      border-radius: 2px;
-      border: 1.5px solid var(--rose);
-      color: var(--rose);
-      background: transparent;
-      transition: all 0.2s;
-    }
     .site-header:not(.scrolled) .nav-cta {
       border-color: rgba(255,255,255,0.6);
       color: #fff;
     }
-    .nav-cta:hover {
-      background: var(--rose) !important;
-      border-color: var(--rose) !important;
-      color: #fff !important;
-    }
-
-    .nav-hamburger {
-      display: none;
-      flex-direction: column;
-      gap: 5px;
-      cursor: pointer;
-      padding: 4px;
-      background: none;
-      border: none;
-    }
-    .nav-hamburger span {
-      display: block;
-      width: 24px;
-      height: 2px;
-      background: currentColor;
-      transition: all 0.25s;
-    }
-    .site-header.scrolled .nav-hamburger { color: var(--ink); }
     .site-header:not(.scrolled) .nav-hamburger { color: #fff; }
 
     /* ── Hero ── */
@@ -347,11 +171,6 @@
       color: rgba(255,255,255,0.45);
     }
 
-    /* ── Section Scaffolding ── */
-    .section { padding: clamp(4rem, 8vw, 7rem) 0; }
-    .section-header { margin-bottom: clamp(2.5rem, 5vw, 4rem); }
-    .section-header .label { margin-bottom: 0.75rem; }
-
     /* ── Services ── */
     .services-section { background: var(--surface); }
     .services-intro {
@@ -636,182 +455,16 @@
     }
     .testimonial-card.featured .testimonial-author-role { color: rgba(255,255,255,0.65); }
 
-    /* ── CTA Banner ── */
-    .cta-section {
-      position: relative;
-      overflow: hidden;
-      background: var(--warm-gray);
-    }
-    .cta-inner {
-      display: grid;
-      grid-template-columns: 1fr auto;
-      gap: 3rem;
-      align-items: center;
-      padding: clamp(3.5rem, 7vw, 6rem) 0;
-    }
-    .cta-text .label { margin-bottom: 0.75rem; }
-    .cta-text h2 { margin-bottom: 1rem; }
-    .cta-text p {
-      color: var(--text-muted);
-      font-size: 1rem;
-      max-width: 520px;
-      line-height: 1.75;
-    }
-    .cta-actions {
-      display: flex;
-      flex-direction: column;
-      gap: 0.75rem;
-      align-items: flex-start;
-      white-space: nowrap;
-    }
-    .cta-phone {
-      display: flex;
-      align-items: center;
-      gap: 0.5rem;
-      font-size: 0.875rem;
-      color: var(--text-muted);
-    }
-    .cta-phone strong {
-      color: var(--text);
-      font-weight: 600;
-    }
-
-    /* ── Footer ── */
-    .site-footer {
-      background: var(--ink);
-      padding: clamp(3.5rem, 6vw, 5rem) 0 2rem;
-    }
-    .footer-grid {
-      display: grid;
-      grid-template-columns: 1.75fr 1fr 1fr 1fr;
-      gap: 3rem;
-      padding-bottom: 3rem;
-      border-bottom: 1px solid rgba(255,255,255,0.07);
-    }
-    .footer-brand img { height: 38px; margin-bottom: 1rem; }
-    .footer-brand p {
-      font-size: 0.875rem;
-      color: rgba(255,255,255,0.4);
-      line-height: 1.75;
-      max-width: 260px;
-      margin-bottom: 1.5rem;
-    }
-    .footer-social {
-      display: flex;
-      gap: 0.625rem;
-    }
-    .footer-social a {
-      width: 36px;
-      height: 36px;
-      border: 1px solid rgba(255,255,255,0.12);
-      border-radius: 2px;
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      color: rgba(255,255,255,0.45);
-      font-size: 0.75rem;
-      transition: all 0.2s;
-    }
-    .footer-social a:hover {
-      border-color: var(--rose);
-      color: var(--rose);
-    }
-    .footer-col h4 {
-      font-size: 0.75rem;
-      font-weight: 600;
-      letter-spacing: 0.1em;
-      text-transform: uppercase;
-      color: rgba(255,255,255,0.3);
-      margin-bottom: 1.25rem;
-    }
-    .footer-col ul { list-style: none; }
-    .footer-col ul li { margin-bottom: 0.625rem; }
-    .footer-col ul li a {
-      font-size: 0.875rem;
-      color: rgba(255,255,255,0.5);
-      transition: color 0.15s;
-    }
-    .footer-col ul li a:hover { color: #fff; }
-    .footer-contact-item {
-      display: flex;
-      gap: 0.5rem;
-      font-size: 0.875rem;
-      color: rgba(255,255,255,0.5);
-      margin-bottom: 0.5rem;
-      line-height: 1.5;
-    }
-    .footer-contact-item strong { color: rgba(255,255,255,0.75); }
-    .footer-bottom {
-      display: flex;
-      align-items: center;
-      justify-content: space-between;
-      padding-top: 1.75rem;
-      gap: 1rem;
-      flex-wrap: wrap;
-    }
-    .footer-bottom p {
-      font-size: 0.8125rem;
-      color: rgba(255,255,255,0.28);
-    }
-    .footer-bottom-links {
-      display: flex;
-      gap: 1.5rem;
-      list-style: none;
-    }
-    .footer-bottom-links a {
-      font-size: 0.8125rem;
-      color: rgba(255,255,255,0.28);
-      transition: color 0.15s;
-    }
-    .footer-bottom-links a:hover { color: rgba(255,255,255,0.65); }
-
-    /* ── Mobile Nav ── */
-    .mobile-menu {
-      display: none;
-      position: fixed;
-      inset: 0;
-      background: var(--ink);
-      z-index: 99;
-      flex-direction: column;
-      justify-content: center;
-      align-items: center;
-      gap: 2rem;
-    }
-    .mobile-menu.open { display: flex; }
-    .mobile-menu a {
-      font-family: var(--font-display);
-      font-size: 2rem;
-      color: rgba(255,255,255,0.75);
-      transition: color 0.15s;
-    }
-    .mobile-menu a:hover { color: #fff; }
-    .mobile-menu-close {
-      position: absolute;
-      top: 1.5rem;
-      right: 1.5rem;
-      background: none;
-      border: none;
-      color: rgba(255,255,255,0.5);
-      font-size: 1.5rem;
-      cursor: pointer;
-      line-height: 1;
-    }
-
-    /* ── Responsive ── */
+    /* ── Responsive (page-specific) ── */
     @media (max-width: 1024px) {
       .services-grid { grid-template-columns: 1fr 1fr; }
       .service-card-wide { grid-column: span 2; aspect-ratio: 16/9; }
       .process-steps { grid-template-columns: 1fr 1fr; gap: 2.5rem; }
       .testimonials-grid { grid-template-columns: 1fr 1fr; }
       .testimonials-grid .testimonial-card:last-child { display: none; }
-      .footer-grid { grid-template-columns: 1fr 1fr; gap: 2.5rem; }
-      .footer-brand { grid-column: span 2; }
     }
 
     @media (max-width: 768px) {
-      .nav-links, .nav-cta { display: none; }
-      .nav-hamburger { display: flex; }
-
       .hero h1 { font-size: clamp(2.5rem, 9vw, 4rem); }
 
       .stats-grid { grid-template-columns: 1fr 1fr; }
@@ -823,9 +476,6 @@
       .process-steps { grid-template-columns: 1fr; }
       .testimonials-grid { grid-template-columns: 1fr; }
       .testimonials-grid .testimonial-card:last-child { display: block; }
-      .cta-inner { grid-template-columns: 1fr; }
-      .footer-grid { grid-template-columns: 1fr; }
-      .footer-brand { grid-column: span 1; }
     }
 
     @media (max-width: 480px) {
diff --git a/jobs/dispatcher/index.html b/jobs/dispatcher/index.html
index 78b6640..fd27250 100644
--- a/jobs/dispatcher/index.html
+++ b/jobs/dispatcher/index.html
@@ -21,199 +21,10 @@
   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
   <link rel="preload" as="style" href="https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&family=Inter:wght@300;400;500;600&display=swap">
   <link href="https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&family=Inter:wght@300;400;500;600&display=swap" rel="stylesheet">
+  <link rel="stylesheet" href="/assets/css/main.css">
 
   <style>
     .grecaptcha-badge { visibility: hidden; }
-    /* ── Reset & Tokens ── */
-    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
-
-    :root {
-      --rose:        #cc3366;
-      --rose-dark:   #a82a54;
-      --rose-tint:   #f7edf1;
-      --ink:         #1a1814;
-      --ink-mid:     #3d3730;
-      --body-bg:     #faf9f7;
-      --surface:     #ffffff;
-      --warm-gray:   #f0ece6;
-      --border:      #e0dbd4;
-      --text:        #2a2520;
-      --text-muted:  #7c756d;
-      --font-display: 'DM Serif Display', Georgia, serif;
-      --font-body:    'Inter', system-ui, sans-serif;
-      --max-w:       1200px;
-      --gap:         clamp(1.5rem, 4vw, 3rem);
-    }
-
-    html { scroll-behavior: smooth; }
-
-    body {
-      font-family: var(--font-body);
-      font-size: 1rem;
-      line-height: 1.65;
-      color: var(--text);
-      background: var(--body-bg);
-      -webkit-font-smoothing: antialiased;
-    }
-
-    img { display: block; max-width: 100%; }
-    a { color: inherit; text-decoration: none; }
-
-    .container {
-      max-width: var(--max-w);
-      margin-inline: auto;
-      padding-inline: clamp(1.25rem, 5vw, 2.5rem);
-    }
-
-    /* ── Typography ── */
-    .display-lg {
-      font-family: var(--font-display);
-      font-size: clamp(2rem, 4vw, 3.5rem);
-      line-height: 1.1;
-      letter-spacing: -0.015em;
-    }
-    .display-md {
-      font-family: var(--font-display);
-      font-size: clamp(1.5rem, 3vw, 2.25rem);
-      line-height: 1.2;
-    }
-    .label {
-      font-size: 0.75rem;
-      font-weight: 600;
-      letter-spacing: 0.12em;
-      text-transform: uppercase;
-      color: var(--rose);
-    }
-    .body-lg { font-size: 1.125rem; line-height: 1.7; }
-    .body-sm { font-size: 0.875rem; line-height: 1.6; color: var(--text-muted); }
-
-    /* ── Buttons ── */
-    .btn {
-      display: inline-flex;
-      align-items: center;
-      gap: 0.5rem;
-      font-family: var(--font-body);
-      font-size: 0.875rem;
-      font-weight: 600;
-      letter-spacing: 0.04em;
-      padding: 0.875rem 1.75rem;
-      border-radius: 2px;
-      transition: all 0.2s ease;
-      cursor: pointer;
-      border: 1.5px solid transparent;
-    }
-    .btn-primary {
-      background: var(--rose);
-      color: #fff;
-      border-color: var(--rose);
-    }
-    .btn-primary:hover {
-      background: var(--rose-dark);
-      border-color: var(--rose-dark);
-    }
-
-    /* ── Navigation ── */
-    .site-header {
-      position: fixed;
-      top: 0;
-      left: 0;
-      right: 0;
-      z-index: 100;
-      background: rgba(255,255,255,0.97);
-      box-shadow: 0 1px 0 var(--border);
-      backdrop-filter: blur(12px);
-      -webkit-backdrop-filter: blur(12px);
-      transition: background 0.3s ease, box-shadow 0.3s ease;
-    }
-    .nav-inner {
-      display: flex;
-      align-items: center;
-      justify-content: space-between;
-      height: 72px;
-    }
-    .nav-logo {
-      display: flex;
-      align-items: center;
-      gap: 0.625rem;
-    }
-    .nav-logo img { height: 44px; width: auto; }
-
-    .nav-links {
-      display: flex;
-      align-items: center;
-      gap: 2rem;
-      list-style: none;
-    }
-    .nav-links a {
-      font-size: 0.875rem;
-      font-weight: 500;
-      color: var(--ink-mid);
-      transition: color 0.15s;
-    }
-    .nav-links a:hover { color: var(--rose) !important; }
-
-    .nav-cta {
-      font-size: 0.8125rem;
-      font-weight: 600;
-      padding: 0.625rem 1.25rem;
-      border-radius: 2px;
-      border: 1.5px solid var(--rose);
-      color: var(--rose);
-      background: transparent;
-      transition: all 0.2s;
-    }
-    .nav-cta:hover {
-      background: var(--rose) !important;
-      border-color: var(--rose) !important;
-      color: #fff !important;
-    }
-
-    .nav-hamburger {
-      display: none;
-      flex-direction: column;
-      gap: 5px;
-      cursor: pointer;
-      padding: 4px;
-      background: none;
-      border: none;
-      color: var(--ink);
-    }
-    .nav-hamburger span {
-      display: block;
-      width: 24px;
-      height: 2px;
-      background: currentColor;
-      transition: all 0.25s;
-    }
-
-    /* ── Page Hero ── */
-    .page-hero {
-      background: var(--ink);
-      padding: 140px 0 60px;
-    }
-    .breadcrumb {
-      display: flex;
-      align-items: center;
-      gap: 0.5rem;
-      font-size: 0.8125rem;
-      color: rgba(255,255,255,0.4);
-      margin-bottom: 1.25rem;
-    }
-    .breadcrumb a {
-      color: rgba(255,255,255,0.5);
-      transition: color 0.15s;
-    }
-    .breadcrumb a:hover { color: #fff; }
-    .breadcrumb span { color: rgba(255,255,255,0.25); }
-    .page-hero h1 {
-      font-family: var(--font-display);
-      font-size: clamp(2.25rem, 5vw, 3.5rem);
-      line-height: 1.1;
-      color: #fff;
-    }
-
-    /* ── Section Scaffolding ── */
-    .section { padding: clamp(4rem, 8vw, 7rem) 0; }
 
     /* ── Job Details ── */
     .job-details { background: var(--surface); }
@@ -303,43 +114,6 @@
     .apply-form {
       max-width: 640px;
     }
-    .form-group {
-      margin-bottom: 1.25rem;
-    }
-    .form-group label {
-      display: block;
-      font-size: 0.8125rem;
-      font-weight: 500;
-      color: var(--text);
-      margin-bottom: 0.375rem;
-    }
-    .form-group input[type="text"],
-    .form-group input[type="email"],
-    .form-group input[type="tel"],
-    .form-group textarea {
-      width: 100%;
-      border: 1px solid var(--border);
-      padding: 0.75rem 1rem;
-      border-radius: 2px;
-      font-family: var(--font-body);
-      font-size: 0.9375rem;
-      color: var(--text);
-      background: var(--surface);
-      transition: border-color 0.2s ease;
-      outline: none;
-    }
-    .form-group input::placeholder,
-    .form-group textarea::placeholder {
-      color: var(--text-muted);
-    }
-    .form-group input:focus,
-    .form-group textarea:focus {
-      border-color: var(--rose);
-    }
-    .form-group textarea {
-      resize: vertical;
-      min-height: 120px;
-    }
     .form-group input[type="file"] {
       width: 100%;
       font-family: var(--font-body);
@@ -364,146 +138,14 @@
       border-color: var(--rose);
       color: var(--rose);
     }
-    .form-submit {
-      margin-top: 0.5rem;
-    }
-
-    /* ── Footer ── */
-    .site-footer {
-      background: var(--ink);
-      padding: clamp(3.5rem, 6vw, 5rem) 0 2rem;
-    }
-    .footer-grid {
-      display: grid;
-      grid-template-columns: 1.75fr 1fr 1fr 1fr;
-      gap: 3rem;
-      padding-bottom: 3rem;
-      border-bottom: 1px solid rgba(255,255,255,0.07);
-    }
-    .footer-brand img { height: 38px; margin-bottom: 1rem; }
-    .footer-brand p {
-      font-size: 0.875rem;
-      color: rgba(255,255,255,0.4);
-      line-height: 1.75;
-      max-width: 260px;
-      margin-bottom: 1.5rem;
-    }
-    .footer-social {
-      display: flex;
-      gap: 0.625rem;
-    }
-    .footer-social a {
-      width: 36px;
-      height: 36px;
-      border: 1px solid rgba(255,255,255,0.12);
-      border-radius: 2px;
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      color: rgba(255,255,255,0.45);
-      font-size: 0.75rem;
-      transition: all 0.2s;
-    }
-    .footer-social a:hover {
-      border-color: var(--rose);
-      color: var(--rose);
-    }
-    .footer-col h4 {
-      font-size: 0.75rem;
-      font-weight: 600;
-      letter-spacing: 0.1em;
-      text-transform: uppercase;
-      color: rgba(255,255,255,0.3);
-      margin-bottom: 1.25rem;
-    }
-    .footer-col ul { list-style: none; }
-    .footer-col ul li { margin-bottom: 0.625rem; }
-    .footer-col ul li a {
-      font-size: 0.875rem;
-      color: rgba(255,255,255,0.5);
-      transition: color 0.15s;
-    }
-    .footer-col ul li a:hover { color: #fff; }
-    .footer-contact-item {
-      display: flex;
-      gap: 0.5rem;
-      font-size: 0.875rem;
-      color: rgba(255,255,255,0.5);
-      margin-bottom: 0.5rem;
-      line-height: 1.5;
-    }
-    .footer-contact-item strong { color: rgba(255,255,255,0.75); }
-    .footer-bottom {
-      display: flex;
-      align-items: center;
-      justify-content: space-between;
-      padding-top: 1.75rem;
-      gap: 1rem;
-      flex-wrap: wrap;
-    }
-    .footer-bottom p {
-      font-size: 0.8125rem;
-      color: rgba(255,255,255,0.28);
-    }
-    .footer-bottom-links {
-      display: flex;
-      gap: 1.5rem;
-      list-style: none;
-    }
-    .footer-bottom-links a {
-      font-size: 0.8125rem;
-      color: rgba(255,255,255,0.28);
-      transition: color 0.15s;
-    }
-    .footer-bottom-links a:hover { color: rgba(255,255,255,0.65); }
-
-    /* ── Mobile Nav ── */
-    .mobile-menu {
-      display: none;
-      position: fixed;
-      inset: 0;
-      background: var(--ink);
-      z-index: 99;
-      flex-direction: column;
-      justify-content: center;
-      align-items: center;
-      gap: 2rem;
-    }
-    .mobile-menu.open { display: flex; }
-    .mobile-menu a {
-      font-family: var(--font-display);
-      font-size: 2rem;
-      color: rgba(255,255,255,0.75);
-      transition: color 0.15s;
-    }
-    .mobile-menu a:hover { color: #fff; }
-    .mobile-menu-close {
-      position: absolute;
-      top: 1.5rem;
-      right: 1.5rem;
-      background: none;
-      border: none;
-      color: rgba(255,255,255,0.5);
-      font-size: 1.5rem;
-      cursor: pointer;
-      line-height: 1;
-    }
-
-    /* ── Responsive ── */
+    /* ── Responsive (page-specific) ── */
     @media (max-width: 1024px) {
       .job-layout { grid-template-columns: 1fr 280px; }
-      .footer-grid { grid-template-columns: 1fr 1fr; gap: 2.5rem; }
-      .footer-brand { grid-column: span 2; }
     }
 
     @media (max-width: 768px) {
-      .nav-links, .nav-cta { display: none; }
-      .nav-hamburger { display: flex; }
-      .page-hero { padding: 120px 0 40px; }
       .job-layout { grid-template-columns: 1fr; }
       .job-sidebar { position: static; order: -1; }
-      .footer-grid { grid-template-columns: 1fr; }
-      .footer-brand { grid-column: span 1; }
     }
 
     @media (max-width: 480px) {
diff --git a/privacy-policy/index.html b/privacy-policy/index.html
index f3ea820..d0bbfae 100644
--- a/privacy-policy/index.html
+++ b/privacy-policy/index.html
@@ -21,181 +21,9 @@
   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
   <link rel="preload" as="style" href="https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&family=Inter:wght@300;400;500;600&display=swap">
   <link href="https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&family=Inter:wght@300;400;500;600&display=swap" rel="stylesheet">
+  <link rel="stylesheet" href="/assets/css/main.css">
 
   <style>
-    /* ── Reset & Tokens ── */
-    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
-
-    :root {
-      --rose:        #cc3366;
-      --rose-dark:   #a82a54;
-      --rose-tint:   #f7edf1;
-      --ink:         #1a1814;
-      --ink-mid:     #3d3730;
-      --body-bg:     #faf9f7;
-      --surface:     #ffffff;
-      --warm-gray:   #f0ece6;
-      --border:      #e0dbd4;
-      --text:        #2a2520;
-      --text-muted:  #7c756d;
-      --font-display: 'DM Serif Display', Georgia, serif;
-      --font-body:    'Inter', system-ui, sans-serif;
-      --max-w:       1200px;
-      --gap:         clamp(1.5rem, 4vw, 3rem);
-    }
-
-    html { scroll-behavior: smooth; }
-
-    body {
-      font-family: var(--font-body);
-      font-size: 1rem;
-      line-height: 1.65;
-      color: var(--text);
-      background: var(--body-bg);
-      -webkit-font-smoothing: antialiased;
-    }
-
-    img { display: block; max-width: 100%; }
-    a { color: inherit; text-decoration: none; }
-
-    .container {
-      max-width: var(--max-w);
-      margin-inline: auto;
-      padding-inline: clamp(1.25rem, 5vw, 2.5rem);
-    }
-
-    /* ── Navigation ── */
-    .site-header {
-      position: fixed;
-      top: 0;
-      left: 0;
-      right: 0;
-      z-index: 100;
-      background: rgba(255,255,255,0.97);
-      box-shadow: 0 1px 0 var(--border);
-      backdrop-filter: blur(12px);
-      -webkit-backdrop-filter: blur(12px);
-      transition: background 0.3s ease, box-shadow 0.3s ease;
-    }
-    .nav-inner {
-      display: flex;
-      align-items: center;
-      justify-content: space-between;
-      height: 72px;
-    }
-    .nav-logo {
-      display: flex;
-      align-items: center;
-      gap: 0.625rem;
-    }
-    .nav-logo img { height: 44px; width: auto; }
-
-    .nav-links {
-      display: flex;
-      align-items: center;
-      gap: 2rem;
-      list-style: none;
-    }
-    .nav-links a {
-      font-size: 0.875rem;
-      font-weight: 500;
-      color: var(--ink-mid);
-      transition: color 0.15s;
-    }
-    .nav-links a:hover { color: var(--rose) !important; }
-
-    .nav-cta {
-      font-size: 0.8125rem;
-      font-weight: 600;
-      padding: 0.625rem 1.25rem;
-      border-radius: 2px;
-      border: 1.5px solid var(--rose);
-      color: var(--rose);
-      background: transparent;
-      transition: all 0.2s;
-    }
-    .nav-cta:hover {
-      background: var(--rose) !important;
-      border-color: var(--rose) !important;
-      color: #fff !important;
-    }
-
-    .nav-hamburger {
-      display: none;
-      flex-direction: column;
-      gap: 5px;
-      cursor: pointer;
-      padding: 4px;
-      background: none;
-      border: none;
-      color: var(--ink);
-    }
-    .nav-hamburger span {
-      display: block;
-      width: 24px;
-      height: 2px;
-      background: currentColor;
-      transition: all 0.25s;
-    }
-
-    /* ── Mobile Nav ── */
-    .mobile-menu {
-      display: none;
-      position: fixed;
-      inset: 0;
-      background: var(--ink);
-      z-index: 99;
-      flex-direction: column;
-      justify-content: center;
-      align-items: center;
-      gap: 2rem;
-    }
-    .mobile-menu.open { display: flex; }
-    .mobile-menu a {
-      font-family: var(--font-display);
-      font-size: 2rem;
-      color: rgba(255,255,255,0.75);
-      transition: color 0.15s;
-    }
-    .mobile-menu a:hover { color: #fff; }
-    .mobile-menu-close {
-      position: absolute;
-      top: 1.5rem;
-      right: 1.5rem;
-      background: none;
-      border: none;
-      color: rgba(255,255,255,0.5);
-      font-size: 1.5rem;
-      cursor: pointer;
-      line-height: 1;
-    }
-
-    /* ── Page Hero ── */
-    .page-hero {
-      background: var(--ink);
-      padding: 140px 0 60px;
-    }
-    .breadcrumb {
-      display: flex;
-      align-items: center;
-      gap: 0.5rem;
-      font-size: 0.8125rem;
-      color: rgba(255,255,255,0.4);
-      margin-bottom: 1.25rem;
-    }
-    .breadcrumb a {
-      color: rgba(255,255,255,0.5);
-      transition: color 0.15s;
-    }
-    .breadcrumb a:hover { color: #fff; }
-    .breadcrumb span { color: rgba(255,255,255,0.25); }
-    .page-hero h1 {
-      font-family: var(--font-display);
-      font-size: clamp(2.25rem, 5vw, 3.5rem);
-      line-height: 1.1;
-      color: #fff;
-    }
-
     /* ── Prose Content ── */
     .prose-section {
       background: var(--surface);
@@ -242,111 +70,6 @@
       color: var(--text-muted);
     }
 
-    /* ── Footer ── */
-    .site-footer {
-      background: var(--ink);
-      padding: clamp(3.5rem, 6vw, 5rem) 0 2rem;
-    }
-    .footer-grid {
-      display: grid;
-      grid-template-columns: 1.75fr 1fr 1fr 1fr;
-      gap: 3rem;
-      padding-bottom: 3rem;
-      border-bottom: 1px solid rgba(255,255,255,0.07);
-    }
-    .footer-brand img { height: 38px; margin-bottom: 1rem; }
-    .footer-brand p {
-      font-size: 0.875rem;
-      color: rgba(255,255,255,0.4);
-      line-height: 1.75;
-      max-width: 260px;
-      margin-bottom: 1.5rem;
-    }
-    .footer-social {
-      display: flex;
-      gap: 0.625rem;
-    }
-    .footer-social a {
-      width: 36px;
-      height: 36px;
-      border: 1px solid rgba(255,255,255,0.12);
-      border-radius: 2px;
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      color: rgba(255,255,255,0.45);
-      font-size: 0.75rem;
-      transition: all 0.2s;
-    }
-    .footer-social a:hover {
-      border-color: var(--rose);
-      color: var(--rose);
-    }
-    .footer-col h4 {
-      font-size: 0.75rem;
-      font-weight: 600;
-      letter-spacing: 0.1em;
-      text-transform: uppercase;
-      color: rgba(255,255,255,0.3);
-      margin-bottom: 1.25rem;
-    }
-    .footer-col ul { list-style: none; }
-    .footer-col ul li { margin-bottom: 0.625rem; }
-    .footer-col ul li a {
-      font-size: 0.875rem;
-      color: rgba(255,255,255,0.5);
-      transition: color 0.15s;
-    }
-    .footer-col ul li a:hover { color: #fff; }
-    .footer-contact-item {
-      display: flex;
-      gap: 0.5rem;
-      font-size: 0.875rem;
-      color: rgba(255,255,255,0.5);
-      margin-bottom: 0.5rem;
-      line-height: 1.5;
-    }
-    .footer-contact-item strong { color: rgba(255,255,255,0.75); }
-    .footer-bottom {
-      display: flex;
-      align-items: center;
-      justify-content: space-between;
-      padding-top: 1.75rem;
-      gap: 1rem;
-      flex-wrap: wrap;
-    }
-    .footer-bottom p {
-      font-size: 0.8125rem;
-      color: rgba(255,255,255,0.28);
-    }
-    .footer-bottom-links {
-      display: flex;
-      gap: 1.5rem;
-      list-style: none;
-    }
-    .footer-bottom-links a {
-      font-size: 0.8125rem;
-      color: rgba(255,255,255,0.28);
-      transition: color 0.15s;
-    }
-    .footer-bottom-links a:hover { color: rgba(255,255,255,0.65); }
-
-    /* ── Responsive ── */
-    @media (max-width: 1024px) {
-      .footer-grid { grid-template-columns: 1fr 1fr; gap: 2.5rem; }
-      .footer-brand { grid-column: span 2; }
-    }
-
-    @media (max-width: 768px) {
-      .nav-links, .nav-cta { display: none; }
-      .nav-hamburger { display: flex; }
-      .footer-grid { grid-template-columns: 1fr; }
-      .footer-brand { grid-column: span 1; }
-    }
-
-    @media (max-width: 480px) {
-      .page-hero { padding: 120px 0 40px; }
-    }
   </style>
 </head>
 
diff --git a/services/index.html b/services/index.html
index 1ac0092..dd2c6f0 100644
--- a/services/index.html
+++ b/services/index.html
@@ -21,239 +21,10 @@
   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
   <link rel="preload" as="style" href="https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&family=Inter:wght@300;400;500;600&display=swap">
   <link href="https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&family=Inter:wght@300;400;500;600&display=swap" rel="stylesheet">
+  <link rel="stylesheet" href="/assets/css/main.css">
 
   <style>
     .grecaptcha-badge { visibility: hidden; }
-    /* ── Reset & Tokens ── */
-    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
-
-    :root {
-      --rose:        #cc3366;
-      --rose-dark:   #a82a54;
-      --rose-tint:   #f7edf1;
-      --ink:         #1a1814;
-      --ink-mid:     #3d3730;
-      --body-bg:     #faf9f7;
-      --surface:     #ffffff;
-      --warm-gray:   #f0ece6;
-      --border:      #e0dbd4;
-      --text:        #2a2520;
-      --text-muted:  #7c756d;
-      --font-display: 'DM Serif Display', Georgia, serif;
-      --font-body:    'Inter', system-ui, sans-serif;
-      --max-w:       1200px;
-      --gap:         clamp(1.5rem, 4vw, 3rem);
-    }
-
-    html { scroll-behavior: smooth; }
-
-    body {
-      font-family: var(--font-body);
-      font-size: 1rem;
-      line-height: 1.65;
-      color: var(--text);
-      background: var(--body-bg);
-      -webkit-font-smoothing: antialiased;
-    }
-
-    img { display: block; max-width: 100%; }
-    a { color: inherit; text-decoration: none; }
-
-    .container {
-      max-width: var(--max-w);
-      margin-inline: auto;
-      padding-inline: clamp(1.25rem, 5vw, 2.5rem);
-    }
-
-    /* ── Typography ── */
-    .display-lg {
-      font-family: var(--font-display);
-      font-size: clamp(2rem, 4vw, 3.5rem);
-      line-height: 1.1;
-      letter-spacing: -0.015em;
-    }
-    .display-md {
-      font-family: var(--font-display);
-      font-size: clamp(1.5rem, 3vw, 2.25rem);
-      line-height: 1.2;
-    }
-    .label {
-      font-size: 0.75rem;
-      font-weight: 600;
-      letter-spacing: 0.12em;
-      text-transform: uppercase;
-      color: var(--rose);
-    }
-    .body-lg { font-size: 1.125rem; line-height: 1.7; }
-
-    /* ── Buttons ── */
-    .btn {
-      display: inline-flex;
-      align-items: center;
-      gap: 0.5rem;
-      font-family: var(--font-body);
-      font-size: 0.875rem;
-      font-weight: 600;
-      letter-spacing: 0.04em;
-      padding: 0.875rem 1.75rem;
-      border-radius: 2px;
-      transition: all 0.2s ease;
-      cursor: pointer;
-      border: 1.5px solid transparent;
-    }
-    .btn-primary {
-      background: var(--rose);
-      color: #fff;
-      border-color: var(--rose);
-    }
-    .btn-primary:hover {
-      background: var(--rose-dark);
-      border-color: var(--rose-dark);
-    }
-    .btn-outline {
-      background: transparent;
-      color: var(--rose);
-      border-color: var(--rose);
-    }
-    .btn-outline:hover {
-      background: var(--rose);
-      color: #fff;
-    }
-
-    /* ── Navigation ── */
-    .site-header {
-      position: fixed;
-      top: 0;
-      left: 0;
-      right: 0;
-      z-index: 100;
-      background: rgba(255,255,255,0.97);
-      box-shadow: 0 1px 0 var(--border);
-      backdrop-filter: blur(12px);
-      -webkit-backdrop-filter: blur(12px);
-      transition: background 0.3s ease, box-shadow 0.3s ease;
-    }
-    .nav-inner {
-      display: flex;
-      align-items: center;
-      justify-content: space-between;
-      height: 72px;
-    }
-    .nav-logo {
-      display: flex;
-      align-items: center;
-      gap: 0.625rem;
-    }
-    .nav-logo img { height: 44px; width: auto; }
-
-    .nav-links {
-      display: flex;
-      align-items: center;
-      gap: 2rem;
-      list-style: none;
-    }
-    .nav-links a {
-      font-size: 0.875rem;
-      font-weight: 500;
-      color: var(--ink-mid);
-      transition: color 0.15s;
-    }
-    .nav-links a:hover { color: var(--rose) !important; }
-
-    .nav-cta {
-      font-size: 0.8125rem;
-      font-weight: 600;
-      padding: 0.625rem 1.25rem;
-      border-radius: 2px;
-      border: 1.5px solid var(--rose);
-      color: var(--rose);
-      background: transparent;
-      transition: all 0.2s;
-    }
-    .nav-cta:hover {
-      background: var(--rose) !important;
-      border-color: var(--rose) !important;
-      color: #fff !important;
-    }
-
-    .nav-hamburger {
-      display: none;
-      flex-direction: column;
-      gap: 5px;
-      cursor: pointer;
-      padding: 4px;
-      background: none;
-      border: none;
-      color: var(--ink);
-    }
-    .nav-hamburger span {
-      display: block;
-      width: 24px;
-      height: 2px;
-      background: currentColor;
-      transition: all 0.25s;
-    }
-
-    /* ── Mobile Nav ── */
-    .mobile-menu {
-      display: none;
-      position: fixed;
-      inset: 0;
-      background: var(--ink);
-      z-index: 99;
-      flex-direction: column;
-      justify-content: center;
-      align-items: center;
-      gap: 2rem;
-    }
-    .mobile-menu.open { display: flex; }
-    .mobile-menu a {
-      font-family: var(--font-display);
-      font-size: 2rem;
-      color: rgba(255,255,255,0.75);
-      transition: color 0.15s;
-    }
-    .mobile-menu a:hover { color: #fff; }
-    .mobile-menu-close {
-      position: absolute;
-      top: 1.5rem;
-      right: 1.5rem;
-      background: none;
-      border: none;
-      color: rgba(255,255,255,0.5);
-      font-size: 1.5rem;
-      cursor: pointer;
-      line-height: 1;
-    }
-
-    /* ── Page Hero ── */
-    .page-hero {
-      background: var(--ink);
-      padding: 140px 0 60px;
-    }
-    .breadcrumb {
-      display: flex;
-      align-items: center;
-      gap: 0.5rem;
-      font-size: 0.8125rem;
-      color: rgba(255,255,255,0.4);
-      margin-bottom: 1.25rem;
-    }
-    .breadcrumb a {
-      color: rgba(255,255,255,0.5);
-      transition: color 0.15s;
-    }
-    .breadcrumb a:hover { color: #fff; }
-    .breadcrumb span { color: rgba(255,255,255,0.25); }
-    .page-hero h1 {
-      font-family: var(--font-display);
-      font-size: clamp(2.25rem, 5vw, 3.5rem);
-      line-height: 1.1;
-      color: #fff;
-    }
-
-    /* ── Section Scaffolding ── */
-    .section { padding: clamp(4rem, 8vw, 7rem) 0; }
 
     /* ── Services Intro ── */
     .services-intro-section { background: var(--surface); }
@@ -373,152 +144,26 @@
     .form-group.full-width {
       grid-column: span 2;
     }
-    .form-group label {
-      font-size: 0.8125rem;
-      font-weight: 500;
-      color: var(--text);
-    }
     .form-group label .required {
       color: var(--rose);
     }
-    .form-group input,
-    .form-group textarea {
-      font-family: var(--font-body);
-      font-size: 0.9375rem;
-      padding: 0.75rem 1rem;
-      border: 1px solid var(--border);
-      border-radius: 2px;
-      background: var(--surface);
-      color: var(--text);
-      transition: border-color 0.2s;
-      outline: none;
-    }
-    .form-group input:focus,
-    .form-group textarea:focus {
-      border-color: var(--rose);
-    }
-    .form-group textarea {
-      resize: vertical;
-      min-height: 120px;
-    }
     .form-submit {
       grid-column: span 2;
-      margin-top: 0.5rem;
     }
 
-    /* ── Footer ── */
-    .site-footer {
-      background: var(--ink);
-      padding: clamp(3.5rem, 6vw, 5rem) 0 2rem;
-    }
-    .footer-grid {
-      display: grid;
-      grid-template-columns: 1.75fr 1fr 1fr 1fr;
-      gap: 3rem;
-      padding-bottom: 3rem;
-      border-bottom: 1px solid rgba(255,255,255,0.07);
-    }
-    .footer-brand img { height: 38px; margin-bottom: 1rem; }
-    .footer-brand p {
-      font-size: 0.875rem;
-      color: rgba(255,255,255,0.4);
-      line-height: 1.75;
-      max-width: 260px;
-      margin-bottom: 1.5rem;
-    }
-    .footer-social {
-      display: flex;
-      gap: 0.625rem;
-    }
-    .footer-social a {
-      width: 36px;
-      height: 36px;
-      border: 1px solid rgba(255,255,255,0.12);
-      border-radius: 2px;
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      color: rgba(255,255,255,0.45);
-      font-size: 0.75rem;
-      transition: all 0.2s;
-    }
-    .footer-social a:hover {
-      border-color: var(--rose);
-      color: var(--rose);
-    }
-    .footer-col h4 {
-      font-size: 0.75rem;
-      font-weight: 600;
-      letter-spacing: 0.1em;
-      text-transform: uppercase;
-      color: rgba(255,255,255,0.3);
-      margin-bottom: 1.25rem;
-    }
-    .footer-col ul { list-style: none; }
-    .footer-col ul li { margin-bottom: 0.625rem; }
-    .footer-col ul li a {
-      font-size: 0.875rem;
-      color: rgba(255,255,255,0.5);
-      transition: color 0.15s;
-    }
-    .footer-col ul li a:hover { color: #fff; }
-    .footer-contact-item {
-      display: flex;
-      gap: 0.5rem;
-      font-size: 0.875rem;
-      color: rgba(255,255,255,0.5);
-      margin-bottom: 0.5rem;
-      line-height: 1.5;
-    }
-    .footer-contact-item strong { color: rgba(255,255,255,0.75); }
-    .footer-bottom {
-      display: flex;
-      align-items: center;
-      justify-content: space-between;
-      padding-top: 1.75rem;
-      gap: 1rem;
-      flex-wrap: wrap;
-    }
-    .footer-bottom p {
-      font-size: 0.8125rem;
-      color: rgba(255,255,255,0.28);
-    }
-    .footer-bottom-links {
-      display: flex;
-      gap: 1.5rem;
-      list-style: none;
-    }
-    .footer-bottom-links a {
-      font-size: 0.8125rem;
-      color: rgba(255,255,255,0.28);
-      transition: color 0.15s;
-    }
-    .footer-bottom-links a:hover { color: rgba(255,255,255,0.65); }
-
-    /* ── Responsive ── */
+    /* ── Responsive (page-specific) ── */
     @media (max-width: 1024px) {
       .services-grid { grid-template-columns: 1fr 1fr; }
       .service-card-wide { grid-column: span 2; aspect-ratio: 16/9; }
-      .footer-grid { grid-template-columns: 1fr 1fr; gap: 2.5rem; }
-      .footer-brand { grid-column: span 2; }
     }
 
     @media (max-width: 768px) {
-      .nav-links, .nav-cta { display: none; }
-      .nav-hamburger { display: flex; }
-
       .services-grid { grid-template-columns: 1fr; }
       .service-card-wide { grid-column: span 1; aspect-ratio: 4/3; }
       .contact-inner { grid-template-columns: 1fr; }
       .contact-form { grid-template-columns: 1fr; }
       .form-group.full-width { grid-column: span 1; }
       .form-submit { grid-column: span 1; }
-      .footer-grid { grid-template-columns: 1fr; }
-      .footer-brand { grid-column: span 1; }
-    }
-
-    @media (max-width: 480px) {
-      .page-hero { padding: 120px 0 40px; }
     }
   </style>
 <script src="https://www.google.com/recaptcha/api.js?render=6Les66kUAAAAANyLrgkl7iuN4JUpNlB5upaMovI4"></script>
diff --git a/social-accountability/index.html b/social-accountability/index.html
index 648e245..39425be 100644
--- a/social-accountability/index.html
+++ b/social-accountability/index.html
@@ -21,229 +21,9 @@
   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
   <link rel="preload" as="style" href="https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&family=Inter:wght@300;400;500;600&display=swap">
   <link href="https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&family=Inter:wght@300;400;500;600&display=swap" rel="stylesheet">
+  <link rel="stylesheet" href="/assets/css/main.css">
 
   <style>
-    /* ── Reset & Tokens ── */
-    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
-
-    :root {
-      --rose:        #cc3366;
-      --rose-dark:   #a82a54;
-      --rose-tint:   #f7edf1;
-      --ink:         #1a1814;
-      --ink-mid:     #3d3730;
-      --body-bg:     #faf9f7;
-      --surface:     #ffffff;
-      --warm-gray:   #f0ece6;
-      --border:      #e0dbd4;
-      --text:        #2a2520;
-      --text-muted:  #7c756d;
-      --font-display: 'DM Serif Display', Georgia, serif;
-      --font-body:    'Inter', system-ui, sans-serif;
-      --max-w:       1200px;
-      --gap:         clamp(1.5rem, 4vw, 3rem);
-    }
-
-    html { scroll-behavior: smooth; }
-
-    body {
-      font-family: var(--font-body);
-      font-size: 1rem;
-      line-height: 1.65;
-      color: var(--text);
-      background: var(--body-bg);
-      -webkit-font-smoothing: antialiased;
-    }
-
-    img { display: block; max-width: 100%; }
-    a { color: inherit; text-decoration: none; }
-
-    .container {
-      max-width: var(--max-w);
-      margin-inline: auto;
-      padding-inline: clamp(1.25rem, 5vw, 2.5rem);
-    }
-
-    /* ── Typography ── */
-    .display-lg {
-      font-family: var(--font-display);
-      font-size: clamp(2rem, 4vw, 3.5rem);
-      line-height: 1.1;
-      letter-spacing: -0.015em;
-    }
-    .display-md {
-      font-family: var(--font-display);
-      font-size: clamp(1.5rem, 3vw, 2.25rem);
-      line-height: 1.2;
-    }
-    .label {
-      font-size: 0.75rem;
-      font-weight: 600;
-      letter-spacing: 0.12em;
-      text-transform: uppercase;
-      color: var(--rose);
-    }
-
-    /* ── Buttons ── */
-    .btn {
-      display: inline-flex;
-      align-items: center;
-      gap: 0.5rem;
-      font-family: var(--font-body);
-      font-size: 0.875rem;
-      font-weight: 600;
-      letter-spacing: 0.04em;
-      padding: 0.875rem 1.75rem;
-      border-radius: 2px;
-      transition: all 0.2s ease;
-      cursor: pointer;
-      border: 1.5px solid transparent;
-    }
-    .btn-primary {
-      background: var(--rose);
-      color: #fff;
-      border-color: var(--rose);
-    }
-    .btn-primary:hover {
-      background: var(--rose-dark);
-      border-color: var(--rose-dark);
-    }
-
-    /* ── Navigation ── */
-    .site-header {
-      position: fixed;
-      top: 0;
-      left: 0;
-      right: 0;
-      z-index: 100;
-      background: rgba(255,255,255,0.97);
-      box-shadow: 0 1px 0 var(--border);
-      backdrop-filter: blur(12px);
-      -webkit-backdrop-filter: blur(12px);
-      transition: background 0.3s ease, box-shadow 0.3s ease;
-    }
-    .nav-inner {
-      display: flex;
-      align-items: center;
-      justify-content: space-between;
-      height: 72px;
-    }
-    .nav-logo {
-      display: flex;
-      align-items: center;
-      gap: 0.625rem;
-    }
-    .nav-logo img { height: 44px; width: auto; }
-
-    .nav-links {
-      display: flex;
-      align-items: center;
-      gap: 2rem;
-      list-style: none;
-    }
-    .nav-links a {
-      font-size: 0.875rem;
-      font-weight: 500;
-      color: var(--ink-mid);
-      transition: color 0.15s;
-    }
-    .nav-links a:hover { color: var(--rose) !important; }
-
-    .nav-cta {
-      font-size: 0.8125rem;
-      font-weight: 600;
-      padding: 0.625rem 1.25rem;
-      border-radius: 2px;
-      border: 1.5px solid var(--rose);
-      color: var(--rose);
-      background: transparent;
-      transition: all 0.2s;
-    }
-    .nav-cta:hover {
-      background: var(--rose) !important;
-      border-color: var(--rose) !important;
-      color: #fff !important;
-    }
-
-    .nav-hamburger {
-      display: none;
-      flex-direction: column;
-      gap: 5px;
-      cursor: pointer;
-      padding: 4px;
-      background: none;
-      border: none;
-      color: var(--ink);
-    }
-    .nav-hamburger span {
-      display: block;
-      width: 24px;
-      height: 2px;
-      background: currentColor;
-      transition: all 0.25s;
-    }
-
-    /* ── Mobile Nav ── */
-    .mobile-menu {
-      display: none;
-      position: fixed;
-      inset: 0;
-      background: var(--ink);
-      z-index: 99;
-      flex-direction: column;
-      justify-content: center;
-      align-items: center;
-      gap: 2rem;
-    }
-    .mobile-menu.open { display: flex; }
-    .mobile-menu a {
-      font-family: var(--font-display);
-      font-size: 2rem;
-      color: rgba(255,255,255,0.75);
-      transition: color 0.15s;
-    }
-    .mobile-menu a:hover { color: #fff; }
-    .mobile-menu-close {
-      position: absolute;
-      top: 1.5rem;
-      right: 1.5rem;
-      background: none;
-      border: none;
-      color: rgba(255,255,255,0.5);
-      font-size: 1.5rem;
-      cursor: pointer;
-      line-height: 1;
-    }
-
-    /* ── Page Hero ── */
-    .page-hero {
-      background: var(--ink);
-      padding: 140px 0 60px;
-    }
-    .breadcrumb {
-      display: flex;
-      align-items: center;
-      gap: 0.5rem;
-      font-size: 0.8125rem;
-      color: rgba(255,255,255,0.4);
-      margin-bottom: 1.25rem;
-    }
-    .breadcrumb a {
-      color: rgba(255,255,255,0.5);
-      transition: color 0.15s;
-    }
-    .breadcrumb a:hover { color: #fff; }
-    .breadcrumb span { color: rgba(255,255,255,0.25); }
-    .page-hero h1 {
-      font-family: var(--font-display);
-      font-size: clamp(2.25rem, 5vw, 3.5rem);
-      line-height: 1.1;
-      color: #fff;
-    }
-
-    /* ── Section Scaffolding ── */
-    .section { padding: clamp(4rem, 8vw, 7rem) 0; }
-
     /* ── Intro ── */
     .intro-section {
       background: var(--surface);
@@ -310,152 +90,6 @@
       font-size: 0.9375rem;
     }
 
-    /* ── CTA Banner ── */
-    .cta-section {
-      position: relative;
-      overflow: hidden;
-      background: var(--warm-gray);
-    }
-    .cta-inner {
-      display: grid;
-      grid-template-columns: 1fr auto;
-      gap: 3rem;
-      align-items: center;
-      padding: clamp(3.5rem, 7vw, 6rem) 0;
-    }
-    .cta-text .label { margin-bottom: 0.75rem; }
-    .cta-text h2 { margin-bottom: 1rem; }
-    .cta-text p {
-      color: var(--text-muted);
-      font-size: 1rem;
-      max-width: 520px;
-      line-height: 1.75;
-    }
-    .cta-actions {
-      display: flex;
-      flex-direction: column;
-      gap: 0.75rem;
-      align-items: flex-start;
-      white-space: nowrap;
-    }
-    .cta-phone {
-      display: flex;
-      align-items: center;
-      gap: 0.5rem;
-      font-size: 0.875rem;
-      color: var(--text-muted);
-    }
-    .cta-phone strong {
-      color: var(--text);
-      font-weight: 600;
-    }
-
-    /* ── Footer ── */
-    .site-footer {
-      background: var(--ink);
-      padding: clamp(3.5rem, 6vw, 5rem) 0 2rem;
-    }
-    .footer-grid {
-      display: grid;
-      grid-template-columns: 1.75fr 1fr 1fr 1fr;
-      gap: 3rem;
-      padding-bottom: 3rem;
-      border-bottom: 1px solid rgba(255,255,255,0.07);
-    }
-    .footer-brand img { height: 38px; margin-bottom: 1rem; }
-    .footer-brand p {
-      font-size: 0.875rem;
-      color: rgba(255,255,255,0.4);
-      line-height: 1.75;
-      max-width: 260px;
-      margin-bottom: 1.5rem;
-    }
-    .footer-social {
-      display: flex;
-      gap: 0.625rem;
-    }
-    .footer-social a {
-      width: 36px;
-      height: 36px;
-      border: 1px solid rgba(255,255,255,0.12);
-      border-radius: 2px;
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      color: rgba(255,255,255,0.45);
-      font-size: 0.75rem;
-      transition: all 0.2s;
-    }
-    .footer-social a:hover {
-      border-color: var(--rose);
-      color: var(--rose);
-    }
-    .footer-col h4 {
-      font-size: 0.75rem;
-      font-weight: 600;
-      letter-spacing: 0.1em;
-      text-transform: uppercase;
-      color: rgba(255,255,255,0.3);
-      margin-bottom: 1.25rem;
-    }
-    .footer-col ul { list-style: none; }
-    .footer-col ul li { margin-bottom: 0.625rem; }
-    .footer-col ul li a {
-      font-size: 0.875rem;
-      color: rgba(255,255,255,0.5);
-      transition: color 0.15s;
-    }
-    .footer-col ul li a:hover { color: #fff; }
-    .footer-contact-item {
-      display: flex;
-      gap: 0.5rem;
-      font-size: 0.875rem;
-      color: rgba(255,255,255,0.5);
-      margin-bottom: 0.5rem;
-      line-height: 1.5;
-    }
-    .footer-contact-item strong { color: rgba(255,255,255,0.75); }
-    .footer-bottom {
-      display: flex;
-      align-items: center;
-      justify-content: space-between;
-      padding-top: 1.75rem;
-      gap: 1rem;
-      flex-wrap: wrap;
-    }
-    .footer-bottom p {
-      font-size: 0.8125rem;
-      color: rgba(255,255,255,0.28);
-    }
-    .footer-bottom-links {
-      display: flex;
-      gap: 1.5rem;
-      list-style: none;
-    }
-    .footer-bottom-links a {
-      font-size: 0.8125rem;
-      color: rgba(255,255,255,0.28);
-      transition: color 0.15s;
-    }
-    .footer-bottom-links a:hover { color: rgba(255,255,255,0.65); }
-
-    /* ── Responsive ── */
-    @media (max-width: 1024px) {
-      .footer-grid { grid-template-columns: 1fr 1fr; gap: 2.5rem; }
-      .footer-brand { grid-column: span 2; }
-    }
-
-    @media (max-width: 768px) {
-      .nav-links, .nav-cta { display: none; }
-      .nav-hamburger { display: flex; }
-      .cta-inner { grid-template-columns: 1fr; }
-      .footer-grid { grid-template-columns: 1fr; }
-      .footer-brand { grid-column: span 1; }
-    }
-
-    @media (max-width: 480px) {
-      .page-hero { padding: 120px 0 40px; }
-    }
   </style>
 </head>
 
diff --git a/terms-of-service/index.html b/terms-of-service/index.html
index f1926bd..029f07b 100644
--- a/terms-of-service/index.html
+++ b/terms-of-service/index.html
@@ -21,181 +21,9 @@
   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
   <link rel="preload" as="style" href="https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&family=Inter:wght@300;400;500;600&display=swap">
   <link href="https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&family=Inter:wght@300;400;500;600&display=swap" rel="stylesheet">
+  <link rel="stylesheet" href="/assets/css/main.css">
 
   <style>
-    /* ── Reset & Tokens ── */
-    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
-
-    :root {
-      --rose:        #cc3366;
-      --rose-dark:   #a82a54;
-      --rose-tint:   #f7edf1;
-      --ink:         #1a1814;
-      --ink-mid:     #3d3730;
-      --body-bg:     #faf9f7;
-      --surface:     #ffffff;
-      --warm-gray:   #f0ece6;
-      --border:      #e0dbd4;
-      --text:        #2a2520;
-      --text-muted:  #7c756d;
-      --font-display: 'DM Serif Display', Georgia, serif;
-      --font-body:    'Inter', system-ui, sans-serif;
-      --max-w:       1200px;
-      --gap:         clamp(1.5rem, 4vw, 3rem);
-    }
-
-    html { scroll-behavior: smooth; }
-
-    body {
-      font-family: var(--font-body);
-      font-size: 1rem;
-      line-height: 1.65;
-      color: var(--text);
-      background: var(--body-bg);
-      -webkit-font-smoothing: antialiased;
-    }
-
-    img { display: block; max-width: 100%; }
-    a { color: inherit; text-decoration: none; }
-
-    .container {
-      max-width: var(--max-w);
-      margin-inline: auto;
-      padding-inline: clamp(1.25rem, 5vw, 2.5rem);
-    }
-
-    /* ── Navigation ── */
-    .site-header {
-      position: fixed;
-      top: 0;
-      left: 0;
-      right: 0;
-      z-index: 100;
-      background: rgba(255,255,255,0.97);
-      box-shadow: 0 1px 0 var(--border);
-      backdrop-filter: blur(12px);
-      -webkit-backdrop-filter: blur(12px);
-      transition: background 0.3s ease, box-shadow 0.3s ease;
-    }
-    .nav-inner {
-      display: flex;
-      align-items: center;
-      justify-content: space-between;
-      height: 72px;
-    }
-    .nav-logo {
-      display: flex;
-      align-items: center;
-      gap: 0.625rem;
-    }
-    .nav-logo img { height: 44px; width: auto; }
-
-    .nav-links {
-      display: flex;
-      align-items: center;
-      gap: 2rem;
-      list-style: none;
-    }
-    .nav-links a {
-      font-size: 0.875rem;
-      font-weight: 500;
-      color: var(--ink-mid);
-      transition: color 0.15s;
-    }
-    .nav-links a:hover { color: var(--rose) !important; }
-
-    .nav-cta {
-      font-size: 0.8125rem;
-      font-weight: 600;
-      padding: 0.625rem 1.25rem;
-      border-radius: 2px;
-      border: 1.5px solid var(--rose);
-      color: var(--rose);
-      background: transparent;
-      transition: all 0.2s;
-    }
-    .nav-cta:hover {
-      background: var(--rose) !important;
-      border-color: var(--rose) !important;
-      color: #fff !important;
-    }
-
-    .nav-hamburger {
-      display: none;
-      flex-direction: column;
-      gap: 5px;
-      cursor: pointer;
-      padding: 4px;
-      background: none;
-      border: none;
-      color: var(--ink);
-    }
-    .nav-hamburger span {
-      display: block;
-      width: 24px;
-      height: 2px;
-      background: currentColor;
-      transition: all 0.25s;
-    }
-
-    /* ── Mobile Nav ── */
-    .mobile-menu {
-      display: none;
-      position: fixed;
-      inset: 0;
-      background: var(--ink);
-      z-index: 99;
-      flex-direction: column;
-      justify-content: center;
-      align-items: center;
-      gap: 2rem;
-    }
-    .mobile-menu.open { display: flex; }
-    .mobile-menu a {
-      font-family: var(--font-display);
-      font-size: 2rem;
-      color: rgba(255,255,255,0.75);
-      transition: color 0.15s;
-    }
-    .mobile-menu a:hover { color: #fff; }
-    .mobile-menu-close {
-      position: absolute;
-      top: 1.5rem;
-      right: 1.5rem;
-      background: none;
-      border: none;
-      color: rgba(255,255,255,0.5);
-      font-size: 1.5rem;
-      cursor: pointer;
-      line-height: 1;
-    }
-
-    /* ── Page Hero ── */
-    .page-hero {
-      background: var(--ink);
-      padding: 140px 0 60px;
-    }
-    .breadcrumb {
-      display: flex;
-      align-items: center;
-      gap: 0.5rem;
-      font-size: 0.8125rem;
-      color: rgba(255,255,255,0.4);
-      margin-bottom: 1.25rem;
-    }
-    .breadcrumb a {
-      color: rgba(255,255,255,0.5);
-      transition: color 0.15s;
-    }
-    .breadcrumb a:hover { color: #fff; }
-    .breadcrumb span { color: rgba(255,255,255,0.25); }
-    .page-hero h1 {
-      font-family: var(--font-display);
-      font-size: clamp(2.25rem, 5vw, 3.5rem);
-      line-height: 1.1;
-      color: #fff;
-    }
-
     /* ── Prose Content ── */
     .prose-section {
       background: var(--surface);
@@ -242,111 +70,6 @@
       color: var(--text-muted);
     }
 
-    /* ── Footer ── */
-    .site-footer {
-      background: var(--ink);
-      padding: clamp(3.5rem, 6vw, 5rem) 0 2rem;
-    }
-    .footer-grid {
-      display: grid;
-      grid-template-columns: 1.75fr 1fr 1fr 1fr;
-      gap: 3rem;
-      padding-bottom: 3rem;
-      border-bottom: 1px solid rgba(255,255,255,0.07);
-    }
-    .footer-brand img { height: 38px; margin-bottom: 1rem; }
-    .footer-brand p {
-      font-size: 0.875rem;
-      color: rgba(255,255,255,0.4);
-      line-height: 1.75;
-      max-width: 260px;
-      margin-bottom: 1.5rem;
-    }
-    .footer-social {
-      display: flex;
-      gap: 0.625rem;
-    }
-    .footer-social a {
-      width: 36px;
-      height: 36px;
-      border: 1px solid rgba(255,255,255,0.12);
-      border-radius: 2px;
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      color: rgba(255,255,255,0.45);
-      font-size: 0.75rem;
-      transition: all 0.2s;
-    }
-    .footer-social a:hover {
-      border-color: var(--rose);
-      color: var(--rose);
-    }
-    .footer-col h4 {
-      font-size: 0.75rem;
-      font-weight: 600;
-      letter-spacing: 0.1em;
-      text-transform: uppercase;
-      color: rgba(255,255,255,0.3);
-      margin-bottom: 1.25rem;
-    }
-    .footer-col ul { list-style: none; }
-    .footer-col ul li { margin-bottom: 0.625rem; }
-    .footer-col ul li a {
-      font-size: 0.875rem;
-      color: rgba(255,255,255,0.5);
-      transition: color 0.15s;
-    }
-    .footer-col ul li a:hover { color: #fff; }
-    .footer-contact-item {
-      display: flex;
-      gap: 0.5rem;
-      font-size: 0.875rem;
-      color: rgba(255,255,255,0.5);
-      margin-bottom: 0.5rem;
-      line-height: 1.5;
-    }
-    .footer-contact-item strong { color: rgba(255,255,255,0.75); }
-    .footer-bottom {
-      display: flex;
-      align-items: center;
-      justify-content: space-between;
-      padding-top: 1.75rem;
-      gap: 1rem;
-      flex-wrap: wrap;
-    }
-    .footer-bottom p {
-      font-size: 0.8125rem;
-      color: rgba(255,255,255,0.28);
-    }
-    .footer-bottom-links {
-      display: flex;
-      gap: 1.5rem;
-      list-style: none;
-    }
-    .footer-bottom-links a {
-      font-size: 0.8125rem;
-      color: rgba(255,255,255,0.28);
-      transition: color 0.15s;
-    }
-    .footer-bottom-links a:hover { color: rgba(255,255,255,0.65); }
-
-    /* ── Responsive ── */
-    @media (max-width: 1024px) {
-      .footer-grid { grid-template-columns: 1fr 1fr; gap: 2.5rem; }
-      .footer-brand { grid-column: span 2; }
-    }
-
-    @media (max-width: 768px) {
-      .nav-links, .nav-cta { display: none; }
-      .nav-hamburger { display: flex; }
-      .footer-grid { grid-template-columns: 1fr; }
-      .footer-brand { grid-column: span 1; }
-    }
-
-    @media (max-width: 480px) {
-      .page-hero { padding: 120px 0 40px; }
-    }
   </style>
 </head>