:root{--accent: #92c1e9;--black: #000;--white: #fff;--gray: #777}body{margin:0;font-family:Inter,system-ui,sans-serif;background:var(--white);color:var(--black)}.app{max-width:1200px;margin:0 auto;padding:24px}.nav{display:flex;justify-content:space-between;align-items:center}.nav a{margin-right:16px;text-decoration:none;color:var(--black)}.hero{margin:120px 0;max-width:700px}.hero h1{font-size:3rem;line-height:1.1}.hero p{color:var(--gray);font-size:1.1rem}.primary{background:var(--accent);border:none;padding:12px 24px;font-size:1rem;cursor:pointer}.values,.how{margin:120px 0;display:grid;grid-template-columns:repeat(3,1fr);gap:40px}.footer{margin-top:120px;text-align:center;color:var(--gray)}#root{max-width:1280px;margin:0 auto;padding:2rem;text-align:center}.logo{height:6em;padding:1.5em;will-change:filter;transition:filter .3s}.logo:hover{filter:drop-shadow(0 0 2em #646cffaa)}.logo.react:hover{filter:drop-shadow(0 0 2em #61dafbaa)}@keyframes logo-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media(prefers-reduced-motion:no-preference){a:nth-of-type(2) .logo{animation:logo-spin infinite 20s linear}}.card{padding:2em}.read-the-docs{color:#888}.header{position:sticky;top:0;width:100%;background:var(--white);border-bottom:1px solid #eee;padding:16px 0;z-index:100}.header-container{max-width:1200px;margin:0 auto;padding:0 24px;display:flex;justify-content:space-between;align-items:center}.header-logo{font-weight:600;font-size:1.2rem;display:flex;align-items:center;gap:12px}.header-logo img{height:40px}.header-nav{display:flex;gap:24px;align-items:center}.header-nav a{text-decoration:none;color:var(--black)}.header-nav button{background:var(--accent);border:none;padding:8px 20px;border-radius:4px;cursor:pointer;font-weight:500}.footer{position:sticky;bottom:0;width:100%;background:var(--white);border-top:1px solid #eee;padding:20px 0;text-align:center}.footer p{margin:0;color:var(--gray)}