From dab9fd1fe635a8d1bc5081c2ef5be1ab26461baf Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Mar=C3=ADa?= <mherrezuelo94@hotmail.com>
Date: Tue, 9 Sep 2025 16:28:25 +0200
Subject: [PATCH] wip produtoras/id page

---
 assets/img/latienda-casa.svg      |  18 +-
 assets/img/latienda-email.svg     |  12 +-
 assets/img/latienda-telefono.svg  |  17 +-
 assets/img/latienda-tienda.svg    |  24 +--
 assets/img/latienda-web.svg       |  62 +-----
 components/CoopCard.vue           |   3 +-
 components/HighlightsCard.vue     |   2 +-
 components/ProductCard.vue        |   2 +-
 components/ProductCardDetails.vue |   2 +-
 components/ProductModal.vue       |   2 +-
 components/ProductsRelated.vue    |   2 +-
 pages/productoras/[id].vue        | 322 +++++++++++++++++-------------
 12 files changed, 203 insertions(+), 265 deletions(-)

diff --git a/assets/img/latienda-casa.svg b/assets/img/latienda-casa.svg
index afea397..28f3746 100644
--- a/assets/img/latienda-casa.svg
+++ b/assets/img/latienda-casa.svg
@@ -1,16 +1,4 @@
-<?xml version="1.0" encoding="utf-8"?>
-<!-- Generator: Adobe Illustrator 22.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
-<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
-	 viewBox="0 0 23 28" enable-background="new 0 0 23 28" xml:space="preserve">
-<g>
-	<g>
-		<path fill="#374493" d="M19.146,4.192c-2.035-2.057-4.746-3.19-7.634-3.19h-0.012C5.684,0.882,0.582,6.036,0.702,11.887
-			c0.152,4.131,4.101,9.377,7.176,13.408C8.781,26.38,10.097,27,11.511,27c1.463,0,2.822-0.664,3.727-1.82
-			c2.281-2.853,7.207-9.715,7.059-13.293C22.297,8.978,21.178,6.245,19.146,4.192L19.146,4.192z M13.653,23.923
-			c-1.043,1.384-3.237,1.387-4.28,0.002c-4.17-5.343-6.653-9.794-6.653-12.039c0-4.882,3.938-8.853,8.779-8.853h0.012
-			c4.834,0,8.767,3.972,8.767,8.853C20.279,14.156,17.864,18.543,13.653,23.923L13.653,23.923z M11.556,16.184
-			c-2.365,0-4.289-1.936-4.289-4.316c0.236-5.726,8.343-5.724,8.577,0C15.845,14.248,13.921,16.184,11.556,16.184z M11.556,9.583
-			c-1.252,0-2.27,1.025-2.27,2.285c0.125,3.031,4.417,3.03,4.541,0C13.827,10.608,12.808,9.583,11.556,9.583z"/>
-	</g>
-</g>
+<svg width="25" height="24" viewBox="0 0 25 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M20.5 10C20.5 14.993 14.961 20.193 13.101 21.799C12.9277 21.9293 12.7168 21.9998 12.5 21.9998C12.2832 21.9998 12.0723 21.9293 11.899 21.799C10.039 20.193 4.5 14.993 4.5 10C4.5 7.87827 5.34285 5.84344 6.84315 4.34315C8.34344 2.84285 10.3783 2 12.5 2C14.6217 2 16.6566 2.84285 18.1569 4.34315C19.6571 5.84344 20.5 7.87827 20.5 10Z" stroke="#143E8C" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M12.5 13C14.1569 13 15.5 11.6569 15.5 10C15.5 8.34315 14.1569 7 12.5 7C10.8431 7 9.5 8.34315 9.5 10C9.5 11.6569 10.8431 13 12.5 13Z" stroke="#143E8C" stroke-linecap="round" stroke-linejoin="round"/>
 </svg>
diff --git a/assets/img/latienda-email.svg b/assets/img/latienda-email.svg
index 85db6b3..e1d3129 100644
--- a/assets/img/latienda-email.svg
+++ b/assets/img/latienda-email.svg
@@ -1,11 +1,3 @@
-<?xml version="1.0" encoding="utf-8"?>
-<!-- Generator: Adobe Illustrator 22.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
-<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
-	 viewBox="0 0 26 20" enable-background="new 0 0 26 20" xml:space="preserve">
-<g>
-	<path fill="#374493" d="M22.413,0.824H3.587c-1.505,0-2.73,1.173-2.73,2.614v13.123c0,1.442,1.225,2.614,2.73,2.614h18.827
-		c1.505,0,2.73-1.173,2.73-2.614V3.439C25.144,1.997,23.919,0.824,22.413,0.824z M21.828,2.91L13,10.385L4.172,2.91H21.828z
-		 M23.059,16.561c0,0.287-0.296,0.529-0.646,0.529H3.587c-0.35,0-0.646-0.242-0.646-0.529V4.743l8.844,7.466
-		c0.139,0.118,0.316,0.182,0.496,0.182h1.439c0.18,0,0.356-0.065,0.495-0.182l8.845-7.466V16.561z"/>
-</g>
+<svg width="25" height="24" viewBox="0 0 25 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M22.5 7L13.53 12.7C13.2213 12.8934 12.8643 12.996 12.5 12.996C12.1357 12.996 11.7787 12.8934 11.47 12.7L2.5 7M4.5 4H20.5C21.6046 4 22.5 4.89543 22.5 6V18C22.5 19.1046 21.6046 20 20.5 20H4.5C3.39543 20 2.5 19.1046 2.5 18V6C2.5 4.89543 3.39543 4 4.5 4Z" stroke="#143E8C" stroke-linecap="round" stroke-linejoin="round"/>
 </svg>
diff --git a/assets/img/latienda-telefono.svg b/assets/img/latienda-telefono.svg
index 5ed0606..c0bf95f 100644
--- a/assets/img/latienda-telefono.svg
+++ b/assets/img/latienda-telefono.svg
@@ -1,16 +1,3 @@
-<?xml version="1.0" encoding="utf-8"?>
-<!-- Generator: Adobe Illustrator 22.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
-<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
-	 viewBox="0 0 20 31" enable-background="new 0 0 20 31" xml:space="preserve">
-<g>
-	<g>
-		<path fill="#374493" d="M17.223,1H2.777C1.793,1,0.998,1.797,0.998,2.782v25.436C0.998,29.201,1.793,30,2.777,30h14.446
-			c0.984,0,1.779-0.799,1.779-1.782V2.782C19.002,1.797,18.207,1,17.223,1z M16.969,26.915c0,0.474-0.385,0.859-0.858,0.859H3.89
-			c-0.475,0-0.858-0.384-0.858-0.859V4.085c0-0.472,0.383-0.857,0.858-0.857H16.11c0.473,0,0.858,0.384,0.858,0.857V26.915z"/>
-		<path fill="#374493" d="M11.883,4.805h-3.56c-0.492,0-0.889,0.399-0.889,0.891S7.83,6.587,8.323,6.587h3.56
-			c0.491,0,0.889-0.399,0.889-0.891S12.374,4.805,11.883,4.805z"/>
-		<path fill="#374493" d="M10.103,23.021c-0.984,0-1.78,0.796-1.78,1.781c0,0.983,0.796,1.779,1.78,1.779
-			c0.984,0,1.78-0.796,1.78-1.779C11.883,23.817,11.087,23.021,10.103,23.021z"/>
-	</g>
-</g>
+<svg width="25" height="24" viewBox="0 0 25 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M22.5004 8.0001V2.0001M22.5004 2.0001H16.5004M22.5004 2.0001L16.5004 8.0001M22.5004 16.9201V19.9201C22.5016 20.1986 22.4445 20.4743 22.3329 20.7294C22.2214 20.9846 22.0577 21.2137 21.8525 21.402C21.6473 21.5902 21.405 21.7336 21.1412 21.8228C20.8773 21.912 20.5978 21.9452 20.3204 21.9201C17.2433 21.5857 14.2874 20.5342 11.6904 18.8501C9.27425 17.3148 7.22576 15.2663 5.69042 12.8501C4.0004 10.2413 2.94866 7.27109 2.62042 4.1801C2.59543 3.90356 2.6283 3.62486 2.71692 3.36172C2.80555 3.09859 2.94799 2.85679 3.13519 2.65172C3.32238 2.44665 3.55023 2.28281 3.80421 2.17062C4.0582 2.05843 4.33276 2.00036 4.61042 2.0001H7.61042C8.09573 1.99532 8.56621 2.16718 8.93418 2.48363C9.30215 2.80008 9.5425 3.23954 9.61042 3.7201C9.73704 4.68016 9.97187 5.62282 10.3104 6.5301C10.445 6.88802 10.4741 7.27701 10.3943 7.65098C10.3146 8.02494 10.1293 8.36821 9.86042 8.6401L8.59042 9.9101C10.014 12.4136 12.0869 14.4865 14.5904 15.9101L15.8604 14.6401C16.1323 14.3712 16.4756 14.1859 16.8495 14.1062C17.2235 14.0264 17.6125 14.0556 17.9704 14.1901C18.8777 14.5286 19.8204 14.7635 20.7804 14.8901C21.2662 14.9586 21.7098 15.2033 22.027 15.5776C22.3441 15.9519 22.5126 16.4297 22.5004 16.9201Z" stroke="#143E8C" stroke-linecap="round" stroke-linejoin="round"/>
 </svg>
diff --git a/assets/img/latienda-tienda.svg b/assets/img/latienda-tienda.svg
index 320ef00..b702873 100644
--- a/assets/img/latienda-tienda.svg
+++ b/assets/img/latienda-tienda.svg
@@ -1,23 +1,3 @@
-<?xml version="1.0" encoding="utf-8"?>
-<!-- Generator: Adobe Illustrator 22.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
-<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
-	 viewBox="0 0 31 27" enable-background="new 0 0 31 27" xml:space="preserve">
-<g>
-	<path fill="#FF666E" d="M19.356,21.186c0-2.121-1.727-3.841-3.858-3.841c-2.131,0-3.859,1.719-3.859,3.84c0,0,0,0,0,0.001v3.85
-		c0,0.533,0.434,0.965,0.969,0.965l0,0h5.788c0.535,0,0.969-0.432,0.969-0.965v-3.85H19.356z M15.498,19.265
-		c1.065,0,1.929,0.86,1.929,1.92v2.894h-3.858v-2.894C13.568,20.125,14.432,19.265,15.498,19.265z"/>
-	<path fill="#FF666E" d="M29.989,10.881l-0.906-4.246v-2.75C29.083,2.292,27.786,1,26.185,1l0,0H4.873
-		C3.273,1,1.975,2.292,1.975,3.885v2.777l-0.969,4.219c-0.008,0.069-0.008,0.138,0,0.207c0.001,0.986,0.343,1.941,0.969,2.705v9.322
-		C1.975,24.708,3.273,26,4.873,26h0h3.867c0.533-0.051,0.923-0.523,0.871-1.053c-0.045-0.459-0.41-0.822-0.871-0.867H4.873
-		c-0.535,0-0.969-0.432-0.969-0.965v-7.934c0.464,0.173,0.954,0.264,1.449,0.27c1.318-0.006,2.562-0.61,3.378-1.641
-		c1.46,1.86,4.158,2.189,6.026,0.736c0.276-0.214,0.524-0.462,0.74-0.736c1.46,1.86,4.158,2.189,6.026,0.736
-		c0.276-0.214,0.524-0.462,0.74-0.736c1.133,1.461,3.091,2.016,4.827,1.37v7.934c0,0.533-0.434,0.965-0.969,0.965h-3.858
-		c-0.533,0.051-0.923,0.523-0.871,1.053c0.045,0.459,0.41,0.822,0.871,0.867h3.867c1.601,0,2.898-1.292,2.898-2.885v0v-9.331
-		c0.626-0.764,0.968-1.719,0.969-2.705C30.002,11.013,29.999,10.947,29.989,10.881z M5.353,13.495
-		c-1.298,0.001-2.365-1.017-2.418-2.308l0.788-3.462h4.049v3.39C7.757,12.434,6.678,13.496,5.353,13.495z M12.119,13.495
-		c-1.325,0-2.403-1.061-2.418-2.38v-3.39h4.827v3.39C14.514,12.431,13.441,13.491,12.119,13.495z M18.885,13.495
-		c-1.325,0-2.403-1.061-2.418-2.38v-3.39h4.827v3.39C21.279,12.431,20.206,13.491,18.885,13.495z M22.263,5.805H3.904v-1.92
-		c0-0.533,0.434-0.965,0.969-0.965h21.248c0.535,0,0.969,0.432,0.969,0.965v1.92H22.263z M25.642,13.495
-		c-1.325,0-2.403-1.061-2.418-2.38v-3.39h4.049l0.77,3.462C27.989,12.471,26.932,13.487,25.642,13.495L25.642,13.495z"/>
-</g>
+<svg width="25" height="24" viewBox="0 0 25 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M3.5 6L6.5 2H18.5L21.5 6M3.5 6V20C3.5 20.5304 3.71071 21.0391 4.08579 21.4142C4.46086 21.7893 4.96957 22 5.5 22H19.5C20.0304 22 20.5391 21.7893 20.9142 21.4142C21.2893 21.0391 21.5 20.5304 21.5 20V6M3.5 6H21.5M16.5 10C16.5 11.0609 16.0786 12.0783 15.3284 12.8284C14.5783 13.5786 13.5609 14 12.5 14C11.4391 14 10.4217 13.5786 9.67157 12.8284C8.92143 12.0783 8.5 11.0609 8.5 10" stroke="#143E8C" stroke-linecap="round" stroke-linejoin="round"/>
 </svg>
diff --git a/assets/img/latienda-web.svg b/assets/img/latienda-web.svg
index b786844..26b5f86 100644
--- a/assets/img/latienda-web.svg
+++ b/assets/img/latienda-web.svg
@@ -1,61 +1,3 @@
-<?xml version="1.0" encoding="utf-8"?>
-<!-- Generator: Adobe Illustrator 22.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
-<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
-	 viewBox="0 0 29 29" enable-background="new 0 0 29 29" xml:space="preserve">
-<g>
-	<g>
-		<path fill="#FF666E" d="M25.505,6.707c0-0.009-0.001-0.017-0.003-0.026c-0.034-0.048-0.075-0.09-0.11-0.137
-			c-0.252-0.343-0.519-0.674-0.801-0.992c-0.077-0.087-0.154-0.173-0.233-0.258c-0.29-0.311-0.594-0.607-0.913-0.888
-			c-0.059-0.052-0.114-0.106-0.173-0.157c-0.785-0.672-1.644-1.252-2.56-1.728c-0.037-0.019-0.075-0.036-0.113-0.055
-			c-0.408-0.207-0.827-0.394-1.254-0.559c-0.096-0.035-0.184-0.068-0.276-0.096c-0.38-0.137-0.766-0.257-1.158-0.36
-			c-0.116-0.031-0.232-0.063-0.349-0.09c-0.386-0.09-0.772-0.158-1.166-0.214c-0.12-0.017-0.237-0.041-0.358-0.055
-			c-1.016-0.123-2.044-0.123-3.06,0c-0.121,0.014-0.238,0.038-0.358,0.055c-0.395,0.056-0.784,0.124-1.166,0.214
-			c-0.118,0.027-0.233,0.059-0.349,0.09c-0.394,0.103-0.78,0.223-1.158,0.36C9.851,1.844,9.764,1.877,9.672,1.908
-			C9.245,2.072,8.826,2.259,8.418,2.466C8.38,2.485,8.342,2.502,8.305,2.521C7.385,2.997,6.524,3.577,5.736,4.25
-			C5.677,4.301,5.622,4.355,5.564,4.407C5.242,4.69,4.938,4.986,4.651,5.295C4.572,5.38,4.495,5.466,4.418,5.553
-			C4.135,5.87,3.868,6.2,3.617,6.544c-0.035,0.047-0.076,0.089-0.11,0.137C3.503,6.69,3.499,6.698,3.495,6.707
-			c-3.327,4.662-3.327,10.923,0,15.585c0.003,0.009,0.007,0.018,0.012,0.026c0.034,0.048,0.075,0.09,0.11,0.137
-			c0.251,0.343,0.518,0.674,0.801,0.992c0.077,0.087,0.154,0.173,0.233,0.258c0.291,0.311,0.595,0.607,0.913,0.888
-			c0.059,0.052,0.114,0.106,0.173,0.157c0.785,0.672,1.644,1.252,2.56,1.728c0.037,0.019,0.075,0.036,0.113,0.055
-			c0.408,0.207,0.827,0.394,1.254,0.559c0.096,0.035,0.184,0.068,0.276,0.096c0.38,0.137,0.766,0.257,1.158,0.36
-			c0.116,0.031,0.232,0.063,0.349,0.09c0.386,0.09,0.772,0.158,1.166,0.214c0.12,0.017,0.237,0.041,0.358,0.055
-			c1.016,0.123,2.044,0.123,3.06,0c0.121-0.014,0.238-0.038,0.358-0.055c0.395-0.056,0.784-0.124,1.166-0.214
-			c0.118-0.027,0.233-0.059,0.349-0.09c0.395-0.103,0.781-0.223,1.158-0.36c0.096-0.033,0.184-0.066,0.276-0.096
-			c0.427-0.165,0.846-0.351,1.254-0.559c0.038-0.019,0.076-0.036,0.113-0.055c0.917-0.476,1.776-1.056,2.56-1.728
-			c0.059-0.051,0.114-0.105,0.173-0.157c0.322-0.282,0.626-0.578,0.913-0.888c0.079-0.085,0.156-0.171,0.233-0.258
-			c0.282-0.318,0.549-0.648,0.801-0.992c0.035-0.047,0.076-0.089,0.11-0.137c0.004-0.008,0.008-0.017,0.012-0.026
-			C28.832,17.63,28.832,11.37,25.505,6.707z M24.404,8.532c0.923,1.519,1.48,3.232,1.627,5.003h-5.778
-			c-0.071-1.149-0.252-2.289-0.54-3.404C21.345,9.826,22.925,9.287,24.404,8.532z M16.959,3.192c0.054,0.013,0.106,0.03,0.16,0.042
-			c0.345,0.081,0.688,0.174,1.023,0.289c0.051,0.017,0.101,0.038,0.151,0.056c0.332,0.116,0.659,0.244,0.979,0.386
-			c0.056,0.026,0.111,0.055,0.167,0.081c0.307,0.146,0.606,0.304,0.899,0.474l0.193,0.117c0.278,0.17,0.548,0.351,0.81,0.545
-			c0.068,0.049,0.135,0.096,0.202,0.15c0.257,0.193,0.504,0.4,0.739,0.62c0.062,0.056,0.125,0.111,0.186,0.169
-			c0.247,0.234,0.482,0.482,0.71,0.739c0.029,0.034,0.06,0.065,0.089,0.096c-1.306,0.622-2.69,1.067-4.114,1.321
-			c-0.66-1.814-1.531-3.543-2.597-5.153C16.69,3.149,16.827,3.163,16.959,3.192z M10.681,13.535
-			c0.076-1.044,0.254-2.077,0.531-3.087c1.093,0.13,2.193,0.194,3.293,0.193c1.102,0,2.202-0.066,3.296-0.198
-			c0.276,1.011,0.453,2.046,0.528,3.091H10.681z M18.329,15.465c-0.076,1.044-0.254,2.077-0.531,3.087
-			c-1.093-0.13-2.193-0.194-3.293-0.193c-1.102-0.001-2.202,0.063-3.296,0.193c-0.276-1.009-0.453-2.043-0.528-3.087H18.329z
-			 M14.505,3.554c1.098,1.556,2.001,3.24,2.688,5.016c-0.893,0.095-1.79,0.142-2.688,0.143c-0.897-0.001-1.793-0.049-2.686-0.144
-			C12.508,6.795,13.41,5.111,14.505,3.554z M5.833,6.859C6.06,6.602,6.296,6.354,6.543,6.12c0.061-0.058,0.124-0.113,0.186-0.169
-			c0.238-0.217,0.484-0.423,0.739-0.62C7.534,5.28,7.602,5.234,7.669,5.18c0.262-0.193,0.532-0.375,0.81-0.545l0.193-0.117
-			C8.965,4.348,9.265,4.19,9.572,4.045C9.628,4.019,9.683,3.99,9.739,3.964c0.32-0.145,0.647-0.273,0.979-0.386
-			c0.05-0.018,0.096-0.039,0.151-0.056c0.335-0.112,0.675-0.204,1.023-0.289c0.054-0.013,0.106-0.03,0.161-0.041
-			c0.132-0.029,0.269-0.042,0.403-0.067c-1.066,1.61-1.938,3.34-2.598,5.154C8.434,8.024,7.05,7.58,5.744,6.957
-			C5.773,6.923,5.804,6.893,5.833,6.859z M4.606,8.532c1.479,0.755,3.058,1.294,4.69,1.599c-0.288,1.115-0.469,2.255-0.539,3.404
-			H2.979C3.126,11.764,3.683,10.052,4.606,8.532z M4.606,20.468c-0.923-1.519-1.48-3.232-1.627-5.003h5.778
-			c0.071,1.149,0.252,2.289,0.54,3.404C7.665,19.174,6.085,19.713,4.606,20.468z M12.051,25.809c-0.054-0.013-0.106-0.03-0.16-0.042
-			c-0.345-0.081-0.688-0.174-1.023-0.289c-0.051-0.017-0.101-0.038-0.151-0.056c-0.332-0.116-0.659-0.244-0.979-0.386
-			c-0.056-0.026-0.111-0.055-0.167-0.081c-0.307-0.146-0.606-0.304-0.899-0.474l-0.193-0.117c-0.278-0.17-0.548-0.351-0.81-0.545
-			c-0.068-0.049-0.135-0.096-0.202-0.15c-0.257-0.193-0.504-0.4-0.739-0.62c-0.062-0.056-0.125-0.111-0.186-0.169
-			c-0.247-0.234-0.482-0.482-0.71-0.739c-0.029-0.034-0.06-0.065-0.089-0.096c1.306-0.622,2.69-1.067,4.114-1.321
-			c0.66,1.814,1.531,3.543,2.597,5.153C12.32,25.851,12.183,25.838,12.051,25.809z M14.505,25.446
-			c-1.098-1.556-2.001-3.24-2.688-5.016c1.786-0.192,3.588-0.192,5.375,0l-0.001,0.001C16.502,22.205,15.6,23.889,14.505,25.446z
-			 M23.177,22.141c-0.227,0.257-0.463,0.504-0.71,0.739c-0.061,0.058-0.124,0.113-0.186,0.169c-0.238,0.217-0.484,0.424-0.739,0.62
-			c-0.067,0.051-0.134,0.101-0.202,0.15c-0.262,0.193-0.532,0.375-0.81,0.545l-0.193,0.117c-0.292,0.17-0.592,0.328-0.899,0.474
-			c-0.056,0.026-0.111,0.055-0.167,0.081c-0.32,0.145-0.647,0.273-0.979,0.386c-0.05,0.018-0.096,0.039-0.151,0.056
-			c-0.335,0.112-0.675,0.204-1.023,0.289c-0.054,0.013-0.106,0.03-0.161,0.041c-0.132,0.029-0.269,0.042-0.403,0.067
-			c1.065-1.609,1.937-3.339,2.597-5.153c1.424,0.255,2.808,0.699,4.114,1.321C23.237,22.077,23.206,22.108,23.177,22.141z
-			 M24.404,20.468c-1.479-0.755-3.058-1.294-4.69-1.599c0.288-1.115,0.469-2.255,0.539-3.404h5.778
-			C25.884,17.236,25.326,18.949,24.404,20.468z"/>
-	</g>
-</g>
+<svg width="21" height="22" viewBox="0 0 21 22" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M20.5 11C20.5 16.5228 16.0228 21 10.5 21M20.5 11C20.5 5.47715 16.0228 1 10.5 1M20.5 11H0.5M10.5 21C4.97715 21 0.5 16.5228 0.5 11M10.5 21C7.93223 18.3038 6.5 14.7233 6.5 11C6.5 7.27674 7.93223 3.69615 10.5 1M10.5 21C13.0678 18.3038 14.5 14.7233 14.5 11C14.5 7.27674 13.0678 3.69615 10.5 1M0.5 11C0.5 5.47715 4.97715 1 10.5 1" stroke="#143E8C" stroke-linecap="round" stroke-linejoin="round"/>
 </svg>
diff --git a/components/CoopCard.vue b/components/CoopCard.vue
index d15fe86..5b9d445 100644
--- a/components/CoopCard.vue
+++ b/components/CoopCard.vue
@@ -152,7 +152,8 @@ export default {
           transition: all 0.2s ease;
 
           &:hover {
-            background: #f3f4f6;
+            background: $color-button;
+            color: white;
           }
         }
       }
diff --git a/components/HighlightsCard.vue b/components/HighlightsCard.vue
index 4110c70..6967743 100644
--- a/components/HighlightsCard.vue
+++ b/components/HighlightsCard.vue
@@ -128,7 +128,7 @@ export default {
   methods: {
     getProductImg(product) {
       if (product && product.image) return product.image
-      return `@/assets/img/latienda-product-default.svg`
+      return `@/assets/img/consumo-default.png`
     },
   },
 }
diff --git a/components/ProductCard.vue b/components/ProductCard.vue
index 837fa34..60bc8c1 100644
--- a/components/ProductCard.vue
+++ b/components/ProductCard.vue
@@ -11,7 +11,7 @@
         <img
           v-else
           class="image"
-          src="@/assets/img/latienda-product-default.svg"
+          src="@/assets/img/consumo-default.png"
           :alt="product.name"
         />
       </div>
diff --git a/components/ProductCardDetails.vue b/components/ProductCardDetails.vue
index 15ac2e0..7c23543 100644
--- a/components/ProductCardDetails.vue
+++ b/components/ProductCardDetails.vue
@@ -161,7 +161,7 @@ export default {
     getProductImg(product) {
       if (product && product.image) 
         return product.image
-      return `@/assets/img/latienda-product-default.svg`
+      return `@/assets/img/consumo-default.png`
     },
     tagRoute(tag) {
       return `/busqueda?tags=${tag}`
diff --git a/components/ProductModal.vue b/components/ProductModal.vue
index 7666445..5590b90 100644
--- a/components/ProductModal.vue
+++ b/components/ProductModal.vue
@@ -174,7 +174,7 @@ export default {
     },
     getImgUrl(image) {
       if (image) return image
-      return `@/assets/img/latienda-product-default.svg`
+      return `@/assets/img/consumo-default.png`
     },
     redirectToLogin() {
       this.$router.push({
diff --git a/components/ProductsRelated.vue b/components/ProductsRelated.vue
index bf4e84c..506b276 100644
--- a/components/ProductsRelated.vue
+++ b/components/ProductsRelated.vue
@@ -15,7 +15,7 @@
       <img
         v-else
         class="image-default"
-        src="@/assets/img/latienda-product-default.svg"
+        src="@/assets/img/consumo-default.png"
         alt=""
       />
       <h3>{{ product.name }}</h3>
diff --git a/pages/productoras/[id].vue b/pages/productoras/[id].vue
index cbfec08..8f5149f 100644
--- a/pages/productoras/[id].vue
+++ b/pages/productoras/[id].vue
@@ -1,13 +1,33 @@
 <template>
-  <div class="container">
-    <div class="row c-description">
-      <div class="col-md-4">
+  <div class="content">
+    <div class="c-description">
+      <div class="c-image-links">
         <div class="c-image-container">
           <img v-if="coop?.logo" :src="coop?.logo" alt="" />
-          <img v-else src="@/assets/img/latienda-product-default.svg" alt="" />
+          <img v-else src="@/assets/img/consumo-default.png" alt="" />
         </div>
+        <BButton
+          v-if="coop?.shop_link"
+          class="div-link"
+          align="center"
+          :href="coop?.shop_link"
+          target="_blank"
+        >
+          <img class="div-link-img" src="@/assets/img/latienda-tienda.svg" />
+          <span>COMPRA EN SU TIENDA</span>
+        </BButton>
+        <BButton
+          v-if="coop?.web_link"
+          class="div-link"
+          align="center"
+          :href="coop?.web_link"
+          target="_blank"
+        >
+          <img class="div-link-img" src="@/assets/img/latienda-web.svg" />
+          <span>CONOCE MÁS SU PROYECTO</span>
+        </BButton>
       </div>
-      <div class="col-md-6">
+      <div class="c-text">
         <h1 class="coop-name">{{ coop?.company_name }}</h1>
         <p class="coop-text">
           {{ coop?.description }}
@@ -19,63 +39,38 @@
             :to="tagRoute(n)"
             class="tag_container"
           >
-            <img class="tag_img" src="@/assets/img/latienda-tag.svg" />
             <span>{{ n }}</span>
           </NuxtLink>
         </div>
-      </div>
-    </div>
-    <div class="row coop-links">
-      <div class="col-md-4">
-        <BButton
-          v-if="coop?.shop_link"
-          class="div-link"
-          align="center"
-          :href="coop?.shop_link"
-          target="_blank"
-        >
-          <img class="div-link-img" src="@/assets/img/latienda-tienda.svg" />
-          <span>Tienda online</span>
-        </BButton>
-        <BButton
-          v-if="coop?.web_link"
-          class="div-link"
-          align="center"
-          :href="coop?.web_link"
-          target="_blank"
-        >
-          <img class="div-link-img" src="@/assets/img/latienda-web.svg" />
-          <span>Página web</span>
-        </BButton>
-      </div>
-      <div class="col-md-4">
-        <div v-if="coop?.mobile || coop?.phone" class="div-action tel">
-          <img
-            class="div-action-img"
-            src="@/assets/img/latienda-telefono.svg"
-          />
-          <span
-            >{{ coop?.phone }} <br />
-            {{ coop?.mobile }}</span
-          >
-        </div>
-        <div v-if="coop?.email" class="div-action mail">
-          <img class="div-action-img" src="@/assets/img/latienda-email.svg" />
-          <span>{{ coop?.email }}</span>
-        </div>
-      </div>
-      <div class="col-md-4">
-        <div v-if="coop?.address" class="div-action address">
-          <img class="div-action-img" src="@/assets/img/latienda-casa.svg" />
-          <span>{{ coop?.address }}</span>
-        </div>
-        <div v-if="coop?.city" class="div-action location">
-          <img
-            class="div-action-img"
-            src="@/assets/img/latienda-ubicacion.svg"
-          />
-          <span>{{ coop?.city }}</span>
-        </div>
+        <div class="coop-links">
+          <div v-if="coop?.address" class="div-action address">
+              <img class="div-action-img" src="@/assets/img/latienda-casa.svg" />
+              <span>{{ coop?.address }}</span>
+            </div>
+            <div v-if="coop?.mobile || coop?.phone" class="div-action tel">
+              <img
+                class="div-action-img"
+                src="@/assets/img/latienda-telefono.svg"
+              />
+              <span
+                >{{ coop?.phone }} <br />
+                {{ coop?.mobile }}</span
+              >
+            </div>
+            <div v-if="coop?.email" class="div-action mail">
+              <img class="div-action-img" src="@/assets/img/latienda-email.svg" />
+              <span>{{ coop?.email }}</span>
+            </div>
+            
+            <!-- <div v-if="coop?.city" class="div-action location">
+              <img
+                class="div-action-img"
+                src="@/assets/img/latienda-ubicacion.svg"
+              />
+              <span>{{ coop?.city }}</span>
+            </div> -->
+          </div>
+      
       </div>
     </div>
     <div class="row">
@@ -125,7 +120,7 @@ import { mapState } from 'pinia'
 export default {
   setup(){
     definePageMeta({
-      layout: 'main',
+      layout: 'default',
     })
   },
   //TODO: implement head() method
@@ -264,132 +259,185 @@ export default {
 }
 </script>
 
-<style lang="scss" scoped>
+<!-- <style lang="scss" scoped>
 //global classes for Bootstrap styling
 ul.nav > li.nav-item {
   font-weight: bolder;
   :hover {
-    color: $color-navy;
+    color: $color-consumo-base;
   }
   .active {
     border-top: 4px solid $color-navy;
     color: $color-navy;
   }
 }
-</style>
+</style> -->
 
 <style lang="scss" scoped>
-.container {
-  margin-top: 80px;
-  margin-bottom: 80px;
-
-  @include mobile {
-    padding: 0.4em 2em;
-  }
+.content {
+  // margin-top: 80px;
+  // margin-bottom: 80px;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
 }
 
 .c-description {
-  margin-top: 40px;
-  margin-bottom: 40px;
+  display: flex;
+  flex-direction: row;
+  align-items: start;
+  justify-content: start;
+  gap: 4rem;
+  width: 100%;
+  padding: 4rem 4rem;
+  border-radius: var(--rounded-3xl, 24px);
+  background: linear-gradient(
+      180deg,
+      $color-consumo-base-extra-light 0%,
+      $color-bg-light 100%
+    );
+
+  @include tablet {
+    gap: 1rem;
+  }
   @include mobile {
-    margin-bottom: 0;
+    flex-direction: column;
+    gap: 1rem;
+    margin-top: 5rem;
+    padding: 2rem 1rem;
+  }
+  .c-image-links {
+    display: flex;
+    flex-direction: column;
+    width: auto;
+    gap: 1.5rem;
+    @include mobile {
+      flex-direction: column;
+      margin-right: 0;
+    }
+
+    .div-link:hover {
+      background-color: white;
+      transition: all 0.2s ease;
+    }
+
+    .div-link {
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      gap: 0.7rem;
+      width: 100%;
+      border: 1px solid $color-button;
+      border-radius: 5px;
+      background-color: transparent;
+      font-weight: $bold;
+      padding: 15px 0;
+
+      .div-link-img {
+        width: 20px;
+      }
+      span {
+        color: $color-button;
+      }
+    }
   }
 }
 
 .coop-links {
-  margin-bottom: 40px;
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  width: 100%;
 
   .div-action {
     display: flex;
-    justify-content: flex-start;
+    flex-direction: row;
     align-items: center;
+    justify-content: start;
     padding-left: 8px;
-    overflow: hidden;
-
-    .img-tel {
-      width: 16px;
-    }
+    background-color: transparent;
+    font-size: $m;
   }
 
-  .div-link-img,
   .div-action-img {
-    width: 20px;
+    width: 24px;
+    height: 24px;
     margin-right: 8px;
-  }
-
-  .div-action-img {
     margin-left: 5px;
   }
 }
 
 .c-image-container {
-  height: 100%;
-  width: 100%;
+  height: 300px;
+  width: 300px;
   display: flex;
   flex-direction: column;
+  gap: 1rem;
   align-items: center;
   justify-content: center;
+  background-color: white;
+  border-radius: 16px;
   img {
     width: 100%;
-    height: auto;
-    object-fit: cover;
+    height: 100%;
+    object-fit: contain;
+  }
+
+  @include mobile {
+    width: 200px;
+    height: 200px;
+    margin: 0 auto;
   }
 }
 
-.coop-name {
-  font-size: $xl;
-  color: $color-navy;
-  text-transform: capitalize;
-}
-.coop-text {
-  margin-top: 8px;
-  font-family: $font-secondary;
-  font-size: $s;
-  color: $color-greytext;
-}
+.c-text {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  justify-content: center;
+  @include mobile {
+    margin-top: 2rem;
+  }
 
-.div-link:hover {
-  box-shadow: 0 4px 16px rgba(99, 99, 99, 0.2);
-  transition: all 0.2s ease;
-}
-
-.div-link {
-  width: 100%;
-  border: 3px solid $color-orange;
-  border-radius: 5px;
-  background-color: $color-light;
-  font-weight: $bold;
-  padding: 15px 0;
-  margin-bottom: 5px;
-
-  span {
-    color: $color-orange;
+  .coop-name {
+    font-size: $h2;
+    font-weight: $bold;
+    text-transform: capitalize;
+  }
+  .coop-text {
+    margin-top: 8px;
+    font-size: $m;
+    width: 80%;
+    @include tablet {
+      width: 100%;
+    }
+    @include mobile {
+      width: 100%;
   }
 }
-
-.div-action {
-  width: 100%;
-  background-color: $color-grey-nav;
-  border: none;
-  color: $color-greytext;
-  font-family: $font-secondary;
-  font-size: $s;
-  padding: 20px 0;
-  margin-bottom: 5px;
 }
 
-.tag_container {
-  margin: 5px 6px 0 0;
-  border: 2px solid $color-greylayout;
-  border-radius: 5px;
-  padding: 6px 10px;
-  display: inline-block;
-  font-family: $font-secondary;
-  font-size: $xs;
-  color: $color-greytext;
+.tags_container {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: start;
+  gap: 8px;
 
-  .tag_img {
-    width: 18px;
+  .tag_container {
+    margin: 5px 6px 0 0;
+    border-radius: 1rem;
+    padding: 8px;
+    display: inline-block;
+    font-family: $font-secondary;
+    font-size: $xs;
+    background-color: white;
+    color: #4B4B4B;
+    text-align: center;
+    text-transform: uppercase;
+    text-decoration: none;
   }
 }