feat(ecommerce): ADR 0008 - iteracion de paleta a Azul & Amarillo

Reemplaza los valores de marino/coral/coral-claro de "Navy & Coral"
por una paleta azul solido (#0055B8, ancla + accion unica) + amarillo
(#FFC220, acento en badges/detalles, nunca en botones). Los nombres de
token (--color-ari-marino/coral/coral-claro) no cambian, solo sus
valores, por lo que el resto de componentes que ya migraron en las
sub-fases 1-3 heredan la paleta nueva automaticamente via CSS vars.

Ajustes puntuales de contraste: badges de descuento/destacado en
product-card.tsx pasan de texto blanco a texto marino sobre fondo
amarillo; linea decorativa del navbar pasa de coral (ahora identico al
marino) a coral-claro para seguir siendo visible contra el header.

workloads/ecommerce/public/images/brand/logo-ari.svg

@@ -1,15 +1,16 @@
-<!-- ADR 0008 ("Navy & Coral"). Isotipo: mariposa geometrica de 4 elipses
-     sobre circulo/campo marino + wordmark "ARI shopping".
+<!-- ADR 0008, paleta final "Azul & Amarillo" (Walmart-inspirada). Isotipo:
+     mariposa geometrica de 4 elipses sobre circulo/campo azul + wordmark
+     "ARI shopping".
      Ver docs-portal/docs/decisiones/0008-identidad-navy-coral.md -->
 <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 64" role="img" aria-label="ARI shopping">
-  <rect width="200" height="64" rx="12" fill="#122844"/>
+  <rect width="200" height="64" rx="12" fill="#0055B8"/>
   <g transform="translate(14 20)">
-    <ellipse cx="10" cy="8" rx="9" ry="7" transform="rotate(-18 10 8)" fill="#D85A30"/>
-    <ellipse cx="24" cy="8" rx="9" ry="7" transform="rotate(18 24 8)" fill="#D85A30"/>
-    <ellipse cx="12" cy="16" rx="6" ry="5" transform="rotate(-10 12 16)" fill="#F0997B"/>
-    <ellipse cx="22" cy="16" rx="6" ry="5" transform="rotate(10 22 16)" fill="#F0997B"/>
-    <rect x="16" y="3" width="2" height="18" rx="1" fill="#122844"/>
+    <ellipse cx="10" cy="8" rx="9" ry="7" transform="rotate(-18 10 8)" fill="#FFC220"/>
+    <ellipse cx="24" cy="8" rx="9" ry="7" transform="rotate(18 24 8)" fill="#FFC220"/>
+    <ellipse cx="12" cy="16" rx="6" ry="5" transform="rotate(-10 12 16)" fill="#FFDD73"/>
+    <ellipse cx="22" cy="16" rx="6" ry="5" transform="rotate(10 22 16)" fill="#FFDD73"/>
+    <rect x="16" y="3" width="2" height="18" rx="1" fill="#0055B8"/>
   </g>
   <text x="64" y="38" font-family="Poppins, ui-sans-serif, system-ui, sans-serif" font-weight="700" font-size="26" fill="#FFFFFF">ARI</text>
-  <text x="64" y="53" font-family="Poppins, ui-sans-serif, system-ui, sans-serif" font-weight="700" font-size="11" letter-spacing="2.5" fill="#F0997B">shopping</text>
+  <text x="64" y="53" font-family="Poppins, ui-sans-serif, system-ui, sans-serif" font-weight="700" font-size="11" letter-spacing="2.5" fill="#FFC220">shopping</text>
 </svg>