/* Custom Styles for Harben House Reimagined */

html {
    scroll-behavior: smooth;
}

@layer utilities {
    .shadow-brutal {
        box-shadow: 6px 6px 0px 0px rgba(8, 13, 32, 1);
    }
    .shadow-brutal-sm {
        box-shadow: 4px 4px 0px 0px rgba(8, 13, 32, 1);
    }
    .shadow-brutal-lg {
        box-shadow: 12px 12px 0px 0px rgba(8, 13, 32, 1);
    }
    .shadow-brutal-hover {
        box-shadow: 2px 2px 0px 0px rgba(8, 13, 32, 1);
    }
}

@media (pointer: fine) {
    body, a, button, input, .cursor-none {
        cursor: none !important;
    }
}

.perspective-1000 {
    perspective: 1000px;
}

::-webkit-scrollbar {
    width: 12px;
}
::-webkit-scrollbar-track {
    background: #F7F3EA; 
    border-left: 2px solid #080D20;
}
::-webkit-scrollbar-thumb {
    background: #080D20; 
    border: 2px solid #F7F3EA;
}
::-webkit-scrollbar-thumb:hover {
    background: #F45BB7; 
}

::selection {
    background-color: #F8C800;
    color: #080D20;
}

.brand-link {
    -webkit-text-stroke: 2px #080D20;
    color: transparent;
    text-shadow: 4px 4px 0px #080D20;
}
.brand-link:hover {
    color: #F8C800;
    text-shadow: 8px 8px 0px #080D20;
    -webkit-text-stroke: 0px transparent;
}

/* Rainbow Hover Animation */
.hover-rainbow {
    background: #F7F3EA; /* Default cream bg */
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.hover-rainbow:hover {
    background: linear-gradient(124deg, #ff2400, #e81d1d, #e8b71d, #e3e81d, #1de840, #1ddde8, #2b1de8, #dd00f3, #dd00f3);
    background-size: 400% 400%;
    animation: rainbow-bg 2s ease infinite;
}

@keyframes rainbow-bg {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}