:root{--vw: 1440;--multiplier: 100vw;--background: #ece9e4;--text: #020403}*{box-sizing:border-box;margin:0;padding:0}body{font-family:Arial,Helvetica,sans-serif}button{background-color:transparent;border:none;cursor:pointer}.content{position:fixed;inset:0;overflow:hidden;width:100%;height:100vh}canvas{width:100%;height:100%;display:block;pointer-events:none}.header{position:fixed;width:100%;padding:calc(18 / var(--vw) * var(--multiplier));display:flex;align-items:center;justify-content:center;z-index:999;bottom:0;left:0}.nav{display:flex;align-items:center;justify-content:space-between;background-color:var(--text);color:var(--background);width:40%;padding:calc(12 / var(--vw) * var(--multiplier)) calc(14 / var(--vw) * var(--multiplier));border-radius:5px}.nav__title{font-size:calc(18 / var(--vw) * var(--multiplier));text-transform:capitalize}.nav__transition{font-size:calc(14 / var(--vw) * var(--multiplier));padding:calc(8 / var(--vw) * var(--multiplier)) calc(12 / var(--vw) * var(--multiplier));border-radius:3px;color:var(--background)}@media screen and (max-width:768px){.nav{width:70%;padding:calc(22 / var(--vw) * var(--multiplier)) calc(24 / var(--vw) * var(--multiplier))}.nav__title{font-size:calc(48 / var(--vw) * var(--multiplier))}.nav__transition{font-size:calc(34 / var(--vw) * var(--multiplier));padding:calc(12 / var(--vw) * var(--multiplier)) calc(16 / var(--vw) * var(--multiplier))}}