diff --git a/apps/web/vibes/soul/form/radio-group/index.tsx b/apps/web/vibes/soul/form/radio-group/index.tsx
index 7c803a0a8..6c58e4630 100644
--- a/apps/web/vibes/soul/form/radio-group/index.tsx
+++ b/apps/web/vibes/soul/form/radio-group/index.tsx
@@ -8,6 +8,7 @@ import { Label } from '@/vibes/soul/form/label';
 interface Option {
   value: string;
   label: string;
+  description?: string;
   disabled?: boolean;
 }
 
@@ -90,7 +91,9 @@ function RadioGroupItem({
   return (
     <div className="flex items-center" key={option.value}>
       <RadioGroupPrimitive.Item
-        aria-label={option.label}
+        aria-labelledby={
+          option.description !== undefined ? `${id}-label ${id}-description` : `${id}-label`
+        }
         className={clsx(
           'size-5 cursor-default rounded-full border outline-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&:disabled+label]:pointer-events-none [&:disabled+label]:opacity-50',
           {
@@ -126,7 +129,7 @@ function RadioGroupItem({
       </RadioGroupPrimitive.Item>
       <label
         className={clsx(
-          'pl-3 text-sm leading-none',
+          'flex flex-grow justify-between pl-3 text-sm leading-none',
           {
             light: 'text-[var(--radio-group-light-label,hsl(var(--foreground)))]',
             dark: 'text-[var(--radio-group-dark-label,hsl(var(--background)))]',
@@ -134,7 +137,10 @@ function RadioGroupItem({
         )}
         htmlFor={id}
       >
-        {option.label}
+        <span id={`${id}-label`}>{option.label}</span>
+        {option.description !== undefined && (
+          <span id={`${id}-description`}>{option.description}</span>
+        )}
       </label>
     </div>
   );