agregar iconos

src/assets/circulo.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 11.168 11.168"><path d="M0 0c8.742 0 15.829-7.086 15.829-15.829 0-8.742-7.087-15.828-15.829-15.828s-15.829 7.086-15.829 15.828C-15.829-7.086-8.742 0 0 0" style="fill:#000;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(.35278 0 0 -.35278 5.584 0)"/></svg>

src/assets/cruces.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 72.103 20.229"><path d="M0 0c-12.772 0-12.772 55.341-25.544 55.341C-38.317 55.341-38.317 0-51.089 0c-12.774 0-12.774 55.341-25.548 55.341C-89.407 55.341-89.407 0-102.178 0c-12.775 0-12.775 55.341-25.549 55.341C-140.498 55.341-140.498 0-153.269 0c-12.78 0-12.78 55.341-25.559 55.341-12.78 0-12.78-55.341-25.559-55.341" style="fill:none;stroke:#000;stroke-width:2;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" transform="matrix(.35278 0 0 -.35278 72.103 19.876)"/></svg>

src/index.11ty.jsx

@@ -31,6 +31,8 @@ const postcss = require("postcss")([
 export async function render(data) {
   const Estrellita = await loadSvg("src/assets/estrellita.svg");
   const Wave = await loadSvg("src/assets/wave.svg");
+  const Circulo = await loadSvg("src/assets/circulo.svg");
+  const Cruces = await loadSvg("src/assets/cruces.svg");
   // console.debug(data);
   const WobbleVioleta = await loadSvg("src/assets/wobble violeta.svg");
   const CaritasFelices = await loadSvg("src/assets/caritas felices.svg");
@@ -96,10 +98,18 @@ export async function render(data) {
                 )
               )}
             </div>
+            <div class="mt-8 flex items-center justify-between">
+              <Circulo class="h-6 h-full" />
+              <div class="relative">
+                <Cruces class="h-8" />
+                <Cruces class="absolute top-0 h-8 -scale-y-100" />
+              </div>
+              <Circulo class="h-6 h-full" />
+            </div>
           </div>
         </section>
         <section class="min-h-screen bg-blanco">
-          <div class="mx-auto max-w-3xl p-4">
+          <div class="mx-auto max-w-5xl p-2">
             <div class="mb-4 flex justify-center gap-4">
               <img
                 class="aspect-[1.3] w-1/2"
@@ -110,10 +120,14 @@ export async function render(data) {
                 src="assets/img/imagen_violeta.webp"
               />
             </div>
+            <div class="flex items-center gap-4">
+              <Wave containerClass="mx-8" class="w-full" />
               <img
                 class="mx-auto aspect-[1.94] w-8/12 object-contain"
                 src="assets/img/imagen_celeste.webp"
               />
+              <Wave containerClass="mx-8" class="w-full" />
+            </div>
           </div>
         </section>
         <section class="flex min-h-screen place-content-center bg-blanco">