*{
    margin:0;
    padding:0;
    box-sizing:border-box;
    font-family:system-ui, sans-serif;
    }
    
    body{
    background:#0b0b0b;
    color:white;
    overflow-x:hidden;
    }
    
    canvas{
    position:fixed;
    top:0;
    left:0;
    z-index:-1;
    }
    
    /* HERO */
    
    .hero{
    height:100vh;
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    text-align:center;
    padding:20px;
    }
    
    h1{
    font-size:clamp(2.8rem,6vw,4.8rem);
    font-weight:650;
    letter-spacing:-1px;
    margin-bottom:12px;
    }
    
    .subtitle{
    font-size:1.2rem;
    opacity:0.8;
    margin-bottom:36px;
    }
    
    .btn{
    padding:14px 32px;
    border-radius:30px;
    background:white;
    color:black;
    text-decoration:none;
    font-weight:600;
    border:none;
    transition:all .3s;
    }
    
    .btn:hover{
    transform:translateY(-3px);
    box-shadow:0 10px 25px rgba(255,255,255,0.2);
    }