diff --git a/src/app/page.tsx b/src/app/page.tsx
index 13273a3..1a1b0e3 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -12,6 +12,7 @@ import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
 import FooterBase from '@/components/sections/footer/FooterBase';
 import { Zap, Users, Award, Handshake, Github, Linkedin, Twitter } from "lucide-react";
 import { useState } from 'react';
+import { getCTAButtonVariant } from '@/utils/designTokens';
 
 export default function LandingPage() {
   const [flippedCards, setFlippedCards] = useState<{[key: string]: boolean}>({});
@@ -203,7 +204,7 @@ export default function LandingPage() {
                                 href={social.href}
                                 target="_blank"
                                 rel="noopener noreferrer"
-                                className="flex items-center justify-center gap-3 px-4 py-3 rounded-lg bg-white/10 hover:bg-white/20 text-white transition-colors"
+                                className={`flex items-center justify-center gap-3 px-4 py-3 rounded-lg ${getCTAButtonVariant('shift-hover')} text-white transition-colors`}
                                 title={social.label}
                               >
                                 <Icon className="w-5 h-5" />
diff --git a/src/providers/themeProvider/ThemeProvider.tsx b/src/providers/themeProvider/ThemeProvider.tsx
index c99ee83..e81f544 100644
--- a/src/providers/themeProvider/ThemeProvider.tsx
+++ b/src/providers/themeProvider/ThemeProvider.tsx
@@ -1,6 +1,7 @@
 'use client';
 
 import React, { createContext, useContext, useState } from 'react';
+import { getCardStyleClasses } from '@/utils/designTokens';
 
 interface SocialLink {
   platform: string;
@@ -59,7 +60,7 @@ function TeamCard({ member }: TeamCardProps) {
 
   return (
     <div
-      className="h-80 w-full cursor-pointer perspective"
+      className={`h-80 w-full cursor-pointer perspective ${getCardStyleClasses('glass-elevated')}`}
       onMouseEnter={() => setIsFlipped(true)}
       onMouseLeave={() => setIsFlipped(false)}
     >
diff --git a/src/tag/Tag.tsx b/src/tag/Tag.tsx
index cd24300..0772b29 100644
--- a/src/tag/Tag.tsx
+++ b/src/tag/Tag.tsx
@@ -1,6 +1,7 @@
 "use client";
 
 import { useState } from "react";
+import { getCardStyleClasses } from '@/utils/designTokens';
 
 interface TeamMember {
   id: string;
@@ -39,7 +40,7 @@ export default function Tag({ members = defaultMembers }: TagProps) {
           {members.map((member) => (
             <div
               key={member.id}
-              className="h-80 cursor-pointer perspective"
+              className={`h-80 cursor-pointer perspective ${getCardStyleClasses('glass-elevated')}`}
               onClick={() => toggleFlip(member.id)}
             >
               <div