diff --git a/website/src/components/GaufrePage.astro b/website/src/components/GaufrePage.astro
index fb26acd..0f0f698 100644
--- a/website/src/components/GaufrePage.astro
+++ b/website/src/components/GaufrePage.astro
@@ -177,19 +177,42 @@ const useSubsettedFont = import.meta.env.PUBLIC_USE_GAUFRE_SUBSETTED_FONT !== "0
           z-index: 1 !important;
         }
 
-        .lagaufre-service:hover,
-        .lagaufre-service:focus-within {
+        .lagaufre-service:hover {
           background-color: #f0f0fa !important;
           border-top: 1px solid #8989cd !important;
           border-bottom: 1px solid #8989cd !important;
         }
-
-        [data-fr-scheme="dark"] .lagaufre-service:hover,
-        [data-fr-scheme="dark"] .lagaufre-service:focus-within {
-          background-color: #2d2d2d !important;
+        .lagaufre-service:has(:focus-visible) { /* this is like a "has-focus-within" selector */
+          background-color: #f0f0fa !important;
           border-top: 1px solid #8989cd !important;
           border-bottom: 1px solid #8989cd !important;
         }
+        /* fallback for browsers that don't support :has */
+        @supports not selector(:has(+ *)) {
+          .lagaufre-service:focus-within {
+            background-color: #f0f0fa !important;
+            border-top: 1px solid #8989cd !important;
+            border-bottom: 1px solid #8989cd !important;
+          }
+        }
+
+        [data-fr-scheme="dark"] .lagaufre-service:hover {
+          background-color: #2d2d2d !important;
+          border-top-color: #8989cd !important;
+          border-bottom-color: #8989cd !important;
+        }
+        [data-fr-scheme="dark"] .lagaufre-service:has(:focus-visible) {
+          background-color: #2d2d2d !important;
+          border-top-color: #8989cd !important;
+          border-bottom-color: #8989cd !important;
+        }
+        @supports not selector(:has(+ *)) {
+          [data-fr-scheme="dark"] .lagaufre-service:focus-within {
+            background-color: #2d2d2d !important;
+            border-top-color: #8989cd !important;
+            border-bottom-color: #8989cd !important;
+          }
+        }
 
         .lagaufre-service__icon {
           flex-shrink: 0 !important;