:root {
          --cor-fundo: #fdfaf3;
          --cor-texto-padrao: #2c2521;
          --cor-destaque: #e58a58;
          --cor-pontos: rgba(0, 0, 0, 0.1);
          --tiktok-cor-fundo: #000000;
          --instagram-cor-fundo: linear-gradient(45deg,
                  #f09433 0%,
                  #e6683c 25%,
                  #dc2743 50%,
                  #cc2366 75%,
                  #bc1888 100%);
          --youtube-cor-fundo: #ff0000;
          --cor-texto-botoes: #ffffff;
      }

      @keyframes fadeIn {
          from {
              opacity: 0;
              transform: translateY(10px);
          }

          to {
              opacity: 1;
              transform: translateY(0);
          }
      }

      body {
          margin: 0;
          font-family: "Poppins", sans-serif;
          color: var(--cor-texto-padrao);
          background-color: var(--cor-fundo);
          background-image: radial-gradient(var(--cor-pontos) 1px,
                  transparent 1px);
          background-size: 15px 15px;
          display: flex;
          align-items: center;
          justify-content: center;
          min-height: 100vh;
          padding: 20px 15px;
          box-sizing: border-box;
      }

      .container {
          width: 100%;
          max-width: 500px;
          text-align: center;
          animation: fadeIn 0.5s ease-out;
      }

      .profile-picture {
          width: 120px;
          height: 120px;
          border-radius: 50%;
          margin-bottom: 20px;
      }

      h1 {
          font-size: 2.8em;
          font-weight: 700;
          margin: 0;
          line-height: 1.1;
      }

      .subtitle {
          font-size: 1em;
          margin: 10px 0 25px;
          opacity: 0.8;
      }

      .social-icons-header {
          display: flex;
          justify-content: center;
          gap: 25px;
          margin-bottom: 35px;
      }

      .social-icons-header a {
          color: var(--cor-texto-padrao);
          font-size: 1.6em;
          text-decoration: none;
          transition: transform 0.2s ease, color 0.2s ease;
          cursor: pointer;
      }

      .social-icons-header a:hover {
          transform: scale(1.2);
          color: var(--cor-destaque);
      }

      .links-section {
          display: flex;
          flex-direction: column;
          gap: 20px;
      }

      .link-button {
          padding: 20px;
          text-decoration: none;
          font-size: 1.1em;
          font-weight: 700;
          border-radius: 20px;
          border: 2.5px solid var(--cor-texto-padrao);
          transition: all 0.1s ease-out;
          box-shadow: 4px 4px 0px 0px var(--cor-texto-padrao);
          display: flex;
          align-items: center;
          justify-content: center;
          gap: 10px;
      }

      .link-button:hover {
          transform: translate(2px, 2px);
          box-shadow: 2px 2px 0px 0px var(--cor-texto-padrao);
      }

      .link-button:active {
          transform: translate(4px, 4px);
          box-shadow: 0px 0px 0px 0px var(--cor-texto-padrao);
      }

      .tiktok-button {
          background-color: var(--tiktok-cor-fundo);
          color: var(--cor-texto-botoes);
      }

      .instagram-button {
          background: var(--instagram-cor-fundo);
          color: var(--cor-texto-botoes);
      }

      .youtube-button {
          background-color: var(--youtube-cor-fundo);
          color: var(--cor-texto-botoes);
      }

      footer {
          margin-top: 40px;
          padding-top: 25px;
          border-top: 2px dashed var(--cor-destaque);
          animation: fadeIn 0.5s ease-out 0.8s;
          animation-fill-mode: both;
      }

      .contact-label {
          font-size: 1em;
          font-weight: 700;
          margin-bottom: 15px;
      }

      .copy-button {
          background-color: transparent;
          color: var(--cor-texto-padrao);
          padding: 12px 20px;
          border-radius: 12px;
          border: 2.5px solid var(--cor-texto-padrao);
          font-weight: 700;
          font-family: "Poppins", sans-serif;
          font-size: 1em;
          cursor: pointer;
          transition: all 0.2s ease;
          display: inline-flex;
          align-items: center;
          gap: 10px;
          box-shadow: 4px 4px 0px 0px var(--cor-texto-padrao);
      }

      .copy-button:hover {
          background-color: var(--cor-texto-padrao);
          color: #ffffff;
          transform: translate(2px, 2px);
          box-shadow: 2px 2px 0px 0px var(--cor-texto-padrao);
      }

      .copy-button:active {
          transform: translate(4px, 4px);
          box-shadow: 0px 0px 0px 0px var(--cor-texto-padrao);
      }

      #copy-feedback {
          min-height: 25px;
          margin-top: 15px;
          font-size: 0.9em;
          color: var(--cor-destaque);
          font-weight: 700;
      }

      .profile-picture,
      h1,
      .subtitle,
      .social-icons-header,
      .links-section .link-button {
          animation: fadeIn 0.5s ease-out;
          animation-fill-mode: both;
      }

      .profile-picture {
          animation-delay: 0.1s;
      }

      h1 {
          animation-delay: 0.2s;
      }

      .subtitle {
          animation-delay: 0.3s;
      }

      .social-icons-header {
          animation-delay: 0.4s;
      }

      .links-section .tiktok-button {
          animation-delay: 0.5s;
      }

      .links-section .instagram-button {
          animation-delay: 0.6s;
      }

      .links-section .youtube-button {
          animation-delay: 0.7s;
      }