diff --git a/biome.json b/biome.json
index 1eff60e..8a20156 100644
--- a/biome.json
+++ b/biome.json
@@ -1,10 +1,45 @@
 {
-	"$schema": "https://biomejs.dev/schemas/2.3.11/schema.json",
+	"$schema": "https://biomejs.dev/schemas/2.4.11/schema.json",
 	"files": {
 		"includes": [
-			"frontend/**",
-			"!!**/node_modules",
-			"!!**/dist"
+			"frontend/**"
 		]
+	},
+	"vcs": {
+		"enabled": true,
+		"clientKind": "git",
+		"useIgnoreFile": true
+	},
+	"formatter": {
+		"enabled": true,
+		"indentStyle": "tab"
+	},
+	"linter": {
+		"enabled": true,
+		"rules": {
+			"recommended": true,
+			"suspicious": {
+				"noArrayIndexKey": "off",
+				"noExplicitAny": "off",
+				"noImplicitAnyLet": "off",
+				"noUnknownAtRules": "off"
+			},
+			"a11y": {
+				"noSvgWithoutTitle": "off",
+				"noLabelWithoutControl": "off",
+				"useSemanticElements": "off"
+			},
+			"style": {
+				"noNonNullAssertion": "off"
+			},
+			"correctness": {
+				"useExhaustiveDependencies": "off"
+			}
+		}
+	},
+	"javascript": {
+		"formatter": {
+			"quoteStyle": "double"
+		}
 	}
 }
diff --git a/frontend/form/index.html b/frontend/form/index.html
index aa05a9d..d5fa90b 100644
--- a/frontend/form/index.html
+++ b/frontend/form/index.html
@@ -11,7 +11,7 @@
     <!-- Critical CSS inlined for faster FCP -->
     <style>
       html, body { background-color: #ffffff; margin: 0; padding: 0; }
-            #root { min-height: 100vh; }
+                  #root { min-height: 100vh; }
     </style>
     <!-- Preconnect to external origins -->
     <link rel="preconnect" href="https://fonts.googleapis.com" />
diff --git a/frontend/gdg-website/biome.json b/frontend/gdg-website/biome.json
deleted file mode 100644
index 8700070..0000000
--- a/frontend/gdg-website/biome.json
+++ /dev/null
@@ -1,56 +0,0 @@
-{
-	"$schema": "https://biomejs.dev/schemas/2.4.11/schema.json",
-	"root": false,
-
-	"vcs": {
-		"enabled": true,
-		"clientKind": "git",
-		"useIgnoreFile": true
-	},
-	"files": {
-		"ignoreUnknown": false,
-		"includes": ["**/*.ts", "**/*.tsx", "**/*.js", "**/*.jsx", "**/*.json"]
-	},
-	"formatter": {
-		"enabled": true,
-		"indentStyle": "tab"
-	},
-	"linter": {
-		"enabled": true,
-		"rules": {
-			"recommended": true,
-			"suspicious": {
-				"noArrayIndexKey": "off",
-				"noExplicitAny": "off",
-				"noImplicitAnyLet": "off"
-			},
-			"a11y": {
-				"noSvgWithoutTitle": "off",
-				"noLabelWithoutControl": "off",
-				"useSemanticElements": "off"
-			},
-			"style": {
-				"noNonNullAssertion": "off"
-			},
-			"correctness": {
-				"useExhaustiveDependencies": "off"
-			}
-		}
-	},
-	"javascript": {
-		"formatter": {
-			"quoteStyle": "double"
-		}
-	},
-	"overrides": [
-		{
-			"includes": ["**/dist/**", "**/node_modules/**", "**/tsconfig*.json"],
-			"linter": {
-				"enabled": false
-			},
-			"formatter": {
-				"enabled": false
-			}
-		}
-	]
-}
diff --git a/frontend/gdg-website/src/components/common/Card.tsx b/frontend/gdg-website/src/components/common/Card.tsx
index 7a663ce..9f9c0c9 100644
--- a/frontend/gdg-website/src/components/common/Card.tsx
+++ b/frontend/gdg-website/src/components/common/Card.tsx
@@ -55,15 +55,15 @@ export const Card: React.FC<CardProps> = ({
 	};
 
 	return (
-		// biome-ignore lint/a11y/noStaticElementInteractions: conditional role is not recognized by Biome
-		<div
+		<button
+			type={clickable ? "button" : undefined}
 			className={classNames}
-			onClick={handleClick}
-			onKeyDown={handleKeyDown}
-			role={clickable ? "button" : undefined}
-			tabIndex={clickable ? 0 : undefined}
+			onClick={clickable ? handleClick : undefined}
+			onKeyDown={clickable ? handleKeyDown : undefined}
+			disabled={!clickable}
+			aria-disabled={!clickable}
 		>
 			{children}
-		</div>
+		</button>
 	);
 };
diff --git a/frontend/gdg-website/src/components/common/Feedback.tsx b/frontend/gdg-website/src/components/common/Feedback.tsx
index 36cefcc..e1cbb2d 100644
--- a/frontend/gdg-website/src/components/common/Feedback.tsx
+++ b/frontend/gdg-website/src/components/common/Feedback.tsx
@@ -9,7 +9,7 @@ export const Feedback: React.FC<FeedbackProps> = ({
 }) => {
 	return (
 		<div
-			className={`flex flex-col items-center py-12 px-6 min-h-[420px] relative ${className}`}
+			className={`flex w-full max-w-full overflow-x-clip flex-col items-center py-12 px-4 sm:px-6 min-h-[420px] relative ${className}`}
 		>
 			<div className="flex gap-2 mb-8">
 				<div className="w-3 h-3 rounded-full bg-[#4285F4]" />
@@ -18,7 +18,7 @@ export const Feedback: React.FC<FeedbackProps> = ({
 				<div className="w-3 h-3 rounded-full bg-[#34A853]" />
 			</div>
 
-			<div className="bg-white border border-[#dadce0] rounded-[24px] pt-10 pb-8 px-5 sm:px-10 max-w-[540px] w-full text-center relative overflow-hidden shadow-sm">
+			<div className="bg-white border border-[#dadce0] rounded-[24px] pt-10 pb-8 px-4 sm:px-10 max-w-[540px] w-full text-center relative overflow-hidden shadow-sm">
 				<div
 					className="absolute top-0 left-0 right-0 h-1"
 					style={{
@@ -48,7 +48,7 @@ export const Feedback: React.FC<FeedbackProps> = ({
 
 				<a
 					href="mailto:gdgoncampus.yu@gmail.com"
-					className="inline-flex items-center gap-2.5 bg-[#4285F4] text-white border-none rounded-full px-7 py-[13px] text-[14px] font-medium cursor-pointer tracking-[0.1px] transition-all hover:bg-[#3367D6] hover:-translate-y-[1px] active:scale-95 mb-6"
+					className="inline-flex w-full max-w-[320px] items-center justify-center gap-2 bg-[#4285F4] text-white border-none rounded-full px-4 sm:px-7 py-[13px] text-[13px] sm:text-[14px] font-medium cursor-pointer tracking-[0.1px] transition-all hover:bg-[#3367D6] hover:-translate-y-[1px] active:scale-95 mb-6 break-all"
 				>
 					<svg viewBox="0 0 24 24" fill="none" className="w-4 h-4 shrink-0">
 						<path
diff --git a/frontend/gdg-website/src/components/features/FlowingMenu.tsx b/frontend/gdg-website/src/components/features/FlowingMenu.tsx
index c30f79f..3a57fd3 100644
--- a/frontend/gdg-website/src/components/features/FlowingMenu.tsx
+++ b/frontend/gdg-website/src/components/features/FlowingMenu.tsx
@@ -66,7 +66,7 @@ interface MenuItemProps {
 }
 
 function MenuItem({
-	link: _link,
+	link,
 	text,
 	image,
 	speed,
@@ -76,7 +76,7 @@ function MenuItem({
 	borderColor,
 	fontClass,
 }: MenuItemProps) {
-	const itemRef = useRef<HTMLDivElement>(null);
+	const itemRef = useRef<HTMLAnchorElement>(null);
 	const marqueeRef = useRef<HTMLDivElement>(null);
 	const marqueeInnerRef = useRef<HTMLDivElement>(null);
 	const animationRef = useRef<gsap.core.Tween | null>(null);
@@ -212,10 +212,10 @@ function MenuItem({
 		(fontClass && !FLOWING_MENU_FONT_TW[fontClass] ? fontClass : "");
 
 	return (
-		// biome-ignore lint/a11y/noStaticElementInteractions: this wrapper handles mouse interactions for visual effects
-		<div
+		<a
+			href={link}
 			ref={itemRef}
-			className="flex-1 relative overflow-hidden text-center border-t border-solid bg-transparent first:border-t-0 pointer-events-auto"
+			className="flex-1 relative overflow-hidden text-center border-t border-solid bg-transparent first:border-t-0 pointer-events-auto block no-underline"
 			style={{ borderColor }}
 			onMouseEnter={handleMouseEnter}
 			onMouseLeave={handleMouseLeave}
@@ -247,7 +247,7 @@ function MenuItem({
 					</div>
 				</div>
 			</div>
-		</div>
+		</a>
 	);
 }
 
diff --git a/frontend/gdg-website/src/components/features/OrganizerCard.tsx b/frontend/gdg-website/src/components/features/OrganizerCard.tsx
index c295b7e..1e72c52 100644
--- a/frontend/gdg-website/src/components/features/OrganizerCard.tsx
+++ b/frontend/gdg-website/src/components/features/OrganizerCard.tsx
@@ -34,10 +34,10 @@ export const OrganizerCard: React.FC<OrganizerCardProps> = ({
 			}}
 			className="flex flex-col items-center group w-full"
 		>
-			<div className="relative mb-8">
+			<div className="relative mb-5 sm:mb-8">
 				{/* Image Container with Glow */}
 				<div className="absolute -inset-4 bg-gradient-to-tr from-purple-500/20 to-blue-500/20 rounded-full blur-2xl opacity-0 group-hover:opacity-100 transition-opacity duration-500" />
-				<div className="w-48 h-48 md:w-64 md:h-64 rounded-full overflow-hidden border-2 border-white/10 relative z-10 group-hover:border-white/30 transition-colors duration-300">
+				<div className="w-36 h-36 sm:w-48 sm:h-48 md:w-64 md:h-64 rounded-full overflow-hidden border-2 border-white/10 relative z-10 group-hover:border-white/30 transition-colors duration-300">
 					<img
 						src={member.photoUrl}
 						alt={member.name}
@@ -47,12 +47,12 @@ export const OrganizerCard: React.FC<OrganizerCardProps> = ({
 				</div>
 			</div>
 
-			<div className="text-center space-y-1">
-				<h3 className="text-xl md:text-2xl font-bold tracking-tight text-gray-200 group-hover:text-white transition-colors">
+			<div className="text-center space-y-1 px-2">
+				<h3 className="text-lg sm:text-xl md:text-2xl font-bold tracking-tight text-gray-200 group-hover:text-white transition-colors break-words">
 					{member.name}
 				</h3>
 				{member.title && (
-					<p className="text-sm md:text-base text-gray-500 font-medium tracking-wide">
+					<p className="text-xs sm:text-sm md:text-base text-gray-500 font-medium tracking-wide">
 						{member.title}
 					</p>
 				)}
@@ -64,7 +64,7 @@ export const OrganizerCard: React.FC<OrganizerCardProps> = ({
 				rel="noopener noreferrer"
 				whileHover={{ scale: 1.1 }}
 				whileTap={{ scale: 0.9 }}
-				className="mt-6 p-2 rounded-lg bg-white/5 hover:bg-white/10 border border-white/5 hover:border-white/20 transition-all text-gray-400 hover:text-[#0077b5]"
+				className="mt-4 sm:mt-6 p-2 rounded-lg bg-white/5 hover:bg-white/10 border border-white/5 hover:border-white/20 transition-all text-gray-400 hover:text-[#0077b5]"
 				aria-label={`${member.name}'s LinkedIn`}
 			>
 				<LinkedinIcon />
diff --git a/frontend/gdg-website/src/components/features/TeamMemberCard.tsx b/frontend/gdg-website/src/components/features/TeamMemberCard.tsx
index 2c0db9d..bc01ef3 100644
--- a/frontend/gdg-website/src/components/features/TeamMemberCard.tsx
+++ b/frontend/gdg-website/src/components/features/TeamMemberCard.tsx
@@ -51,13 +51,13 @@ export const TeamMemberCard: React.FC<TeamMemberCardProps> = ({
 				type: "spring",
 				bounce: 0.35,
 			}}
-			className={`flex min-w-0 w-full flex-col items-center bg-transparent rounded-[var(--border-radius-md)] px-2 py-4 sm:px-4 sm:py-6 shadow-none transition-none hover:shadow-none hover:translate-y-0 hover:bg-transparent text-white ${className}`}
+			className={`flex min-w-0 w-full flex-col items-center bg-transparent rounded-[var(--border-radius-md)] px-1 py-3 sm:px-4 sm:py-6 shadow-none transition-none hover:shadow-none hover:translate-y-0 hover:bg-transparent text-white ${className}`}
 			data-role={member.role}
 		>
-			<div className="relative mb-4 group">
+			<div className="relative mb-3 sm:mb-4 group">
 				<div className="absolute -inset-2 bg-gradient-to-tr from-current to-transparent rounded-full blur-xl opacity-0 group-hover:opacity-20 transition-opacity duration-500" />
 				<div
-					className={`relative z-10 rounded-full overflow-hidden bg-black/5 border-2 border-transparent group-hover:border-current transition-colors duration-300 ${isTeamLeader ? "w-28 h-28 sm:w-32 sm:h-32 md:w-36 md:h-36" : "w-24 h-24 sm:w-28 sm:h-28 md:w-32 md:h-32"}`}
+					className={`relative z-10 rounded-full overflow-hidden bg-black/5 border-2 border-transparent group-hover:border-current transition-colors duration-300 ${isTeamLeader ? "w-24 h-24 sm:w-32 sm:h-32 md:w-36 md:h-36" : "w-20 h-20 sm:w-28 sm:h-28 md:w-32 md:h-32"}`}
 				>
 					<img
 						src={member.photoUrl}
@@ -69,25 +69,25 @@ export const TeamMemberCard: React.FC<TeamMemberCardProps> = ({
 				</div>
 			</div>
 			<h3
-				className={`font-bold text-gray-200 group-hover:text-white transition-colors mb-1 m-0 text-center mt-4 ${nameClass}`}
+				className={`font-bold text-gray-200 group-hover:text-white transition-colors mb-1 m-0 text-center mt-2 sm:mt-4 leading-tight break-words ${nameClass}`}
 			>
 				{member.name}
 			</h3>
 			<p
-				className={`${memberTitleClass} text-gray-400 group-hover:text-gray-300 transition-colors mb-2 m-0 text-center tracking-wide`}
+				className={`${memberTitleClass} text-gray-400 group-hover:text-gray-300 transition-colors mb-2 m-0 text-center tracking-wide leading-tight`}
 			>
 				{displayTitle}
 			</p>
 
 			{member.socialLinks.length > 0 && (
-				<div className="flex gap-2 mt-2">
+				<div className="flex gap-2 mt-1 sm:mt-2">
 					{member.socialLinks.map((link) => (
 						<a
 							key={link.platform}
 							href={link.url}
 							target="_blank"
 							rel="noopener noreferrer"
-							className="mt-2 p-2 rounded-lg bg-white/5 hover:bg-white/10 border border-white/5 hover:border-white/20 transition-all text-gray-400 hover:text-[#0077b5]"
+							className="mt-1 sm:mt-2 p-1.5 sm:p-2 rounded-lg bg-white/5 hover:bg-white/10 border border-white/5 hover:border-white/20 transition-all text-gray-400 hover:text-[#0077b5]"
 							aria-label={`${member.name}'s ${link.platform}`}
 						>
 							{getSocialIcon(link.platform)}
diff --git a/frontend/gdg-website/src/components/layout/Footer.tsx b/frontend/gdg-website/src/components/layout/Footer.tsx
index 7f891a2..9c25afd 100644
--- a/frontend/gdg-website/src/components/layout/Footer.tsx
+++ b/frontend/gdg-website/src/components/layout/Footer.tsx
@@ -56,9 +56,9 @@ const socialLinks = [
 export const Footer: React.FC<FooterProps> = ({ className = "" }) => {
 	return (
 		<footer
-			className={`bg-[#f8f9fa] border-t border-[#dadce0] px-4 py-2 mt-8 ${className}`}
+			className={`bg-[#f8f9fa] border-t border-[#dadce0] px-4 py-2 mt-8 w-full max-w-full overflow-x-clip ${className}`}
 		>
-			<div className="max-w-[1200px] mx-auto flex flex-col md:flex-row items-center justify-between gap-2">
+			<div className="max-w-[1200px] mx-auto flex flex-col md:flex-row items-center justify-between gap-2 w-full">
 				<div className="flex items-center gap-2 mb-2 md:mb-0">
 					<img
 						src="https://raw.githubusercontent.com/GDG-Yasar-Software-Team/core/refs/heads/main/frontend/form/public/gdg-logo.png"
@@ -70,7 +70,7 @@ export const Footer: React.FC<FooterProps> = ({ className = "" }) => {
 					</h3>
 				</div>
 
-				<div className="flex items-center scale-75 origin-center md:origin-right">
+				<div className="flex items-center scale-75 origin-center md:origin-right max-w-full overflow-x-auto md:overflow-visible">
 					<AnimatedSocialDock items={socialLinks} />
 				</div>
 			</div>
diff --git a/frontend/gdg-website/src/pages/About/AboutPage.tsx b/frontend/gdg-website/src/pages/About/AboutPage.tsx
index 9766c81..60d8077 100644
--- a/frontend/gdg-website/src/pages/About/AboutPage.tsx
+++ b/frontend/gdg-website/src/pages/About/AboutPage.tsx
@@ -45,22 +45,22 @@ const GALLERY_IMAGES = [
 
 export const AboutPage: React.FC = () => {
 	return (
-		<div className="min-h-screen flex flex-col bg-white overflow-hidden">
+		<div className="min-h-screen flex flex-col bg-white overflow-x-clip max-w-full">
 			<Navigation />
-			<main className="flex-1">
+			<main className="flex-1 overflow-x-clip max-w-full">
 				{/* Who Are We Section */}
-				<section className="flex flex-col lg:flex-row w-full min-h-[75vh]">
-					<div className="relative w-full lg:w-1/2 bg-[#121212] text-white p-12 lg:p-24 flex flex-col justify-center">
+				<section className="flex flex-col lg:flex-row w-full max-w-full min-h-[75vh] overflow-x-clip">
+					<div className="relative w-full lg:w-1/2 bg-[#121212] text-white p-6 sm:p-8 lg:p-24 flex flex-col justify-center">
 						<div className="max-w-xl mx-auto lg:ml-0 z-10 w-full">
-							<h1 className="text-4xl md:text-5xl lg:text-6xl font-extrabold mb-8 tracking-tight leading-tight">
+							<h1 className="text-3xl sm:text-4xl md:text-5xl lg:text-6xl font-extrabold mb-6 sm:mb-8 tracking-tight leading-tight">
 								Who Are We?
 							</h1>
-							<p className="text-gray-300 text-lg md:text-xl leading-relaxed mb-6 font-medium">
+							<p className="text-gray-300 text-base sm:text-lg md:text-xl leading-relaxed mb-5 sm:mb-6 font-medium">
 								We are a university-based student community that brings together
 								individuals interested in technology, innovation, and personal
 								development.
 							</p>
-							<p className="text-gray-400 text-base md:text-lg leading-relaxed mb-10">
+							<p className="text-gray-400 text-sm sm:text-base md:text-lg leading-relaxed mb-7 sm:mb-10">
 								Our members come from different backgrounds, but we share a
 								common goal: learning by doing and growing together.
 							</p>
@@ -68,12 +68,12 @@ export const AboutPage: React.FC = () => {
 								href="https://gdg.community.dev/gdg-on-campus-yasar-university-izmir-turkey/"
 								target="_blank"
 								rel="noopener noreferrer"
-								className="inline-block bg-[#4285F4] hover:bg-blue-600 text-white font-semibold py-4 px-10 rounded-full transition-all shadow-lg hover:shadow-blue-500/30 transform hover:-translate-y-1 w-max"
+								className="inline-flex items-center justify-center bg-[#4285F4] hover:bg-blue-600 text-white text-sm sm:text-base font-semibold py-3 sm:py-4 px-6 sm:px-10 rounded-full transition-all shadow-lg hover:shadow-blue-500/30 transform hover:-translate-y-1 w-full sm:w-max"
 							>
 								Join the Community
 							</a>
 						</div>
-						<div className="absolute bottom-12 right-12 opacity-30 pointer-events-none">
+						<div className="absolute bottom-6 right-6 sm:bottom-12 sm:right-12 opacity-30 pointer-events-none hidden sm:block">
 							<svg
 								width="64"
 								height="80"
@@ -91,9 +91,9 @@ export const AboutPage: React.FC = () => {
 						</div>
 					</div>
 
-					<div className="w-full lg:w-1/2 bg-[#4285F4] p-8 lg:p-0 flex items-center justify-center relative overflow-hidden">
-						<div className="relative w-full max-w-[500px] aspect-square lg:h-[75%] lg:w-[75%] lg:max-w-none z-10">
-							<div className="absolute inset-0 bg-white/10 rounded-[4rem] md:rounded-[6rem] lg:rounded-[120px_20px_120px_20px] overflow-hidden shadow-2xl">
+					<div className="w-full lg:w-1/2 bg-[#4285F4] p-4 sm:p-6 lg:p-0 flex items-center justify-center relative overflow-hidden">
+						<div className="relative w-full max-w-[320px] sm:max-w-[460px] aspect-square lg:h-[75%] lg:w-[75%] lg:max-w-none z-10">
+							<div className="absolute inset-0 bg-white/10 rounded-[2.5rem] sm:rounded-[4rem] lg:rounded-[120px_20px_120px_20px] overflow-hidden shadow-2xl">
 								<img
 									src="https://raw.githubusercontent.com/GDG-Yasar-Software-Team/mail-assets/main/gdg-events/events-picture/64670bc4-2530-468e-a450-bfb3c4b2cd34.jpg"
 									alt="GDG Team"
@@ -101,23 +101,23 @@ export const AboutPage: React.FC = () => {
 								/>
 							</div>
 						</div>
-						<div className="absolute top-[-10%] right-[-10%] w-96 h-96 bg-white/10 rounded-full blur-3xl pointer-events-none"></div>
-						<div className="absolute bottom-[-10%] left-[-10%] w-80 h-80 bg-[#34A853]/20 rounded-full blur-3xl pointer-events-none"></div>
+						<div className="absolute top-[-20%] right-[-30%] sm:top-[-10%] sm:right-[-10%] w-64 h-64 sm:w-96 sm:h-96 bg-white/10 rounded-full blur-3xl pointer-events-none" />
+						<div className="absolute bottom-[-20%] left-[-30%] sm:bottom-[-10%] sm:left-[-10%] w-56 h-56 sm:w-80 sm:h-80 bg-[#34A853]/20 rounded-full blur-3xl pointer-events-none" />
 					</div>
 				</section>
 
-				<div className="bg-[#f8f9fa] py-20 text-center border-y border-gray-200">
-					<h2 className="text-4xl md:text-5xl font-extrabold text-[#202124] mb-6 tracking-tight">
+				<div className="bg-[#f8f9fa] py-14 sm:py-20 text-center border-y border-gray-200 max-w-full overflow-x-clip">
+					<h2 className="text-3xl sm:text-4xl md:text-5xl font-extrabold text-[#202124] mb-5 sm:mb-6 tracking-tight">
 						What Do We Do?
 					</h2>
-					<p className="text-xl text-[#5f6368] max-w-4xl mx-auto px-6 leading-relaxed">
+					<p className="text-base sm:text-lg md:text-xl text-[#5f6368] max-w-4xl mx-auto px-4 sm:px-6 leading-relaxed">
 						We are more than just a club; we are a community that bridges the
 						gap between theory and practice. Check out our diverse domains where
 						we learn, build, and grow together.
 					</p>
 				</div>
 
-				<div className="flex flex-col py-16 px-6 lg:px-24 bg-[#f8f9fa] gap-20 mx-auto">
+				<div className="flex flex-col py-12 sm:py-16 px-4 sm:px-6 lg:px-24 bg-[#f8f9fa] gap-10 sm:gap-14 lg:gap-20 mx-auto max-w-full overflow-x-clip">
 					{[
 						{
 							title: "Hands-on Workshops",
@@ -221,39 +221,37 @@ export const AboutPage: React.FC = () => {
 						return (
 							<div
 								key={block.title}
-								className={`flex flex-col ${isEven ? "lg:flex-row" : "lg:flex-row-reverse"} w-full min-h-[450px] bg-white rounded-[3rem] shadow-sm border border-gray-100 overflow-hidden max-w-[1400px] mx-auto`}
+								className={`flex flex-col ${isEven ? "lg:flex-row" : "lg:flex-row-reverse"} w-full bg-white rounded-[1.5rem] sm:rounded-[2rem] lg:rounded-[3rem] shadow-sm border border-gray-100 overflow-hidden max-w-[1400px] mx-auto`}
 							>
-								<div className="w-full lg:w-1/2 p-12 lg:p-20 flex flex-col justify-center">
+								<div className="w-full lg:w-1/2 p-5 sm:p-8 lg:p-20 flex flex-col justify-center">
 									<div className="w-full">
-										<div className="flex items-center gap-4 mb-8">
-											<div
-												className={`w-20 h-20 bg-gray-50 rounded-3xl flex items-center justify-center flex-shrink-0 shadow-sm border border-gray-100`}
-											>
+										<div className="flex items-center flex-wrap gap-3 sm:gap-4 mb-6 sm:mb-8">
+											<div className="w-14 h-14 sm:w-20 sm:h-20 bg-gray-50 rounded-2xl sm:rounded-3xl flex items-center justify-center flex-shrink-0 shadow-sm border border-gray-100">
 												{block.icon}
 											</div>
 											<div
-												className={`inline-block px-5 py-2 rounded-full text-sm font-bold tracking-widest uppercase ${block.color} text-white shadow-sm`}
+												className={`inline-block px-4 py-1.5 sm:px-5 sm:py-2 rounded-full text-xs sm:text-sm font-bold tracking-wide sm:tracking-widest uppercase ${block.color} text-white shadow-sm`}
 											>
 												{block.tag}
 											</div>
 										</div>
-										<h3 className="text-3xl md:text-5xl font-bold mb-6 tracking-tight leading-tight text-[#202124]">
+										<h3 className="text-2xl sm:text-3xl md:text-5xl font-bold mb-4 sm:mb-6 tracking-tight leading-tight text-[#202124] break-words">
 											{block.title}
 										</h3>
-										<p className="text-[#5f6368] text-lg md:text-xl leading-relaxed">
+										<p className="text-[#5f6368] text-base sm:text-lg md:text-xl leading-relaxed">
 											{block.description}
 										</p>
 									</div>
 								</div>
 
-								<div className="w-full lg:w-1/2 p-4 lg:p-6 flex items-center justify-center bg-gray-50/50">
-									<div className="relative w-full h-full min-h-[350px] lg:min-h-[100%] rounded-[2rem] overflow-hidden shadow-md group">
+								<div className="w-full lg:w-1/2 p-3 sm:p-4 lg:p-6 flex items-center justify-center bg-gray-50/50">
+									<div className="relative w-full h-full min-h-[220px] sm:min-h-[300px] lg:min-h-[100%] rounded-[1.25rem] sm:rounded-[2rem] overflow-hidden shadow-md group">
 										<img
 											src={imgUrl}
 											alt={block.title}
 											className="absolute inset-0 w-full h-full object-cover transition-transform duration-700 group-hover:scale-105"
 										/>
-										<div className="absolute inset-0 bg-black/5 group-hover:bg-transparent transition-colors duration-500"></div>
+										<div className="absolute inset-0 bg-black/5 group-hover:bg-transparent transition-colors duration-500" />
 									</div>
 								</div>
 							</div>
@@ -261,20 +259,20 @@ export const AboutPage: React.FC = () => {
 					})}
 				</div>
 
-				<section className="w-full py-24 bg-white overflow-hidden border-t border-gray-100">
-					<div className="text-center mb-16">
-						<h2 className="text-4xl md:text-5xl font-bold text-[#202124] tracking-tight">
+				<section className="w-full max-w-full py-16 sm:py-24 bg-white overflow-x-clip border-t border-gray-100">
+					<div className="text-center mb-10 sm:mb-16 px-4">
+						<h2 className="text-3xl sm:text-4xl md:text-5xl font-bold text-[#202124] tracking-tight">
 							Moments From Our Team
 						</h2>
-						<p className="text-gray-500 mt-3 text-lg">
+						<p className="text-gray-500 mt-3 text-base sm:text-lg">
 							Every moment we spend together, learning, and having fun...
 						</p>
 					</div>
-					<div className="w-full h-[400px] sm:h-[500px] md:h-[600px] relative pointer-events-auto">
+					<div className="w-full h-[300px] sm:h-[420px] md:h-[560px] relative pointer-events-auto">
 						<DomeGallery
 							images={GALLERY_IMAGES}
 							fit={0.8}
-							minRadius={300}
+							minRadius={180}
 							maxVerticalRotationDeg={0}
 							segments={22}
 							dragDampening={2}
@@ -285,7 +283,7 @@ export const AboutPage: React.FC = () => {
 				</section>
 
 				<div className="border-t border-gray-100">
-					<Feedback className="bg-white py-24" />
+					<Feedback className="bg-white py-16 sm:py-24" />
 				</div>
 			</main>
 			<Footer />
diff --git a/frontend/gdg-website/src/pages/Team/TeamPage.tsx b/frontend/gdg-website/src/pages/Team/TeamPage.tsx
index fe9525d..528058b 100644
--- a/frontend/gdg-website/src/pages/Team/TeamPage.tsx
+++ b/frontend/gdg-website/src/pages/Team/TeamPage.tsx
@@ -41,14 +41,14 @@ export const TeamPage: React.FC = () => {
 
 			<Navigation />
 
-			<main className="flex-1 relative z-10 w-full">
+			<main className="flex-1 relative z-10 w-full overflow-x-hidden">
 				{/* Organizers Section */}
 				<section
 					className="min-h-[calc(100dvh-74px)] snap-start w-full flex items-center justify-center relative overflow-visible py-12 md:py-16"
 					data-team-tone="organizers"
 				>
 					<div className="max-w-[1240px] mx-auto px-4 sm:px-6 relative z-10 w-full">
-						<div className="flex flex-col items-center mb-20 text-center">
+						<div className="flex flex-col items-center mb-12 sm:mb-20 text-center px-2">
 							<motion.div
 								initial={{ opacity: 0, y: 50, scale: 0.8 }}
 								whileInView={{ opacity: 1, y: 0, scale: 1 }}
@@ -71,13 +71,13 @@ export const TeamPage: React.FC = () => {
 									type: "spring",
 									bounce: 0.35,
 								}}
-								className="text-4xl sm:text-5xl md:text-7xl font-black tracking-tighter text-white m-0 uppercase"
+								className="text-3xl sm:text-5xl md:text-7xl font-black tracking-tighter text-white m-0 uppercase break-words"
 							>
 								ORGANIZERS
 							</motion.h2>
 						</div>
 
-						<div className="grid grid-cols-1 md:grid-cols-2 gap-12 md:gap-16 max-w-[850px] mx-auto justify-items-center items-start">
+						<div className="grid grid-cols-1 md:grid-cols-2 gap-8 sm:gap-12 md:gap-16 max-w-[850px] mx-auto justify-items-center items-start px-2 sm:px-0">
 							{leaders.map((member, i) => (
 								<OrganizerCard key={member.id} member={member} index={i} />
 							))}
@@ -97,7 +97,7 @@ export const TeamPage: React.FC = () => {
 							className="min-h-[calc(100dvh-74px)] snap-start w-full flex flex-col py-12 md:py-16 hover-trigger relative bg-transparent overflow-visible"
 							data-team-tone="organization"
 						>
-							<div className="flex flex-col items-center mb-8 md:mb-12 text-center relative z-[2]">
+							<div className="flex flex-col items-center mb-8 md:mb-12 text-center relative z-[2] px-2">
 								<motion.div
 									initial={{ opacity: 0, y: 50, scale: 0.8 }}
 									whileInView={{ opacity: 1, y: 0, scale: 1 }}
@@ -120,12 +120,12 @@ export const TeamPage: React.FC = () => {
 										type: "spring",
 										bounce: 0.35,
 									}}
-									className="text-3xl sm:text-4xl md:text-6xl font-black tracking-tighter text-white m-0 uppercase"
+									className="text-2xl sm:text-4xl md:text-6xl font-black tracking-tighter text-white m-0 uppercase break-words"
 								>
 									ORGANIZATION
 								</motion.h2>
 							</div>
-							<div className="flex-1 flex flex-col justify-center px-4 z-[2] max-w-7xl mx-auto w-full">
+							<div className="flex-1 flex flex-col justify-center px-3 sm:px-4 z-[2] max-w-7xl mx-auto w-full">
 								<div className="flex justify-center mb-6 md:mb-10 items-center justify-items-center">
 									{organizationTeam
 										.filter((m) => m.role === "team_lead")
@@ -137,13 +137,13 @@ export const TeamPage: React.FC = () => {
 											/>
 										))}
 								</div>
-								<div className="flex justify-center gap-4 md:gap-6 flex-wrap max-w-7xl mx-auto w-full px-2">
+								<div className="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-5 gap-3 sm:gap-5 max-w-7xl mx-auto w-full">
 									{organizationTeam
 										.filter((m) => m.role === "member")
 										.map((member, idx) => (
 											<div
 												key={member.id}
-												className="w-[130px] sm:w-[150px] md:w-[160px] "
+												className="w-full max-w-[170px] justify-self-center"
 											>
 												<TeamMemberCard member={member} index={idx + 1} />
 											</div>
@@ -157,7 +157,7 @@ export const TeamPage: React.FC = () => {
 							className="min-h-[calc(100dvh-74px)] snap-start w-full flex flex-col py-12 md:py-16 hover-trigger relative bg-transparent overflow-visible"
 							data-team-tone="marketing"
 						>
-							<div className="flex flex-col items-center mb-8 md:mb-12 text-center relative z-[2]">
+							<div className="flex flex-col items-center mb-8 md:mb-12 text-center relative z-[2] px-2">
 								<motion.div
 									initial={{ opacity: 0, y: 50, scale: 0.8 }}
 									whileInView={{ opacity: 1, y: 0, scale: 1 }}
@@ -180,12 +180,12 @@ export const TeamPage: React.FC = () => {
 										type: "spring",
 										bounce: 0.35,
 									}}
-									className="text-3xl sm:text-4xl md:text-6xl font-black tracking-tighter text-white m-0 uppercase"
+									className="text-2xl sm:text-4xl md:text-6xl font-black tracking-tighter text-white m-0 uppercase break-words"
 								>
 									MARKETING
 								</motion.h2>
 							</div>
-							<div className="flex-1 flex flex-col justify-center px-4 z-[2] max-w-7xl mx-auto w-full">
+							<div className="flex-1 flex flex-col justify-center px-3 sm:px-4 z-[2] max-w-7xl mx-auto w-full">
 								<div className="flex justify-center mb-6 md:mb-10 items-center justify-items-center">
 									{marketingTeam
 										.filter((m) => m.role === "team_lead")
@@ -197,13 +197,13 @@ export const TeamPage: React.FC = () => {
 											/>
 										))}
 								</div>
-								<div className="flex justify-center gap-4 md:gap-6 flex-wrap max-w-7xl mx-auto w-full px-2">
+								<div className="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-5 gap-3 sm:gap-5 max-w-7xl mx-auto w-full">
 									{marketingTeam
 										.filter((m) => m.role === "member")
 										.map((member, idx) => (
 											<div
 												key={member.id}
-												className="w-[130px] sm:w-[150px] md:w-[160px] "
+												className="w-full max-w-[170px] justify-self-center"
 											>
 												<TeamMemberCard member={member} index={idx + 1} />
 											</div>
@@ -217,7 +217,7 @@ export const TeamPage: React.FC = () => {
 							className="min-h-[calc(100dvh-74px)] snap-start w-full flex flex-col py-12 md:py-16 hover-trigger relative bg-transparent overflow-visible"
 							data-team-tone="sponsorship"
 						>
-							<div className="flex flex-col items-center mb-8 md:mb-12 text-center relative z-[2]">
+							<div className="flex flex-col items-center mb-8 md:mb-12 text-center relative z-[2] px-2">
 								<motion.div
 									initial={{ opacity: 0, y: 50, scale: 0.8 }}
 									whileInView={{ opacity: 1, y: 0, scale: 1 }}
@@ -240,12 +240,12 @@ export const TeamPage: React.FC = () => {
 										type: "spring",
 										bounce: 0.35,
 									}}
-									className="text-3xl sm:text-4xl md:text-6xl font-black tracking-tighter text-white m-0 uppercase"
+									className="text-2xl sm:text-4xl md:text-6xl font-black tracking-tighter text-white m-0 uppercase break-words"
 								>
 									SPONSORSHIP
 								</motion.h2>
 							</div>
-							<div className="flex-1 flex flex-col justify-center px-4 z-[2] max-w-7xl mx-auto w-full">
+							<div className="flex-1 flex flex-col justify-center px-3 sm:px-4 z-[2] max-w-7xl mx-auto w-full">
 								<div className="flex justify-center mb-6 md:mb-10 items-center justify-items-center">
 									{sponsorshipTeam
 										.filter((m) => m.role === "team_lead")
@@ -257,13 +257,13 @@ export const TeamPage: React.FC = () => {
 											/>
 										))}
 								</div>
-								<div className="flex justify-center gap-4 md:gap-6 flex-wrap max-w-7xl mx-auto w-full px-2">
+								<div className="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-5 gap-3 sm:gap-5 max-w-7xl mx-auto w-full">
 									{sponsorshipTeam
 										.filter((m) => m.role === "member")
 										.map((member, idx) => (
 											<div
 												key={member.id}
-												className="w-[130px] sm:w-[150px] md:w-[160px] "
+												className="w-full max-w-[170px] justify-self-center"
 											>
 												<TeamMemberCard member={member} index={idx + 1} />
 											</div>
@@ -277,7 +277,7 @@ export const TeamPage: React.FC = () => {
 							className="min-h-[calc(100dvh-74px)] snap-start w-full flex flex-col py-12 md:py-16 hover-trigger relative bg-transparent overflow-visible"
 							data-team-tone="software"
 						>
-							<div className="flex flex-col items-center mb-8 md:mb-12 text-center relative z-[2]">
+							<div className="flex flex-col items-center mb-8 md:mb-12 text-center relative z-[2] px-2">
 								<motion.div
 									initial={{ opacity: 0, y: 50, scale: 0.8 }}
 									whileInView={{ opacity: 1, y: 0, scale: 1 }}
@@ -300,12 +300,12 @@ export const TeamPage: React.FC = () => {
 										type: "spring",
 										bounce: 0.35,
 									}}
-									className="text-3xl sm:text-4xl md:text-6xl font-black tracking-tighter text-white m-0 uppercase"
+									className="text-2xl sm:text-4xl md:text-6xl font-black tracking-tighter text-white m-0 uppercase break-words"
 								>
 									SOFTWARE
 								</motion.h2>
 							</div>
-							<div className="flex-1 flex flex-col justify-center px-4 z-[2] max-w-7xl mx-auto w-full">
+							<div className="flex-1 flex flex-col justify-center px-3 sm:px-4 z-[2] max-w-7xl mx-auto w-full">
 								<div className="flex justify-center mb-6 md:mb-10 items-center justify-items-center">
 									{softwareTeam
 										.filter((m) => m.role === "team_lead")
@@ -317,13 +317,13 @@ export const TeamPage: React.FC = () => {
 											/>
 										))}
 								</div>
-								<div className="flex justify-center gap-4 md:gap-6 flex-wrap max-w-7xl mx-auto w-full px-2">
+								<div className="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-5 gap-3 sm:gap-5 max-w-7xl mx-auto w-full">
 									{softwareTeam
 										.filter((m) => m.role === "member")
 										.map((member, idx) => (
 											<div
 												key={member.id}
-												className="w-[130px] sm:w-[150px] md:w-[160px] "
+												className="w-full max-w-[170px] justify-self-center"
 											>
 												<TeamMemberCard member={member} index={idx + 1} />
 											</div>
diff --git a/frontend/gdg-website/src/styles/global.css b/frontend/gdg-website/src/styles/global.css
index 48a88de..5b92fd2 100644
--- a/frontend/gdg-website/src/styles/global.css
+++ b/frontend/gdg-website/src/styles/global.css
@@ -7,17 +7,35 @@
    Note: Most styles now handled by Tailwind
    ======================================== */
 
+/* Tailwind preflight is disabled, so we restore essential sizing defaults */
+*,
+*::before,
+*::after {
+	box-sizing: border-box;
+}
+
+img,
+svg,
+video,
+canvas {
+	max-width: 100%;
+	height: auto;
+}
+
 /* Font smoothing */
 html {
 	-webkit-font-smoothing: antialiased;
 	-moz-osx-font-smoothing: grayscale;
 	text-rendering: optimizeLegibility;
+	overflow-x: hidden;
 }
 
 /* Body defaults */
 body {
 	font-family: var(--font-family);
 	min-height: 100vh;
+	width: 100%;
+	max-width: 100%;
 	margin: 0;
 	padding: 0;
 	overflow-x: hidden;
diff --git a/frontend/gdg-website/src/styles/tailwind.css b/frontend/gdg-website/src/styles/tailwind.css
index 390c0b1..330c3cf 100644
--- a/frontend/gdg-website/src/styles/tailwind.css
+++ b/frontend/gdg-website/src/styles/tailwind.css
@@ -1,4 +1,4 @@
-@tailwind base;
+@tailwind base;
 @tailwind components;
 @tailwind utilities;
 
diff --git a/frontend/gdg-website/translate.cjs b/frontend/gdg-website/translate.cjs
index de492a6..54b8ea2 100644
--- a/frontend/gdg-website/translate.cjs
+++ b/frontend/gdg-website/translate.cjs
@@ -1,16 +1,26 @@
-const fs = require('fs');
-const path = 'C:/Users/burak/Pictures/Screenshots/core/frontend/gdg-website/src/pages/About/AboutPage.tsx';
-let content = fs.readFileSync(path, 'utf8');
+const fs = require("node:fs");
 
-content = content.replace('Biz Kimiz?', 'Who Are We?');
-content = content.replace('Bizler, sadece ders geçmek veya zorunlu staj aramak yerine,\r\n\t\t\t\t\t\t\t\tteknolojiyi öğrenmeye ve yeni bir şeyler üretmeye aşık olduğumuz\r\n\t\t\t\t\t\t\t\tiçin toplanmış bir avuç Yaşar Üniversitesi öğrencisiyiz.', 'We are a group of Yaşar University students gathered because we love learning technology and creating new things, rather than just passing classes or looking for mandatory internships.');
-content = content.replace('Aramızda ilk kez \\"Hello World\\" yazmanın heyecanını yaşayanlar da\r\n\t\t\t\t\t\t\t\tvar, yıllardır kendi projelerini kodlayanlar da... Amacımız\r\n\t\t\t\t\t\t\t\tmükemmel olmak değil; birbirimizden öğrenmek, hata yapmaktan\r\n\t\t\t\t\t\t\t\tkorkmamak ve teknolojinin hızına hep birlikte ayak uydurmak. Ne\r\n\t\t\t\t\t\t\t\tkadar farklı koda baksak da ortak dilimiz: Üretmek.', 'There are some of us experiencing the excitement of writing \\"Hello World\\" for the first time, and some who have been coding their own projects for years... Our goal is not to be perfect; but to learn from each other, not be afraid of making mistakes, and keep up with the speed of technology together. No matter how different the code we look at, our common language is: Creating.');
-content = content.replace('Topluluğa Katıl', 'Join the Community');
-content = content.replace('Neler Yapıyoruz?', 'What Do We Do?');
-content = content.replace('Yapay zeka demolarından, teknik mülakat hazırlıklarına; saatlerce\r\n\t\t\t\t\t\tsüren kodlama atölyelerinden, alanında uzman isimleri dinlediğimiz\r\n\t\t\t\t\t\tseminerlere... Teoride bırakmayıp pratiğe döktüğümüz geçmiş\r\n\t\t\t\t\t\tetkinliklerimize göz at.', 'From AI demos to technical interview preparations; from hours of coding workshops to seminars where we listen to experts in their fields... Check out our past events where we put theory into practice.');
-content = content.replace('Event / Atölye', 'Event / Workshop');
-content = content.replace('Kayıt Ol & Detayları Gör', 'Register & View Details');
-content = content.replace('Ekibimizden Kareler', 'Moments From Our Team');
-content = content.replace('Birlikte olduğumuz, öğrendiğimiz ve eğlendiğimiz her an...', 'Every moment we spend together, learning, and having fun...');
+const path =
+	"C:/Users/burak/Pictures/Screenshots/core/frontend/gdg-website/src/pages/About/AboutPage.tsx";
+let content = fs.readFileSync(path, "utf8");
 
-fs.writeFileSync(path, content, 'utf8');
+const replacements = [
+	[
+		"We are a university-based student community that brings together individuals interested in technology, innovation, and personal development.",
+		"We are a university-based student community that brings together individuals interested in technology, innovation, and personal development.",
+	],
+	[
+		"Our members come from different backgrounds, but we share a common goal: learning by doing and growing together.",
+		"Our members come from different backgrounds, but we share a common goal: learning by doing and growing together.",
+	],
+	[
+		"We are more than just a club; we are a community that bridges the gap between theory and practice. Check out our diverse domains where we learn, build, and grow together.",
+		"We are more than just a club; we are a community that bridges the gap between theory and practice. Check out our diverse domains where we learn, build, and grow together.",
+	],
+];
+
+for (const [search, replacement] of replacements) {
+	content = content.replace(search, replacement);
+}
+
+fs.writeFileSync(path, content, "utf8");
diff --git a/frontend/gdg-website/tsconfig.app.json b/frontend/gdg-website/tsconfig.app.json
index 63201d0..8c2c171 100644
--- a/frontend/gdg-website/tsconfig.app.json
+++ b/frontend/gdg-website/tsconfig.app.json
@@ -7,16 +7,12 @@
 		"module": "ESNext",
 		"types": ["vite/client"],
 		"skipLibCheck": true,
-
-		/* Bundler mode */
 		"moduleResolution": "bundler",
 		"allowImportingTsExtensions": true,
 		"verbatimModuleSyntax": true,
 		"moduleDetection": "force",
 		"noEmit": true,
 		"jsx": "react-jsx",
-
-		/* Path aliases */
 		"baseUrl": ".",
 		"paths": {
 			"@/*": ["src/*"],
@@ -25,8 +21,6 @@
 			"@/types/*": ["src/types/*"],
 			"@/styles/*": ["src/styles/*"]
 		},
-
-		/* Linting */
 		"strict": true,
 		"noUnusedLocals": true,
 		"noUnusedParameters": true,
diff --git a/frontend/gdg-website/tsconfig.node.json b/frontend/gdg-website/tsconfig.node.json
index e75109e..da4028c 100644
--- a/frontend/gdg-website/tsconfig.node.json
+++ b/frontend/gdg-website/tsconfig.node.json
@@ -6,15 +6,11 @@
 		"module": "ESNext",
 		"types": ["node"],
 		"skipLibCheck": true,
-
-		/* Bundler mode */
 		"moduleResolution": "bundler",
 		"allowImportingTsExtensions": true,
 		"verbatimModuleSyntax": true,
 		"moduleDetection": "force",
 		"noEmit": true,
-
-		/* Linting */
 		"strict": true,
 		"noUnusedLocals": true,
 		"noUnusedParameters": true,
diff --git a/frontend/mail/src/hooks/useCampaign.ts b/frontend/mail/src/hooks/useCampaign.ts
index 16c74f2..b72a997 100644
--- a/frontend/mail/src/hooks/useCampaign.ts
+++ b/frontend/mail/src/hooks/useCampaign.ts
@@ -19,7 +19,6 @@ export function useCampaign(campaignId: string | undefined): UseCampaignResult {
 		setRefreshKey((k) => k + 1);
 	}, []);
 
-	// biome-ignore lint/correctness/useExhaustiveDependencies: refreshKey triggers manual refetch
 	useEffect(() => {
 		if (!campaignId) {
 			setIsLoading(false);
diff --git a/frontend/mail/src/hooks/useCampaigns.ts b/frontend/mail/src/hooks/useCampaigns.ts
index 8532109..4c554a9 100644
--- a/frontend/mail/src/hooks/useCampaigns.ts
+++ b/frontend/mail/src/hooks/useCampaigns.ts
@@ -25,7 +25,6 @@ export function useCampaigns(pageSize = 20): UseCampaignsResult {
 		setRefreshKey((k) => k + 1);
 	}, []);
 
-	// biome-ignore lint/correctness/useExhaustiveDependencies: refreshKey triggers manual refetch
 	useEffect(() => {
 		let cancelled = false;
 		setIsLoading(true);