html.chawlas-preloader-lock,
html.chawlas-preloader-lock body {
    overflow: hidden !important;
}

.chawlas-preloader {
    position: fixed;
    inset: 0;
    width: 100vw;
    height: 100vh;
    height: 100dvh;
    background: var(--cp-bg, #f3eadf);
    z-index: var(--cp-z, 999999);
    display: grid;
    place-items: center;
    overflow: hidden;
    opacity: 1;
    transform: translateY(0);
    transition: opacity var(--cp-exit, 900ms) cubic-bezier(.77,0,.175,1), transform var(--cp-exit, 900ms) cubic-bezier(.77,0,.175,1);
    pointer-events: all;
    isolation: isolate;
}

.chawlas-preloader__inner {
    position: relative;
    z-index: 2;
    width: 100%;
    height: 100%;
    display: grid;
    place-items: center;
}

.chawlas-preloader__logo-wrap {
    width: min(var(--cp-logo-w, 360px), 82vw);
    overflow: hidden;
    transform: translateZ(0);
    clip-path: inset(0 100% 0 0);
    animation: chawlasLogoReveal var(--cp-logo-reveal, 950ms) cubic-bezier(.76,0,.24,1) 120ms forwards;
    will-change: clip-path;
}

.chawlas-preloader__logo {
    width: 100%;
    height: auto;
    display: block;
    object-fit: contain;
}

.chawlas-preloader__fallback-logo {
    font-family: Georgia, serif;
    color: var(--cp-counter, #d92323);
    font-size: clamp(52px, 7vw, 118px);
    line-height: 1;
    letter-spacing: -0.055em;
}

.chawlas-preloader__counter {
    position: absolute;
    left: 50%;
    bottom: var(--cp-counter-bottom, 22vh);
    transform: translateX(-50%);
    color: var(--cp-counter, #d92323);
    font-family: var(--cp-counter-font, Georgia, serif);
    font-size: var(--cp-counter-size, 36px);
    font-weight: var(--cp-counter-weight, 400);
    line-height: 1;
    letter-spacing: -0.04em;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.chawlas-preloader__circle {
    position: absolute;
    z-index: 1;
    left: 50%;
    top: 50%;
    width: clamp(42px, 5vw, 76px);
    height: clamp(42px, 5vw, 76px);
    border-radius: 999px;
    background: var(--cp-circle, #8b0000);
    transform: translate(-50%, -50%) scale(0);
    opacity: 0;
    will-change: transform, opacity;
}

.chawlas-preloader.is-ending .chawlas-preloader__circle {
    opacity: 1;
    animation: chawlasCircleExpand var(--cp-exit, 1700ms) cubic-bezier(.83,0,.17,1) forwards;
}

.chawlas-preloader.is-ending .chawlas-preloader__logo-wrap,
.chawlas-preloader.is-ending .chawlas-preloader__counter {
    opacity: 0;
    transition: opacity 420ms ease;
}

.chawlas-preloader.is-hidden {
    opacity: 0;
    transform: translateY(10vh);
    pointer-events: none;
}

@keyframes chawlasLogoReveal {
    from { clip-path: inset(0 100% 0 0); }
    to { clip-path: inset(0 0 0 0); }
}

@keyframes chawlasCircleExpand {
    0% { transform: translate(-50%, -50%) scale(0); opacity: 0; }
    12% { transform: translate(-50%, -50%) scale(1); opacity: 1; }
    28% { transform: translate(-50%, -50%) scale(1); opacity: 1; }
    100% { transform: translate(-50%, -50%) scale(160); opacity: 1; }
}

@media (max-width: 767px) {
    .chawlas-preloader__logo-wrap {
        width: min(var(--cp-logo-w-m, 220px), 78vw);
    }
    .chawlas-preloader__counter {
        font-size: var(--cp-counter-size-m, 26px);
    }
}

@media (prefers-reduced-motion: reduce) {
    .chawlas-preloader__logo-wrap,
    .chawlas-preloader.is-ending .chawlas-preloader__circle {
        animation-duration: 1ms !important;
    }
    .chawlas-preloader {
        transition-duration: 1ms !important;
    }
}