change responsive page doctors & change modal and responsive & responsive page doctor item

components/doctor/detailDoctor/cards/AboutDcotor.js

@@ -1,6 +1,10 @@
 function AboutDcotor({ doctor }) {
     return (
         <div>
+            <a
+                id="about-doctor"
+                className='absolute -translate-y-[148px] sm:-translate-y-[157px] md:-translate-y-[166px] lg:-translate-y-[176px]'
+            ></a>
             <p className="text-[#616161] text-[14px] font-normal text-justify">{doctor.detail}</p>
             <div className="my-2">
                 <p className="text-[#525252] text-[16px] font-bold">تخصص ها</p>

components/doctor/detailDoctor/cards/LocationDoctor.js

@@ -1,7 +1,11 @@
 function LocationDoctor({ doctor }) {
     return (
         <div>
-            <div className="my-8">
+            <a
+                id="location"
+                className='absolute -translate-y-[148px] sm:-translate-y-[157px] md:-translate-y-[166px] lg:-translate-y-[176px]'
+            ></a>
+            <div className="mb-[16px] mt-[32px]">
                 <p className="text-[#525252] text-[20px] font-bold">موقعیت مکانی </p>
             </div>
             <div className="gap-4 flex flex-col items-start">

components/doctor/detailDoctor/cards/comments/index.js

@@ -5,8 +5,12 @@ import Comment from '@/app/component/comment'
 function Comments({ doctor }) {
     return (
         <div className='mt-4'>
+            <a
+                id="comments"
+                className='absolute -translate-y-[148px] sm:-translate-y-[157px] md:-translate-y-[166px] lg:-translate-y-[176px]'
+            ></a>
             <div>
-                <p className="text-[#525252] text-[20px] font-bold">موقعیت مکانی </p>
+                <p className="text-[#525252] text-[20px] font-bold">نظرات کاربران </p>
             </div>
             <div className='mt-8 flex items-center justify-start'>
                 <p className='text-[#616161] text-[16px] font-normal'>شما هم نظر خود را در مورد این پزشک به اشتراک بگذارید:</p>