From 0ca46b4cb54a198b8fff0b88f6dfa3e2f52f7ed9 Mon Sep 17 00:00:00 2001 From: "Ozzy (AI Assistant)" Date: Mon, 27 Jul 2026 20:12:12 +0000 Subject: [PATCH 1/4] Miami Red color scheme + Miami M favicon --- css/style.css | 193 +++++++++++++++++++++++++++++++++++--------------- favicon.png | Bin 164 -> 487 bytes 2 files changed, 134 insertions(+), 59 deletions(-) diff --git a/css/style.css b/css/style.css index c93e8c3..ce506d1 100644 --- a/css/style.css +++ b/css/style.css @@ -6,34 +6,45 @@ } :root { - --primary: #2563eb; - --primary-dark: #1d4ed8; - --secondary: #64748b; - --light: #f8fafc; - --dark: #1e293b; - --white: #ffffff; - --gray-50: #f1f5f9; - --gray-100: #e2e8f0; - --shadow: 0 2px 8px rgba(0, 0, 0, 0.1); + --miami-red: #C41E3A; + --miami-red-dark: #9E182E; + --miami-red-light: #E84C65; + --white: #FFFFFF; + --cream: #F8F5F0; + --light-gray: #EAE7E0; + --medium-gray: #8A8580; + --dark-gray: #3A3530; + --text: #2A2520; + --shadow: 0 2px 12px rgba(0, 0, 0, 0.08); + --shadow-hover: 0 6px 24px rgba(196, 30, 58, 0.12); + --radius: 12px; + --max-width: 1280px; +} + +*, *::before, *::after { + box-sizing: border-box; + margin: 0; + padding: 0; } body { font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif; - color: var(--dark); - background-color: var(--white); + color: var(--text); + background-color: var(--cream); line-height: 1.6; + min-height: 100vh; } .container { - max-width: 1200px; + max-width: var(--max-width); margin: 0 auto; - padding: 0 20px; + padding: 0 1.5rem; } /* ===== Header ===== */ .site-header { - background-color: var(--white); - border-bottom: 1px solid var(--gray-100); + background: linear-gradient(135deg, var(--miami-red) 0%, var(--miami-red-dark) 100%); + color: var(--white); position: sticky; top: 0; z-index: 100; @@ -43,27 +54,34 @@ body { display: flex; justify-content: space-between; align-items: center; - padding: 1rem 20px; + padding: 0.75rem 1.5rem; } .logo { font-size: 1.5rem; font-weight: 700; - color: var(--primary); + color: var(--white); + letter-spacing: -0.02em; } .nav a { margin-left: 2rem; - color: var(--dark); + color: rgba(255,255,255,0.85); text-decoration: none; font-weight: 500; + font-size: 0.9rem; transition: color 0.2s; + padding: 0.25rem 0; + border-bottom: 2px solid transparent; } .nav a:hover { - color: var(--primary); + color: var(--white); + border-bottom-color: rgba(255,255,255,0.5); } +/* ===== Staging Banner ===== */ +.staging-banner { background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%); color: white; text-align: center; @@ -79,15 +97,31 @@ body { /* ===== Hero Section ===== */ .hero { - background: linear-gradient(135deg, var(--primary) 0%, #1e40af 100%); + background: linear-gradient(135deg, var(--miami-red) 0%, var(--miami-red-dark) 100%); color: var(--white); - padding: 4rem 0; + padding: 5rem 0; text-align: center; + position: relative; + overflow: hidden; +} + +.hero::before { + content: ''; + position: absolute; + top: -50%; + left: -50%; + width: 200%; + height: 200%; + background: radial-gradient(circle at 30% 50%, rgba(255,255,255,0.05) 0%, transparent 50%); + pointer-events: none; } .hero h2 { font-size: 2.5rem; + font-weight: 700; + letter-spacing: -0.02em; margin-bottom: 1rem; + position: relative; } .hero p { @@ -95,6 +129,7 @@ body { opacity: 0.9; max-width: 600px; margin: 0 auto; + position: relative; } /* ===== Section ===== */ @@ -104,9 +139,10 @@ body { .section h3 { text-align: center; - font-size: 1.875rem; + font-size: 1.75rem; + font-weight: 700; margin-bottom: 3rem; - color: var(--dark); + color: var(--dark-gray); } /* ===== Values Grid ===== */ @@ -120,22 +156,28 @@ body { .value-item { text-align: center; padding: 2rem; - border-radius: 8px; - background: var(--gray-50); + border-radius: var(--radius); + background: var(--white); + box-shadow: var(--shadow); transition: transform 0.2s, box-shadow 0.2s; } .value-item:hover { - transform: translateY(-4px); - box-shadow: var(--shadow); + transform: translateY(-3px); + box-shadow: var(--shadow-hover); } .value-item h4 { - color: var(--primary); + color: var(--miami-red); margin-bottom: 1rem; + font-size: 1.1rem; } /* ===== How It Works ===== */ +.how-it-works { + background: var(--white); +} + .how-it-works .steps { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); @@ -146,32 +188,33 @@ body { .step { text-align: center; padding: 2rem; - border-radius: 8px; - background: var(--white); - border: 1px solid var(--gray-100); + border-radius: var(--radius); + background: var(--cream); box-shadow: var(--shadow); } .step-number { width: 48px; height: 48px; - background: var(--primary); + background: linear-gradient(135deg, var(--miami-red) 0%, var(--miami-red-dark) 100%); color: white; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-weight: 700; + font-size: 1.2rem; margin: 0 auto 1rem; } .step h4 { margin-bottom: 1rem; + color: var(--dark-gray); } /* ===== CTA Section ===== */ .cta { - background: var(--gray-50); + background: var(--cream); text-align: center; padding: 4rem 0; } @@ -179,6 +222,7 @@ body { .cta h2 { margin-bottom: 2rem; font-size: 2rem; + color: var(--dark-gray); } .cta-buttons { @@ -199,49 +243,71 @@ body { border: none; cursor: pointer; font-size: 1rem; + font-family: inherit; } .btn-primary { - background: var(--primary); + background: var(--miami-red); color: white; } .btn-primary:hover { - background: var(--primary-dark); + background: var(--miami-red-dark); transform: translateY(-2px); + box-shadow: var(--shadow-hover); } .btn-secondary { background: transparent; - color: var(--primary); - border: 2px solid var(--primary); + color: var(--miami-red); + border: 2px solid var(--miami-red); } .btn-secondary:hover { - background: var(--primary); + background: var(--miami-red); color: white; + transform: translateY(-2px); +} + +/* ===== Page Header ===== */ +.page-header { + text-align: center; + padding: 3rem 0; +} + +.page-header h2 { + font-size: 2rem; + color: var(--dark-gray); + margin-bottom: 0.5rem; +} + +.page-header p { + color: var(--medium-gray); + font-size: 1.1rem; } /* ===== Forms ===== */ .form-container { max-width: 800px; margin: 0 auto; + padding-bottom: 4rem; } .form-intro { text-align: center; - margin-bottom: 3rem; + margin-bottom: 2rem; } .form-intro h3 { font-size: 1.5rem; - margin-bottom: 1rem; + margin-bottom: 0.5rem; + color: var(--miami-red); } .contact-form { background: var(--white); padding: 2rem; - border-radius: 8px; + border-radius: var(--radius); box-shadow: var(--shadow); } @@ -260,7 +326,8 @@ body { display: block; margin-bottom: 0.5rem; font-weight: 600; - color: var(--dark); + color: var(--dark-gray); + font-size: 0.9rem; } .form-group input, @@ -268,26 +335,29 @@ body { .form-group textarea { width: 100%; padding: 0.75rem; - border: 1px solid var(--gray-100); - border-radius: 6px; + border: 2px solid var(--light-gray); + border-radius: 8px; font-family: inherit; font-size: 1rem; - transition: border-color 0.2s; + background: var(--cream); + transition: border-color 0.2s, background-color 0.2s; } .form-group input:focus, .form-group select:focus, .form-group textarea:focus { outline: none; - border-color: var(--primary); + border-color: var(--miami-red); + background-color: var(--white); } /* ===== Footer ===== */ .site-footer { - background: var(--dark); - color: var(--white); + background: var(--dark-gray); + color: rgba(255,255,255,0.7); text-align: center; padding: 2rem 0; + font-size: 0.85rem; } /* ===== Responsive ===== */ @@ -296,10 +366,20 @@ body { font-size: 2rem; } + .hero { + padding: 3rem 0; + } + .nav { display: none; } + .site-header .container { + flex-direction: column; + gap: 0.5rem; + padding: 0.75rem 1rem; + } + .form-row { grid-template-columns: 1fr; } @@ -319,26 +399,21 @@ body { grid-template-columns: 1fr; } - .site-header .container { - flex-direction: column; - gap: 1rem; + .section { + padding: 3rem 0; } } @media (max-width: 480px) { .container { - padding: 0 15px; + padding: 0 1rem; } .section { padding: 2rem 0; } - .hero { - padding: 2rem 0; + .hero h2 { + font-size: 1.6rem; } - - .form-container { - padding: 0 10px; - } -} \ No newline at end of file +} diff --git a/favicon.png b/favicon.png index bb980d1477bba5591a5f1ee5845fb16777e57c6b..aa900c80189f9712dce07b8ecb29ce3ec9f0c04a 100644 GIT binary patch literal 487 zcmV0XIen{{V|I=;G#N9GsY( zjB&%oN#p7UgC>qRxu7(0KogWlL97Le?@C(1)WnTT+T4BbyYJn*JAiQ;6IGOo%JPcH z_}p4b9YcH6w58$VR7EMQa)G#mwfYv6yC(66r11R;$7OQUGmsEO`(uESo&}-tPU?4< zu&hKgX<=%2Uk; zv0jJEwq7i2+J=o#Cspp4b}||gvq4#E0y$~{IoPJYlZ@xc#bor^LCWYKD_9Q*5aR+F zd~0G-^rG3=Pv?dxXRU@E?MWeUp5iIuuTAiULpd^X!Dg+Bo0dm#!N(>~!}BAfMB!`WGv&F;n1qdcwYo*>l36N%4IMUT dl}Es_1mD*4r0hr9u~h&7002ovPDHLkV1hAJ+k5~3 literal 164 zcmc}{bMg-=H}G~(&vyg@zu?de*U)qz%NInrcse^q0%_-xaBs6zAj7pZG{-eCEXX9! z-`L49&;X>yIX@sJASuwq7;FMigk<39 Date: Mon, 27 Jul 2026 20:20:52 +0000 Subject: [PATCH 2/4] Widen hero paragraph to 720px --- css/style.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/css/style.css b/css/style.css index ce506d1..cba5f5b 100644 --- a/css/style.css +++ b/css/style.css @@ -127,7 +127,7 @@ body { .hero p { font-size: 1.125rem; opacity: 0.9; - max-width: 600px; + max-width: 720px; margin: 0 auto; position: relative; } From 3ebb4fb081239a50d4f8f1e4e1c5b11b793f77c5 Mon Sep 17 00:00:00 2001 From: "Ozzy (AI Assistant)" Date: Mon, 27 Jul 2026 20:34:13 +0000 Subject: [PATCH 3/4] Add resume file upload (swap from URL) --- css/style.css | 27 +++++++++++++-------------- job-seeker.html | 8 +++----- js/form-handler.js | 9 ++++----- 3 files changed, 20 insertions(+), 24 deletions(-) diff --git a/css/style.css b/css/style.css index cba5f5b..569ead6 100644 --- a/css/style.css +++ b/css/style.css @@ -80,20 +80,7 @@ body { border-bottom-color: rgba(255,255,255,0.5); } -/* ===== Staging Banner ===== */ -.staging-banner { - background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%); - color: white; - text-align: center; - padding: 0.5rem; - font-size: 0.875rem; - font-weight: 500; - position: fixed; - top: 0; - left: 0; - right: 0; - z-index: 999; -} + /* ===== Hero Section ===== */ .hero { @@ -293,6 +280,18 @@ body { padding-bottom: 4rem; } +.file-input { + padding: 0.5rem !important; + background: var(--white) !important; +} + +.file-hint { + display: block; + font-size: 0.8rem; + color: var(--medium-gray); + margin-top: 0.25rem; +} + .form-intro { text-align: center; margin-bottom: 2rem; diff --git a/job-seeker.html b/job-seeker.html index 3f066c9..ba4ae44 100644 --- a/job-seeker.html +++ b/job-seeker.html @@ -14,9 +14,6 @@ -
- ⚠️ STAGING SITE — RecruitmentVenture-Staging -