/* 
   de BOEKIT Riverside Resort - Global Styles 
   Optimized for XAMPP / Apache
*/

@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&family=Playfair+Display:ital,wght@0,400..900;1,400..900&display=swap');

:root {
    --font-serif: "Playfair Display", serif;
    --font-sans: "DM Sans", sans-serif;
    --color-brand-forest: #1F7A4D;
    --color-brand-deep: #145A32;
    --color-brand-yellow: #F4B41A;
    --color-brand-olive: #7FB77E;
    --color-brand-blue: #4FA3A5;
    --color-brand-sand: #F5E6C8;
    --color-background-warm: #fafaf8;
}

body {
    background-color: var(--color-background-warm);
    color: var(--color-brand-deep);
    font-family: var(--font-sans);
    overflow-x: hidden;
}

.font-serif { font-family: var(--font-serif); }

/* Premium Multi-layered Shadow */
.premium-shadow {
    box-shadow:
        rgba(14, 63, 126, 0.04) 0px 0px 0px 1px,
        rgba(42, 51, 69,  0.04) 0px 1px 1px -0.5px,
        rgba(42, 51, 70,  0.04) 0px 3px 3px -1.5px,
        rgba(42, 51, 70,  0.04) 0px 6px 6px -3px,
        rgba(14, 63, 126, 0.04) 0px 12px 12px -6px,
        rgba(14, 63, 126, 0.04) 0px 24px 24px -12px;
}

/* Animations */
@keyframes blur-in {
    0%   { filter: blur(12px); opacity: 0; transform: translateY(8px); }
    100% { filter: blur(0);    opacity: 1; transform: translateY(0);   }
}

.animate-blur-in {
    opacity: 0;
    animation: blur-in 0.8s ease-out forwards;
}

@keyframes scroll-down {
    0% { transform: translateY(0); }
    100% { transform: translateY(-50%); }
}

@keyframes scroll-up {
    0% { transform: translateY(-50%); }
    100% { transform: translateY(0); }
}

.animate-scroll-down {
    animation: scroll-down 30s linear infinite;
}

.animate-scroll-up {
    animation: scroll-up 30s linear infinite;
}

.animate-scroll-left {
    animation: scroll-left 60s linear infinite;
}

.animate-scroll-down:hover,
.animate-scroll-up:hover,
.animate-scroll-left:hover {
    animation-duration: 120s;
}

@keyframes scroll-left {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}

/* Custom Utilities */
.rounded-3xl { border-radius: 24px; }
.rounded-4xl { border-radius: 40px; }