/* Critical above-the-fold CSS */
body{margin:0;padding:0;font-family:system-ui,-apple-system,sans-serif;background:#fff;color:#1f2937;line-height:1.5;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
.dark body{background:#0f172a;color:#f8fafc}
*{box-sizing:border-box}
img{max-width:100%;height:auto;loading:lazy;image-rendering:auto}
.hero-text{font-size:2rem;font-weight:700;line-height:1.1;margin-bottom:1rem}
@media (min-width:768px){.hero-text{font-size:clamp(2.5rem,5vw,4rem)}}
.gradient-text{background:linear-gradient(135deg,#6D28D9,#059669);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.container-tight{max-width:72rem;margin:0 auto;padding:0 1rem}
@media (min-width:1024px){.container-tight{padding:0 2rem}}
@media (max-width:767px){*{animation-duration:0.01s!important;transition-duration:0.01s!important}}
.loading{opacity:0;animation:fadeIn 0.3s forwards}
@keyframes fadeIn{to{opacity:1}}
.above-fold{contain:layout style paint}
.skeleton{background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%);background-size:200% 100%;animation:loading 1.5s infinite}
@keyframes loading{0%{background-position:200% 0}100%{background-position:-200% 0}}