/* ===== LOADER BASE ===== */
.loader {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    pointer-events: none;
}

/* Opona, která vyjede nahoru */
.loader__bg {
    position: absolute;
    inset: 0;
    background: #0a1128;
    transform-origin: top;
    transition: transform 0.8s cubic-bezier(0.86, 0, 0.07, 1);
    will-change: transform;
}

/* ===== LOGO SVG A ANIMACE ===== */
.loader__logo {
    position: relative;
    z-index: 2;
    width: clamp(220px, 30vw, 400px);
    height: auto;
    /* Plynulý posun nahoru při odhalení a zmizení */
    transition: transform 0.8s cubic-bezier(0.86, 0, 0.07, 1),
        opacity 0.4s ease 0.4s;
    will-change: transform, opacity;
}

.loader__outline polygon {
    fill: transparent;
    stroke: rgba(255, 255, 255, 0.6);
    stroke-width: 0.5;
    stroke-dasharray: 400;
    stroke-dashoffset: 400;
    animation:
        drawOutline 1s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards,
        fadeOutline 0.3s ease 0.9s forwards;
}

@keyframes drawOutline {
    to {
        stroke-dashoffset: 0;
    }
}

@keyframes fadeOutline {
    to {
        stroke: transparent;
    }
}

/* ===== WATER FILL ===== */
.loader__fill {
    animation: waterRise 0.8s cubic-bezier(0.22, 0.61, 0.36, 1) forwards 0.4s;
}

@keyframes waterRise {
    0% {
        y: 65.6;
    }

    100% {
        y: 0;
    }
}

.loader__accent {
    opacity: 0;
    animation: accentIn 0.3s ease forwards 0.9s;
}

@keyframes accentIn {
    to {
        opacity: 1;
    }
}

/* ===== REVEAL (OPONA NAHORU) ===== */
.loader--reveal .loader__bg {
    transform: translateY(-100%);
}

.loader--reveal .loader__logo {
    /* Translate se počítá v JS * přesně * a navíc zmizí, aby předal místo hardcoded logu */
    opacity: 0;
}

/* ===== STATIC LOGO V HERO ===== */
/* Toto je finální logo, které je ve stránce pořád, jen se objeví */
.hero-logo-svg {
    width: clamp(220px, 30vw, 400px);
    height: auto;
    display: block;
    margin: 0 auto;
    opacity: 0;
    /* skryto před koncem loaderu */
    transition: opacity 0.6s ease;
}

.hero-logo-svg--visible {
    opacity: 1;
}

/* Hardcoded filled states */
.hero-logo-svg .loader__outline polygon {
    fill: white;
    stroke: none;
    animation: none;
}

.hero-logo-svg .loader__fill {
    animation: none;
    y: 0;
}

.hero-logo-svg .loader__accent {
    animation: none;
    opacity: 1;
}

/* ===== HERO TEXT ENTRANCE ===== */
.hero-content {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.7s ease,
        transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
}

.hero-content--visible {
    opacity: 1;
    transform: translateY(0);
}