@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap');

    * {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
    }

    body {
      min-height: 100vh;
      font-family: 'Lora', serif;
      font-weight: 300;
      background:
        radial-gradient(circle at top left, rgba(216, 188, 195, .8), transparent 35%),
        radial-gradient(circle at bottom right, rgba(108, 50, 64, .45), transparent 35%),
        linear-gradient(135deg, #f6f0f2, #fbf8f9);
      display: flex;
      justify-content: center;
      align-items: center;
      padding: 25px;
      color: #4d3a40;
      overflow-x: hidden;
    }

    .linktree {
      width: 100%;
      max-width: 430px;
      position: relative;
      padding: 56px 22px 35px;
      border-radius: 32px;
      background: rgba(255, 255, 255, .58);
      backdrop-filter: blur(18px);
      box-shadow: 0 30px 70px rgba(108, 50, 64, .22);
      border: 1px solid rgba(255, 255, 255, .65);
      text-align: center;
      overflow: hidden;
      animation: fadeUp .8s ease;
    }

    @keyframes fadeUp {
      from {
        opacity: 0;
        transform: translateY(30px)
      }

      to {
        opacity: 1;
        transform: translateY(0)
      }
    }

    .glow {
      position: absolute;
      width: 220px;
      height: 220px;
      background: #d8bcc3;
      filter: blur(70px);
      opacity: .55;
      border-radius: 50%;
      top: -80px;
      right: -80px;
      z-index: -1;
    }

    .logo {
      width: 156px;
      margin: 0 auto -4px;
    }

    .logo img {
      width: 100%;
      height: auto;
      object-fit: contain;
    }

    h1 {
      color: #6c3240;
      font-size: clamp(34px, 3vw, 60px);
      letter-spacing: 2px;
      margin-bottom: 6px;
    }

    .tagline {
      font-size: 14px;
      color: #7c6870;
      margin-bottom: 22px;
    }

    .featured {
      background: linear-gradient(135deg, #6c3240, #b98796);
      color: white !important;
      box-shadow: 0 14px 35px rgba(108, 50, 64, .35);
    }

    .links {
      display: flex;
      flex-direction: column;
      gap: 14px;
    }

    .link {
      width: 100%;
      padding: 16px 18px;
      border-radius: 18px;
      background: rgba(255, 255, 255, .75);
      color: #6c3240;
      text-decoration: none;
      font-weight: 700;
      font-size: 15px;
      display: flex;
      justify-content: space-between;
      align-items: center;
      border: 1px solid rgba(108, 50, 64, .10);
      box-shadow: 0 10px 25px rgba(108, 50, 64, .10);
      transition: .35s ease;
    }

    .link:hover {
      transform: translateY(-4px) scale(1.02);
      background: #6c3240;
      color: white;
    }

    .link span {
      font-size: 18px;
    }

    .socials {
      margin-top: 22px;
      display: flex;
      justify-content: center;
      gap: 12px;
    }

    .socials a {
      width: 42px;
      height: 42px;
      border-radius: 50%;
      background: white;
      display: grid;
      place-items: center;
      color: #6c3240;
      text-decoration: none;
      font-weight: bold;
      box-shadow: 0 10px 25px rgba(108, 50, 64, .14);
      transition: .3s ease;
    }

    .socials a:hover {
      background: #6c3240;
      color: white;
      transform: translateY(-3px);
    }

    .footer {
      margin-top: 22px;
      font-size: 12px;
      color: #7c6870;
    }


    .b1 {
      left: 35px;
      top: 80px
    }

    .b2 {
      right: 45px;
      top: 220px;
      animation-delay: 1s
    }

    .b3 {
      left: 60px;
      bottom: 70px;
      animation-delay: 2s
    }

    @keyframes float {

      0%,
      100% {
        transform: translateY(0)
      }

      50% {
        transform: translateY(-18px)
      }
    }

    @media(max-width:480px) {
      body {
        padding: 16px;
      }

      .linktree {
        border-radius: 26px;
      }

      h1 {
        font-size: clamp(34px, 3vw, 60px);
      }
    }

h1, h2, h3, h4, h5, h6 { font-weight: 300 !important; }
