.gradient-bg {
    z-index: -1;
    width: 100vw;
    height: 100vh;
    position: fixed;
    overflow: hidden;
    background: linear-gradient(40deg,#386385,#00325A);
    top: 0;
    left: 0
}

.gradient-bg .svgBlur {
    display: none
}

.gradient-bg .noiseBg {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 1;
    mix-blend-mode: soft-light;
    opacity: .3
}

.gradient-bg .gradients-container {
    filter: url(#goo) blur(40px);
    width: 100%;
    height: 100%
}

.gradient-bg .g1 {
    position: absolute;
    background: radial-gradient(circle at center,rgba(47,93,182,.8) 0,rgba(47,93,182,0) 50%) no-repeat;
    mix-blend-mode: hard-light;
    width: 80%;
    height: 80%;
    top: calc(50% - 80% / 2);
    left: calc(50% - 80% / 2);
    transform-origin: center center;
    animation: moveVertical 30s ease infinite;
    opacity: 1
}

.gradient-bg .g2 {
    position: absolute;
    background: radial-gradient(circle at center,rgba(82,132,198,.8) 0,rgba(82,132,198,0) 50%) no-repeat;
    mix-blend-mode: hard-light;
    width: 80%;
    height: 80%;
    top: calc(50% - 80% / 2);
    left: calc(50% - 80% / 2);
    transform-origin: calc(50% - 400px);
    animation: moveInCircle 20s reverse infinite;
    opacity: 1
}

.gradient-bg .g3 {
    position: absolute;
    background: radial-gradient(circle at center,rgba(82,108,197,.8) 0,rgba(82,108,197,0) 50%) no-repeat;
    mix-blend-mode: hard-light;
    width: 80%;
    height: 80%;
    top: calc(50% - 80% / 2 + 200px);
    left: calc(50% - 80% / 2 - 500px);
    transform-origin: calc(50% + 400px);
    animation: moveInCircle 40s linear infinite;
    opacity: 1
}

.gradient-bg .g4 {
    position: absolute;
    background: radial-gradient(circle at center,rgba(67,88,169,.8) 0,rgba(67,88,169,0) 50%) no-repeat;
    mix-blend-mode: hard-light;
    width: 80%;
    height: 80%;
    top: calc(50% - 80% / 2);
    left: calc(50% - 80% / 2);
    transform-origin: calc(50% - 200px);
    animation: moveHorizontal 40s ease infinite;
    opacity: .7
}

.gradient-bg .g5 {
    position: absolute;
    background: radial-gradient(circle at center,rgba(51,96,170,.8) 0,rgba(51,96,170,0) 50%) no-repeat;
    mix-blend-mode: hard-light;
    width: calc(80% * 2);
    height: calc(80% * 2);
    top: calc(50% - 80%);
    left: calc(50% - 80%);
    transform-origin: calc(50% - 800px) calc(50% + 200px);
    animation: moveInCircle 20s ease infinite;
    opacity: 1
}

.gradient-bg .interactive {
    position: absolute;
    background: radial-gradient(circle at center,rgba(181,201,255,.8) 0,rgba(181,201,255,0) 50%) no-repeat;
    mix-blend-mode: hard-light;
    width: 100%;
    height: 100%;
    top: -50%;
    left: -50%;
    opacity: .7
}
/* ═══════════════════════════════════════════════════
    FLOATING SHAPES
═══════════════════════════════════════════════════ */
.shape {
    position: absolute;
    pointer-events: none;
    z-index: 5;
}

/* ── Pencil image slot (left) ── */
.pencil-slot {
    left: 3.5%;
    bottom: 20%;
    width: clamp(50px, 14vw, 200px);
}

.pencil-slot img {
    width: 100%;
    height: auto;
    object-fit: contain;
}

/* ── Olympiad sticker slot (right) ── */
.olympiad-slot {
    right: 4%;
    bottom: 20%;
    width: clamp(74px, 14vw, 200px);
}

.olympiad-slot img {
    width: 100%;
    height: auto;
    object-fit: contain;
}

/* ── Alarm clock small slot (upper-left area) ── */
.clock-float-slot {
    left: 16%;
    top: 16%;
    width: clamp(36px, 4vw, 54px);
}

/* ─── Responsive ────────────────────────────────────── */
@media (max-width: 768px) {
    .navbar { padding: 14px 20px; }
    .logo-circle { width: 56px; height: 56px; }
    .logo-m { font-size: 17px; }
    .hamburger span:nth-child(1) { width: 24px; }
    .hamburger span:nth-child(2) { width: 18px; }
    .marquee-text { display: none; }
    .shape { transform-origin: center; }
}

@media (max-width: 480px) {
    .headline-row1 { gap: 10px; }
    .cta-btn { padding: 14px 36px; }
    /* Scale down decorative shapes on mobile */
    .shape.scale-mobile { transform: scale(0.7); }
}