Apply global styles for visual consistency

This commit centralizes the styling of key UI elements across the
project to ensure:

- Consistent look and feel.
- Enhanced code reusability.
- Simpified maintenance, improving development speed.

It establishes a uniform foundation that can be leveraged across
different parts of the project, even enabling the styling to be shared
across different websites (supporting issue #49).

Key changes:

- Apply the following shared styles globally:
  * Styling of code, blockquotes, superscripts, horizontal rules and
    anchors.
  * Vertical and horizontal spacing.
- Segregate base styling into dedicated SCSS files for clearer structure
  and increased maintainability.
- Remove custom styling from affected components, enabling global style
  reuse for visual uniformity, reduced redundancy, and enhanced
  semantics.

Other supporting changes:

- Rename `globals.scss` to `base.scss` for better clarity.
- Add `.editorconfig` for `.scss` files to ensure consistent whitespace
  usage.
- Remove `2` file from the project root, that was included in the source
  code by mistake.
- Remove unused font-face imports

src/presentation/assets/styles/base/_link-styling.scss

@@ -0,0 +1,42 @@
+@use "@/presentation/assets/styles/mixins" as *;
+@use "@/presentation/assets/styles/typography" as *;
+@use 'sass:math';
+
+a {
+  color: inherit;
+  cursor: pointer;
+  @include flat-button($disabled: false);
+
+  &[href] {
+    word-break: break-word; // Enables long URLs to wrap within the container, preventing horizontal overflow.
+  }
+  &[href^="http"]{
+    &:after {
+      display: inline-block;
+      content: '';
+
+      /*
+        Use mask element instead of content/background-image etc.
+        This way we can apply current font color to it to match the theme
+      */
+      mask: url(@/presentation/assets/icons/external-link.svg) no-repeat 50% 50%;
+      mask-size: cover;
+      background-color: currentColor;
+
+      /*
+        Use absolute sizing instead of relative. Relative sizing looks bad and inconsistent if there are external elements
+        inside small text (such as inside `<sup>`) and bigger elements like in bigger text. Making them always have same size
+        make the text read and flow better.
+      */
+      width: $font-size-absolute-x-small;
+      height: $font-size-absolute-x-small;
+
+      vertical-align: text-top;
+
+      @include set-property-ch-value-with-fallback(
+        $property: margin-left,
+        $value-in-ch: 0.25,
+      )
+    }
+  }
+}