/* Basic CSS fallback for the layout */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html, body {
    height: 100%;
    width: 100%;
    overflow: hidden;
}

.h-screen { height: 100vh; }
.w-screen { width: 100vw; }
.h-full { height: 100%; }
.w-full { width: 100%; }
.relative { position: relative; }
.absolute { position: absolute; }
.inset-0 { top: 0; right: 0; bottom: 0; left: 0; }
.flex { display: flex; }
.items-center { align-items: center; }
.justify-center { justify-content: center; }
.bg-cover { background-size: cover; }
.bg-center { background-position: center; }
.bg-no-repeat { background-repeat: no-repeat; }
.bg-black { background-color: black; }
.bg-opacity-0 { background-color: rgba(0, 0, 0, 0); }
.bg-opacity-10 { background-color: rgba(0, 0, 0, 0.1); }
.transition-all { transition: all 0.3s ease; }
.duration-300 { transition-duration: 300ms; }
.z-10 { z-index: 10; }
.overflow-hidden { overflow: hidden; }

.hover\:bg-opacity-10:hover {
    background-color: rgba(0, 0, 0, 0.1);
}