:root{--bg-base: #050505;--bg-surface: rgba(15, 15, 20, .7);--bg-card: rgba(22, 22, 30, .5);--bg-glass: rgba(255, 255, 255, .02);--border-glass: rgba(255, 255, 255, .05);--border-glass-hover: rgba(255, 255, 255, .15);--text-primary: #ffffff;--text-secondary: #a1a1aa;--text-tertiary: #71717a;--accent-primary: #818cf8;--accent-secondary: #f472b6;--accent-tertiary: #c084fc;--accent-success: #34d399;--accent-warning: #fbbf24;--accent-danger: #f87171;--gradient-primary: linear-gradient(135deg, var(--accent-primary), var(--accent-secondary));--gradient-glow: linear-gradient(135deg, rgba(129, 140, 248, .2), rgba(244, 114, 182, .2));--gradient-bg-accent: radial-gradient(circle at top right, rgba(129, 140, 248, .15), transparent 40%), radial-gradient(circle at bottom left, rgba(244, 114, 182, .1), transparent 40%);--font-sans: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--font-display: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--transition-fast: .2s ease;--transition-normal: .35s cubic-bezier(.25, 1, .5, 1);--transition-slow: .6s cubic-bezier(.16, 1, .3, 1);--container-max: 1280px;--nav-height: 80px}*{box-sizing:border-box;margin:0;padding:0}button{background:transparent;border:none;cursor:pointer;font-family:inherit;color:inherit;text-align:inherit}body{font-family:var(--font-sans);background-color:var(--bg-base);color:var(--text-primary);line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden;background-image:var(--gradient-bg-accent);background-attachment:fixed;background-size:cover}h1,h2,h3,h4,h5,h6{font-family:var(--font-display);font-weight:800;line-height:1.1;margin-bottom:1rem;letter-spacing:-.03em}h1{font-size:clamp(3rem,7vw,5.5rem)}h2{font-size:clamp(2.25rem,4vw,3.5rem);letter-spacing:-.02em}h3{font-size:clamp(1.5rem,2.5vw,2.25rem)}p{margin-bottom:1.5rem;color:var(--text-secondary);font-size:1.125rem;font-weight:400;letter-spacing:.01em}a{color:var(--text-primary);text-decoration:none;transition:color var(--transition-fast)}a:hover{color:var(--accent-primary)}.container{max-width:var(--container-max);margin:0 auto;padding:0 1.5rem;width:100%}main{min-height:calc(100vh - var(--nav-height));padding-bottom:6rem}.glass-panel{background:var(--bg-card);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid var(--border-glass);border-radius:24px;padding:2.5rem;transition:all var(--transition-normal);position:relative;overflow:hidden;box-shadow:0 8px 32px #0006}.glass-panel:before{content:"";position:absolute;inset:0;border-radius:24px;padding:1px;background:linear-gradient(135deg,#ffffff1a,#fff0);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}.glass-panel:hover{transform:translateY(-6px);box-shadow:0 20px 40px #00000080,0 0 40px var(--gradient-glow);border-color:var(--border-glass-hover);background:#1e1e2a99}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:1rem 2rem;border-radius:999px;font-weight:600;font-size:1.05rem;cursor:pointer;transition:all var(--transition-normal);border:none;font-family:var(--font-sans);letter-spacing:.02em;position:relative;overflow:hidden;z-index:1}.btn-primary{background:var(--gradient-primary);color:#fff;box-shadow:0 10px 25px -5px #818cf880}.btn-primary:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,var(--accent-secondary),var(--accent-primary));opacity:0;z-index:-1;transition:opacity var(--transition-normal)}.btn-primary:hover:before{opacity:1}.btn-primary:hover{transform:translateY(-3px) scale(1.03);box-shadow:0 15px 35px -5px #f472b699}.btn-primary:active{transform:translateY(1px) scale(.98)}.btn-secondary{background:#ffffff08;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:var(--text-primary);border:1px solid rgba(255,255,255,.1)}.btn-secondary:hover{background:#ffffff1a;border-color:#fff3;transform:translateY(-3px);box-shadow:0 10px 25px #0000004d}.text-gradient{background:var(--gradient-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;color:transparent;display:inline-block}.text-gradient-pink{background:linear-gradient(to right,#ec4899,#f43f5e);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;color:transparent}.hidden{display:none!important}@media(min-width:640px){.sm\:flex-row{flex-direction:row}.sm\:w-auto{width:auto}}@media(min-width:768px){.md\:flex{display:flex!important}.md\:hidden{display:none!important}.md\:flex-row{flex-direction:row}}.navbar{position:fixed;width:100%;z-index:50;transition:all var(--transition-normal);background:transparent}.navbar.scrolled{background:#0a0a0cd9;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid var(--border-glass);box-shadow:0 10px 30px #00000080}.navbar-container{height:var(--nav-height);display:flex;align-items:center;justify-content:space-between}.navbar-logo{display:flex;align-items:center;gap:.75rem}.logo-icon{width:40px;height:40px;border-radius:12px;background:var(--gradient-primary);display:flex;align-items:center;justify-content:center;color:#fff;box-shadow:0 8px 16px #818cf84d;transition:transform var(--transition-normal)}.navbar-logo:hover .logo-icon{transform:scale(1.1) rotate(5deg)}.logo-text{font-family:var(--font-display);font-weight:800;font-size:1.25rem;letter-spacing:-.02em}.navbar-nav{display:none}.nav-link{font-size:.95rem;font-weight:500;color:var(--text-secondary);transition:color var(--transition-fast)}.nav-link:hover,.nav-link.active{color:var(--accent-primary)}.menu-toggle{display:block;background:none;border:none;color:var(--text-secondary);cursor:pointer;transition:color var(--transition-fast)}.menu-toggle:hover{color:#fff}.mobile-nav{position:absolute;width:100%;background:#0a0a0cfa;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid var(--border-glass);transition:all var(--transition-normal);max-height:0;opacity:0;overflow:hidden}.mobile-nav.open{max-height:400px;opacity:1;padding:1rem 0 1.5rem}.mobile-nav .nav-link{display:block;padding:.75rem 0;font-size:1.1rem}@media(min-width:768px){.navbar-nav{display:flex;align-items:center;gap:2rem}.menu-toggle{display:none}.mobile-nav{display:none!important}}.quiz-progress-track{position:absolute;top:0;left:0;width:100%;height:4px;background:#ffffff0d}.quiz-progress-bar{height:100%;background:var(--gradient-primary);transition:width .5s ease-out}.quiz-option{width:100%;text-align:left;padding:1.25rem 1.5rem;border-radius:16px;background:#ffffff08;border:1px solid rgba(255,255,255,.08);color:var(--text-primary);font-size:1.125rem;display:flex;align-items:center;justify-content:space-between;cursor:pointer;transition:all var(--transition-normal);font-family:var(--font-sans)}.quiz-option:hover{background:#818cf81a;border-color:#818cf866;transform:translateY(-2px);box-shadow:0 10px 20px #818cf826}.quiz-option-icon{color:var(--accent-primary);opacity:0;transform:translate(-10px);transition:all var(--transition-normal)}.quiz-option:hover .quiz-option-icon{opacity:1;transform:translate(0)}.grid{display:grid;gap:2.5rem}.grid-cols-1{grid-template-columns:1fr}@media(min-width:768px){.md\:grid-cols-2{grid-template-columns:repeat(2,1fr)}.md\:grid-cols-3{grid-template-columns:repeat(3,1fr)}.md\:grid-cols-4{grid-template-columns:repeat(4,1fr)}.md\:col-span-1{grid-column:span 1 / span 1}.md\:col-span-2{grid-column:span 2 / span 2}.md\:col-span-3{grid-column:span 3 / span 3}.md\:col-span-4{grid-column:span 4 / span 4}.md\:p-16{padding:4rem}}@media(min-width:1024px){.lg\:grid-cols-3{grid-template-columns:repeat(3,1fr)}.lg\:grid-cols-4{grid-template-columns:repeat(4,1fr)}}.col-span-1{grid-column:span 1 / span 1}.col-span-2{grid-column:span 2 / span 2}.col-span-3{grid-column:span 3 / span 3}.col-span-4{grid-column:span 4 / span 4}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.items-start{align-items:flex-start}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-2{gap:.5rem}.gap-4{gap:1rem}.gap-6{gap:1.5rem}.gap-8{gap:2rem}.gap-10{gap:2.5rem}.gap-12{gap:3rem}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.mb-1{margin-bottom:.25rem}.mb-2{margin-bottom:.5rem}.mb-4{margin-bottom:1rem}.mb-6{margin-bottom:1.5rem}.mb-8{margin-bottom:2rem}.mb-10{margin-bottom:2.5rem}.mb-12{margin-bottom:3rem}.mb-16{margin-bottom:4rem}.mb-20{margin-bottom:5rem}.mb-24{margin-bottom:6rem}.mt-4{margin-top:1rem}.mt-6{margin-top:1.5rem}.mt-8{margin-top:2rem}.mt-auto{margin-top:auto}.pt-20{padding-top:5rem}.pt-32{padding-top:8rem}.pb-8{padding-bottom:2rem}.p-6{padding:1.5rem}.p-8{padding:2rem}.px-3{padding-left:.75rem;padding-right:.75rem}.py-1{padding-top:.25rem;padding-bottom:.25rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-4{padding-top:1rem;padding-bottom:1rem}.w-full{width:100%}.h-full{height:100%}.w-8{width:2rem}.h-8{height:2rem}.w-10{width:2.5rem}.h-10{height:2.5rem}.w-12{width:3rem}.h-12{height:3rem}.w-16{width:4rem}.h-16{height:4rem}.w-64{width:16rem}.h-64{height:16rem}.shrink-0{flex-shrink:0}.flex-grow{flex-grow:1}.max-w-xl{max-width:36rem}.max-w-2xl{max-width:42rem}.max-w-3xl{max-width:48rem}.max-w-4xl{max-width:56rem}.max-w-5xl{max-width:64rem}.max-w-6xl{max-width:72rem}.mx-auto{margin-left:auto;margin-right:auto}.rounded-full{border-radius:9999px}.rounded-xl{border-radius:.75rem}.rounded-2xl{border-radius:1rem}.text-white{color:#fff}.text-xs{font-size:.75rem;line-height:1rem}.text-sm{font-size:.875rem;line-height:1.25rem}.text-lg{font-size:1.125rem;line-height:1.75rem}.text-xl{font-size:1.25rem;line-height:1.75rem}.text-2xl{font-size:1.5rem;line-height:2rem}.text-3xl{font-size:1.875rem;line-height:2.25rem}.font-medium{font-weight:500}.font-semibold{font-weight:600}.font-bold{font-weight:700}.font-display{font-family:var(--font-display)}.opacity-0{opacity:0}.opacity-100{opacity:1}.relative{position:relative}.absolute{position:absolute}.fixed{position:fixed}.top-0{top:0}.left-0{left:0}.z-10{z-index:10}.z-50{z-index:50}.transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.3s}.transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.3s}.transition-transform{transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.3s}.bg-indigo-500\/10{background-color:#6366f11a}.border-indigo-500\/20{border-color:#6366f133}.text-indigo-400{color:#818cf8}.bg-pink-500\/10{background-color:#ec48991a}.border-pink-500\/20{border-color:#ec489933}.text-pink-400{color:#f472b6}.bg-emerald-500\/10{background-color:#10b9811a}.border-emerald-500\/20{border-color:#10b98133}.text-emerald-400{color:#34d399}.bg-blue-500\/10{background-color:#3b82f61a}.border-blue-500\/20{border-color:#3b82f633}.text-blue-400{color:#60a5fa}@keyframes fadeIn{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.animate-fade-in{animation:fadeIn var(--transition-slow) forwards;opacity:0}.animate-delay-1{animation-delay:.15s}.animate-delay-2{animation-delay:.3s}.animate-delay-3{animation-delay:.45s}.section{padding:8rem 0;position:relative}.hero{min-height:90vh;display:flex;align-items:center;position:relative;overflow:hidden}.feature-icon-wrapper{width:64px;height:64px;border-radius:20px;background:#ffffff08;border:1px solid rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;margin-bottom:2rem;color:var(--accent-primary);transition:all var(--transition-normal);box-shadow:inset 0 0 20px #ffffff05}.glass-panel:hover .feature-icon-wrapper{background:#818cf826;border-color:#818cf866;transform:scale(1.15) rotate(5deg);color:#fff;box-shadow:0 0 30px #818cf84d,inset 0 0 20px #818cf833}::-webkit-scrollbar{width:10px}::-webkit-scrollbar-track{background:var(--bg-base)}::-webkit-scrollbar-thumb{background:var(--bg-surface);border-radius:5px}::-webkit-scrollbar-thumb:hover{background:var(--accent-primary)}
