/* --- EXTRA STYLES --- */
/* These styles are for less critical or decorative elements. */
/* They can be loaded later or dynamically to optimize initial page load. */

/* Example: Styling for a specific widget */
.widget-area .widget {
    border: 1px dashed #ccc;
    padding: 1rem;
    margin-bottom: 1rem;
    background-color: #f9f9f9;
}

/* Example: Animations */
.animated-element {
    transition: all 0.3s ease-in-out;
}
.animated-element:hover {
    transform: translateY(-5px);
}