@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&family=Space+Grotesk:wght@300;400;500;600;700&display=swap');
:root{--primary:#4A0D67;--primary-light:#6B2B8C;--primary-dark:#3A0A52;--accent:#FF6B00;--accent-light:#FF8F3D;--accent-dark:#E65D00;--secondary:#00A3FF;--secondary-light:#33B5FF;--secondary-dark:#0080E6;--background:#FCFCFD;--surface:#FFFFFF;--surface-elevated:#F5F5F5;--text-primary:#22223B;--text-secondary:#4A4B5E;--text-muted:#6B7685;--border:rgba(34,34,59,0.06);--border-light:rgba(34,34,59,0.03);--gradient-primary:linear-gradient(135deg,#FF6B00 0%,#FF8F3D 100%);--gradient-secondary:linear-gradient(135deg,#00A3FF 0%,#33B5FF 100%);--gradient-purple:linear-gradient(135deg,#4A0D67 0%,#6B2B8C 100%);--gradient-hero:linear-gradient(135deg,#4A0D67 0%,#3A0A52 35%,#2D0842 100%);--shadow-sm:0 1px 2px rgba(0,0,0,0.05);--shadow-md:0 4px 12px rgba(0,0,0,0.08);--shadow-lg:0 8px 24px rgba(0,0,0,0.12);--shadow-xl:0 16px 48px rgba(0,0,0,0.15);--shadow-2xl:0 24px 64px rgba(0,0,0,0.2);--shadow-primary:0 20px 40px rgba(74,13,103,0.15);--shadow-accent:0 20px 40px rgba(255,107,0,0.15);--shadow-secondary:0 20px 40px rgba(0,163,255,0.15);--radius-sm:8px;--radius-md:12px;--radius-lg:16px;--radius-xl:24px;--radius-2xl:32px;--transition-smooth:cubic-bezier(0.25,0.46,0.45,0.94);--transition-bounce:cubic-bezier(0.68,-0.55,0.265,1.55);--transition-elastic:cubic-bezier(0.175,0.885,0.32,1.275)}
[data-theme="dark"]{--background:#0F0F0F;--surface:#1A1A1A;--surface-elevated:#2A2A2A;--text-primary:#FFFFFF;--text-secondary:#B8B8B8;--text-muted:#808080;--border:rgba(255,255,255,0.1);--border-light:rgba(255,255,255,0.05);--gradient-hero:linear-gradient(135deg,#1A0A2E 0%,#2D1B4E 35%,#0F0515 100%);--shadow-sm:0 1px 2px rgba(0,0,0,0.3);--shadow-md:0 4px 12px rgba(0,0,0,0.4);--shadow-lg:0 8px 24px rgba(0,0,0,0.5);--shadow-xl:0 16px 48px rgba(0,0,0,0.6);--shadow-2xl:0 24px 64px rgba(0,0,0,0.7);--shadow-primary:0 20px 40px rgba(74,13,103,0.3);--shadow-accent:0 20px 40px rgba(255,107,0,0.3);--shadow-secondary:0 20px 40px rgba(0,163,255,0.3)}
*{margin:0;padding:0;box-sizing:border-box}
*::selection{background:var(--accent);color:white}
html{scroll-behavior:smooth;overflow-x:hidden}
body{font-family:'Inter',sans-serif;line-height:1.6;color:var(--text-primary);background:var(--background);text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden;transition:background-color 0.3s ease,color 0.3s ease}
h1,h2,h3,h4,h5,h6{font-family:'Space Grotesk',sans-serif;font-weight:700;line-height:1.2;letter-spacing:-0.02em}
h1{font-size:clamp(2rem,5vw,4rem);font-weight:900}
h2{font-size:clamp(1.5rem,4vw,3rem);font-weight:800}
h3{font-size:clamp(1.25rem,3vw,2rem);font-weight:700}
h4{font-size:clamp(1.1rem,2.5vw,1.5rem);font-weight:600}
p{font-size:clamp(0.9rem,2vw,1.1rem);line-height:1.6;color:var(--text-secondary)}
a{color:var(--primary);text-decoration:none;transition:color 0.3s ease}
a:hover{color:var(--primary-light)}
img{max-width:100%;height:auto;display:block}
button{font-family:inherit;cursor:pointer;border:none;background:none}
input,textarea,select{font-family:inherit;font-size:inherit}
ul,ol{list-style:none}
table{border-collapse:collapse;width:100%}
.container{max-width:1400px;margin:0 auto;padding:0 2rem}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:absolute;top:-40px;left:6px;background:var(--primary);color:white;padding:8px;text-decoration:none;border-radius:4px;z-index:10000}
.skip-link:focus{top:6px}
.gradient-text{background:linear-gradient(135deg,#FFFFFF 0%,#80C8FF 50%,#FFB07A 100%);background:linear-gradient(135deg,#FFFFFF 0%,oklch(0.75 0.15 210) 50%,oklch(0.7 0.18 30) 100%);background-size:200% 200%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;animation:gradientMove 3s ease-in-out infinite}
.highlight{background:var(--gradient-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;font-weight:700}
.text-highlight{background:var(--gradient-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;font-weight:600}
[data-lazy]{opacity:0;transition:opacity 0.3s ease}
[data-lazy].loaded{opacity:1}
[data-aos]{opacity:0;transition-property:opacity,transform;transition-duration:0.8s;transition-timing-function:var(--transition-smooth)}
[data-aos].aos-animate{opacity:1;transform:translateY(0) scale(1)}
[data-aos="fade-up"]{transform:translateY(50px)}
[data-aos="zoom-in"]{transform:scale(0.8)}
@keyframes gradientMove{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:0.5;transform:scale(1.1)}}
@keyframes floatMascot{0%,100%{transform:translateY(0px) rotate(0deg)}25%{transform:translateY(-10px) rotate(1deg)}50%{transform:translateY(-5px) rotate(0deg)}75%{transform:translateY(-15px) rotate(-1deg)}}
@keyframes gridMove{0%{transform:translate(0,0)}100%{transform:translate(50px,50px)}}
@keyframes floatAround{0%,100%{transform:translateY(0px) translateX(0px)}25%{transform:translateY(-20px) translateX(10px)}50%{transform:translateY(-10px) translateX(-15px)}75%{transform:translateY(15px) translateX(5px)}}
@keyframes logoGlow{0%{filter:drop-shadow(0 0 5px var(--accent))}100%{filter:drop-shadow(0 0 20px var(--accent))}}
@keyframes loadingProgress{0%{width:0%}50%{width:70%}100%{width:100%}}
@keyframes ctaFloat{0%,100%{transform:translateY(0px)}50%{transform:translateY(-10px)}}
@keyframes countUp{0%{opacity:0;transform:translateY(20px) scale(0.8)}100%{opacity:1;transform:translateY(0) scale(1)}}
@keyframes slideInUp{0%{opacity:0;transform:translateY(30px) scale(0.95)}100%{opacity:1;transform:translateY(0) scale(1)}}
@keyframes slideInTestimonial{0%{opacity:0;transform:translateX(-20px) scale(0.95)}100%{opacity:1;transform:translateX(0) scale(1)}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:0.01ms!important;animation-iteration-count:1!important;transition-duration:0.01ms!important}}
@media (prefers-contrast:high){:root{--border:rgba(0,0,0,0.3)}}
@media (prefers-contrast:high){[data-theme="dark"]{--border:rgba(255,255,255,0.3);--text-secondary:#E0E0E0;--text-muted:#B0B0B0}}