body {
    background-color: #0A0A0C;
    color: #e5e1e4;
}

.hero-gradient {
    background: radial-gradient(circle at top right, rgba(0, 240, 255, 0.15), transparent 50%),
        radial-gradient(circle at bottom left, rgba(188, 19, 254, 0.15), transparent 50%);
}

.btn-primary {
    background: linear-gradient(135deg, #00F0FF, #BC13FE);
    color: #ffffff;
    transition: all 0.3s ease;
}

.btn-primary:hover {
    box-shadow: 0 0 20px rgba(0, 240, 255, 0.4);
    transform: translateY(-2px);
}

.btn-secondary {
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid #00F0FF;
    color: #00F0FF;
    transition: all 0.3s ease;
}

.btn-secondary:hover {
    background: rgba(0, 240, 255, 0.1);
    transform: translateY(-2px);
}

.glass-card {
    background: rgba(255, 255, 255, 0.03);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    border-left: 1px solid rgba(255, 255, 255, 0.08);
    border-right: 1px solid transparent;
    border-bottom: 1px solid transparent;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.glass-card:hover {
    border-color: #00F0FF;
    box-shadow: 0 0 20px rgba(0, 240, 255, 0.15);
    transform: translateY(-5px);
}

.feature-icon-wrapper {
    background: linear-gradient(135deg, rgba(0, 240, 255, 0.1), rgba(188, 19, 254, 0.1));
    border: 1px solid rgba(0, 240, 255, 0.3);
}

html.lenis, html.lenis body {
    height: auto;
}
.lenis.lenis-smooth {
    scroll-behavior: auto !important;
}
.lenis.lenis-smooth [data-lenis-prevent] {
    overscroll-behavior: contain;
}
.lenis.lenis-stopped {
    overflow: hidden;
}
.reveal {
    opacity: 0;
    transform: translateY(40px);
    transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.reveal.active {
    opacity: 1;
    transform: translateY(0);
}
.delay-100 { transition-delay: 100ms; }
.delay-200 { transition-delay: 200ms; }
.delay-300 { transition-delay: 300ms; }

body { overflow-x: hidden; }
.glass-panel { background: rgba(255, 255, 255, 0.03); backdrop-filter: blur(12px); border: 1px solid rgba(255, 255, 255, 0.08); }
.input-glass { background: rgba(0, 0, 0, 0.2); border: 1px solid rgba(255, 255, 255, 0.08); transition: border-color 0.3s, box-shadow 0.3s; }
.input-glass:focus { border-color: #00F0FF; box-shadow: 0 0 10px rgba(0, 240, 255, 0.2); outline: none; }
.btn-primary { background: linear-gradient(135deg, #00F0FF 0%, #BC13FE 100%); color: white; transition: all 0.3s ease; position: relative; overflow: hidden; z-index: 1; }
.btn-primary::before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: linear-gradient(135deg, #BC13FE 0%, #00F0FF 100%); z-index: -1; opacity: 0; transition: opacity 0.3s ease; }
.btn-primary:hover::before { opacity: 1; }
.btn-primary:hover { box-shadow: 0 0 20px rgba(0, 240, 255, 0.4); }
.btn-glass { background: rgba(255, 255, 255, 0.03); border: 1px solid rgba(255, 255, 255, 0.08); transition: all 0.3s ease; }
.btn-glass:hover { background: rgba(255, 255, 255, 0.08); border-color: #00F0FF; color: #00F0FF; }
altcha-widget { --altcha-max-width: 100%; position: relative; }
altcha-widget::after { content: ''; position: absolute; right: 1rem; top: 50%; transform: translateY(-50%); width: 22px; height: 22px; background-image: url('logo.webp'); background-size: contain; background-repeat: no-repeat; background-position: center; opacity: 0.7; pointer-events: none; transition: opacity 0.2s; }
altcha-widget:hover::after { opacity: 1; }
#login-btn:disabled { background: #353437; color: #64748B; cursor: not-allowed; border: 1px solid #64748B; }
#login-btn:disabled::before { display: none; }