/* Page Transition Styles */
body {
    opacity: 0;
    transition: opacity 100ms ease-in-out;
    position: relative;
}

body.page-visible {
    opacity: 1;
}

body.page-exit {
    opacity: 0;
}

.page-transition-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 9999;
    background-color: transparent;
    transition: background-color 100ms ease-in-out;
}

body.page-exit .page-transition-overlay {
    background-color: rgba(255, 255, 255, 0.1);
}

/* Ensure links maintain their appearance during transition */
a {
    transition: color 100ms ease;
}

/* Add subtle transition to all elements */
*, *::before, *::after {
    transition-property: background-color, border-color, color, opacity, transform;
    transition-duration: 100ms;
    transition-timing-function: ease-in-out;
}