:root{--dot-size:2px;--dot-space:50px}.grid{background-image:radial-gradient(var(--primary-color)var(--dot-size),transparent 0);background-position:50%;background-size:var(--dot-space)var(--dot-space);width:100%;height:100%;position:absolute;top:0;left:0;overflow:hidden}.hero{z-index:2;width:100vw;height:100vh;text-shadow:0 0 .15em var(--primary-color);flex-direction:column;justify-content:center;align-items:center;font-size:clamp(.5rem,2vw,6rem);display:flex;position:relative}.hero:after{z-index:1;background-image:radial-gradient(var(--background-color)10vw,transparent 100%);content:"";width:100%;height:100%;position:absolute;top:0;left:0}.hero__text{z-index:3;flex-direction:column;justify-content:center;align-items:center;display:flex;position:relative}.hero h1{font-size:3em}.hero p{font-size:.8em}.hero a{border:2px solid var(--primary-color);box-shadow:0 0 .15em var(--primary-color);border-radius:10px;padding:.4em 1.6em;font-size:.8em;text-decoration:none;transition:border-color .2s linear,background-color .2s linear,color .2s linear,box-shadow .2s linear,text-shadow .2s linear}.hero a:hover{background-color:var(--primary-color);color:var(--background-color)}.hero a:active{border-color:var(--primary-color-darker);box-shadow:0 0 .15em var(--primary-color-darker);background-color:var(--primary-color-darker);text-shadow:0 0 .15em var(--primary-color-darker);color:var(--primary-color)}