* { margin:0; padding:0; box-sizing:border-box; }
body { font-family: 'Inter', sans-serif; background: #fafbfc; color: #1e2b3c; line-height: 1.6; }
.skip-link { position: absolute; top: -100%; left: 16px; z-index: 100; background: oklch(var(--p)); color: oklch(var(--pc)); padding: 8px 16px; border-radius: 8px; font-weight: 600; font-size: 14px; transition: top 0.15s ease; }
.skip-link:focus { top: 12px; }
.fade-up, .hero-section h1, .hero-section p, .hero-section .flex, #problem-section .grid > div, #solution-section .space-y-6 > div, #research .card.border, #research .space-y-6 > div, #persona-section .card, #persona-section .w-64 { will-change: transform, opacity; }
.hero-canvas { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 0; opacity: 0.5; pointer-events: none; }
.fade-up { opacity: 0; transform: translateY(30px); transition: opacity 0.6s cubic-bezier(0.23, 1, 0.32, 1), transform 0.6s cubic-bezier(0.23, 1, 0.32, 1); }
.fade-up.visible { opacity: 1; transform: translateY(0); }
.typing-demo { border-right: 2px solid oklch(var(--p)); white-space: pre-wrap; overflow: hidden; display: inline-block; }
.typing-demo.cursor-blink { animation: blinkCursor 0.8s infinite; }
@keyframes blinkCursor { 0%,100% { border-color: transparent; } 50% { border-color: oklch(var(--p)); } }
.hover-lift { transition: transform 0.25s ease, box-shadow 0.25s ease; }
.hover-lift:hover { transform: translateY(-6px); box-shadow: 0 25px 30px -12px rgba(0,0,0,0.18); }
.checkbox-wrap:has(input[type="checkbox"]:checked) { box-shadow: inset 0 0 0 2px oklch(var(--p)); background: oklch(var(--p) / 0.08) !important; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; } .fade-up { opacity: 1 !important; transform: none !important; } .hover-lift:hover { transform: none !important; } .typing-demo { border-right: none !important; } }