toggle sun-moon

index.html

@@ -16,8 +16,7 @@
 
   <!-- HERO -->
   <section class="hero">
-    <canvas id="hero-canvas" aria-hidden="true"></canvas>
-    <div class="container">
+     <div class="container">
       <div class="hero-copy">
         <p class="eyebrow">ESTUDIO CREATIVO · AGENCIA BOUTIQUE</p>
         <h1>Marcas con <span class="grad-word">esencia,</span>
@@ -36,26 +35,7 @@
     <div class="container">
       <p class="eyebrow">EL CONCEPTO</p>
       <h2 style="max-width:30ch;">Dos fuerzas.<br> Una forma de construir.</h2>
-      <div class="duo-columns" style="margin-top:var(--space-4);">
-        <div class="duo-col amor">
-          <h4 style="color:var(--accent-amor);">AMOR</h4>
-          <ul>
-            <li>Pasión</li>
-            <li>Arte</li>
-            <li>Identidad</li>
-            <li>Dirección creativa</li>
-          </ul>
-        </div>
-        <div class="duo-col roma">
-          <h4 style="color:var(--accent-roma-bright);">ROMA</h4>
-          <ul>
-            <li>Estrategia</li>
-            <li>Arquitectura</li>
-            <li>Tecnología</li>
-            <li>Procesos</li>
-          </ul>
-        </div>
-      </div>
+      
       <p class="lede" style="margin-top:var(--space-3); max-width:80ch;">La creatividad atrae. La estrategia la convierte en crecimiento. No somos "otra agencia de marketing": diagnosticamos, diseñamos y construimos soluciones digitales a medida.</p>
     </div>
   </section>
@@ -80,7 +60,7 @@
   </section>
 
   <!-- ECOSISTEMA DE SERVICIOS -->
-  <section class="section-tight" style="background:var(--bg-sunken);">
+  <section class="section-tight"></section>
     <div class="container">
       <p class="eyebrow">ECOSISTEMA DE SOLUCIONES</p>
       <h2 style="max-width:22ch;">Una estrategia construida alrededor de tu negocio.</h2>
@@ -126,11 +106,11 @@
   <section>
     <div class="container">
       <p class="eyebrow">PLANES DE CRECIMIENTO</p>
-      <h2 style="max-width:60ch;">Distintos negocios. Distintas etapas.<br> Un mismo objetivo: crecer.</h2>
+      <h2 style="max-width:60ch;">Cada proyecto es único.<br> Adaptamos nuestros planes a tus objetivos.</h2>
       <div class="grid grid-4" style="margin-top:var(--space-4);">
         <div class="card"><h4 style="font-size:var(--step-0);">Esencial</h4><p style="color:var(--text-soft); font-size:0.92rem; margin-top:0.5rem;">Establecer una presencia digital profesional y consistente.</p></div>
         <div class="card"><h4 style="font-size:var(--step-0);">Impulso</h4><p style="color:var(--text-soft); font-size:0.92rem; margin-top:0.5rem;">Aumentar visibilidad, interacción y generación de leads calificados.</p></div>
-        <div class="card" style="border-color:var(--accent-amor);"><h4 style="font-size:var(--step-0); color:var(--accent-amor);">Premium</h4><p style="color:var(--text-soft); font-size:0.92rem; margin-top:0.5rem;">Consolidar y expandir la empresa comercialmente.</p></div>
+        <div class="card" style="border-color:var(--accent-amor);"><h4 style="font-size:var(--step-0); color:var(--accent-amor);">Premium ★ </p></h4><p style="color:var(--text-soft); font-size:0.92rem; margin-top:0.5rem;">Consolidar y expandir la empresa comercialmente.</p></div>
         <div class="card"><h4 style="font-size:var(--step-0);">Élite</h4><p style="color:var(--text-soft); font-size:0.92rem; margin-top:0.5rem;">Máximo posicionamiento y gestión integral de marca.</p></div>
       </div>
       <div class="btn-row" style="display:flex; gap:1rem; flex-wrap:wrap; margin-top:var(--space-4);">
@@ -141,7 +121,7 @@
   </section>
 
   <!-- PORTFOLIO DESTACADO -->
-  <section class="section-tight" style="background:var(--bg-sunken);">
+  <section class="section-tight"></section>
     <div class="container">
       <p class="eyebrow">TRABAJO QUE HABLA POR NOSOTROS</p>
       <h2 style="max-width:60ch;">Proyectos que combinan identidad, <br>estrategia y estructura.</h2>
@@ -198,16 +178,15 @@
     </div>
   </section>
 
-  <!-- CTA FINAL -->
-  <section style="background: var(--c-plum-2); color:var(--c-mist);">
-    <div class="container" style="text-align:center;">
-      <h2 style="max-width:20ch; margin-inline:auto; color:var(--c-mist);">Tu próximo tiene que ser una estratégico.</h2>
-      <div class="btn-row" style="justify-content:center; margin-top:var(--space-3);">
-        <a href="diagnostico.html" class="btn btn-primary">Empezar diagnóstico</a>
-        <a href="contacto.html" class="btn btn-primary">Hablar con Amor y Roma</a>
-      </div>
+<!-- CTA FINAL -->
+<section style="background: var(--c-plum-2); color:var(--c-mist);">
+  <div class="container" style="text-align:center;">
+    <h2 style="max-width:20ch; margin-inline:auto; color:var(--c-mist);">Tu próximo tiene que ser estratégico.</h2>
+    <div class="btn-row" style="justify-content:center; margin-top:var(--space-3);">
+      <a href="contacto.html" class="btn btn-primary">Hablar con Amor &amp; Roma</a>
     </div>
-  </section>
+  </div>
+</section>
 
 </main>