refactor(docs): example of blurred card (#3741)

* docs(card): adding info regarding the gradient for blurred card

* chore(nit): adding example

* chore(docs): revise content for card isBlurred example

* chore(docs): revise isBlurred note

---------

Co-authored-by: Maharshi Alpesh <maharshialpesh@Maharshi-Book.local>
Co-authored-by: WK Wong <wingkwong.code@gmail.com>

Author: 3 people

apps/docs/content/docs/components/card.mdx

@@ -73,7 +73,9 @@ You can use other NextUI components inside the card to compose a more complex ca
 
 ### Blurred Card
 
-You can pass the `isBlurred` prop to the card to blur the card.
+You can pass the `isBlurred` prop to the card to blur the card. Card gets blurred properties based on its ancestor element.
+
+> **Note**: To achieve the blur effect as seen in the preview, you need to provide a suitable background (e.g., `bg-gradient-to-tr from-[#FFB457] to-[#FF705B]`) to an ancestor element of the Card component allowing the Card's blur effect to be visible.
 
 <CodeDemo isGradientBox title="Blurred Card" files={cardContent.blurred} />