diff --git a/src/backend/views/pages/blocks/header.twig b/src/backend/views/pages/blocks/header.twig
index d91fad4..f069652 100644
--- a/src/backend/views/pages/blocks/header.twig
+++ b/src/backend/views/pages/blocks/header.twig
@@ -1,12 +1,11 @@
 <h{{ level }} id="{{ text | urlify  }}" class="block-header block-header--{{ level }} block-header--anchor">
-  <a href="#{{ text | urlify  }}">
-    {{ text }}
-  </a>
   <div class="block-header__copy-link-splash"></div>
   <div class="block-header__copy-link">
     <div class="block-header__copy-link-icon--initial">{{ svg('copy') }}</div>
     <div class="block-header__copy-link-icon--success">{{ svg('check') }}</div>
   </div>
-
+  <a href="#{{ text | urlify  }}">
+    {{ text }}
+  </a>
 </h{{ level }}>
 
diff --git a/src/frontend/styles/components/page.pcss b/src/frontend/styles/components/page.pcss
index 2113913..7aa1716 100644
--- a/src/frontend/styles/components/page.pcss
+++ b/src/frontend/styles/components/page.pcss
@@ -98,7 +98,9 @@
 .block-header {
   @apply --text-header;
 
-  position: relative;
+  display: flex;
+  align-items: center;
+  transform: translateX(-36px);
 
   &--2 {
     @apply --text-header-2;
@@ -118,6 +120,7 @@
   &--link-copied {
     .block-header__copy-link, .block-header__copy-link:hover {
       background: var(--color-success);
+      opacity: 1;
     }
 
     .block-header__copy-link-icon--initial {
@@ -125,30 +128,27 @@
     }
 
     .block-header__copy-link-icon--success {
-      display: block;
+      display: flex;
     }
 
     .block-header__copy-link-splash {
       opacity: 0.1;
       transform: scale(2);
     }
-
-    .block-header__copy-link-success {
-      display: flex;
-    }
   }
 
   &__copy-link-splash {
     position: absolute;
+    left: 0;
     width: 28px;
     height: 28px;
-    top: 3px;
-    left: -36px;
-    border-radius: 11px;
     background-color: var(--color-success);
-    opacity: 0;
     transform: scale(1);
+    opacity: 0;
+    border-radius: 11px;
     transition: transform 300ms;
+    z-index: 1;
+    will-change: transform, opacity;
   }
 
   &__copy-link-icon--success {
@@ -165,11 +165,8 @@
   }
 
   &__copy-link {
-    position: absolute;
     width: 28px;
     height: 28px;
-    left: -36px;
-    top: 3px;
     cursor: pointer;
     display: flex;
     align-items: center;
@@ -177,9 +174,8 @@
     border-radius: 8px;
     color: var(--color-text-second);
     opacity: 0;
-    transition: opacity;
-    transition-delay: 0.5s;
-    transition-duration: 200ms;
+    margin-right: 8px;
+    z-index: 2;
 
     @media (--can-hover) {
       &:hover {
@@ -192,8 +188,6 @@
     &:hover {
       .block-header__copy-link {
         opacity: 1;
-        transition-delay: 0s;
-        transition-duration: 100ms;
       }
     }
   }