made breadcrumbs

src/app/[locale]/news/News.scss

@@ -1,21 +1,25 @@
 .news {
   display: flex;
   flex-direction: column;
-  gap: 40px;
 
   h2 {
     width: fit-content;
+    margin-bottom: 40px;
   }
 }
 
 @media screen and (max-width: 768px) {
   .news {
-    gap: 30px;
+    h2 {
+      margin-bottom: 30px;
+    }
   }
 }
 
 @media screen and (max-width: 550px) {
   .news {
-    gap: 20px;
+    h2 {
+      margin-bottom: 20px;
+    }
   }
 }

src/app/[locale]/news/[id]/page.tsx

@@ -6,6 +6,7 @@ import Image from "next/image";
 import message from "./icons/message.svg";
 import calendar from "./icons/calendar.svg";
 import ReviewSection from "@/widgets/ReviewSection/ReviewSection";
+import BreadCrumbs from "@/features/BreadCrumbs/BreadCrumbs";
 
 const NewsDetails = async ({
   params,
@@ -39,6 +40,7 @@ const NewsDetails = async ({
 
   return (
     <div className="news-details page-padding">
+      <BreadCrumbs />
       <Typography element="h2">{data.title}</Typography>
 
       <div className="news-details__img">

src/app/[locale]/news/page.tsx

@@ -1,3 +1,4 @@
+import BreadCrumbs from "@/features/BreadCrumbs/BreadCrumbs";
 import "./News.scss";
 import Typography from "@/shared/ui/components/Typography/Typography";
 import NewsList from "@/widgets/NewsList/NewsList";
@@ -5,8 +6,7 @@ import { Metadata } from "next";
 
 export const metadata: Metadata = {
   title: "KG ROAD | Новости",
-  description:
-    "Страница новостей KG ROAD",
+  description: "Страница новостей KG ROAD",
 };
 
 const News = ({
@@ -18,6 +18,8 @@ const News = ({
 }) => {
   return (
     <div className="news page-padding">
+      <BreadCrumbs homeRequired />
+
       <Typography element="h2">Новости</Typography>
 
       <NewsList searchParams={searchParams} />