diff --git a/assets/pasted-20260328-052034-76e61f64.png b/assets/pasted-20260328-052034-76e61f64.png
new file mode 100644
index 0000000..855b826
Binary files /dev/null and b/assets/pasted-20260328-052034-76e61f64.png differ
diff --git a/assets/pasted-20260328-052613-0e0e2c33.png b/assets/pasted-20260328-052613-0e0e2c33.png
new file mode 100644
index 0000000..331e212
Binary files /dev/null and b/assets/pasted-20260328-052613-0e0e2c33.png differ
diff --git a/assets/pasted-20260328-080040-133ede7f.jpg b/assets/pasted-20260328-080040-133ede7f.jpg
new file mode 100644
index 0000000..492c91a
Binary files /dev/null and b/assets/pasted-20260328-080040-133ede7f.jpg differ
diff --git a/assets/pasted-20260328-090924-08e1b476.png b/assets/pasted-20260328-090924-08e1b476.png
new file mode 100644
index 0000000..6cb5954
Binary files /dev/null and b/assets/pasted-20260328-090924-08e1b476.png differ
diff --git a/frontend/public/assets/vm-shot-2026-03-28T07-59-44-940Z.jpg b/frontend/public/assets/vm-shot-2026-03-28T07-59-44-940Z.jpg
new file mode 100644
index 0000000..7d17aa7
Binary files /dev/null and b/frontend/public/assets/vm-shot-2026-03-28T07-59-44-940Z.jpg differ
diff --git a/frontend/src/components/marketing/InquiryForm.tsx b/frontend/src/components/marketing/InquiryForm.tsx
index a7724b6..06b4a66 100644
--- a/frontend/src/components/marketing/InquiryForm.tsx
+++ b/frontend/src/components/marketing/InquiryForm.tsx
@@ -105,18 +105,18 @@ export default function InquiryForm({ initialInquiryType }: Props) {
   };
 
   return (
-    <div className="rounded-[2rem] border border-[#3E2723]/10 bg-white p-6 shadow-[0_24px_80px_rgba(35,24,18,0.08)] md:p-8">
+    <div className="rounded-[2rem] border border-[#1F3A2D]/10 bg-white p-6 shadow-[0_24px_80px_rgba(20,38,29,0.08)] md:p-8">
       <div className="mb-6">
-        <p className="text-sm font-semibold uppercase tracking-[0.35em] text-[#C8A165]">Buyer inquiry</p>
-        <h3 className="font-brand-display mt-3 text-3xl text-[#3E2723]">{title}</h3>
-        <p className="mt-3 max-w-2xl text-sm leading-7 text-[#5B4A43]">
+        <p className="text-sm font-semibold uppercase tracking-[0.35em] text-[#9FB06F]">Buyer inquiry</p>
+        <h3 className="font-brand-display mt-3 text-3xl text-[#1F3A2D]">{title}</h3>
+        <p className="mt-3 max-w-2xl text-sm leading-7 text-[#556257]">
           Share your sourcing goals and we will tailor a response around origins, order size, process, and export handling.
         </p>
       </div>
 
       <form className="space-y-4" onSubmit={onSubmit}>
         <div className="grid gap-4 md:grid-cols-2">
-          <label className="space-y-2 text-sm font-medium text-[#3E2723]">
+          <label className="space-y-2 text-sm font-medium text-[#1F3A2D]">
             Inquiry type
             <select className="coffee-input" name="inquiry_type" value={form.inquiry_type} onChange={onChange}>
               {inquiryTypes.map((item) => (
@@ -126,7 +126,7 @@ export default function InquiryForm({ initialInquiryType }: Props) {
               ))}
             </select>
           </label>
-          <label className="space-y-2 text-sm font-medium text-[#3E2723]">
+          <label className="space-y-2 text-sm font-medium text-[#1F3A2D]">
             Buyer type
             <select className="coffee-input" name="buyer_type" value={form.buyer_type} onChange={onChange}>
               {buyerTypes.map((item) => (
@@ -139,22 +139,22 @@ export default function InquiryForm({ initialInquiryType }: Props) {
         </div>
 
         <div className="grid gap-4 md:grid-cols-2">
-          <label className="space-y-2 text-sm font-medium text-[#3E2723]">
+          <label className="space-y-2 text-sm font-medium text-[#1F3A2D]">
             Full name
             <input className="coffee-input" name="full_name" placeholder="Your name" value={form.full_name} onChange={onChange} />
           </label>
-          <label className="space-y-2 text-sm font-medium text-[#3E2723]">
+          <label className="space-y-2 text-sm font-medium text-[#1F3A2D]">
             Email
             <input className="coffee-input" name="email" type="email" placeholder="you@company.com" value={form.email} onChange={onChange} />
           </label>
         </div>
 
         <div className="grid gap-4 md:grid-cols-2">
-          <label className="space-y-2 text-sm font-medium text-[#3E2723]">
+          <label className="space-y-2 text-sm font-medium text-[#1F3A2D]">
             Phone / WhatsApp
             <input className="coffee-input" name="phone" placeholder="Contact number" value={form.phone} onChange={onChange} />
           </label>
-          <label className="space-y-2 text-sm font-medium text-[#3E2723]">
+          <label className="space-y-2 text-sm font-medium text-[#1F3A2D]">
             Preferred contact method
             <select className="coffee-input" name="preferred_contact_method" value={form.preferred_contact_method} onChange={onChange}>
               {contactMethods.map((item) => (
@@ -167,18 +167,18 @@ export default function InquiryForm({ initialInquiryType }: Props) {
         </div>
 
         <div className="grid gap-4 md:grid-cols-2">
-          <label className="space-y-2 text-sm font-medium text-[#3E2723]">
+          <label className="space-y-2 text-sm font-medium text-[#1F3A2D]">
             Company name
             <input className="coffee-input" name="company_name" placeholder="Company" value={form.company_name} onChange={onChange} />
           </label>
-          <label className="space-y-2 text-sm font-medium text-[#3E2723]">
+          <label className="space-y-2 text-sm font-medium text-[#1F3A2D]">
             Country
             <input className="coffee-input" name="country" placeholder="Country" value={form.country} onChange={onChange} />
           </label>
         </div>
 
         <div className="grid gap-4 md:grid-cols-2">
-          <label className="space-y-2 text-sm font-medium text-[#3E2723]">
+          <label className="space-y-2 text-sm font-medium text-[#1F3A2D]">
             Target volume (kg)
             <input
               className="coffee-input"
@@ -190,7 +190,7 @@ export default function InquiryForm({ initialInquiryType }: Props) {
               onChange={onChange}
             />
           </label>
-          <label className="space-y-2 text-sm font-medium text-[#3E2723]">
+          <label className="space-y-2 text-sm font-medium text-[#1F3A2D]">
             Preferred Incoterm
             <select className="coffee-input" name="incoterm" value={form.incoterm} onChange={onChange}>
               {incoterms.map((item) => (
@@ -202,7 +202,7 @@ export default function InquiryForm({ initialInquiryType }: Props) {
           </label>
         </div>
 
-        <label className="space-y-2 text-sm font-medium text-[#3E2723]">
+        <label className="space-y-2 text-sm font-medium text-[#1F3A2D]">
           Message
           <textarea
             className="coffee-input min-h-[160px] resize-y pt-3"
@@ -214,7 +214,7 @@ export default function InquiryForm({ initialInquiryType }: Props) {
         </label>
 
         <div className="flex flex-col gap-3 md:flex-row md:items-center md:justify-between">
-          <p className="text-sm text-[#6B5B54]">Submissions are routed to the admin inquiry queue for follow-up.</p>
+          <p className="text-sm text-[#667367]">Submissions are routed to the admin inquiry queue for follow-up.</p>
           <MarketingButton className="w-full md:w-auto" type="submit">
             {isSubmitting ? 'Sending request...' : 'Submit inquiry'}
           </MarketingButton>
@@ -222,7 +222,7 @@ export default function InquiryForm({ initialInquiryType }: Props) {
 
         {errorMessage ? <p className="text-sm text-red-600">{errorMessage}</p> : null}
         {successMessage ? (
-          <div className="rounded-2xl border border-[#C8A165]/30 bg-[#F8F1E7] px-4 py-3 text-sm text-[#3E2723]">{successMessage}</div>
+          <div className="rounded-2xl border border-[#9FB06F]/30 bg-[#EEF3E7] px-4 py-3 text-sm text-[#1F3A2D]">{successMessage}</div>
         ) : null}
       </form>
     </div>
diff --git a/frontend/src/components/marketing/MarketingButton.tsx b/frontend/src/components/marketing/MarketingButton.tsx
index 66961a6..8d55f6c 100644
--- a/frontend/src/components/marketing/MarketingButton.tsx
+++ b/frontend/src/components/marketing/MarketingButton.tsx
@@ -11,15 +11,15 @@ type Props = {
 };
 
 const baseClassName =
-  'inline-flex items-center justify-center rounded-full px-5 py-3 text-sm font-semibold transition-all duration-300 focus:outline-none focus:ring-2 focus:ring-[#C8A165] focus:ring-offset-2';
+  'inline-flex items-center justify-center rounded-full px-5 py-3 text-sm font-semibold transition-all duration-300 focus:outline-none focus:ring-2 focus:ring-[#9FB06F] focus:ring-offset-2';
 
 const variantMap = {
   primary:
-    'bg-[#C8A165] text-[#2A1B18] shadow-[0_16px_40px_rgba(200,161,101,0.25)] hover:-translate-y-0.5 hover:bg-[#d5b37d]',
+    'bg-[#9FB06F] text-[#18271F] shadow-[0_16px_40px_rgba(159,176,111,0.25)] hover:-translate-y-0.5 hover:bg-[#B0C482]',
   secondary:
-    'border border-[#C8A165]/60 bg-white/10 text-white backdrop-blur hover:border-[#C8A165] hover:bg-white/20',
+    'border border-[#B9C88D]/55 bg-white/12 text-white backdrop-blur hover:border-[#C5D39A] hover:bg-white/24',
   ghost:
-    'border border-[#3E2723]/15 bg-white text-[#3E2723] hover:border-[#3E2723]/30 hover:bg-[#F5E9DA]',
+    'border border-[#1F3A2D]/15 bg-white text-[#1F3A2D] hover:border-[#1F3A2D]/30 hover:bg-[#F4F1E6]',
 };
 
 export default function MarketingButton({
diff --git a/frontend/src/components/marketing/MarketingLayout.tsx b/frontend/src/components/marketing/MarketingLayout.tsx
index 1110f34..308480b 100644
--- a/frontend/src/components/marketing/MarketingLayout.tsx
+++ b/frontend/src/components/marketing/MarketingLayout.tsx
@@ -45,17 +45,17 @@ const getCurrentLabel = (pathname: string) => {
 const getDesktopNavClasses = (isActive: boolean, isHomeHeroMode: boolean) => {
   if (isHomeHeroMode) {
     return isActive
-      ? 'bg-white/14 text-white shadow-[0_16px_45px_rgba(0,0,0,0.14)]'
-      : 'text-white/88 hover:bg-white/10';
+      ? 'border border-white/15 bg-white/16 text-white shadow-[0_16px_45px_rgba(0,0,0,0.18)] backdrop-blur-md'
+      : 'border border-white/10 bg-[#173125]/58 text-[#F4F1E6] shadow-[0_14px_35px_rgba(0,0,0,0.18)] backdrop-blur-md hover:bg-[#224032]/74 hover:text-white';
   }
 
-  return isActive ? 'bg-[#3E2723] text-[#F5E9DA]' : 'text-[#4d3c35] hover:bg-[#F5E9DA]';
+  return isActive ? 'bg-[#1F3A2D] text-[#F4F1E6]' : 'text-[#32453A] hover:bg-[#F4F1E6]';
 };
 
 const getDesktopDropdownClasses = (isHomeHeroMode: boolean) => {
   return isHomeHeroMode
-    ? 'border-white/10 bg-[#241816]/96 text-white shadow-[0_26px_80px_rgba(0,0,0,0.32)]'
-    : 'border-[#3E2723]/10 bg-white text-[#2c221f] shadow-[0_26px_80px_rgba(35,24,18,0.14)]';
+    ? 'border-white/10 bg-[#14261D]/96 text-white shadow-[0_26px_80px_rgba(0,0,0,0.32)]'
+    : 'border-[#1F3A2D]/10 bg-white text-[#22332B] shadow-[0_26px_80px_rgba(20,38,29,0.14)]';
 };
 
 const getDesktopDropdownItemClasses = (pathname: string, item: NavigationChild, isHomeHeroMode: boolean) => {
@@ -67,7 +67,7 @@ const getDesktopDropdownItemClasses = (pathname: string, item: NavigationChild,
       : 'text-white/78 hover:bg-white/8 hover:text-white';
   }
 
-  return isActive ? 'bg-[#F5E9DA] text-[#3E2723]' : 'text-[#4d3c35] hover:bg-[#F5E9DA]/70';
+  return isActive ? 'bg-[#F4F1E6] text-[#1F3A2D]' : 'text-[#32453A] hover:bg-[#F4F1E6]/70';
 };
 
 export default function MarketingLayout({ children }: Props) {
@@ -96,12 +96,12 @@ export default function MarketingLayout({ children }: Props) {
   const isHomeHeroMode = router.pathname === '/' && !isScrolled && !isMenuOpen;
 
   return (
-    <div className="font-brand-body min-h-screen bg-[#fcfaf6] text-[#2c221f]">
+    <div className="font-brand-body min-h-screen bg-[#FBF9F1] text-[#22332B]">
       <header
         className={`sticky top-0 z-50 transition-all duration-300 ${
           isHomeHeroMode
-            ? 'border-b border-transparent bg-transparent'
-            : 'border-b border-[#3E2723]/10 bg-[#fcfaf6]/92 shadow-[0_18px_50px_rgba(35,24,18,0.08)] backdrop-blur-xl'
+            ? 'border-b border-white/10 bg-[#102118]/62 shadow-[0_18px_50px_rgba(0,0,0,0.18)] backdrop-blur-xl'
+            : 'border-b border-[#1F3A2D]/10 bg-[#FBF9F1]/92 shadow-[0_18px_50px_rgba(20,38,29,0.08)] backdrop-blur-xl'
         }`}
       >
         <div className="mx-auto flex max-w-7xl items-center justify-between gap-4 px-5 py-4 lg:px-8">
@@ -109,17 +109,17 @@ export default function MarketingLayout({ children }: Props) {
             <div
               className={`flex h-12 w-12 items-center justify-center rounded-full border text-sm font-semibold shadow-lg transition-colors duration-300 ${
                 isHomeHeroMode
-                  ? 'border-white/25 bg-white/10 text-[#F5E9DA] backdrop-blur-md'
-                  : 'border-[#C8A165]/50 bg-[#3E2723] text-[#F5E9DA]'
+                  ? 'border-white/28 bg-white/12 text-[#F4F1E6] backdrop-blur-md'
+                  : 'border-[#9FB06F]/50 bg-[#1F3A2D] text-[#F4F1E6]'
               }`}
             >
               AD
             </div>
             <div>
-              <p className={`font-brand-display text-lg font-bold transition-colors duration-300 ${isHomeHeroMode ? 'text-[#F5E9DA]' : 'text-[#3E2723]'}`}>
+              <p className={`font-brand-display text-lg font-bold transition-colors duration-300 ${isHomeHeroMode ? 'text-[#F4F1E6]' : 'text-[#1F3A2D]'}`}>
                 Alem Desta
               </p>
-              <p className={`text-xs uppercase tracking-[0.28em] transition-colors duration-300 ${isHomeHeroMode ? 'text-white/60' : 'text-[#8a6f59]'}`}>
+              <p className={`text-xs uppercase tracking-[0.28em] transition-colors duration-300 ${isHomeHeroMode ? 'text-white/60' : 'text-[#72816F]'}`}>
                 Coffee Export
               </p>
             </div>
@@ -160,7 +160,7 @@ export default function MarketingLayout({ children }: Props) {
                         )}`}
                       >
                         <p className="text-sm font-semibold">{child.label}</p>
-                        <p className={`mt-1 text-xs leading-6 ${isHomeHeroMode ? 'text-white/58' : 'text-[#7a6458]'}`}>{child.description}</p>
+                        <p className={`mt-1 text-xs leading-6 ${isHomeHeroMode ? 'text-white/58' : 'text-[#68766A]'}`}>{child.description}</p>
                       </Link>
                     ))}
                   </div>
@@ -181,8 +181,8 @@ export default function MarketingLayout({ children }: Props) {
             onClick={() => setIsMenuOpen((current) => !current)}
             className={`inline-flex h-12 w-12 items-center justify-center rounded-full border transition-all duration-300 xl:hidden ${
               isHomeHeroMode
-                ? 'border-white/20 bg-white/10 text-[#F5E9DA] backdrop-blur-md'
-                : 'border-[#3E2723]/10 bg-white text-[#3E2723]'
+                ? 'border-white/20 bg-white/10 text-[#F4F1E6] backdrop-blur-md'
+                : 'border-[#1F3A2D]/10 bg-white text-[#1F3A2D]'
             }`}
             aria-label="Toggle navigation"
           >
@@ -191,9 +191,9 @@ export default function MarketingLayout({ children }: Props) {
         </div>
 
         {isMenuOpen ? (
-          <div className="border-t border-[#3E2723]/10 bg-[#fcfaf6] px-5 py-4 xl:hidden">
-            <div className="mb-4 rounded-2xl border border-[#C8A165]/30 bg-[#F5E9DA] px-4 py-3 text-sm text-[#5d4a42]">
-              Currently viewing: <span className="font-semibold text-[#3E2723]">{currentLabel}</span>
+          <div className="border-t border-[#1F3A2D]/10 bg-[#FBF9F1] px-5 py-4 xl:hidden">
+            <div className="mb-4 rounded-2xl border border-[#9FB06F]/30 bg-[#F4F1E6] px-4 py-3 text-sm text-[#5F6C61]">
+              Currently viewing: <span className="font-semibold text-[#1F3A2D]">{currentLabel}</span>
             </div>
             <div className="flex flex-col gap-2">
               {navigationItems.map((item) => {
@@ -203,7 +203,7 @@ export default function MarketingLayout({ children }: Props) {
                       key={item.href}
                       href={item.href}
                       className={`rounded-2xl px-4 py-3 text-sm font-medium ${
-                        isNavItemActive(router.pathname, item) ? 'bg-[#3E2723] text-[#F5E9DA]' : 'bg-white text-[#3E2723]'
+                        isNavItemActive(router.pathname, item) ? 'bg-[#1F3A2D] text-[#F4F1E6]' : 'bg-white text-[#1F3A2D]'
                       }`}
                       onClick={() => setIsMenuOpen(false)}
                     >
@@ -213,12 +213,12 @@ export default function MarketingLayout({ children }: Props) {
                 }
 
                 return (
-                  <div key={item.href} className="overflow-hidden rounded-[1.5rem] border border-[#3E2723]/10 bg-white">
+                  <div key={item.href} className="overflow-hidden rounded-[1.5rem] border border-[#1F3A2D]/10 bg-white">
                     <div className="flex items-center">
                       <Link
                         href={item.href}
                         className={`flex-1 px-4 py-3 text-sm font-medium ${
-                          isNavItemActive(router.pathname, item) ? 'text-[#3E2723]' : 'text-[#4d3c35]'
+                          isNavItemActive(router.pathname, item) ? 'text-[#1F3A2D]' : 'text-[#32453A]'
                         }`}
                         onClick={() => setIsMenuOpen(false)}
                       >
@@ -227,7 +227,7 @@ export default function MarketingLayout({ children }: Props) {
                       <button
                         type="button"
                         onClick={() => setIsExportMenuOpen((current) => !current)}
-                        className="px-4 py-3 text-[#3E2723]"
+                        className="px-4 py-3 text-[#1F3A2D]"
                         aria-label="Toggle export services submenu"
                       >
                         <BaseIcon
@@ -237,18 +237,18 @@ export default function MarketingLayout({ children }: Props) {
                       </button>
                     </div>
                     {isExportMenuOpen ? (
-                      <div className="border-t border-[#3E2723]/10 bg-[#fcfaf6] p-2">
+                      <div className="border-t border-[#1F3A2D]/10 bg-[#FBF9F1] p-2">
                         {item.children.map((child) => (
                           <Link
                             key={child.href}
                             href={child.href}
                             className={`block rounded-2xl px-4 py-3 ${
-                              isActivePath(router.pathname, child.href) ? 'bg-[#3E2723] text-[#F5E9DA]' : 'text-[#3E2723]'
+                              isActivePath(router.pathname, child.href) ? 'bg-[#1F3A2D] text-[#F4F1E6]' : 'text-[#1F3A2D]'
                             }`}
                             onClick={() => setIsMenuOpen(false)}
                           >
                             <p className="text-sm font-medium">{child.label}</p>
-                            <p className={`mt-1 text-xs leading-6 ${isActivePath(router.pathname, child.href) ? 'text-white/70' : 'text-[#7a6458]'}`}>
+                            <p className={`mt-1 text-xs leading-6 ${isActivePath(router.pathname, child.href) ? 'text-white/70' : 'text-[#68766A]'}`}>
                               {child.description}
                             </p>
                           </Link>
@@ -271,11 +271,11 @@ export default function MarketingLayout({ children }: Props) {
 
       <main>{children}</main>
 
-      <section className="border-y border-[#3E2723]/10 bg-[#3E2723] px-5 py-16 text-white lg:px-8">
+      <section className="border-y border-[#1F3A2D]/10 bg-[#1F3A2D] px-5 py-16 text-white lg:px-8">
         <div className="mx-auto flex max-w-7xl flex-col gap-10 lg:flex-row lg:items-center lg:justify-between">
           <div className="max-w-3xl">
-            <p className="text-sm uppercase tracking-[0.35em] text-[#d7b47a]">Ready to source with confidence?</p>
-            <h2 className="font-brand-display mt-4 text-4xl leading-tight text-[#F5E9DA] md:text-5xl">
+            <p className="text-sm uppercase tracking-[0.35em] text-[#B7C78B]">Ready to source with confidence?</p>
+            <h2 className="font-brand-display mt-4 text-4xl leading-tight text-[#F4F1E6] md:text-5xl">
               Discover Ethiopian coffee backed by heritage, clear communication, and export discipline.
             </h2>
           </div>
@@ -288,10 +288,10 @@ export default function MarketingLayout({ children }: Props) {
         </div>
       </section>
 
-      <footer className="bg-[#241816] px-5 py-16 text-white lg:px-8">
+      <footer className="bg-[#14261D] px-5 py-16 text-white lg:px-8">
         <div className="mx-auto grid max-w-7xl gap-10 lg:grid-cols-[1.1fr_0.7fr_0.95fr_1fr]">
           <div>
-            <p className="font-brand-display text-3xl text-[#F5E9DA]">{brand.name}</p>
+            <p className="font-brand-display text-3xl text-[#F4F1E6]">{brand.name}</p>
             <p className="mt-4 max-w-xl text-sm leading-7 text-white/72">{brand.tagline}</p>
             <div className="mt-8 flex flex-wrap gap-3">
               <MarketingButton href="/contact?type=partner_with_us">Partner With Us</MarketingButton>
@@ -302,11 +302,11 @@ export default function MarketingLayout({ children }: Props) {
           </div>
 
           <div>
-            <p className="text-sm font-semibold uppercase tracking-[0.28em] text-[#C8A165]">Main pages</p>
+            <p className="text-sm font-semibold uppercase tracking-[0.28em] text-[#9FB06F]">Main pages</p>
             <div className="mt-5 grid gap-3">
               {navigationItems.map((item) => (
                 <Link key={item.href} href={item.href} className="inline-flex items-center gap-2 text-sm text-white/75 transition hover:text-white">
-                  <BaseIcon path={mdiArrowRight} className="text-[#C8A165]" />
+                  <BaseIcon path={mdiArrowRight} className="text-[#9FB06F]" />
                   {item.label}
                 </Link>
               ))}
@@ -314,11 +314,11 @@ export default function MarketingLayout({ children }: Props) {
           </div>
 
           <div>
-            <p className="text-sm font-semibold uppercase tracking-[0.28em] text-[#C8A165]">Export services</p>
+            <p className="text-sm font-semibold uppercase tracking-[0.28em] text-[#9FB06F]">Export services</p>
             <div className="mt-5 grid gap-3">
               {exportServiceItems.map((item) => (
                 <Link key={item.href} href={item.href} className="inline-flex items-center gap-2 text-sm text-white/75 transition hover:text-white">
-                  <BaseIcon path={mdiArrowRight} className="text-[#C8A165]" />
+                  <BaseIcon path={mdiArrowRight} className="text-[#9FB06F]" />
                   {item.label}
                 </Link>
               ))}
@@ -333,7 +333,7 @@ export default function MarketingLayout({ children }: Props) {
           </div>
 
           <div>
-            <p className="text-sm font-semibold uppercase tracking-[0.28em] text-[#C8A165]">Newsletter subscription</p>
+            <p className="text-sm font-semibold uppercase tracking-[0.28em] text-[#9FB06F]">Newsletter subscription</p>
             <p className="mt-4 text-sm leading-7 text-white/72">
               Receive market-ready updates, sourcing availability, and company news tailored for international buyers.
             </p>
diff --git a/frontend/src/components/marketing/MarketingPageHero.tsx b/frontend/src/components/marketing/MarketingPageHero.tsx
index 56be0eb..313f281 100644
--- a/frontend/src/components/marketing/MarketingPageHero.tsx
+++ b/frontend/src/components/marketing/MarketingPageHero.tsx
@@ -10,15 +10,16 @@ type Props = {
 export default function MarketingPageHero({ eyebrow, title, description, image }: Props) {
   return (
     <section className="px-5 pb-8 pt-12 lg:px-8 lg:pb-12 lg:pt-16">
-      <div className="mx-auto grid max-w-7xl gap-8 overflow-hidden rounded-[2rem] bg-[#F5E9DA] p-6 shadow-[0_28px_90px_rgba(62,39,35,0.08)] lg:grid-cols-[1.05fr_0.95fr] lg:p-10">
+      <div className="mx-auto grid max-w-7xl gap-8 overflow-hidden rounded-[2rem] bg-[#F4F1E6] p-6 shadow-[0_28px_90px_rgba(31,58,45,0.08)] lg:grid-cols-[1.05fr_0.95fr] lg:p-10">
         <div className="flex flex-col justify-center">
-          <p className="text-sm font-semibold uppercase tracking-[0.35em] text-[#C8A165]">{eyebrow}</p>
-          <h1 className="font-brand-display mt-4 text-4xl leading-tight text-[#3E2723] md:text-6xl">{title}</h1>
-          <p className="mt-6 max-w-2xl text-base leading-8 text-[#5B4A43]">{description}</p>
+          <p className="text-sm font-semibold uppercase tracking-[0.35em] text-[#9FB06F]">{eyebrow}</p>
+          <h1 className="font-brand-display mt-4 text-4xl leading-tight text-[#1F3A2D] md:text-6xl">{title}</h1>
+          <p className="mt-6 max-w-2xl text-base leading-8 text-[#556257]">{description}</p>
         </div>
         <div className="relative min-h-[320px] overflow-hidden rounded-[1.75rem]">
-          <img className="absolute inset-0 h-full w-full object-cover" loading="eager" src={image} alt={title} />
-          <div className="absolute inset-0 bg-gradient-to-t from-[#2c1f1b]/50 via-transparent to-transparent" />
+          <img className="absolute inset-0 h-full w-full object-cover saturate-[0.88]" loading="eager" src={image} alt={title} />
+          <div className="absolute inset-0 bg-[linear-gradient(160deg,rgba(16,33,24,0.08),rgba(36,63,48,0.22),rgba(16,33,24,0.42))]" />
+          <div className="absolute inset-0 bg-gradient-to-t from-[#102118]/54 via-transparent to-transparent" />
         </div>
       </div>
     </section>
diff --git a/frontend/src/components/marketing/MarketingSection.tsx b/frontend/src/components/marketing/MarketingSection.tsx
index fea3380..6256f83 100644
--- a/frontend/src/components/marketing/MarketingSection.tsx
+++ b/frontend/src/components/marketing/MarketingSection.tsx
@@ -21,9 +21,9 @@ export default function MarketingSection({
     <section className={`px-5 py-16 lg:px-8 lg:py-24 ${className}`}>
       <div className="mx-auto max-w-7xl">
         <div className={centered ? 'mx-auto max-w-3xl text-center' : 'max-w-3xl'}>
-          {eyebrow ? <p className="text-sm font-semibold uppercase tracking-[0.35em] text-[#C8A165]">{eyebrow}</p> : null}
-          <h2 className="font-brand-display mt-4 text-4xl leading-tight text-[#3E2723] md:text-5xl">{title}</h2>
-          {description ? <p className="mt-5 text-base leading-8 text-[#5B4A43]">{description}</p> : null}
+          {eyebrow ? <p className="text-sm font-semibold uppercase tracking-[0.35em] text-[#9FB06F]">{eyebrow}</p> : null}
+          <h2 className="font-brand-display mt-4 text-4xl leading-tight text-[#1F3A2D] md:text-5xl">{title}</h2>
+          {description ? <p className="mt-5 text-base leading-8 text-[#556257]">{description}</p> : null}
         </div>
         {children ? <div className="mt-12">{children}</div> : null}
       </div>
diff --git a/frontend/src/components/marketing/NewsletterForm.tsx b/frontend/src/components/marketing/NewsletterForm.tsx
index f5a6e2d..3f7072e 100644
--- a/frontend/src/components/marketing/NewsletterForm.tsx
+++ b/frontend/src/components/marketing/NewsletterForm.tsx
@@ -69,14 +69,14 @@ export default function NewsletterForm({ source = 'home_footer', compact = false
       {!compact && (
         <div className="grid gap-3 md:grid-cols-2">
           <input
-            className="h-12 rounded-2xl border border-white/15 bg-white/10 px-4 text-sm text-white placeholder:text-white/55 focus:outline-none focus:ring-2 focus:ring-[#C8A165]"
+            className="h-12 rounded-2xl border border-white/15 bg-white/10 px-4 text-sm text-white placeholder:text-white/55 focus:outline-none focus:ring-2 focus:ring-[#9FB06F]"
             name="full_name"
             placeholder="Name"
             value={form.full_name}
             onChange={onChange}
           />
           <input
-            className="h-12 rounded-2xl border border-white/15 bg-white/10 px-4 text-sm text-white placeholder:text-white/55 focus:outline-none focus:ring-2 focus:ring-[#C8A165]"
+            className="h-12 rounded-2xl border border-white/15 bg-white/10 px-4 text-sm text-white placeholder:text-white/55 focus:outline-none focus:ring-2 focus:ring-[#9FB06F]"
             name="company_name"
             placeholder="Company"
             value={form.company_name}
@@ -86,7 +86,7 @@ export default function NewsletterForm({ source = 'home_footer', compact = false
       )}
       <div className={`grid gap-3 ${compact ? 'md:grid-cols-[minmax(0,1fr)_auto]' : 'md:grid-cols-[minmax(0,1fr)_minmax(0,1fr)]'}`}>
         <input
-          className="h-12 rounded-2xl border border-white/15 bg-white/10 px-4 text-sm text-white placeholder:text-white/55 focus:outline-none focus:ring-2 focus:ring-[#C8A165]"
+          className="h-12 rounded-2xl border border-white/15 bg-white/10 px-4 text-sm text-white placeholder:text-white/55 focus:outline-none focus:ring-2 focus:ring-[#9FB06F]"
           name="email"
           placeholder="Email address"
           type="email"
@@ -99,7 +99,7 @@ export default function NewsletterForm({ source = 'home_footer', compact = false
           </MarketingButton>
         ) : (
           <input
-            className="h-12 rounded-2xl border border-white/15 bg-white/10 px-4 text-sm text-white placeholder:text-white/55 focus:outline-none focus:ring-2 focus:ring-[#C8A165]"
+            className="h-12 rounded-2xl border border-white/15 bg-white/10 px-4 text-sm text-white placeholder:text-white/55 focus:outline-none focus:ring-2 focus:ring-[#9FB06F]"
             name="country"
             placeholder="Country"
             value={form.country}
diff --git a/frontend/src/components/marketing/marketingData.ts b/frontend/src/components/marketing/marketingData.ts
index 79a3da0..3f00d57 100644
--- a/frontend/src/components/marketing/marketingData.ts
+++ b/frontend/src/components/marketing/marketingData.ts
@@ -1,6 +1,6 @@
 export const brand = {
   name: 'Alem Desta Coffee Export',
-  tagline: 'Exported with heritage, tradition, integrity, and pride.',
+  tagline: 'Premium Ethiopian green coffee sourced with heritage, integrity, and export discipline.',
   email: 'info@alemdesta.com',
   phones: ['+251 930105914', '+251 904186868'],
   address: 'Kirkos Sub-city, Wereda 01, Addis Ababa, Ethiopia',
@@ -61,26 +61,26 @@ export const featureHighlights = [
 
 export const galleryItems = [
   {
-    title: 'Highland farms',
-    caption: 'Elevated terroir and patient cultivation shape distinctive cup character.',
+    title: 'Green coffee landscapes',
+    caption: 'Highland farms and careful cultivation create the foundation for exceptional green coffee lots.',
     image:
       'https://images.unsplash.com/photo-1447933601403-0c6688de566e?auto=format&fit=crop&w=1200&q=80',
   },
   {
-    title: 'Processing stations',
-    caption: 'Washed, natural, and honey processes are managed with discipline and care.',
+    title: 'Washing station discipline',
+    caption: 'Lot separation, drying control, and station handling protect specialty green coffee quality before export.',
     image:
       'https://images.unsplash.com/photo-1495474472287-4d71bcdd2085?auto=format&fit=crop&w=1200&q=80',
   },
   {
-    title: 'Cupping sessions',
-    caption: 'Sensory evaluation supports lot selection, consistency, and buyer confidence.',
+    title: 'Lot evaluation',
+    caption: 'Cupping, moisture review, and sample assessment help buyers select green coffee with confidence.',
     image:
       'https://images.unsplash.com/photo-1511920170033-f8396924c348?auto=format&fit=crop&w=1200&q=80',
   },
   {
-    title: 'Export logistics',
-    caption: 'A disciplined export chain moves coffee from Addis Ababa to Djibouti and global markets.',
+    title: 'Export-ready preparation',
+    caption: 'Packaging, documentation, and shipment coordination move export-ready green coffee toward global buyers.',
     image:
       'https://images.unsplash.com/photo-1520607162513-77705c0f0d4a?auto=format&fit=crop&w=1200&q=80',
   },
diff --git a/frontend/src/css/main.css b/frontend/src/css/main.css
index e954850..e48b900 100644
--- a/frontend/src/css/main.css
+++ b/frontend/src/css/main.css
@@ -67,9 +67,9 @@ font-family: 'Ubuntu', sans-serif !important;
 @import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Playfair+Display:wght@600;700;800&display=swap');
 
 :root {
-  --coffee-brown: #3E2723;
-  --coffee-beige: #F5E9DA;
-  --coffee-gold: #C8A165;
+  --coffee-brown: #1F3A2D;
+  --coffee-beige: #F4F1E6;
+  --coffee-gold: #9FB06F;
 }
 
 html {
@@ -88,23 +88,23 @@ html {
   width: 100%;
   height: 3.25rem;
   border-radius: 1rem;
-  border: 1px solid rgba(62, 39, 35, 0.12);
-  background: #fffdf9;
+  border: 1px solid rgba(31, 58, 45, 0.14);
+  background: #F8FAF4;
   padding: 0 1rem;
   font-size: 0.95rem;
-  color: #2c221f;
+  color: #22332B;
   transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
 }
 
 .coffee-input:focus {
   outline: none;
-  border-color: rgba(200, 161, 101, 0.8);
-  box-shadow: 0 0 0 3px rgba(200, 161, 101, 0.16);
+  border-color: rgba(159, 176, 111, 0.82);
+  box-shadow: 0 0 0 3px rgba(159, 176, 111, 0.18);
   background: #ffffff;
 }
 
 .coffee-input::placeholder {
-  color: #9a8578;
+  color: #869488;
 }
 
 @keyframes coffeeFadeIn {
diff --git a/frontend/src/pages/about.tsx b/frontend/src/pages/about.tsx
index 0f8401b..5ff4792 100644
--- a/frontend/src/pages/about.tsx
+++ b/frontend/src/pages/about.tsx
@@ -29,8 +29,8 @@ export default function AboutPage() {
           description="The company story is personal, emotional, and practical — exactly the mix international buyers often trust most when choosing who to work with."
         >
           <div className="grid gap-6 lg:grid-cols-[0.8fr_1.2fr]">
-            <div className="rounded-[2rem] bg-[#3E2723] p-8 text-white shadow-[0_24px_80px_rgba(35,24,18,0.14)]">
-              <p className="text-sm uppercase tracking-[0.32em] text-[#d8bb8a]">What shapes the company</p>
+            <div className="rounded-[2rem] bg-[#1F3A2D] p-8 text-white shadow-[0_24px_80px_rgba(20,38,29,0.14)]">
+              <p className="text-sm uppercase tracking-[0.32em] text-[#B7C78B]">What shapes the company</p>
               <ul className="mt-6 space-y-4 text-sm leading-7 text-white/78">
                 <li>• Ethiopian coffee culture upbringing</li>
                 <li>• Family coffee tradition</li>
@@ -41,8 +41,8 @@ export default function AboutPage() {
             </div>
             <div className="space-y-6">
               {founderStory.map((paragraph) => (
-                <div key={paragraph} className="rounded-[1.75rem] border border-[#3E2723]/8 bg-white p-7 shadow-[0_18px_60px_rgba(35,24,18,0.06)]">
-                  <p className="text-base leading-8 text-[#5B4A43]">{paragraph}</p>
+                <div key={paragraph} className="rounded-[1.75rem] border border-[#1F3A2D]/8 bg-white p-7 shadow-[0_18px_60px_rgba(20,38,29,0.06)]">
+                  <p className="text-base leading-8 text-[#556257]">{paragraph}</p>
                 </div>
               ))}
             </div>
diff --git a/frontend/src/pages/coffee-origins.tsx b/frontend/src/pages/coffee-origins.tsx
index b001793..09338cd 100644
--- a/frontend/src/pages/coffee-origins.tsx
+++ b/frontend/src/pages/coffee-origins.tsx
@@ -30,13 +30,16 @@ export default function CoffeeOriginsPage() {
         >
           <div className="grid gap-6 lg:grid-cols-2 xl:grid-cols-3">
             {origins.map((item) => (
-              <article key={item.name} className="overflow-hidden rounded-[2rem] bg-white shadow-[0_24px_70px_rgba(35,24,18,0.08)]">
-                <img className="h-64 w-full object-cover" loading="lazy" src={item.image} alt={item.name} />
+              <article key={item.name} className="overflow-hidden rounded-[2rem] bg-white shadow-[0_24px_70px_rgba(20,38,29,0.08)]">
+                <div className="relative">
+                  <img className="h-64 w-full object-cover saturate-[0.9]" loading="lazy" src={item.image} alt={item.name} />
+                  <div className="absolute inset-0 bg-[linear-gradient(180deg,rgba(18,38,29,0.05),rgba(18,38,29,0),rgba(18,38,29,0.25))]" />
+                </div>
                 <div className="p-6">
-                  <p className="text-sm uppercase tracking-[0.28em] text-[#C8A165]">{item.altitude}</p>
-                  <h2 className="font-brand-display mt-3 text-3xl text-[#3E2723]">{item.name}</h2>
-                  <p className="mt-4 text-sm leading-7 text-[#5B4A43]">{item.profile}</p>
-                  <div className="mt-5 rounded-2xl bg-[#F5E9DA] px-4 py-3 text-sm text-[#5B4A43]">Rainfall: {item.rainfall}</div>
+                  <p className="text-sm uppercase tracking-[0.28em] text-[#9FB06F]">{item.altitude}</p>
+                  <h2 className="font-brand-display mt-3 text-3xl text-[#1F3A2D]">{item.name}</h2>
+                  <p className="mt-4 text-sm leading-7 text-[#556257]">{item.profile}</p>
+                  <div className="mt-5 rounded-2xl bg-[#F4F1E6] px-4 py-3 text-sm text-[#556257]">Rainfall: {item.rainfall}</div>
                 </div>
               </article>
             ))}
diff --git a/frontend/src/pages/coffee-philosophy.tsx b/frontend/src/pages/coffee-philosophy.tsx
index 4b5bc9e..c196300 100644
--- a/frontend/src/pages/coffee-philosophy.tsx
+++ b/frontend/src/pages/coffee-philosophy.tsx
@@ -35,12 +35,12 @@ export default function CoffeePhilosophyPage() {
         >
           <div className="grid gap-6 md:grid-cols-2 xl:grid-cols-4">
             {philosophyPillars.map((item, index) => (
-              <div key={item.title} className="rounded-[1.75rem] border border-[#3E2723]/8 bg-white p-7 shadow-[0_20px_65px_rgba(35,24,18,0.06)]">
-                <div className="flex h-12 w-12 items-center justify-center rounded-2xl bg-[#F5E9DA] text-[#3E2723]">
+              <div key={item.title} className="rounded-[1.75rem] border border-[#1F3A2D]/8 bg-white p-7 shadow-[0_20px_65px_rgba(20,38,29,0.06)]">
+                <div className="flex h-12 w-12 items-center justify-center rounded-2xl bg-[#F4F1E6] text-[#1F3A2D]">
                   <BaseIcon path={icons[index]} />
                 </div>
-                <h3 className="font-brand-display mt-5 text-2xl text-[#3E2723]">{item.title}</h3>
-                <p className="mt-4 text-sm leading-7 text-[#5B4A43]">{item.description}</p>
+                <h3 className="font-brand-display mt-5 text-2xl text-[#1F3A2D]">{item.title}</h3>
+                <p className="mt-4 text-sm leading-7 text-[#556257]">{item.description}</p>
               </div>
             ))}
           </div>
diff --git a/frontend/src/pages/contact.tsx b/frontend/src/pages/contact.tsx
index 5ae09c5..fe10090 100644
--- a/frontend/src/pages/contact.tsx
+++ b/frontend/src/pages/contact.tsx
@@ -51,36 +51,36 @@ export default function ContactPage() {
           </div>
           <div className="mt-10 grid gap-8 lg:grid-cols-[0.75fr_1.25fr]">
             <div className="space-y-5">
-              <div className="rounded-[1.75rem] border border-[#3E2723]/8 bg-white p-6 shadow-[0_20px_65px_rgba(35,24,18,0.06)]">
+              <div className="rounded-[1.75rem] border border-[#1F3A2D]/8 bg-white p-6 shadow-[0_20px_65px_rgba(20,38,29,0.06)]">
                 <div className="flex items-start gap-4">
-                  <div className="flex h-12 w-12 items-center justify-center rounded-2xl bg-[#F5E9DA] text-[#3E2723]">
+                  <div className="flex h-12 w-12 items-center justify-center rounded-2xl bg-[#F4F1E6] text-[#1F3A2D]">
                     <BaseIcon path={mdiMapMarkerOutline} />
                   </div>
                   <div>
-                    <p className="text-sm font-semibold uppercase tracking-[0.28em] text-[#C8A165]">Location</p>
-                    <p className="mt-3 text-sm leading-7 text-[#5B4A43]">{brand.address}</p>
+                    <p className="text-sm font-semibold uppercase tracking-[0.28em] text-[#9FB06F]">Location</p>
+                    <p className="mt-3 text-sm leading-7 text-[#556257]">{brand.address}</p>
                   </div>
                 </div>
               </div>
-              <div className="rounded-[1.75rem] border border-[#3E2723]/8 bg-white p-6 shadow-[0_20px_65px_rgba(35,24,18,0.06)]">
+              <div className="rounded-[1.75rem] border border-[#1F3A2D]/8 bg-white p-6 shadow-[0_20px_65px_rgba(20,38,29,0.06)]">
                 <div className="flex items-start gap-4">
-                  <div className="flex h-12 w-12 items-center justify-center rounded-2xl bg-[#F5E9DA] text-[#3E2723]">
+                  <div className="flex h-12 w-12 items-center justify-center rounded-2xl bg-[#F4F1E6] text-[#1F3A2D]">
                     <BaseIcon path={mdiEmailOutline} />
                   </div>
                   <div>
-                    <p className="text-sm font-semibold uppercase tracking-[0.28em] text-[#C8A165]">Email</p>
-                    <p className="mt-3 text-sm leading-7 text-[#5B4A43]">{brand.email}</p>
+                    <p className="text-sm font-semibold uppercase tracking-[0.28em] text-[#9FB06F]">Email</p>
+                    <p className="mt-3 text-sm leading-7 text-[#556257]">{brand.email}</p>
                   </div>
                 </div>
               </div>
-              <div className="rounded-[1.75rem] border border-[#3E2723]/8 bg-white p-6 shadow-[0_20px_65px_rgba(35,24,18,0.06)]">
+              <div className="rounded-[1.75rem] border border-[#1F3A2D]/8 bg-white p-6 shadow-[0_20px_65px_rgba(20,38,29,0.06)]">
                 <div className="flex items-start gap-4">
-                  <div className="flex h-12 w-12 items-center justify-center rounded-2xl bg-[#F5E9DA] text-[#3E2723]">
+                  <div className="flex h-12 w-12 items-center justify-center rounded-2xl bg-[#F4F1E6] text-[#1F3A2D]">
                     <BaseIcon path={mdiPhoneOutline} />
                   </div>
                   <div>
-                    <p className="text-sm font-semibold uppercase tracking-[0.28em] text-[#C8A165]">Phone</p>
-                    <div className="mt-3 space-y-1 text-sm leading-7 text-[#5B4A43]">
+                    <p className="text-sm font-semibold uppercase tracking-[0.28em] text-[#9FB06F]">Phone</p>
+                    <div className="mt-3 space-y-1 text-sm leading-7 text-[#556257]">
                       {brand.phones.map((phone) => (
                         <p key={phone}>{phone}</p>
                       ))}
diff --git a/frontend/src/pages/export-services.tsx b/frontend/src/pages/export-services.tsx
index 32a74fc..f2316d1 100644
--- a/frontend/src/pages/export-services.tsx
+++ b/frontend/src/pages/export-services.tsx
@@ -65,13 +65,13 @@ export default function ExportServicesPage() {
             {exportServiceItems.map((item) => (
               <article
                 key={item.href}
-                className="rounded-[2rem] border border-[#3E2723]/8 bg-white p-7 shadow-[0_20px_65px_rgba(35,24,18,0.06)]"
+                className="rounded-[2rem] border border-[#1F3A2D]/8 bg-white p-7 shadow-[0_20px_65px_rgba(20,38,29,0.06)]"
               >
-                <div className="flex h-14 w-14 items-center justify-center rounded-2xl bg-[#F5E9DA] text-[#3E2723]">
+                <div className="flex h-14 w-14 items-center justify-center rounded-2xl bg-[#F4F1E6] text-[#1F3A2D]">
                   <BaseIcon path={iconByHref[item.href as keyof typeof iconByHref]} />
                 </div>
-                <h2 className="font-brand-display mt-6 text-3xl text-[#3E2723]">{item.label}</h2>
-                <p className="mt-4 text-sm leading-7 text-[#5B4A43]">{item.description}</p>
+                <h2 className="font-brand-display mt-6 text-3xl text-[#1F3A2D]">{item.label}</h2>
+                <p className="mt-4 text-sm leading-7 text-[#556257]">{item.description}</p>
                 <div className="mt-6">
                   <MarketingButton href={item.href} variant="ghost">
                     View details
@@ -86,19 +86,19 @@ export default function ExportServicesPage() {
           eyebrow="Buyer workflow"
           title="How the export relationship is structured"
           description="International buyers need more than storytelling. They need a process that feels organized, transparent, and commercially dependable."
-          className="bg-[#fffdf9]"
+          className="bg-[#F8FAF4]"
         >
           <div className="grid gap-6 lg:grid-cols-3">
             {workflowSteps.map((step, index) => (
               <div
                 key={step.title}
-                className="rounded-[1.75rem] border border-[#3E2723]/8 bg-white p-7 shadow-[0_18px_55px_rgba(35,24,18,0.05)]"
+                className="rounded-[1.75rem] border border-[#1F3A2D]/8 bg-white p-7 shadow-[0_18px_55px_rgba(20,38,29,0.05)]"
               >
-                <div className="flex h-11 w-11 items-center justify-center rounded-full bg-[#3E2723] text-sm font-semibold text-[#F5E9DA]">
+                <div className="flex h-11 w-11 items-center justify-center rounded-full bg-[#1F3A2D] text-sm font-semibold text-[#F4F1E6]">
                   {index + 1}
                 </div>
-                <h3 className="font-brand-display mt-6 text-2xl text-[#3E2723]">{step.title}</h3>
-                <p className="mt-4 text-sm leading-7 text-[#5B4A43]">{step.description}</p>
+                <h3 className="font-brand-display mt-6 text-2xl text-[#1F3A2D]">{step.title}</h3>
+                <p className="mt-4 text-sm leading-7 text-[#556257]">{step.description}</p>
               </div>
             ))}
           </div>
diff --git a/frontend/src/pages/index.tsx b/frontend/src/pages/index.tsx
index 50dff6c..a26c431 100644
--- a/frontend/src/pages/index.tsx
+++ b/frontend/src/pages/index.tsx
@@ -61,21 +61,21 @@ export default function HomePage() {
         description="Premium Ethiopian coffee exporter connecting origin, traceability, and global buyer confidence with elegant, professional service."
       />
       <MarketingLayout>
-        <section className="relative -mt-[88px] overflow-hidden bg-[#231815] px-5 pb-16 pt-36 text-white lg:px-8 lg:pb-24 lg:pt-44">
+        <section className="relative -mt-[88px] overflow-hidden bg-[#16271F] px-5 pb-16 pt-36 text-white lg:px-8 lg:pb-24 lg:pt-44">
           <div className="absolute inset-0">
             <img
-              className="h-full w-full object-cover opacity-25"
+              className="h-full w-full scale-[1.02] object-cover opacity-32 saturate-[0.82]"
               loading="eager"
               src="https://images.unsplash.com/photo-1447933601403-0c6688de566e?auto=format&fit=crop&w=1600&q=80"
               alt="Ethiopian coffee farm"
             />
-            <div className="absolute inset-0 bg-[linear-gradient(135deg,rgba(24,15,13,0.88),rgba(62,39,35,0.72),rgba(24,15,13,0.9))]" />
+            <div className="absolute inset-0 bg-[linear-gradient(135deg,rgba(18,38,29,0.88),rgba(31,58,45,0.72),rgba(18,38,29,0.9))]" />
           </div>
 
           <div className="coffee-fade-in relative mx-auto grid max-w-7xl gap-10 lg:grid-cols-[1.05fr_0.95fr] lg:items-end">
             <div>
-              <p className="text-sm font-semibold uppercase tracking-[0.38em] text-[#d8bb8a]">Luxury Ethiopian coffee export</p>
-              <h1 className="font-brand-display mt-6 max-w-4xl text-5xl leading-[1.05] text-[#F5E9DA] md:text-7xl">
+              <p className="text-sm font-semibold uppercase tracking-[0.38em] text-[#B7C78B]">Specialty green coffee export</p>
+              <h1 className="font-brand-display mt-6 max-w-4xl text-5xl leading-[1.05] text-[#F4F1E6] md:text-7xl">
                 Ethiopian Premium Coffee – Sourced with Experience, Exported with Integrity
               </h1>
               <p className="mt-6 max-w-3xl text-lg leading-8 text-white/78">
@@ -83,7 +83,7 @@ export default function HomePage() {
               </p>
               <p className="mt-6 max-w-3xl text-base leading-8 text-white/72">
                 {brand.name} bridges Ethiopian premium coffee producers with global buyers, focusing on traceability,
-                single-origin sourcing, and uncompromising quality.
+                single-origin green coffee sourcing, export-ready preparation, and uncompromising quality.
               </p>
               <div className="mt-10 flex flex-col gap-4 sm:flex-row">
                 <MarketingButton href="/contact?type=request_samples">Request Samples</MarketingButton>
@@ -94,7 +94,7 @@ export default function HomePage() {
             </div>
 
             <div className="rounded-[2rem] border border-white/10 bg-white/10 p-6 backdrop-blur-md shadow-[0_30px_80px_rgba(0,0,0,0.25)] md:p-8">
-              <p className="text-sm font-semibold uppercase tracking-[0.28em] text-[#d8bb8a]">Why buyers trust us</p>
+              <p className="text-sm font-semibold uppercase tracking-[0.28em] text-[#B7C78B]">Why buyers trust us</p>
               <div className="mt-8 space-y-5">
                 {statItems.map((item) => (
                   <div key={item.label} className="border-b border-white/10 pb-5 last:border-b-0 last:pb-0">
@@ -114,12 +114,12 @@ export default function HomePage() {
         >
           <div className="grid gap-6 md:grid-cols-2 xl:grid-cols-4">
             {trustPillars.map((item) => (
-              <div key={item.title} className="rounded-[1.75rem] border border-[#3E2723]/8 bg-white p-6 shadow-[0_20px_65px_rgba(35,24,18,0.06)]">
-                <div className="flex h-12 w-12 items-center justify-center rounded-2xl bg-[#F5E9DA] text-[#3E2723]">
+              <div key={item.title} className="rounded-[1.75rem] border border-[#1F3A2D]/8 bg-white p-6 shadow-[0_20px_65px_rgba(20,38,29,0.06)]">
+                <div className="flex h-12 w-12 items-center justify-center rounded-2xl bg-[#F4F1E6] text-[#1F3A2D]">
                   <BaseIcon path={item.icon} />
                 </div>
-                <h3 className="font-brand-display mt-5 text-2xl text-[#3E2723]">{item.title}</h3>
-                <p className="mt-3 text-sm leading-7 text-[#5B4A43]">{item.description}</p>
+                <h3 className="font-brand-display mt-5 text-2xl text-[#1F3A2D]">{item.title}</h3>
+                <p className="mt-3 text-sm leading-7 text-[#556257]">{item.description}</p>
               </div>
             ))}
           </div>
@@ -130,13 +130,13 @@ export default function HomePage() {
           title="Built around traceability, premium handling, and long-term export partnerships"
           description="Each highlight below mirrors the core buying questions of roasters, green coffee importers, and wholesale partners evaluating a supplier relationship."
           centered
-          className="bg-[#fffdf9]"
+          className="bg-[#F8FAF4]"
         >
           <div className="grid gap-6 lg:grid-cols-2 xl:grid-cols-4">
             {featureHighlights.map((item) => (
-              <div key={item.title} className="rounded-[1.75rem] border border-[#3E2723]/8 bg-white p-7 shadow-[0_20px_70px_rgba(35,24,18,0.07)]">
-                <h3 className="font-brand-display text-2xl text-[#3E2723]">{item.title}</h3>
-                <p className="mt-4 text-sm leading-7 text-[#5B4A43]">{item.description}</p>
+              <div key={item.title} className="rounded-[1.75rem] border border-[#1F3A2D]/8 bg-white p-7 shadow-[0_20px_70px_rgba(20,38,29,0.07)]">
+                <h3 className="font-brand-display text-2xl text-[#1F3A2D]">{item.title}</h3>
+                <p className="mt-4 text-sm leading-7 text-[#556257]">{item.description}</p>
               </div>
             ))}
           </div>
@@ -149,18 +149,19 @@ export default function HomePage() {
         >
           <div className="grid gap-6 md:grid-cols-2">
             {galleryItems.map((item) => (
-              <article key={item.title} className="group overflow-hidden rounded-[2rem] bg-white shadow-[0_24px_70px_rgba(35,24,18,0.08)]">
+              <article key={item.title} className="group overflow-hidden rounded-[2rem] bg-white shadow-[0_24px_70px_rgba(20,38,29,0.08)]">
                 <div className="relative h-72 overflow-hidden">
                   <img
-                    className="h-full w-full object-cover transition duration-700 group-hover:scale-105"
+                    className="h-full w-full object-cover saturate-[0.88] transition duration-700 group-hover:scale-105"
                     loading="lazy"
                     src={item.image}
                     alt={item.title}
                   />
+                  <div className="absolute inset-0 bg-[linear-gradient(180deg,rgba(18,38,29,0.08),rgba(18,38,29,0),rgba(18,38,29,0.28))]" />
                 </div>
                 <div className="p-6">
-                  <h3 className="font-brand-display text-2xl text-[#3E2723]">{item.title}</h3>
-                  <p className="mt-3 text-sm leading-7 text-[#5B4A43]">{item.caption}</p>
+                  <h3 className="font-brand-display text-2xl text-[#1F3A2D]">{item.title}</h3>
+                  <p className="mt-3 text-sm leading-7 text-[#556257]">{item.caption}</p>
                 </div>
               </article>
             ))}
@@ -171,16 +172,19 @@ export default function HomePage() {
           eyebrow="Origin snapshots"
           title="Distinctive Ethiopian regions, each with its own flavor narrative"
           description="A quick regional preview gives buyers a sense of sourcing depth before they request samples or a tailored quote."
-          className="bg-[#F5E9DA]/45"
+          className="bg-[#F4F1E6]/45"
         >
           <div className="grid gap-6 lg:grid-cols-3">
             {origins.slice(0, 3).map((item) => (
-              <div key={item.name} className="overflow-hidden rounded-[2rem] bg-white shadow-[0_24px_70px_rgba(35,24,18,0.08)]">
-                <img className="h-56 w-full object-cover" loading="lazy" src={item.image} alt={item.name} />
+              <div key={item.name} className="overflow-hidden rounded-[2rem] bg-white shadow-[0_24px_70px_rgba(20,38,29,0.08)]">
+                <div className="relative">
+                  <img className="h-56 w-full object-cover saturate-[0.9]" loading="lazy" src={item.image} alt={item.name} />
+                  <div className="absolute inset-0 bg-[linear-gradient(180deg,rgba(18,38,29,0.05),rgba(18,38,29,0),rgba(18,38,29,0.24))]" />
+                </div>
                 <div className="p-6">
-                  <p className="text-sm uppercase tracking-[0.28em] text-[#C8A165]">{item.altitude}</p>
-                  <h3 className="font-brand-display mt-3 text-2xl text-[#3E2723]">{item.name}</h3>
-                  <p className="mt-3 text-sm leading-7 text-[#5B4A43]">{item.profile}</p>
+                  <p className="text-sm uppercase tracking-[0.28em] text-[#9FB06F]">{item.altitude}</p>
+                  <h3 className="font-brand-display mt-3 text-2xl text-[#1F3A2D]">{item.name}</h3>
+                  <p className="mt-3 text-sm leading-7 text-[#556257]">{item.profile}</p>
                 </div>
               </div>
             ))}
@@ -199,11 +203,11 @@ export default function HomePage() {
         >
           <div className="grid gap-4 md:grid-cols-2">
             {exportServices.slice(0, 4).map((item) => (
-              <div key={item} className="flex gap-4 rounded-[1.5rem] border border-[#3E2723]/8 bg-white p-5 shadow-[0_18px_60px_rgba(35,24,18,0.06)]">
-                <div className="mt-1 text-[#C8A165]">
+              <div key={item} className="flex gap-4 rounded-[1.5rem] border border-[#1F3A2D]/8 bg-white p-5 shadow-[0_18px_60px_rgba(20,38,29,0.06)]">
+                <div className="mt-1 text-[#9FB06F]">
                   <BaseIcon path={mdiEarth} />
                 </div>
-                <p className="text-sm leading-7 text-[#5B4A43]">{item}</p>
+                <p className="text-sm leading-7 text-[#556257]">{item}</p>
               </div>
             ))}
           </div>
@@ -214,13 +218,13 @@ export default function HomePage() {
           title="Commercial credibility, with room to grow into buyer proof"
           description="These premium placeholders establish the intended testimonial zone so future buyer feedback can be added without redesigning the site."
           centered
-          className="bg-[#fffdf9]"
+          className="bg-[#F8FAF4]"
         >
           <div className="grid gap-6 lg:grid-cols-2">
             {testimonials.map((item) => (
-              <blockquote key={item.author} className="rounded-[1.75rem] border border-[#3E2723]/8 bg-white p-7 shadow-[0_18px_60px_rgba(35,24,18,0.06)]">
-                <p className="font-brand-display text-2xl leading-10 text-[#3E2723]">“{item.quote}”</p>
-                <footer className="mt-6 text-sm font-medium uppercase tracking-[0.24em] text-[#8a6f59]">{item.author}</footer>
+              <blockquote key={item.author} className="rounded-[1.75rem] border border-[#1F3A2D]/8 bg-white p-7 shadow-[0_18px_60px_rgba(20,38,29,0.06)]">
+                <p className="font-brand-display text-2xl leading-10 text-[#1F3A2D]">“{item.quote}”</p>
+                <footer className="mt-6 text-sm font-medium uppercase tracking-[0.24em] text-[#72816F]">{item.author}</footer>
               </blockquote>
             ))}
           </div>
@@ -230,11 +234,11 @@ export default function HomePage() {
           eyebrow="Stay informed"
           title="Subscribe for sourcing updates"
           description="Newsletter sign-up is already connected to the admin subscriber list, giving your team a real conversion path from day one."
-          className="bg-[#3E2723] text-white"
+          className="bg-[#1F3A2D] text-white"
         >
           <div className="grid gap-10 lg:grid-cols-[1fr_0.9fr] lg:items-center">
             <div>
-              <h3 className="font-brand-display text-4xl text-[#F5E9DA]">Receive buyer-focused coffee updates</h3>
+              <h3 className="font-brand-display text-4xl text-[#F4F1E6]">Receive buyer-focused green coffee updates</h3>
               <p className="mt-5 max-w-2xl text-base leading-8 text-white/72">
                 Join the list for availability updates, new origin highlights, and company announcements shaped for professional buyers.
               </p>
diff --git a/frontend/src/pages/logistics-export.tsx b/frontend/src/pages/logistics-export.tsx
index 4e625da..8baa652 100644
--- a/frontend/src/pages/logistics-export.tsx
+++ b/frontend/src/pages/logistics-export.tsx
@@ -67,13 +67,13 @@ export default function LogisticsExportPage() {
             {logisticsPillars.map((item) => (
               <div
                 key={item.title}
-                className="rounded-[1.75rem] border border-[#3E2723]/8 bg-white p-6 shadow-[0_20px_65px_rgba(35,24,18,0.06)]"
+                className="rounded-[1.75rem] border border-[#1F3A2D]/8 bg-white p-6 shadow-[0_20px_65px_rgba(20,38,29,0.06)]"
               >
-                <div className="flex h-12 w-12 items-center justify-center rounded-2xl bg-[#F5E9DA] text-[#3E2723]">
+                <div className="flex h-12 w-12 items-center justify-center rounded-2xl bg-[#F4F1E6] text-[#1F3A2D]">
                   <BaseIcon path={item.icon} />
                 </div>
-                <h2 className="font-brand-display mt-5 text-2xl text-[#3E2723]">{item.title}</h2>
-                <p className="mt-4 text-sm leading-7 text-[#5B4A43]">{item.description}</p>
+                <h2 className="font-brand-display mt-5 text-2xl text-[#1F3A2D]">{item.title}</h2>
+                <p className="mt-4 text-sm leading-7 text-[#556257]">{item.description}</p>
               </div>
             ))}
           </div>
@@ -83,18 +83,18 @@ export default function LogisticsExportPage() {
           eyebrow="Export flow"
           title="A simple view of how the shipment process is organized"
           description="The sequence below reinforces a premium message: disciplined coffee handling, timely coordination, and dependable communication."
-          className="bg-[#fffdf9]"
+          className="bg-[#F8FAF4]"
         >
           <div className="grid gap-4 lg:grid-cols-2">
             {timeline.map((step, index) => (
               <div
                 key={step}
-                className="flex items-center gap-4 rounded-[1.5rem] border border-[#3E2723]/8 bg-white px-5 py-4 shadow-[0_18px_55px_rgba(35,24,18,0.05)]"
+                className="flex items-center gap-4 rounded-[1.5rem] border border-[#1F3A2D]/8 bg-white px-5 py-4 shadow-[0_18px_55px_rgba(20,38,29,0.05)]"
               >
-                <div className="flex h-10 w-10 items-center justify-center rounded-full bg-[#3E2723] text-sm font-semibold text-[#F5E9DA]">
+                <div className="flex h-10 w-10 items-center justify-center rounded-full bg-[#1F3A2D] text-sm font-semibold text-[#F4F1E6]">
                   {index + 1}
                 </div>
-                <p className="text-sm leading-7 text-[#5B4A43]">{step}</p>
+                <p className="text-sm leading-7 text-[#556257]">{step}</p>
               </div>
             ))}
           </div>
diff --git a/frontend/src/pages/quality-control.tsx b/frontend/src/pages/quality-control.tsx
index 83af8ea..fdb4a48 100644
--- a/frontend/src/pages/quality-control.tsx
+++ b/frontend/src/pages/quality-control.tsx
@@ -34,16 +34,16 @@ export default function QualityControlPage() {
         >
           <div className="grid gap-6 lg:grid-cols-3">
             {qualityProcesses.map((item, index) => (
-              <div key={item.title} className="rounded-[1.85rem] border border-[#3E2723]/8 bg-white p-7 shadow-[0_24px_70px_rgba(35,24,18,0.06)]">
-                <div className="flex h-12 w-12 items-center justify-center rounded-2xl bg-[#F5E9DA] text-[#3E2723]">
+              <div key={item.title} className="rounded-[1.85rem] border border-[#1F3A2D]/8 bg-white p-7 shadow-[0_24px_70px_rgba(20,38,29,0.06)]">
+                <div className="flex h-12 w-12 items-center justify-center rounded-2xl bg-[#F4F1E6] text-[#1F3A2D]">
                   <BaseIcon path={processIcons[index]} />
                 </div>
-                <h3 className="font-brand-display mt-5 text-3xl text-[#3E2723]">{item.title}</h3>
-                <p className="mt-4 text-sm leading-7 text-[#5B4A43]">{item.highlight}</p>
+                <h3 className="font-brand-display mt-5 text-3xl text-[#1F3A2D]">{item.title}</h3>
+                <p className="mt-4 text-sm leading-7 text-[#556257]">{item.highlight}</p>
                 <div className="mt-6 space-y-3">
                   {item.steps.map((step, stepIndex) => (
-                    <div key={step} className="flex items-center gap-3 rounded-2xl bg-[#F8F1E7] px-4 py-3 text-sm text-[#4f403a]">
-                      <span className="flex h-8 w-8 items-center justify-center rounded-full bg-[#3E2723] text-xs font-semibold text-[#F5E9DA]">
+                    <div key={step} className="flex items-center gap-3 rounded-2xl bg-[#EEF3E7] px-4 py-3 text-sm text-[#4F5E53]">
+                      <span className="flex h-8 w-8 items-center justify-center rounded-full bg-[#1F3A2D] text-xs font-semibold text-[#F4F1E6]">
                         {stepIndex + 1}
                       </span>
                       {step}
@@ -59,11 +59,11 @@ export default function QualityControlPage() {
           eyebrow="Quality system"
           title="Measured, tasted, and reviewed before export"
           description="Moisture control and cupping evaluation help translate process discipline into export confidence."
-          className="bg-[#fffdf9]"
+          className="bg-[#F8FAF4]"
         >
           <div className="grid gap-4 md:grid-cols-2 xl:grid-cols-3">
             {qualityMetrics.map((item) => (
-              <div key={item} className="rounded-[1.5rem] border border-[#3E2723]/8 bg-white px-5 py-4 text-sm leading-7 text-[#5B4A43] shadow-[0_18px_55px_rgba(35,24,18,0.05)]">
+              <div key={item} className="rounded-[1.5rem] border border-[#1F3A2D]/8 bg-white px-5 py-4 text-sm leading-7 text-[#556257] shadow-[0_18px_55px_rgba(20,38,29,0.05)]">
                 {item}
               </div>
             ))}
diff --git a/frontend/src/pages/sustainability.tsx b/frontend/src/pages/sustainability.tsx
index 9bbfc06..907e9cf 100644
--- a/frontend/src/pages/sustainability.tsx
+++ b/frontend/src/pages/sustainability.tsx
@@ -31,7 +31,7 @@ export default function SustainabilityPage() {
         >
           <div className="grid gap-6 md:grid-cols-2">
             {sustainabilityPoints.map((item) => (
-              <div key={item} className="rounded-[1.75rem] border border-[#3E2723]/8 bg-white p-7 text-sm leading-7 text-[#5B4A43] shadow-[0_20px_65px_rgba(35,24,18,0.06)]">
+              <div key={item} className="rounded-[1.75rem] border border-[#1F3A2D]/8 bg-white p-7 text-sm leading-7 text-[#556257] shadow-[0_20px_65px_rgba(20,38,29,0.06)]">
                 {item}
               </div>
             ))}
diff --git a/frontend/src/pages/vision-mission-values.tsx b/frontend/src/pages/vision-mission-values.tsx
index 89b28df..0f47993 100644
--- a/frontend/src/pages/vision-mission-values.tsx
+++ b/frontend/src/pages/vision-mission-values.tsx
@@ -34,16 +34,16 @@ export default function VisionMissionValuesPage() {
           eyebrow="Core values"
           title="The values that guide how we source, communicate, and deliver"
           centered
-          className="bg-[#fffdf9]"
+          className="bg-[#F8FAF4]"
         >
           <div className="grid gap-6 md:grid-cols-2 xl:grid-cols-3">
             {values.map((item, index) => (
-              <div key={item.title} className="rounded-[1.75rem] border border-[#3E2723]/8 bg-white p-7 shadow-[0_20px_65px_rgba(35,24,18,0.06)]">
-                <div className="flex h-12 w-12 items-center justify-center rounded-2xl bg-[#F5E9DA] text-[#3E2723]">
+              <div key={item.title} className="rounded-[1.75rem] border border-[#1F3A2D]/8 bg-white p-7 shadow-[0_20px_65px_rgba(20,38,29,0.06)]">
+                <div className="flex h-12 w-12 items-center justify-center rounded-2xl bg-[#F4F1E6] text-[#1F3A2D]">
                   <BaseIcon path={icons[index]} />
                 </div>
-                <h3 className="font-brand-display mt-5 text-2xl text-[#3E2723]">{item.title}</h3>
-                <p className="mt-4 text-sm leading-7 text-[#5B4A43]">{item.description}</p>
+                <h3 className="font-brand-display mt-5 text-2xl text-[#1F3A2D]">{item.title}</h3>
+                <p className="mt-4 text-sm leading-7 text-[#556257]">{item.description}</p>
               </div>
             ))}
           </div>
@@ -56,7 +56,7 @@ export default function VisionMissionValuesPage() {
         >
           <div className="grid gap-4 md:grid-cols-2">
             {principles.map((item) => (
-              <div key={item} className="rounded-[1.5rem] border border-[#3E2723]/8 bg-white px-5 py-4 text-sm font-medium text-[#3E2723] shadow-[0_18px_60px_rgba(35,24,18,0.05)]">
+              <div key={item} className="rounded-[1.5rem] border border-[#1F3A2D]/8 bg-white px-5 py-4 text-sm font-medium text-[#1F3A2D] shadow-[0_18px_60px_rgba(20,38,29,0.05)]">
                 {item}
               </div>
             ))}