src/entities/Section/ui/SectionAccordion/SectionAccordion.tsx

@@ -36,8 +36,8 @@ export function SectionAccordion({ number, title, id, isActive, href, children }
   return (
     <section id={id} className="scroll-mt-8">
       {isActive ? (
-        <ViewTransitionWrapper name="section-content">
-          <div className="mb-12">
+        <div className="mb-12">
+          <ViewTransitionWrapper name="section-content">
             <div className="mb-16">
               <h1
                 className="font-heading font-black text-5xl leading-[1.2] mb-0"
@@ -46,16 +46,15 @@ export function SectionAccordion({ number, title, id, isActive, href, children }
                 {number}. {title}
               </h1>
             </div>
+          </ViewTransitionWrapper>
+          <ViewTransitionWrapper name="section-body">
             <div className="section-content">{children}</div>
-          </div>
-        </ViewTransitionWrapper>
+          </ViewTransitionWrapper>
+        </div>
       ) : (
-        <Link
-          href={href}
-          className="block w-full text-left mb-3 py-3 transition-all duration-200 hover:opacity-60 group border-b-0 hover:border-b-0"
-        >
+        <Link href={href} className="block w-full text-left mb-3 py-3 group border-b-0 hover:border-b-0">
           <h2
-            className="font-heading font-black text-2xl sm:text-3xl opacity-30 group-hover:opacity-50 transition-opacity"
+            className="font-heading font-black text-2xl sm:text-3xl opacity-30 group-hover:opacity-60 transition-opacity duration-200"
             style={{ fontVariationSettings: "'WONK' 1, 'SOFT' 0" }}
           >
             {number}. {title}