:root{--bg:#0a0a0a;--bg-elevated:#111;--border:#1f1f1f;--text:#f5f5f5;--text-muted:#a1a1a1;--radius:14px}*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}body{font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:var(--bg);color:var(--text);line-height:1.5;-webkit-font-smoothing:antialiased;display:flex;flex-direction:column;min-height:100vh;overflow-x:hidden}.container{width:100%;max-width:720px;margin:0 auto;padding:0 24px;position:relative;z-index:1}body:before{content:"";position:fixed;inset:0;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E");opacity:.035;pointer-events:none;z-index:0}.particles{position:fixed;inset:0;pointer-events:none;z-index:0;overflow:hidden}.particle{position:absolute;width:2px;height:2px;background:rgba(255,255,255,.25);border-radius:50%;animation:float linear infinite}@keyframes float{0%{transform:translateY(100vh) scale(0);opacity:0}10%,90%{opacity:1}100%{transform:translateY(-10vh) scale(1);opacity:0}}header{padding:28px 0 0;opacity:0;animation:fadeDown .8s ease .1s forwards}.logo{font-size:1.25rem;font-weight:600;letter-spacing:-.03em;color:var(--text);text-decoration:none;display:inline-flex;align-items:center;gap:8px;transition:opacity .3s}.logo:hover{opacity:.7}.logo img{width:25px;height:25px;object-fit:cover}.logo strong{font-weight:600}.logo span{font-weight:300;color:var(--text-muted);font-size:.9rem}main{flex:1;display:flex;flex-direction:column;justify-content:center;padding:60px 0 80px}.hero{text-align:center;margin-bottom:56px}.hero h1{font-size:clamp(2.4rem,6vw,3.5rem);font-weight:600;letter-spacing:-.04em;line-height:1.15;margin-bottom:18px;opacity:0;transform:translateY(30px);animation:fadeUp .9s cubic-bezier(.16,1,.3,1) .25s forwards;background:linear-gradient(180deg,#fff 0%,#b0b0b0 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.hero p{font-size:1.125rem;color:var(--text-muted);max-width:420px;margin:0 auto;opacity:0;transform:translateY(20px);animation:fadeUp .9s cubic-bezier(.16,1,.3,1) .4s forwards}.actions{display:grid;gap:14px;margin-bottom:48px}.card{background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius);padding:22px 26px;text-decoration:none;color:inherit;display:flex;align-items:center;justify-content:space-between;position:relative;overflow:hidden;opacity:0;transform:translateY(24px);transition:border-color .35s ease,background .35s ease,transform .35s cubic-bezier(.16,1,.3,1),box-shadow .35s ease}.card:nth-child(1){animation:fadeUp .8s cubic-bezier(.16,1,.3,1) .55s forwards}.card:nth-child(2){animation:fadeUp .8s cubic-bezier(.16,1,.3,1) .65s forwards}.card:nth-child(3){animation:fadeUp .8s cubic-bezier(.16,1,.3,1) .75s forwards}.card:before{content:"";position:absolute;top:0;left:-100%;width:60%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.04),transparent);transition:left .6s ease}.card:hover:before{left:120%}.card:hover{border-color:#3a3a3a;background:#161616;transform:translateY(-4px);box-shadow:0 12px 40px rgba(0,0,0,.4)}.card-content h3{font-size:1.05rem;font-weight:500;margin-bottom:4px}.card-content p{font-size:.875rem;color:var(--text-muted)}.card-arrow{color:var(--text-muted);font-size:1.3rem;transition:transform .4s cubic-bezier(.16,1,.3,1),color .3s}.card:hover .card-arrow{transform:translateX(8px);color:#fff}.note{text-align:center;font-size:.875rem;color:var(--text-muted);padding:18px;border:1px dashed var(--border);border-radius:var(--radius);opacity:0;animation:fadeUp .8s cubic-bezier(.16,1,.3,1) .9s forwards;transition:border-color .4s,background .4s}.note:hover{border-color:#333;background:rgba(255,255,255,.02)}.note strong{color:var(--text);font-weight:500}footer{padding:32px 0 40px;border-top:1px solid var(--border);text-align:center;font-size:.8125rem;color:var(--text-muted);opacity:0;animation:fadeUp .8s ease 1s forwards}@keyframes fadeUp{to{opacity:1;transform:translateY(0)}}@keyframes fadeDown{from{opacity:0;transform:translateY(-15px)}to{opacity:1;transform:translateY(0)}}@keyframes ripple{to{transform:scale(2.2);opacity:0}}@media(max-width:480px){.hero h1{font-size:2.2rem}.card{padding:18px 20px}}
