@layer components {
  .inf-card-mark {
    width: full;
    padding-left: 1.25rem;
    padding-right: 1.25rem;
    border-left-width: 1px solid #fb923c;
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 5px;
  }

  .inf-title {
    align-self: stretch;
    display: flex;
    justify-content: start;
    color: rgba(255,255,255,0.5);
    font-size: 1.25rem;
    font-weight: 300;
    line-height: 1.75rem;
    font-family: 'Outfit', sans-serif;
  }

  .inf-text {
    align-self: stretch;
    display: flex;
    justify-content: start;
    color: white;
    font-size: 1.5rem;
    font-weight: 500;
    line-height: 1.75rem;
    font-family: 'Outfit', sans-serif;
  }
}

.btn-contact {
  padding: 0.5rem 1rem;            /* px-4 py-2 */
  background-color: #bef264;       /* bg-lime-300 */
  border-radius: 32px;             /* rounded-[32px] */
  outline: 3px solid #18181b;      /* outline-[3px] outline-zinc-900 */
  display: inline-flex;            /* inline-flex */
  justify-content: center;         /* justify-center */
  align-items: center;             /* items-center */
  width: fit-content;
  height: fit-content;
}

.btn-text {
  color: #18181b;                  /* text-zinc-900 */
  font-size: 1.25rem;              /* text-xl */
  font-weight: 600;                /* font-semibold */
  font-family: 'outfit', cursive; /* font-['Baloo_2'] */
  /* text-decoration: underline;      underline */
  line-height: normal;             /* leading-normal */
}