:root {
            --bg: #ffffff;
            --text-dark: #000000;
            --edu-blue: #1a0dab;
            --ease-out: cubic-bezier(0.34, 1.56, 0.64, 1);
            --ease-in: cubic-bezier(0.7, 0, 0.3, 1);
        }

        #intro-stage {
            position: fixed;
            inset: 0;
            display: none;
            justify-content: center;
            align-items: center;
            background: var(--bg);
            z-index: 10000;
        }

        .logo-container {
            position: relative;
            display: flex;
            align-items: center;
            justify-content: center;
            width: 100%;
            max-width: 500px;
            padding: 20px;
        }

        .svg-text {
            width: 100%;
            height: auto;
            max-height: 200px;
            overflow: visible;
        }

        .svg-text text {
            font-size: 110px;
            font-weight: 900;
            fill: transparent;
            stroke: var(--text-dark);
            stroke-width: 1.5;
            stroke-dasharray: 500;
            stroke-dashoffset: 500;
            text-anchor: middle;
            dominant-baseline: middle;
            animation: drawAction 1.2s var(--ease-in) forwards 0.3s;
        }

        .blue-dot {
            width: 6vw;
            height: 6vw;
            max-width: 32px;
            max-height: 32px;
            min-width: 15px;
            min-height: 15px;
            background-color: var(--edu-blue);
            border-radius: 50%;
            position: absolute;
            right: 5%;
            opacity: 0;
            transform: scale(0);
            animation: dotPop 0.8s var(--ease-out) forwards 1.4s;
        }

        .glow-pulse {
            position: absolute;
            width: 6vw;
            height: 6vw;
            max-width: 32px;
            max-height: 32px;
            right: 5%;
            background-color: var(--edu-blue);
            border-radius: 50%;
            opacity: 0;
            filter: blur(10px);
            pointer-events: none;
        }

        .pulse-active {
            animation: softGlow 1.2s ease-out forwards 1.6s;
        }

        @keyframes drawAction {
            0% { stroke-dashoffset: 500; fill: transparent; }
            80% { fill: transparent; stroke-width: 1.5; }
            100% { stroke-dashoffset: 0; fill: var(--text-dark); stroke-width: 0; }
        }

        @keyframes dotPop {
            0% { transform: scale(0) translateX(20px); opacity: 0; }
            100% { transform: scale(1) translateX(0); opacity: 1; }
        }

        @keyframes softGlow {
            0% { transform: scale(1); opacity: 0.6; }
            100% { transform: scale(15); opacity: 0; filter: blur(50px); }
        }

        .master-exit {
            animation: smoothFade 0.8s var(--ease-in) forwards 3.5s;
        }

        @keyframes smoothFade {
            to { opacity: 0; transform: scale(0.98); visibility: hidden; }
        }

        #main-site.show-instant {
            opacity: 1;
            transition: none;
        }

        #main-site.show {
            opacity: 1;
        }

        @media (max-width: 480px) {
            .svg-text text {
                font-size: 140px;
            }
            .blue-dot, .glow-pulse {
                right: 10%;
            }
        }