Change colors.

.claude/settings.local.json

@@ -0,0 +1,9 @@
+{
+  "permissions": {
+    "allow": [
+      "Bash(npm install *)",
+      "Bash(npm run *)",
+      "Bash(awk '{print $NF}')"
+    ]
+  }
+}

about.html

@@ -286,7 +286,7 @@
         </p>
         <a
           href="index.html#tools-header"
-          class="inline-block px-8 py-3 rounded-full bg-gradient-to-b from-indigo-500 to-indigo-600 text-white font-semibold focus:ring-2 focus:ring-offset-2 focus:ring-offset-gray-900 focus:ring-indigo-400 hover:shadow-xl hover:shadow-indigo-500/30 transition-all duration-200 transform hover:-translate-y-1"
+          class="btn-cta-red inline-block px-8 py-3 rounded-full text-white font-semibold transition-all duration-200 transform hover:-translate-y-1"
           data-i18n="about.cta.button"
         >
           Explore All Tools

deploy/config.json

@@ -0,0 +1,9 @@
+{
+  "disabledTools": [
+    "digital-sign-pdf",
+    "timestamp-pdf"
+  ],
+  "editorDisabledCategories": [
+    "redaction"
+  ]
+}

index.html

@@ -102,44 +102,6 @@
     {{> navbar }}
 
     <!-- Donation Ribbon -->
-    <div
-      id="donation-ribbon"
-      class="bg-gradient-to-r from-indigo-600 via-purple-600 to-pink-500 py-2 px-4 text-center hide-section"
-    >
-      <div
-        class="container mx-auto flex items-center justify-center gap-3 flex-wrap"
-      >
-        <span class="text-white text-sm font-medium flex items-center gap-2">
-          <span data-i18n="donation.message"
-            >Love BentoPDF? Help us keep it free and open source!</span
-          >
-        </span>
-        <a
-          href="https://ko-fi.com/alio01"
-          target="_blank"
-          rel="noopener noreferrer"
-          class="inline-flex items-center gap-1.5 px-3 py-1 bg-white text-purple-700 rounded-full text-xs font-semibold hover:bg-gray-100 transition-colors shadow-sm"
-        >
-          <i data-lucide="heart" class="w-3.5 h-3.5 text-purple-700"></i>
-          <span data-i18n="donation.button">Donate</span>
-        </a>
-        <a
-          href="https://github.com/sponsors/alam00000"
-          target="_blank"
-          rel="noopener noreferrer"
-          class="inline-flex items-center gap-1.5 px-3 py-1 bg-gray-900 text-white rounded-full text-xs font-semibold hover:bg-gray-800 transition-colors shadow-sm border border-gray-700"
-        >
-          <svg class="w-3.5 h-3.5" fill="currentColor" viewBox="0 0 24 24">
-            <path
-              fill-rule="evenodd"
-              d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-              clip-rule="evenodd"
-            />
-          </svg>
-          <span>Sponsor</span>
-        </a>
-      </div>
-    </div>
 
     <div id="app" class="min-h-screen container mx-auto p-4 md:p-8">
       <section id="hero-section" class="text-center py-20 relative">
@@ -188,10 +150,10 @@
         <div class="flex flex-col items-center gap-4">
           <a
             href="#tools-header"
-            class="inline-flex items-center gap-3 pl-8 pr-2 py-2 rounded-full bg-gradient-to-b from-indigo-500 to-indigo-600 text-white font-semibold focus:ring-2 focus:ring-offset-2 focus:ring-offset-gray-900 focus:ring-indigo-400 hover:shadow-xl hover:shadow-indigo-500/30 transition-all duration-200 transform hover:-translate-y-1"
+            class="btn-cta-red inline-flex items-center gap-3 pl-8 pr-2 py-2 rounded-full text-white font-semibold transition-all duration-200 transform hover:-translate-y-1"
           >
             <span data-i18n="hero.startUsing">Start Using Now</span>
-            <span class="bg-white text-indigo-600 rounded-full p-2">
+            <span class="bg-white rounded-full p-2" style="color: #bb2d0c">
               <svg
                 xmlns="http://www.w3.org/2000/svg"
                 width="16"
@@ -1298,7 +1260,7 @@
 
       <div class="section-divider hide-section"></div>
 
-      <section id="testimonials-section" class="py-20 hide-section">
+      <!--<section id="testimonials-section" class="py-20 hide-section">
         <h2 class="text-3xl md:text-4xl font-bold text-center text-white mb-12">
           <span data-i18n="testimonials.title">What Our</span>
           <span class="marker-slanted" data-i18n="testimonials.users"
@@ -1401,7 +1363,7 @@
             </p>
           </div>
         </div>
-      </section>
+      </section>-->
 
       <div id="signature-ghost" class="hidden"></div>
 

public/locales/en/common.json

@@ -223,7 +223,7 @@
   "footer": {
     "copyright": "© 2026 BentoPDF. All rights reserved.",
     "version": "Version",
-    "company": "Company",
+    "company": "Company (BentoPDF)",
     "aboutUs": "About Us",
     "faqLink": "FAQ",
     "contactUs": "Contact Us",

public/locales/fr/common.json

@@ -214,7 +214,7 @@
   "footer": {
     "copyright": "© 2026 BentoPDF. Tous droits réservés.",
     "version": "Version",
-    "company": "Entreprise",
+    "company": "Entreprise (BentoPDF)",
     "aboutUs": "À propos",
     "faqLink": "FAQ",
     "contactUs": "Nous contacter",

src/css/markdown-editor.css

@@ -45,23 +45,23 @@
 }
 
 .md-editor-btn-secondary {
-  color: rgb(156, 163, 175);
+  color: rgb(157, 191, 175);
-  background: rgb(31, 41, 55);
+  background: rgb(0, 62, 28);
-  border: 1px solid rgb(55, 65, 81);
+  border: 1px solid rgb(2, 78, 37);
 }
 
 .md-editor-btn-secondary:hover {
-  background: rgb(55, 65, 81);
+  background: rgb(2, 78, 37);
   color: white;
 }
 
 .md-editor-btn-primary {
   color: white;
-  background: rgb(79, 70, 229);
+  background: rgb(117, 187, 153);
 }
 
 .md-editor-btn-primary:hover {
-  background: rgb(99, 102, 241);
+  background: rgb(117, 187, 153);
 }
 
 .md-editor-btn:disabled {
@@ -75,18 +75,18 @@
   align-items: center;
   gap: 0.5rem;
   padding: 0.375rem 0.75rem;
-  background: rgb(31, 41, 55);
+  background: rgb(0, 62, 28);
-  border: 1px solid rgb(55, 65, 81);
+  border: 1px solid rgb(2, 78, 37);
   border-radius: 0.375rem;
   font-size: 0.875rem;
-  color: rgb(156, 163, 175);
+  color: rgb(157, 191, 175);
 }
 
 .theme-toggle-slider {
   position: relative;
   width: 40px;
   height: 20px;
-  background: rgb(55, 65, 81);
+  background: rgb(2, 78, 37);
   border-radius: 10px;
   cursor: pointer;
   transition: background 0.2s;
@@ -105,7 +105,7 @@
 }
 
 .theme-toggle-slider.active {
-  background: rgb(79, 70, 229);
+  background: rgb(117, 187, 153);
 }
 
 .theme-toggle-slider.active::before {
@@ -118,7 +118,7 @@
   grid-template-columns: 1fr 1fr;
   gap: 1rem;
   height: 600px;
-  border: 1px solid rgb(55, 65, 81);
+  border: 1px solid rgb(2, 78, 37);
   border-radius: 0.5rem;
   overflow: hidden;
 }
@@ -127,22 +127,22 @@
   display: flex;
   flex-direction: column;
   min-height: 0;
-  background: rgb(31, 41, 55);
+  background: rgb(0, 62, 28);
 }
 
 .md-editor-pane-header {
   padding: 0.75rem 1rem;
   font-size: 0.875rem;
   font-weight: 600;
-  color: rgb(156, 163, 175);
+  color: rgb(157, 191, 175);
-  background: rgb(17, 24, 39);
+  background: rgb(1, 17, 9);
-  border-bottom: 1px solid rgb(55, 65, 81);
+  border-bottom: 1px solid rgb(2, 78, 37);
   flex-shrink: 0;
 }
 
 /* Separator between panes */
 .md-editor-pane:first-child {
-  border-right: 2px solid rgb(55, 65, 81);
+  border-right: 2px solid rgb(2, 78, 37);
 }
 
 .md-editor.light-mode .md-editor-pane:first-child {
@@ -158,7 +158,7 @@
   font-size: 0.875rem;
   line-height: 1.6;
   color: rgb(229, 231, 235);
-  background: rgb(31, 41, 55);
+  background: rgb(0, 62, 28);
   border: none;
   outline: none;
   resize: none;
@@ -181,19 +181,19 @@
 
 .md-editor.light-mode .md-editor-textarea {
   background: white;
-  color: rgb(17, 24, 39);
+  color: rgb(1, 17, 9);
 }
 
 .md-editor.light-mode .md-editor-preview {
   background: white;
-  color: rgb(17, 24, 39);
+  color: rgb(1, 17, 9);
 }
 
 .md-editor-preview {
   flex: 1;
   padding: 1.5rem;
   overflow-y: auto;
-  background: rgb(31, 41, 55);
+  background: rgb(0, 62, 28);
   color: rgb(229, 231, 235);
 }
 
@@ -218,13 +218,13 @@
 
 .md-editor-preview h1 {
   font-size: 2em;
-  border-bottom: 1px solid rgb(55, 65, 81);
+  border-bottom: 1px solid rgb(2, 78, 37);
   padding-bottom: 0.3em;
 }
 
 .md-editor-preview h2 {
   font-size: 1.5em;
-  border-bottom: 1px solid rgb(55, 65, 81);
+  border-bottom: 1px solid rgb(2, 78, 37);
   padding-bottom: 0.3em;
 }
 
@@ -249,20 +249,20 @@
 .md-editor-preview code {
   font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace;
   font-size: 0.9em;
-  background: rgb(17, 24, 39);
+  background: rgb(1, 17, 9);
   color: rgb(251, 191, 36);
   padding: 0.2em 0.4em;
   border-radius: 3px;
 }
 
 .md-editor-preview pre {
-  background: rgb(17, 24, 39);
+  background: rgb(1, 17, 9);
   padding: 1rem;
   overflow: auto;
   border-radius: 0.5rem;
   line-height: 1.45;
   margin: 1em 0;
-  border: 1px solid rgb(55, 65, 81);
+  border: 1px solid rgb(2, 78, 37);
 }
 
 .md-editor-preview pre code {
@@ -274,8 +274,8 @@
 .md-editor-preview blockquote {
   margin: 1em 0;
   padding: 0 1em;
-  color: rgb(156, 163, 175);
+  color: rgb(157, 191, 175);
-  border-left: 4px solid rgb(79, 70, 229);
+  border-left: 4px solid rgb(117, 187, 153);
 }
 
 .md-editor-preview ul,
@@ -296,24 +296,24 @@
 
 .md-editor-preview th,
 .md-editor-preview td {
-  border: 1px solid rgb(55, 65, 81);
+  border: 1px solid rgb(2, 78, 37);
   padding: 8px 12px;
   text-align: left;
 }
 
 .md-editor-preview th {
-  background: rgb(17, 24, 39);
+  background: rgb(1, 17, 9);
   font-weight: 600;
   color: white;
 }
 
 .md-editor-preview tr:nth-child(even) {
-  background: rgb(17, 24, 39);
+  background: rgb(1, 17, 9);
 }
 
 .md-editor-preview hr {
   border: none;
-  border-top: 1px solid rgb(55, 65, 81);
+  border-top: 1px solid rgb(2, 78, 37);
   margin: 2em 0;
 }
 
@@ -330,7 +330,7 @@
 .md-editor.light-mode .md-editor-preview h4,
 .md-editor.light-mode .md-editor-preview h5,
 .md-editor.light-mode .md-editor-preview h6 {
-  color: rgb(17, 24, 39);
+  color: rgb(1, 17, 9);
 }
 
 .md-editor.light-mode .md-editor-preview h1,
@@ -353,12 +353,12 @@
 }
 
 .md-editor.light-mode .md-editor-preview pre code {
-  color: rgb(17, 24, 39);
+  color: rgb(1, 17, 9);
 }
 
 .md-editor.light-mode .md-editor-preview blockquote {
   color: rgb(75, 85, 99);
-  border-left-color: rgb(99, 102, 241);
+  border-left-color: rgb(117, 187, 153);
 }
 
 .md-editor.light-mode .md-editor-preview th,
@@ -368,7 +368,7 @@
 
 .md-editor.light-mode .md-editor-preview th {
   background: rgb(249, 250, 251);
-  color: rgb(17, 24, 39);
+  color: rgb(1, 17, 9);
 }
 
 .md-editor.light-mode .md-editor-preview tr:nth-child(even) {
@@ -382,7 +382,7 @@
 /* Markdown Plugin Styles */
 .md-editor-preview mark {
   background-color: rgb(254, 243, 199);
-  color: rgb(17, 24, 39);
+  color: rgb(1, 17, 9);
   padding: 0.1em 0.2em;
   border-radius: 2px;
 }
@@ -390,7 +390,7 @@
 .md-editor-preview ins {
   text-decoration: none;
   background-color: rgb(134, 239, 172);
-  color: rgb(17, 24, 39);
+  color: rgb(1, 17, 9);
   padding: 0.1em 0.2em;
   border-radius: 2px;
 }
@@ -403,7 +403,7 @@
 .md-editor-preview .footnotes {
   margin-top: 2em;
   padding-top: 1em;
-  border-top: 1px solid rgb(55, 65, 81);
+  border-top: 1px solid rgb(2, 78, 37);
   font-size: 0.9em;
 }
 
@@ -412,11 +412,11 @@
 }
 
 .md-editor-preview .table-of-contents {
-  background: rgb(17, 24, 39);
+  background: rgb(1, 17, 9);
   padding: 1em 1.5em;
   border-radius: 0.5rem;
   margin: 1em 0;
-  border: 1px solid rgb(55, 65, 81);
+  border: 1px solid rgb(2, 78, 37);
 }
 
 .md-editor.light-mode .md-editor-preview .table-of-contents {
@@ -430,9 +430,9 @@
   justify-content: center;
   margin: 1.5em 0;
   padding: 1em;
-  background: rgb(17, 24, 39);
+  background: rgb(1, 17, 9);
   border-radius: 0.5rem;
-  border: 1px solid rgb(55, 65, 81);
+  border: 1px solid rgb(2, 78, 37);
 }
 
 .md-editor-preview .mermaid-diagram svg {
@@ -473,14 +473,14 @@
 }
 
 .md-editor-modal {
-  background: rgb(31, 41, 55);
+  background: rgb(0, 62, 28);
   border-radius: 0.75rem;
   padding: 1.5rem;
   max-width: 600px;
   width: 90%;
   max-height: 80vh;
   overflow-y: auto;
-  border: 1px solid rgb(55, 65, 81);
+  border: 1px solid rgb(2, 78, 37);
   box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.5);
 }
 
@@ -499,7 +499,7 @@
 
 .md-editor-modal-close {
   padding: 0.5rem;
-  color: rgb(156, 163, 175);
+  color: rgb(157, 191, 175);
   background: transparent;
   border: none;
   cursor: pointer;
@@ -508,7 +508,7 @@
 }
 
 .md-editor-modal-close:hover {
-  background: rgb(55, 65, 81);
+  background: rgb(2, 78, 37);
   color: white;
 }
 
@@ -529,7 +529,7 @@
   gap: 0.5rem;
   padding: 0.375rem 0;
   font-size: 0.875rem;
-  color: rgb(156, 163, 175);
+  color: rgb(157, 191, 175);
   cursor: pointer;
 }
 
@@ -541,8 +541,8 @@
   padding: 0.5rem 0.75rem;
   font-size: 0.875rem;
   color: white;
-  background: rgb(17, 24, 39);
+  background: rgb(1, 17, 9);
-  border: 1px solid rgb(55, 65, 81);
+  border: 1px solid rgb(2, 78, 37);
   border-radius: 0.375rem;
   cursor: pointer;
   width: 100%;
@@ -554,12 +554,11 @@
 
 .md-editor-settings-group select:focus {
   outline: none;
-  border-color: rgb(79, 70, 229);
+  border-color: rgb(117, 187, 153);
 }
 
 /* Print Styles */
 @media print {
-
   /* Reset all backgrounds, margins, and padding */
   html,
   body {
@@ -584,10 +583,10 @@
   nav,
   footer,
   #back-to-tools,
-  .bg-gray-800>h1.text-2xl,
+  .bg-gray-800 > h1.text-2xl,
-  .bg-gray-800>p.text-gray-400,
+  .bg-gray-800 > p.text-gray-400,
-  #markdown-editor-container~h1,
+  #markdown-editor-container ~ h1,
-  #markdown-editor-container~p {
+  #markdown-editor-container ~ p {
     display: none !important;
   }
 
@@ -600,7 +599,7 @@
   .py-8,
   .px-4,
   #markdown-editor-container,
-  [class*="container"] {
+  [class*='container'] {
     padding: 0 !important;
     margin: 0 !important;
     background: white !important;
@@ -658,8 +657,8 @@
     page-break-after: avoid;
   }
 
-  .md-editor-preview>h1:first-child,
+  .md-editor-preview > h1:first-child,
-  .md-editor-preview>*:first-child {
+  .md-editor-preview > *:first-child {
     margin-top: 0 !important;
   }
 
@@ -769,7 +768,7 @@
 
   .md-editor-pane:first-child {
     border-right: none;
-    border-bottom: 2px solid rgb(55, 65, 81);
+    border-bottom: 2px solid rgb(2, 78, 37);
   }
 
   .md-editor.light-mode .md-editor-pane:first-child {
@@ -814,4 +813,4 @@
   .md-editor-actions {
     gap: 0.375rem;
   }
-}
+}

src/css/styles.css

@@ -42,6 +42,19 @@
   --font-lato: 'Lato', sans-serif;
   --font-merriweather: 'Merriweather', serif;
   --font-cedarville: 'Cedarville Cursive', cursive;
+
+  --color-indigo-400: #d9f3e4;
+  --color-indigo-500: #75bb99;
+  --color-indigo-600: #75bb99;
+  --color-indigo-700: #5a9e7d;
+  --color-gray-900: #011109;
+  --color-gray-800: #003e1c;
+  --color-gray-700: #024e25;
+  --color-gray-600: #036830;
+  --color-gray-500: #9dbfaf;
+  --color-gray-400: #9dbfaf;
+  --color-gray-300: #d9f3e4;
+  --color-gray-200: #d9f3e4;
 }
 
 html {
@@ -50,16 +63,16 @@ html {
 
 body {
   font-family: 'DM Sans', sans-serif;
-  background-color: #111827;
+  background-color: #011109;
-  color: #d1d5db;
+  color: #d9f3e4;
 }
 
 .tool-card {
   transition:
     transform 0.2s ease-in-out,
     box-shadow 0.2s ease-in-out;
-  border: 1px solid #374151;
+  border: 1px solid #024e25;
-  background-color: #1f2937;
+  background-color: #003e1c;
   padding: 1.5rem;
   border-radius: 0.5rem;
   display: flex;
@@ -68,12 +81,25 @@ body {
   text-align: center;
 }
 
+.btn-cta-red {
+  background: linear-gradient(to bottom, #cc3910, #bb2d0c);
+}
+
+.btn-cta-red:hover {
+  box-shadow:
+    0 20px 25px -5px rgba(187, 45, 12, 0.4),
+    0 8px 10px -6px rgba(187, 45, 12, 0.3);
+}
+
 .tool-card:hover {
   transform: translateY(-5px);
   box-shadow:
     0 10px 15px -3px rgba(0, 0, 0, 0.2),
     0 4px 6px -2px rgba(0, 0, 0, 0.1);
-  border-color: #4f46e5;
+  border-color: #bb2d0c;
+  box-shadow:
+    0 10px 15px -3px rgba(187, 45, 12, 0.2),
+    0 4px 6px -2px rgba(187, 45, 12, 0.1);
 }
 
 .category-header {
@@ -98,11 +124,11 @@ body {
 }
 
 .category-header:hover {
-  color: #818cf8;
+  color: #d9f3e4;
 }
 
 .category-header:hover .category-chevron {
-  color: #818cf8;
+  color: #d9f3e4;
 }
 
 .category-tools {
@@ -126,7 +152,7 @@ body {
   border-left: none;
   border-right: none;
   border-top: none;
-  border-bottom: 1px solid #1f2937;
+  border-bottom: 1px solid #003e1c;
   background-color: transparent;
   align-items: center;
   justify-content: flex-start;
@@ -160,8 +186,8 @@ body {
 .compact-mode .tool-card:hover {
   transform: none;
   box-shadow: none;
-  background-color: #1f2937;
+  background-color: #003e1c;
-  border-color: #1f2937;
+  border-color: #003e1c;
 }
 
 @media (min-width: 640px) {
@@ -197,23 +223,23 @@ input[type='file']::file-selector-button {
 }
 
 ::-webkit-scrollbar-track {
-  background: #1f2937;
+  background: #003e1c;
 }
 
 ::-webkit-scrollbar-thumb {
-  background: #4f46e5;
+  background: #75bb99;
   border-radius: 4px;
 }
 
 ::-webkit-scrollbar-thumb:hover {
-  background: #4338ca;
+  background: #5a9e7d;
   /* indigo-700 */
 }
 
 /* Style for drag-and-drop placeholder */
 .sortable-ghost {
   opacity: 0.4;
-  border: 2px dashed #4f46e5;
+  border: 2px dashed #75bb99;
 }
 
 #embed-pdf-container > div {
@@ -222,7 +248,7 @@ input[type='file']::file-selector-button {
 }
 
 #tool-interface {
-  color: #39a0ed;
+  color: #75bb99;
 }
 
 #page-organizer .page-thumbnail,
@@ -251,9 +277,9 @@ input[type='file']::file-selector-button {
   min-width: 0;
   overflow: auto;
   height: 75vh;
-  border: 2px solid #374151;
+  border: 2px solid #024e25;
   border-radius: 0.5rem;
-  background-color: #1f2937;
+  background-color: #003e1c;
 }
 
 /* This rule ensures canvases in side-by-side panels display at their natural rendered size. */
@@ -285,9 +311,9 @@ footer a {
 }
 
 .pill {
-  background-color: #374151;
+  background-color: #024e25;
   /* bg-gray-700 */
-  color: #d1d5db;
+  color: #d9f3e4;
   /* text-gray-300 */
   padding: 8px 16px;
   border-radius: 9999px;
@@ -297,7 +323,7 @@ footer a {
 }
 
 .cta-button {
-  background-color: #4f46e5;
+  background-color: #75bb99;
   /* indigo-600 */
   color: white;
   font-weight: 600;
@@ -308,7 +334,7 @@ footer a {
 }
 
 .cta-button:hover {
-  background-color: #4338ca;
+  background-color: #5a9e7d;
   /* indigo-700 */
 }
 
@@ -319,7 +345,7 @@ footer a {
 }
 
 .feature-card {
-  background-color: #1f2937;
+  background-color: #003e1c;
   /* bg-gray-800 */
   padding: 24px;
   border-radius: 8px;
@@ -347,13 +373,13 @@ footer a {
   right: 0;
   bottom: 0;
   height: 6px;
-  background: linear-gradient(120deg, #6366f1, #8b5cf6);
+  background: linear-gradient(120deg, #75bb99, #5a9e7d);
   z-index: -1;
 }
 
 .section-divider {
   height: 1px;
-  background: linear-gradient(to right, transparent, #4d44f7, transparent);
+  background: linear-gradient(to right, transparent, #75bb99, transparent);
   /* Fades from transparent to indigo and back */
   margin: 2rem auto;
   /* my-16 */
@@ -368,7 +394,7 @@ footer a {
   /* py-3 px-8 */
   border-radius: 0.5rem;
   /* rounded-lg */
-  background-image: linear-gradient(to bottom, #6366f1, #4f46e5);
+  background-image: linear-gradient(to bottom, #75bb99, #75bb99);
   /* from-indigo-500 to-indigo-600 */
   color: #ffffff;
   /* text-white */
@@ -381,16 +407,16 @@ footer a {
 
 .btn-gradient:hover {
   box-shadow:
-    0 10px 15px -3px rgba(79, 70, 229, 0.3),
+    0 10px 15px -3px rgba(117, 187, 153, 0.3),
-    0 4px 6px -4px rgba(79, 70, 229, 0.3);
+    0 4px 6px -4px rgba(117, 187, 153, 0.3);
 }
 
 .btn-gradient:focus {
   outline: 2px solid transparent;
   outline-offset: 2px;
   box-shadow:
-    0 0 0 2px #111827,
+    0 0 0 2px #011109,
-    0 0 0 4px #818cf8;
+    0 0 0 4px #d9f3e4;
   /* focus:ring-2 focus:ring-offset-2 focus:ring-offset-gray-900 focus:ring-indigo-400 */
 }
 
@@ -406,9 +432,9 @@ footer a {
   /* w-16 */
   height: 64px;
   /* h-16 */
-  border: 5px solid #374151;
+  border: 5px solid #024e25;
   /* border-gray-700 */
-  border-bottom-color: #4f46e5;
+  border-bottom-color: #75bb99;
   /* border-indigo-600 */
   border-radius: 50%;
   display: inline-block;
@@ -438,9 +464,9 @@ footer a {
 
 /* Highlight for selected signature in the saved list */
 .saved-signature.selected {
-  border-color: #4f46e5;
+  border-color: #75bb99;
   /* indigo-600 */
-  box-shadow: 0 0 10px rgba(79, 70, 229, 0.5);
+  box-shadow: 0 0 10px rgba(117, 187, 153, 0.5);
 }
 
 /* Cursor change when hovering over a placed signature */
@@ -465,7 +491,7 @@ footer a {
 }
 
 .faq-item.open .faq-question {
-  color: #818cf8;
+  color: #d9f3e4;
   /* indigo-400 */
 }
 
@@ -475,21 +501,21 @@ footer a {
 
 /* Testimonial Card Styles */
 .testimonial-card {
-  background-color: #1f2937;
+  background-color: #003e1c;
   /* bg-gray-800 */
   padding: 24px;
   border-radius: 0.75rem;
   /* rounded-xl */
-  border: 1px solid #374151;
+  border: 1px solid #024e25;
   /* border-gray-700 */
   display: flex;
   flex-direction: column;
 }
 
 .pill {
-  background-color: #374151;
+  background-color: #024e25;
   /* bg-gray-700 */
-  color: #d1d5db;
+  color: #d9f3e4;
   /* text-gray-300 */
   padding: 8px 16px;
   border-radius: 9999px;
@@ -499,9 +525,9 @@ footer a {
 }
 
 .pill {
-  background-color: #374151;
+  background-color: #024e25;
   /* bg-gray-700 */
-  color: #d1d5db;
+  color: #d9f3e4;
   /* text-gray-300 */
   /* Smaller padding and font size by default for mobile */
   padding: 6px 12px;
@@ -626,11 +652,11 @@ button:disabled,
     ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono',
     'Courier New', monospace;
   line-height: 1;
-  color: #e5e7eb;
+  color: #d9f3e4;
-  background-color: #374151;
+  background-color: #024e25;
-  border: 1px solid #4b5563;
+  border: 1px solid #036830;
   border-radius: 0.25rem;
-  box-shadow: 0 1px 0 0 #1f2937;
+  box-shadow: 0 1px 0 0 #003e1c;
 }
 
 .shortcut-input {
@@ -642,8 +668,8 @@ button:disabled,
 
 .shortcut-input:focus {
   outline: none;
-  border-color: #6366f1;
+  border-color: #75bb99;
-  box-shadow: 0 0 0 2px rgba(99, 102, 241, 0.2);
+  box-shadow: 0 0 0 2px rgba(117, 187, 153, 0.2);
 }
 
 /* Custom Scrollbar for Modal Content */
@@ -652,16 +678,16 @@ button:disabled,
 }
 
 #shortcuts-list::-webkit-scrollbar-track {
-  background: #1f2937;
+  background: #003e1c;
 }
 
 #shortcuts-list::-webkit-scrollbar-thumb {
-  background: #4b5563;
+  background: #036830;
   border-radius: 3px;
 }
 
 #shortcuts-list::-webkit-scrollbar-thumb:hover {
-  background: #6b7280;
+  background: #9dbfaf;
 }
 
 /* Scroll to Top Button Visibility */
@@ -693,7 +719,7 @@ input[type='color'] {
   width: 2.5rem;
   height: 2.5rem;
   padding: 0;
-  border: 2px solid #4b5563;
+  border: 2px solid #036830;
   border-radius: 9999px;
   background: transparent;
   cursor: pointer;

src/partials/footer.html

@@ -6,7 +6,7 @@
         <div class="flex items-center justify-center md:justify-start mb-4">
           <img
             id="footer-logo"
-            src="{{baseUrl}}{{#if brandLogo}}{{brandLogo}}{{else}}images/favicon.svg{{/if}}"
+            src="{{baseUrl}}{{#if brandLogo}}{{brandLogo}}{{else}}images/profile-pic.png{{/if}}"
             alt="{{#if brandName}}{{brandName}}{{else}}Bento PDF{{/if}} Logo"
             class="h-10 w-10 mr-3"
           />
@@ -42,14 +42,14 @@
               >FAQ</a
             >
           </li>
-          <li>
+          <!--<li>
             <a
               href="contact.html"
               class="hover:text-indigo-400"
               data-i18n="footer.contactUs"
               >Contact Us</a
             >
-          </li>
+          </li>-->
         </ul>
       </div>
 

src/partials/navbar.html

@@ -8,7 +8,7 @@
       >
         <img
           id="nav-logo"
-          src="{{baseUrl}}{{#if brandLogo}}{{brandLogo}}{{else}}images/favicon-no-bg.svg{{/if}}"
+          src="{{baseUrl}}{{#if brandLogo}}{{brandLogo}}{{else}}images/profile-pic.png{{/if}}"
           alt="{{#if brandName}}{{brandName}}{{else}}Bento PDF{{/if}} Logo"
           class="h-8 w-8"
         />
@@ -23,12 +23,6 @@
       <div class="hidden md:flex items-center space-x-8">
         <a href="index.html" class="nav-link" data-i18n="nav.home">Home</a>
         <a href="about.html" class="nav-link" data-i18n="nav.about">About</a>
-        <a href="contact.html" class="nav-link" data-i18n="nav.contact"
-          >Contact</a
-        >
-        <a href="licensing.html" class="nav-link" data-i18n="nav.licensing"
-          >Licensing</a
-        >
         <a
           href="https://bentopdf.com/docs/"
           class="nav-link"
@@ -138,12 +132,6 @@
       <a href="about.html" class="mobile-nav-link" data-i18n="nav.about"
         >About</a
       >
-      <a href="contact.html" class="mobile-nav-link" data-i18n="nav.contact"
-        >Contact</a
-      >
-      <a href="licensing.html" class="mobile-nav-link" data-i18n="nav.licensing"
-        >Licensing</a
-      >
       <a
         href="https://bentopdf.com/docs/"
         class="mobile-nav-link"