diff --git a/src/components/ThemeToggle.astro b/src/components/ThemeToggle.astro
index 5163e056b..6bad04373 100644
--- a/src/components/ThemeToggle.astro
+++ b/src/components/ThemeToggle.astro
@@ -5,7 +5,7 @@ import MoonIcon from "@/icons/moon.astro"
 
 <button
   id="themeToggle"
-  class="inline-flex text-primary transition hover:scale-125 hover:opacity-70"
+  class="inline-flex text-primary transition any-hover:scale-125 any-hover:opacity-70"
 >
   <SunIcon
     class="opacity-100 transition-transform dark:-rotate-90 dark:opacity-0"
diff --git a/src/sections/Footer.astro b/src/sections/Footer.astro
index 3dd35e8fc..0dcc4cabe 100644
--- a/src/sections/Footer.astro
+++ b/src/sections/Footer.astro
@@ -25,7 +25,7 @@ import XIcon from "@/icons/x.astro"
           rel="noopener"
           aria-label="Instagram de la velada"
           href="https://www.instagram.com/infolavelada"
-          class="hover:scale-125 hover:opacity-70 transition inline-block"
+          class="any-hover:scale-125 any-hover:opacity-70 transition inline-block"
         >
           <InstagramIcon class="text-primary" />
         </a>
@@ -36,7 +36,7 @@ import XIcon from "@/icons/x.astro"
           rel="noopener"
           aria-label="X de la velada"
           href="https://x.com/infoLaVelada"
-          class="hover:scale-125 hover:opacity-70 transition inline-block"
+          class="any-hover:scale-125 any-hover:opacity-70 transition inline-block"
         >
           <XIcon class="text-primary" />
         </a>
diff --git a/tailwind.config.mjs b/tailwind.config.mjs
index a719236b6..da0fbf88f 100644
--- a/tailwind.config.mjs
+++ b/tailwind.config.mjs
@@ -13,5 +13,7 @@ export default {
 		},
 	},
 	darkMode: 'class',
-	plugins: [animations],
+	plugins: [animations, function ({ addVariant }) {
+		addVariant("any-hover", "@media (any-hover: hover) { &:hover }")
+	}],
 }