/* Minimal global styles (keep most styling via Tailwind utilities)
   No @apply used since we're not building Tailwind.
*/

:root {
    --transition-fast: 200ms;
}

html {
    scroll-behavior: smooth;
}

/* Smooth theme transition */
* {
    transition: background-color var(--transition-fast) linear, border-color var(--transition-fast) linear, color var(--transition-fast) linear, fill var(--transition-fast) linear, stroke var(--transition-fast) linear;
}

/* Utility helpers */
.visually-hidden {
    position: absolute !important;
    height: 1px;
    width: 1px;
    overflow: hidden;
    clip: rect(1px, 1px, 1px, 1px);
    white-space: nowrap;
}

/* Simple carousel container to prevent layout shifts */
.carousel-track {
    display: flex;
    will-change: transform;
}

.carousel-item {
    flex: 0 0 100%;
}

/* Optional custom scrollbar (works in modern browsers) */
::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

::-webkit-scrollbar-thumb {
    background: rgba(100, 116, 139, 0.5);
    border-radius: 999px;
}

::-webkit-scrollbar-track {
    background: transparent;
}