/* Gimnazija Loader - CSS */
/* Colors */
:root {
    --glp-brand: rgba(97, 52, 22, 0.89); /* #613416E3 */
    --glp-accent: #d5bd85;
}

html, body { height: 100%; }

/* Full-screen overlay that will fade out entirely */
#glp-loader {
    position: fixed;
    inset: 0;
    z-index: 999999;
    display: grid;
    place-items: center;
    background:
        radial-gradient(120% 100% at 100% 100%, rgba(213, 189, 133, 0.22) 0%, rgba(213, 189, 133, 0.00) 60%),
        radial-gradient(120% 100% at 0% 0%, rgba(97, 52, 22, 0.18) 0%, rgba(97, 52, 22, 0.00) 60%),
        linear-gradient(180deg, #faf9f6 0%, #f2efe8 100%);
}

#glp-loader::before {
    content: '';
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        repeating-linear-gradient(45deg, rgba(97, 52, 22, 0.025) 0 2px, rgba(97, 52, 22, 0.00) 2px 8px),
        radial-gradient(120% 100% at 50% 50%, rgba(0,0,0,0.04) 0%, rgba(0,0,0,0.06) 70%, rgba(0,0,0,0.10) 100%);
    mix-blend-mode: multiply;
    opacity: .5;
}

.glp-logo-wrap {
    position: relative;
    width: 320px;
    height: 320px;
    display: grid;
    place-items: center;
    filter: drop-shadow(0 8px 20px rgba(0,0,0,0.12));
}

#glp-logo {
    width: 100%;
    height: 100%;
    object-fit: contain;
    /* Left-to-right wipe reveal, hold, then left-to-right hide */
    clip-path: inset(0 100% 0 0);
    animation: glp-logo-wipe 3000ms ease-in-out forwards;
}

@keyframes glp-logo-wipe {
    0%   { clip-path: inset(0 100% 0 0); opacity: 1; }
    45%  { clip-path: inset(0 0% 0 0);   opacity: 1; }
    70%  { clip-path: inset(0 0% 0 0);   opacity: 1; }
    100% { clip-path: inset(0 0% 0 100%); opacity: 1; }
}

/* Fade out class added by JS */
body.glp-loaded #glp-loader {
    animation: glp-fade-out 500ms ease forwards;
}

@keyframes glp-fade-out {
    to { opacity: 0; visibility: hidden; }
}