/*
.clock {
    width: 554px;
    height: 945px;
    position: relative;
    transform-origin: 0% 0%;
    transform: scale(.5);
}

.clock * {
    position: absolute;
}

.clockface {
    width: 369px;
    height: 369px;
    left: 92px;
    top: 88px;
}

.pendulum {
    left: 194px;
    top: 420px;
    transform-origin:50% 0% ;
    transform: rotate(30deg)
}

.clockhand {
	top: 10px;
	left: 158px;
}
*/

/* ===== KELLA SEKTSIOON ===== */


/* ===== KELLA KONTEINER ===== */


.clock {
    width: 554px;
    height: 945px;
    position: relative;

    transform-origin: 0% 0%;
    transform: scale(.5);

    /* VISUAALNE STIIL */
    background: rgba(255,255,255,0.85);
    border-radius: 20px;
    box-shadow: 0 25px 60px rgba(0,0,0,0.25);
    backdrop-filter: blur(8px);

    transition: transform 0.3s ease;
}

/* kerge hover efekt */
.clock:hover {
    transform: scale(.55);
}

/* kõik clocki sees olevad elemendid */
.clock * {
    position: absolute;
}

/* ===== NUMBRILAUD ===== */

.clockface {
    width: 369px;
    height: 369px;
    left: 92px;
    top: 88px;
}

/* ===== PENDEL ===== */

.pendulum {
    left: 194px;
    top: 420px;
    transition: transform 0.3s ease;
}

/* ===== SEIERID ===== */

.clockhand {
    top: 10px;
    left: 158px;

    transform-origin: 50% 90%;
}

/* väike sügavuse efekt */
.clockhand img {
    filter: drop-shadow(0 2px 4px rgba(0,0,0,0.3));
}