.container {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
    font-size: clamp(2rem, 2.8vw, 4rem);
    font-family: 'Special Elite', monospace;
    background: linear-gradient(135deg, #f4f1ea, #e8e2d9);
    color: #212121;
  }

  .typewriter {
    width: 37ch;
    white-space: nowrap;
    overflow: hidden;
    border-right: 4px solid #212121;
    animation: typing 6s steps(37, end), blink 1s step-start infinite, deleting 6s steps(37, end) 8s infinite;
    color: #000;
  }

  @keyframes typing {
    from {
      width: 0;
    }
    to {
      width: 37ch;
    }
  }

  @keyframes deleting {
    from {
      width: 37ch;
    }
    to {
      width: 0;
    }
  }

  @keyframes blink {
    50% {
      border-color: transparent;
    }
  }