merge(mobile): ادغام شاخهٔ new-one2 — طراحی ریسپانسیو صفحهٔ اصلی (کلاس‌های breakpoint در همهٔ بخش‌ها) با حفظ تغییرات طراحی ما: تیم وسط‌چین بدون دایره، پروژه‌های شاخص بدون تب، تناوب پس‌زمینه (tone)، پس‌زمینهٔ پیوستهٔ تماس و منطق دوزبانهٔ مقالات

frontend/src/components/home/FeaturedProjects.tsx

@@ -22,18 +22,18 @@ export function FeaturedProjects() {
     .sort((a, b) => FEATURED_TITLES.indexOf(a.title) - FEATURED_TITLES.indexOf(b.title))
 
   return (
-    <section className="bg-char py-24 lg:py-32" aria-labelledby="projects-title">
-      <div className="mx-auto max-w-site px-6 lg:px-10">
+    <section className="w-full max-w-full overflow-x-clip bg-char py-16 md:py-24 lg:py-32" aria-labelledby="projects-title">
+      <div className="mx-auto max-w-site px-4 md:px-6 lg:px-10">
         <SectionHeading title={heading.title} lead={heading.lead} headingKey="featured_projects" />
 
-        <div className="mt-10 min-h-[420px]">
+        <div className="mt-8 min-h-[420px] md:mt-10">
           <AnimatePresence mode="wait">
             <motion.div
               key="featured"
               initial={{ opacity: 0, y: 15 }}
               animate={{ opacity: 1, y: 0 }}
               transition={{ duration: 0.3, ease: [0.23, 1, 0.32, 1] }}
-              className="grid gap-6 lg:grid-cols-3"
+              className="flex gap-4 overflow-x-auto pb-4 snap-x snap-mandatory [&::-webkit-scrollbar]:hidden [-ms-overflow-style:none] [scrollbar-width:none] md:grid md:grid-cols-3 md:gap-6 md:overflow-visible md:pb-0"
             >
               {list.map((project, i) => {
                 const imageUrl = project.image || undefined;
@@ -44,7 +44,7 @@ export function FeaturedProjects() {
                     initial={{ opacity: 0, y: 20 }}
                     animate={{ opacity: 1, y: 0 }}
                     transition={{ duration: 0.5, delay: i * 0.1, ease: [0.23, 1, 0.32, 1] }}
-                    className="h-full"
+                    className="h-full w-[82vw] max-w-[320px] shrink-0 snap-center md:w-auto md:max-w-none md:shrink"
                   >
                     <ProjectCard 
                       project={project} 
@@ -61,7 +61,7 @@ export function FeaturedProjects() {
         {/* دکمه مشاهده همه پروژه‌ها */}
         {heading.cta_label && heading.cta_href && (
           <Reveal delay={0.1}>
-            <div className="mt-12 flex justify-center">
+            <div className="mt-10 flex justify-center md:mt-12">
               <PremiumButton to={href(heading.cta_href)}>
                 <InlineEdit
                   value={heading.cta_label}