:root{--a:#e63946;--b:#0a0a0a;--c:#f8f9fa;--d:rgba(10,10,10,0.9);--e:#2d2d2d;--f:rgba(0,0,0,0.85)}body{font-family:Poppins,sans-serif;margin:0;padding:0;background:var(--b) fixed url('/assets/bg.jpg');background-size:cover;color:var(--c);line-height:1.6;min-height:100vh;position:relative;transition:background 0.3s ease}body.light-mode{--b:#f8f9fa;--c:#0a0a0a;--d:rgba(248,249,250,0.9);--e:#dee2e6;--f:rgba(248,249,250,0.85)}body::before{content:'';position:fixed;top:0;left:0;width:100%;height:100%;background:var(--f);z-index:-1;transition:background 0.3s ease}.a1{background:var(--d);border-bottom:1px solid var(--a);padding:8px 0;position:relative;z-index:1001}.a1 marquee{font-family:Space Mono,monospace;font-size:0.9rem;color:var(--a);letter-spacing:2px}header{text-align:center;padding:100px 20px;position:relative;z-index:1}header h1,header h2{display:flex;flex-direction:column;align-items:center;font-family:Poppins,sans-serif;margin:0 auto 1rem;letter-spacing:2px;overflow:hidden}header h1{font-size:3.2rem;border-bottom:1px solid var(--e);padding-bottom:0.5rem;margin-bottom:1.5rem}header h2{font-size:2.9rem}header p{font-family:Inter,sans-serif;font-size:1.2rem;color:#adb5bd;animation:fadeIn 2s ease-in}nav{display:flex;justify-content:center;background:var(--d);position:sticky;top:0;border-bottom:1px solid var(--e);border-top:1px solid var(--e);backdrop-filter:blur(5px);z-index:1000;padding:8px 0;width:100%}nav a{font-family:Inter,sans-serif;color:var(--c);padding:1rem 2rem;text-decoration:none;border-bottom:2px solid transparent;transition:all 0.3s ease;margin:0 5px;position:relative}nav a::after{content:'';position:absolute;bottom:-2px;left:0;width:0;height:2px;background:var(--a);transition:width 0.3s ease}nav a:hover::after{width:100%}.e5{max-width:1200px;margin:0 auto;padding:2rem;position:relative;z-index:1}.b2,.c3,.d4{background:var(--d);border:1px solid var(--e);padding:2rem;margin-bottom:2rem;backdrop-filter:blur(5px);box-shadow:0 4px 15px rgba(0,0,0,0.1);transition:transform 0.3s ease}.b2:hover,.c3:hover,.d4:hover{transform:translateY(-5px)}h2{font-family:Poppins,sans-serif;color:var(--a);border-bottom:1px solid var(--e);padding-bottom:0.5rem;margin-bottom:1.5rem;font-size:1.75rem}.c3 ul{list-style:none;padding:0}.c3 ul li{font-family:Inter,sans-serif;padding:1rem;margin:0.5rem 0;background:rgba(45,45,45,0.3);border-left:3px solid var(--a);transition:transform 0.2s ease}.c3 ul li:hover{transform:translateX(10px)}footer{text-align:center;padding:2rem;background:var(--d);border-top:1px solid var(--e);margin-top:auto;backdrop-filter:blur(5px)}.f6,.g7{position:fixed;right:30px;background:var(--a);color:white;width:50px;height:50px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:transform 0.3s ease;z-index:1000;border:2px solid var(--e)}.f6{bottom:100px}.g7{bottom:30px}.f6:hover,.g7:hover{transform:scale(1.1) rotate(15deg)}@keyframes typing{from{width:0}to{width:100%}}@keyframes blink-caret{from,to{border-color:transparent}50%{border-color:var(--a)}}@keyframes fadeIn{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@media (max-width:768px){header h1 .h8{font-size:1.8rem!important;animation:typing 2s steps(40,end),blink-caret 0.75s step-end infinite}nav a{padding:0.8rem 1rem;font-size:0.9rem}}
        .welcome-overlay {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            backdrop-filter: blur(10px);
            background-color: rgba(0, 0, 0, 0.7);
            z-index: 9999;
            display: flex;
            justify-content: center;
            align-items: center;
            flex-direction: column;
        }

        .welcome-content {
            background: rgba(15, 15, 15, 0.9);
            padding: 2rem;
            border-radius: 15px;
            text-align: center;
            border: 1px solid #e63946;
            max-width: 500px;
            width: 90%;
        }

        .start-button {
            background: #e63946;
            color: white;
            padding: 12px 30px;
            border: none;
            border-radius: 5px;
            font-size: 1.1rem;
            cursor: pointer;
            margin-top: 20px;
            transition: transform 0.3s ease;
        }

        .start-button:hover {
            transform: scale(1.05);
        }