/********************************************************************* TAILWIND COLORS */
:root {
    --brand-color: #c98d5f;
    --dark-bg: #1a202c;
    --text-light: #f7fafc;
    --text-dark: #2d3748;
}

body {
    font-family: 'Montserrat', sans-serif;
    color: var(--text-dark);
}

h1, h2, h3, h4 {
    font-family: 'Cormorant Garamond', serif;
    font-weight: 700;
}



/********************************************************************* NAVBAR */
#navbar {
    transition: padding 0.32s ease, background 0.32s ease;
}

#navbar.scrolled {
    padding: 0.32rem 0.64rem;
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}



/********************************************************************* HERO */
.hero-text-shadow {
    text-shadow: 2px 2px 2px #000000;
}

.slider-image {
    animation: zoomInOut 8s infinite alternate ease-in-out;
}

.slider-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    opacity: 0;
    transition: opacity 1.5s ease-in-out;
    z-index: -1;
}

.slider-image.active {
    opacity: 1;
}

#snow-container {
    opacity: 1;
    visibility: visible;
    transition: opacity 0.5s ease-in-out, visibility 0.5s ease-in-out;
}

#snow-container .hidden {
    opacity: 0;
    visibility: hidden;
}

.snowflake {
    position: absolute;
    top: -10vh;
    background-color: white;
    border-radius: 50%;
    opacity: 0.8;
    animation-name: fall;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
}

@keyframes zoomInOut {
    0% {
        transform: scale(1);
    }
    100% {
        transform: scale(1.064);
    }
}

@keyframes fall {
    from { transform: translateY(-10vh) translateX(-5vw); }
    to { transform: translateY(100vh) translateX(5vw); }
}



/********************************************************************* FAQ */
details > summary {
    list-style: none;
}

details > summary::-webkit-details-marker {
    display: none;
}

details[open] .plus-icon {
    display: none;
}

details:not([open]) .minus-icon {
    display: none;
}

/********************************************************************* FOOTER */
.footer-img {
    width: 64px;
}


/********************************************************************* ANIMACE */
[data-intersect-classes] {
    opacity: 0;
}

[data-intersect-classes].animate__animated {
    opacity: 1;
}


/******************************/
.opacity-50 {
    opacity: 0.32;
}

.summary {
    transition: opacity 0.25s ease-in-out; /* Přidáno pro fade efekt */
}