@import url("https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,200..800;1,200..800&family=Tektur:wght@400..900&display=swap");

html {
  scroll-behavior: smooth;
}

.top-right-border {
  position: relative;
}

.top-right-border::before {
  content: "";
  position: absolute;
  inset: 0;
  padding: 2px;
  background: radial-gradient(
    circle at top right,
    #d40000 0%,
    #d40000 15%,
    rgba(220, 38, 38, 0.4) 35%,
    rgba(220, 38, 38, 0.1) 50%,
    transparent 70%
  );
  border-radius: 1.5rem 1.5rem 0 0;
  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  mask-composite: xor;
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
}

.corner-fade-border {
  position: relative;
  background: black;
}

.corner-fade-border::before {
  content: "";
  position: absolute;
  inset: 0;
  padding: 2px;
  background: conic-gradient(
    from 0deg at top right,
    #d40000 0deg,
    #d40000 45deg,
    rgba(220, 38, 38, 0.6) 90deg,
    rgba(220, 38, 38, 0.2) 180deg,
    transparent 270deg,
    transparent 360deg
  );
  border-radius: 1.5rem;
  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  mask-composite: xor;
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
}