Revert to global CSS

app/[locale]/globals.css

@@ -36,4 +36,67 @@ body {
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   overscroll-behavior-x: none;
+}
+
+/* DYNAMIC CONTENT MANAGER */
+.dynamic-content > :not(.hero) {
+  @apply my-16 lg:my-24;
+}
+
+.dynamic-content > :first-child {
+  @apply mt-0 md:mt-0 lg:mt-0;
+}
+
+.dynamic-content > :last-child {
+  @apply mb-16 lg:mb-24;
+}
+
+.dynamic-content .dynamic-content {
+  @apply px-0 md:px-0;
+}
+
+.dynamic-content .dynamic-content > {
+  @apply my-0 md:my-0 lg:my-0;
+}
+
+.dynamic-content .dynamic-content > :last-child {
+  @apply my-0 md:my-0 lg:my-0;
+}
+
+/* GLIDER SLIDER */
+.glider {
+  scrollbar-width: none;
+  -ms-overflow-style: none;
+}
+
+.glider::-webkit-scrollbar {
+  display: none;
+}
+
+.glider-dots {
+  @apply flex !space-x-[2px] !mt-8;
+}
+
+.glider-dot {
+  @apply !m-0 !rounded-none !w-12 !h-4 !bg-transparent after:content-[''] after:block after:w-12 after:h-[3px] after:bg-ui-border 2xl:!w-16 2xl:after:w-16;
+}
+
+.glider-dot.active {
+  @apply after:!bg-high-contrast;
+}
+
+.glider-prev {
+  @apply text-high-contrast !right-12 !-top-10 !left-auto lg:!right-16 lg:!-top-12 2xl:!-top-16 2xl:!right-[100px] !transition-transform !duration-100 hover:!text-high-contrast hover:scale-110;
+}
+
+.glider-next {
+  @apply text-high-contrast !right-4 !-top-10 lg:!right-8 lg:!-top-12 2xl:!-top-16 2xl:!right-16 !transition-transform !duration-100 hover:!text-high-contrast hover:scale-110;
+}
+
+.pdp .glider-prev {
+  @apply text-high-contrast absolute !left-4 !top-1/2 !transition-transform !duration-100 hover:!text-high-contrast hover:scale-100 lg:hidden;
+}
+
+.pdp .glider-next {
+  @apply text-high-contrast absolute !right-4 !top-1/2 !transition-transform !duration-100 hover:!text-high-contrast hover:scale-100 lg:hidden;
 }

components/layout/dynamic-content-manager/dynamic-content-manager.tsx

@@ -2,7 +2,6 @@
 
 import { Info } from 'lucide-react';
 import dynamic from 'next/dynamic';
-import './dynamic-content.css';
 
 import Hero from 'components/modules/hero';
 const Slider = dynamic(() => import('components/modules/slider'))

components/layout/dynamic-content-manager/dynamic-content.css

@@ -1,23 +0,0 @@
-.dynamic-content > :not(.hero) {
-  @apply my-16 lg:my-24;
-}
-
-.dynamic-content > :first-child {
-  @apply mt-0 md:mt-0 lg:mt-0;
-}
-
-.dynamic-content > :last-child {
-  @apply mb-16 lg:mb-24;
-}
-
-.dynamic-content .dynamic-content {
-  @apply px-0 md:px-0;
-}
-
-.dynamic-content .dynamic-content > {
-  @apply my-0 md:my-0 lg:my-0;
-}
-
-.dynamic-content .dynamic-content > :last-child {
-  @apply my-0 md:my-0 lg:my-0;
-}

components/modules/carousel/carousel.css

@@ -1,37 +0,0 @@
-/* Glider slider. */
-.glider {
-  scrollbar-width: none;
-  -ms-overflow-style: none;
-}
-
-.glider::-webkit-scrollbar {
-  display: none;
-}
-
-.glider-dots {
-  @apply flex !space-x-[2px] !mt-8;
-}
-
-.glider-dot {
-  @apply !m-0 !rounded-none !w-12 !h-4 !bg-transparent after:content-[''] after:block after:w-12 after:h-[3px] after:bg-ui-border 2xl:!w-16 2xl:after:w-16;
-}
-
-.glider-dot.active {
-  @apply after:!bg-high-contrast;
-}
-
-.glider-prev {
-  @apply text-high-contrast !right-12 !-top-10 !left-auto lg:!right-16 lg:!-top-12 2xl:!-top-16 2xl:!right-[100px] !transition-transform !duration-100 hover:!text-high-contrast hover:scale-110;
-}
-
-.glider-next {
-  @apply text-high-contrast !right-4 !-top-10 lg:!right-8 lg:!-top-12 2xl:!-top-16 2xl:!right-16 !transition-transform !duration-100 hover:!text-high-contrast hover:scale-110;
-}
-
-.pdp .glider-prev {
-  @apply text-high-contrast absolute !left-4 !top-1/2 !transition-transform !duration-100 hover:!text-high-contrast hover:scale-100 lg:hidden;
-}
-
-.pdp .glider-next {
-  @apply text-high-contrast absolute !right-4 !top-1/2 !transition-transform !duration-100 hover:!text-high-contrast hover:scale-100 lg:hidden;
-}

components/modules/carousel/carousel.tsx

@@ -2,7 +2,6 @@ import 'glider-js/glider.min.css';
 import { ArrowLeft, ArrowRight } from 'lucide-react';
 import React from 'react';
 import Glider from 'react-glider';
-import './carousel.css';
 
 export interface CarouselItemProps {
   children: React.ReactNode